Creativity and the Coordinate Plane

I’ve been teaching a 7th and 8th grade Computer Science Exploration class, going on my fourth semester now. As I always do, I am changing some things up this time. Starting with coding and then will dive into data and the internet and web design later.  In the past I’ve taken the plunge into coding once we’ve gotten background knowledge on data and information – because that’s how I learned it.

I am using Processing as the text-based language of choice this year. In the past, my first assignment was a problem-solving one in which kids had to make geometric shapes that I chose. I wanted to closely tie the learning in with math. However, since then, I came across this series of articles by and about Mitch Resnick: one of the creators of Scratch from the MIT Media Lab. He writes about the power of creative coding, here.  He also muses on the Hour of Code event, which I love but he makes some good points about. The power of computing is sometimes that you can use it to solve a specific puzzle… but often that you use it as a form of creative expression and open-ended modeling. Often you learn the things you want to learn because you are so driven to complete a project of your own design.

So for the kids’ first project this year, I put together a OneNote notebook summarizing some of the basic 2-D drawing functions in Processing. I also gave them this nice coordinate plane handout from Khan Academy.  We used it to do a few warmup exercises – for example, I would put some lines of code on the board, and they would draw what they thought it would look like and hold up their papers.

Then their assignment was “you’re going to create a free draw. You can make a character, a scene, or pixel art. Use at least three colors and five shapes. It should look like a purposeful drawing and not just random scribbles. I look forward to seeing what you make.”  It was very open. I didn’t have a specific problem in mind the students would solve. They would have to invent their own problems, and I ended up really liking the activity for that.

One student created multiple stars in different shades of blues and purples, and she had to make the same diamond shape but translated to different locations. She was determined to get it right and I heard her say “no, that’s not right” and redo her stars multiple times. She added a shooting star for effect.

Many students made pixel art and I enjoyed watching their different approaches. This student created pixel art by drawing lots and lots of squares with a thin black border around them.

Another student chose to do pixel art, but differently. Instead of drawing each square as a separate shape, he looked for bounded colored regions and used the beginShape() and endShape() functions, adding vertices.

Both students above had the issue of figuring out how big a pixel is, scaling their entire canvas and scaling and translating each pixel. They made it look easy!

I have a few students that enjoy “hacking” much more than they do planning and programming and so the activity was very different for them. For most students, this was an exercise in planning, mathematics, and attention to detail. For the hackers, they liked looking up something that was already done online and then modifying it and learning from it. One of these students found this program online.

A basic smiley face, curated from: http://www.openprocessing.org/sketch/31192

He first downloaded the code, ran it and shouted “See! I’m done!” so of course you have a discussion about that and about how you can’t just turn in someone else’s work as your own. But I enjoyed seeing where he took the code from that point.
Student: Well, can I turn the smile upside down and add horns?
Me: Sure. I suspect the bezier function is the smile.
Student: Well how do I turn it upside down?
Me: These eight parameters are (x,y) coordinate pairs. You could plan it out on your graph paper, figure out what points would make the curve into a frown and then try those.
Student: Or…. I could do trial and error.
Me: I would plan it out and……
Student: Haha!! TRIAL AND ERROR!
Me: okay then.

So he did, and ended up making a very nice frowny face with horns. It became clear to me that his form of “trial and error” was in fact a great deal of pattern-seeking and mental math. Are planning and attention to detail valuable skills? Indeed. Are they his strengths? No, and he could get the job done well with the strengths that he had. Did he learn about the coordinate plane and color theory? Yes, I think he did. Maybe it’s ok to allow a kid to learn something new through their current strong skill set rather than the one they struggle with. This same student observed “In math class we use a different coordinate plane. This is really hard!” And I believe that code-switching is good for your brain.

Regardless of their approaches, the kids were really self-motivated to make a nice looking drawing. They owned the problems they were trying to solve. They got instant feedback, by running the program, on whether they solved their own problems correctly. Not everyone’s problems were of the same difficulty or even in the same domain. Many kids might have learned different things from what I intended them to learn. But did every kid learn? Yes, I really think so. Now I wish I knew how to put that magic into every assignment.