Whiteboarding

Like most teachers of abstract ideas, I whiteboard a lot. I also use screen broadcasting to let students see my screen while I mouse, click, type, and talk. It’s important to do both of these things and to switch between them. In fact, I rearranged my classroom to make it natural for me to be close to as many students as possible while moving between my stand-up teacher computer workstation and the whiteboard.

I call that narrow patch of ground between the two halves of the room “the lane” and it’s where I teach from. There’s enough room to walk so I can break up any monotony by moving (because kids eyes will always flick to anything that moves), and I can step back from any student I’m talking with (key strategy) to create space between us that brings other students into the conversation and a volume level that lets anyone hear. Lots of times, those conversations end up with something that needs to be whiteboarded. I go through a couple dozen markers a year in 3-4 colors. Teaching abstract ideas on a whiteboard requires colors. (Note to self: check students for colorblindness.) I had a calculus professor, Alar Toomre, in college who was better at this than most of us will ever be and he did it all in chalk. He brought in his own colored chalk in a wooden box that he carried with him.

That’s what I thought of when I saw these refillable whiteboard markers. Better for the environment, sure, but also way cooler than the disposable Expo markers I’ve used for the past 5 years. Can I justify spending $70 on a set of tools that might make it more enjoyable to do what I do? Or is that silly considering that the school keeps me in an unlimited supply of the disposable stuff? Am I just playing in to consumerism? Or am I defending the environment from toxic waste? I’m tempted to go to the SF Green Festival in a couple weeks just to check these things out.

Whiteboard markers. That’s what teachers think about.

Rambus/KCI Innovation Award

I’m really excited to have gotten the call today from Steve McGriff at the Krause Center for Innovation telling me that I won the 2009 Rambus/KCI Innovation Award. I’ll be presenting the project, which I wrote about briefly just before starting it, at their award event on November 4th. Here’s what I wrote for the entry:

Abstract

In this project, high school juniors and seniors built educational video games for elementary school students. Using a local fifth grade class as a focus group, they researched the likes, dislikes, and academic goals of the younger students and their teacher. Then they worked in teams to generate ideas, align game play with educational objectives, design, build, test, and deliver the games online. By watching fifth grade students play-test the games, my students found out just how demanding a real client can be – in addition to sharing in the excitement of enabling elementary students to have fun while learning.

Narrative

When my students first got off the city bus in front of Gordon J. Lau Elementary School in Chinatown, I don’t think any of them really knew what was about to happen. I certainly didn’t. This was late January 2009 and my Introduction to Programming class, made up of juniors and seniors, was walking in to its first-ever client visit. Granted, the client was a class of fifth grade students and their teacher, but that didn’t seem to lower the stakes.

My students had a clear mission even though it was their first time meeting these younger students: Find out what kind of games they love to play. Find out what they love about them. Then find out what they are supposed to be learning in school. That would be the easy part. My students knew that later they would be synthesizing this information to build educational video games intended to address the very significant challenge of holding a fifth-grader’s attention while simultaneously teaching them something.

I wasn’t sure if they would be too cool to sit in those little fifth grade chairs, but after the first two minutes it felt like a family reunion. My students knew how to ask about things that I didn’t even realize existed: Club Penguin and Xbox Live turned out to be high on the list. They collected pages and pages of information about the students’ study habits, game interests, other activities, and level of computer skill. They investigated favorite cartoons and celebrities, and let the younger kids show off their academic skills. Actually, I’m pretty sure some of the youngsters legitimately had their state capitals down better than my kids. I know Helena, Montana stumped me. We joked that our games were all going to have to be called “Are You Smarter Than A Fifth Grader?”

When the bell rang for the elementary students, my kids stayed and interviewed the fifth grade teacher, Ms. Eliza Gee. She ran them over the geography, vocabulary, mathematics, writing, and science topics that her students would be learning in the coming months. She sent us home with a blank fifth grade report card (and yes, they’re still filled out on triplicate forms) showing all the academic standards for the year.

When we got back to the high school, I posted that fifth grade report card on the wall under a cute, silly title: “Audience Profile Document”. The next task for my students was to brainstorm games that would appeal to the younger kids but also accomplish Ms. Gee’s educational goals. They came up with all sorts of ideas – from UFOs traveling through the solar system to setting Super Mario Brothers in the Revolutionary War to using monsters and rainbows made of ice cream in a math game about the statistics. Clearly they were tuned in to the fun aspect of the project. Later in the week, I found a group standing off to the side of the room, discussing where on the “Audience Profile Document” their game would fall. They understood the educational aspect as well.

As the students worked on their teams in various roles – artist, designer, programmer, and project manager – I met with different groups each day. Sometimes I would talk to specific teams about their work and sometimes I would meet with students based on their roles. This allowed smaller group instruction for tricky programming concepts, or digital art workflows, and even a meeting where the project managers helped one of their fellow PMs who was having trouble getting her group to cooperate. Based on her peers’ suggestions she switched some of the team’s roles around and things smoothed out. Not only did this group structure allow me to focus my instruction more deeply, it also let the students experience real teamwork. This wasn’t just a report where each person could write a page and then staple them all together. They were relying on each other to meet a hard deadline – the fifth graders were coming.

In the week leading up to the visit, my students were scrambling to finish alpha versions of the games. Things were broken, ideas weren’t working, and the stress level was rising. It almost felt like I was back in the software industry, trying to hit a ship date. I don’t remember ever staying late when I was a student in high school – at least not the way I did in my jobs after college as a computer programmer. But my students seemed to understand that this was more than just an assignment and they put in the extra time.

Alpha day had its highs (the kids!) and lows (the bugs), but every team ended up with a huge list of changes and enhancements that they wanted to implement. We learned how to prioritize, how to calculate the critical path through a set of interdependent tasks, and then they were back to work. The next week we got a set of handwritten thank-you letters. I made each project manager keep them with their team’s notes. I think they had a new appreciation for the habit of small businesses to frame the first dollar they ever make.

Our next stop would be the computer lab at the elementary school. We were using this fifth grade class to drive the design process, but my students knew that their ultimate audience would be online – anyone anywhere would be able to access their games. The work they put in for this class of elementary school students could eventually benefit students all over the world.

A little less than two months after starting the project, my students were ready for the second day of play-testing. This time we got off the bus with determination. Previously we’d only visited the students in their fifth-grade classroom, so it was enlightening to see what they had to work with in the school library. My students had done the development work on relatively recent PCs, and the elementary school had a set of older Macs. Fortunately all the games worked and at the end of the day we called the beta test a success.

Then we entered the home stretch, trying to find and fix every bug. Racing to get their games done before the infamous week of STAR testing, my students started to really feel proud of their work. We’d learned a lot more than just how to write code. We’d even learned more than how to work together. We had a purpose and a product. And the first step was just getting on the city bus.

See the finished games (and student-written promotional descriptions) online at:
http://galileoweb.org/chunb/2009-educational-games/

Beyond Programming

I’m really happy with my Introduction to Programming class this year because I feel like I’m finally finding a balance between specific technical concepts and broader design ideas. Not only is this important for keeping the class interesting, but it’s also how I actually want to do my work. The goal is not to turn kids into assembly-line coder drones. My purpose is not to teach a particular subject. What I actually want to share is a general way of thinking and approaching problems. The way of working that I want to teach about can take a variety of forms and it appreciates the many facets involved in a complete solution to a real-world problem.

Computational thinking and analysis is a tool my students can apply everywhere, all the time. But we have to understand that traditional design disciplines as well as newer fields like experience design and HCI play crucial roles along with programming in making computers and programs and networks have meaning and significance in our lives. I’ve wanted to convey this since I started teaching CS, but haven’t started to feel successful until this year.

It’s been fun to bring this idea to life in my class. I’m using Processing which is a great environment for teaching programming because it makes visual output easy without dressing up the bare text of the code. Too many tools explicitly designed for teaching programming try to hide the code inside visual metaphors or hide abstract syntax in natural-sounding languages (that inevitably fall into the uncanny valley of comprehension), when I think that succinct code like you’d find in a widely-used programming language is actually the more easily graspable representation.

It’s just that people also need more than that. They need to see the result of changes to the code in some visual terms, and Processing does that admirably. You type “ellipse”, and you’re going to see an ellipse. Add a “fill” command, and you’ll see the color change. Two lines of code and you’re learning visually. What could be a more direct way to understand that we’re giving the computer instructions, and that those instructions have to follow a specific format? The great thing is that we never have to abandon or tear down what they learn on day one. Even as we advance to defining our own functions and using fancy object-oriented design features of the language, “ellipse” is still the way to draw an ellipse on the screen. Oh, and the syntax is pretty much Java, so it gives them a head start on preparing for the AP Computer Science class as well.

After getting through some of those basics at the start of the year, I showed Luxo Jr. as an example of how a non-human character can create emotional expression and identification. Then we played with the Tickle example in Processing. I challenged the students to try to create something that was emotionally expressive without using human or animal characters. They learned about programmatic animation (repeated drawing) but there was also a non-technical goal to refer to. There were feelings. There was a point. There was a reason to work with the code. And I made teenage boys talk to me about emotions. So there were several points.

Having multiple levels of depth to a project also helps immensely with differentiation. If I ask a class of students to simply meet a checklist of programming tasks — as I’ve done in the past — then the top students will race to finish and I have a classroom management or at least engagement problem on top of the effort it takes to try to drag some of the others through. It’s stressful, and stress is the vibe-killer. My classroom works best when I’m happy.

Given a larger aesthetic or artistic challenge, those top students still want to compete, but will tend to take as much time as is available to try to out-do each other with more complex or skillful work. I’ve also noticed that sometimes the “top” students have trouble with the more open-ended creative assignments, and I push back on them when they ask me for an idea of what they should do. I either make up something off the top of my head that seems insanely hard or I just shrug and let them struggle with it. For those students, it’s good for them to struggle every once in a while. It keeps them human. They almost always come up with something cool.

The week after Luxo and Tickle, we played with jacksonpollock.org (and some other similar sites) to see how programmers can create environments for creative expression. I had the kids write about how limitations and constraints inspire creativity. If you have a tool like Photoshop in front of you, it’s possible to create nearly any image. But there are so many options that it’s hard to know where to start. On the other hand, if you have paint dripping off a virtual brush from the moment you open your eyes, you really can’t do anything but move it around. Instant engagement and instant creativity.

Their assignment was to create an expressive environment — some kind of visual output linked to the mouse movement — that deliberately constrained the user in order to help inspire creativity. Of course, even after I said not to recreate MS Paint, I had a couple kids do exactly that. Which was okay from a programming perspective since it showed their skill development, but I dinged them for it anyway and told them they had to add some kind of a twist. One student made it so the brush will change size while you paint. Another decided to restrict the color palette. But the creations that got the most peer recognition though were much more original.

I’ve always wished I had taken classes from or worked under John Maeda when I was at MIT, and I realized recently that if I had done that I might have met Casey Reas and Ben Fry while they were first creating Processing. I wasn’t very focused at the time, and I left Boston when I graduated in 2000 to come work for Macromedia on Flash. I thought I was going to be building a tool for computational artists. It turned out not so much, and it took me another few years to even learn what it meant to be a professional programmer in a corporate environment.

But the ideas that Maeda, Reas, and Fry made salient are central to what I’m trying to accomplish now. Using visualization to explore the relationship between computation, complexity, and beauty is still incredibly intriguing. The success of Processing makes it possible for a high school class in 2009 to take that exploration much further than I did as an undergrad just ten years ago. Of course the goals are different, and I’m not under the impression that they’re going to learn how to program in 7 days. But let’s also not underestimate the power of the tools and the environment to help make learning easier and ease those initial frustrations that turn off so many people from computer science. The tools matter. Processing isn’t just a free, cross-platform, open source, Java-syntax programming environment — there’s also a runtime called Processing.js that lets you display your creations in a browser, and a WordPress plugin called Processing JS that makes it easy to paste code into a post and just have it work.

Once I discovered these tools, I really hit my stride. I started playing around with programming ideas for myself, for fun — something I haven’t done for years. It started with an attempt to recreate the Jackson Pollock simulator in Processing, and has resulted in what I think are a few really compelling assignments exploring repetition and variation (as a visual design principle and as implemented by classes in object-oriented programming), the massive scale of computation (enabled by the use of loops), and emergent behavior (due to combining simple behavior of objects with loops and arrays). This series of assignments not only leads the students through fundamental concepts in control flow, data structures, and object design, but also gives a visual reason to learn each concept up front, and lets them explore larger thematic and creative ideas while learning syntax.

One student actually asked me — after learning about classes and for loops, but before I introduced arrays — if it was possible to use a number as a variable. I asked him why he wanted to do that and he explained that he wanted to create new instances of a class using a loop, but he kept running into a problem because he couldn’t figure out how to get the variable he was assigning to change within the loop. If you’re a programmer, you know he was asking about arrays. He just didn’t know the word for them yet. I told him that we’d soon learn how to solve his problem, and while he went away hungry to figure it out, I left the conversation floored. When was the last time you had a student anticipate the next topic you were going to teach before they even knew it existed? He asked me a couple more times that week to show him how to use arrays (he figured out what they were called) but I managed to keep redirecting him into the current assignment. I knew that when we finally got there, he was going to be excited. But I didn’t expect him to say after class that it was the best day of his life because of what he learned.

Yeah, he’s a little dramatic. It still feels great. My students will be sharing their emergent behavior projects with each other on Monday. And then we’ll start the first video game design project of the year. Stay tuned.

Following SFUnified

This pretty much sums up where we’re at with technology, education, and fads: My school district is on twitter — with 12 tweets total, the most recent of which is 4 months old. Nice try.

I guess it’s better that dilettantes dabble with free services instead of the really expensive stuff?

This Is Not Helping

So there’s this ongoing problem we try to tackle in computer science education where women and minorities are under-represented in the field.

I was over at the Google Labs web site today, looking for some awesome new something or other. Maybe I’ve just gotten overly sensitized to this sort of thing, but the homogeneity in the column of faces there really jumped out at me. Does it hit you the same way? I’m not faulting them for giving some individual engineers credit and visibility or for putting a human face on their stuff or for being who they are.

But this is what our challenge looks like.

“Many women and minorities are being turned off in the fourth and fifth grade before they even know what computer science is.” — Jan Cuny, National Science Foundation