Friday, 9 March 2012

forget Codeacademy, try Processing

Since I started along this road as a tech teacher, I have always had this awkward feeling as though I were some sort of impostor. There are just so many things that I don't know about computers and technology and here I was passing myself off as some sort of expert. A lot of this had to do with understanding what is going on under the hood. Sure, I could throw a few commands into a terminal here and there and I could tweak the html on a web page but I didn't really understand much about the programming side of things and I felt like I would have to remedy that if I was ever going to feel confident in role as an educational technologist.

So then came the inevitable question that plagues anyone nerdy enough to try to learn programming on their own. Where to begin? Which language? If you do even a brief internet search, you will find a deluge of posts arguing this point. And, like a good nerd, I had to try them all. I'm sure that many a prospective programmer got caught up in this question and ended up getting nowhere. There are too many suggestions. There are too many languages. It can be very confusing.

I found some great resources along the way. They are all neatly packed in my toolbox in case I have a reason to pull them out. The ones I like the best are interactive. Here are a few that I found:

HTML: Interactive HTML Tutorial 
Ruby: HacketyHackTryRuby
JavaScript: Codeacademy
Python: LearnPython, TryPython

There are tons more, of course.  If you want to go down the visual programming language road, then there are products like Google's AppInventor (now part of the MIT , Greenfoot, BlueJ, Alice or even Scratch.  Microsoft has a great visual programming language that you can use for robotics among other things.  They have a pretty incredible collection of resources for teaching robotics that they do nothing to promote.  There are a pile of resources to get you started with that here.  There are even lesson plans and PowerPoint presentations to help.

But I was interested in writing code.  I didn't just want to understand the sort of logic used in writing programs.  I had that.  I had been teaching with Scratch and many similar programs for a while.  I learned LOGO as a kid and did some BASIC in high school.  I wanted to understand more about the syntax.  I wanted a good starting point that I could use to dig into other languages in the future.

After trying a few languages, reading a ton of tutorials, even working my way through a couple of courses, I didn't feel that I had gotten anywhere.  And to be honest. it was kind of boring.  Then, my friend Ray introduced me to Processing.  Processing is an open source programming language based on Java.  it is aimed at artists and designers and it promoted as a sort of idea sketchpad.  It is really easy to get started and your creations are visual.  In fact, it is a lot like learning LOGO but quite a bit more powerful.  You write your programs, called 'sketches', and you click the 'play' button and it runs right away.  You change a value here and there and run it again to see how things changed.  It is a wonderful tool for Constructivist learning.  You can learn so much just by playing around.  The best part is, you can make some pretty cool projects after just a few minutes of learning. In the spirit of open source, many users, put the code for their own projects online so you can tear them apart and see how they work.  Even if a project is beyond your understanding at the moment, you can still learn a lot through that same process of experimentation--open the sketch, change something, run it again to see what happens.

Here's an example of perhaps the simplest program you can write:

point(50, 50);

This will open the default size window, 100 pixels x 100 pixels and put a dot in the middle.

Here's a slightly more sophisticated one that makes a white circle float across a black screen over and over:

float x = 0;
float y = 100;

void setup() {
size(400, 200);

void draw() {
ellipse(x, y, 20, 20);
x = x + 1;
if (x > width) {
x = 0;

The real breakthrough for me came when I discovered FunProgramming.  A fellow that calls himself 'Hamoid', inspired by what he saw from Khan Academy, decided to create a series of videos to teach basic programming.  He started by doing a video every day for the month of August and then just kept going.  There are over 100 now and they really go step-by-step through everything you need to know.  I cannot recommend this resource enough.

Since then, I have managed to create all kinds of different programs and am even using Processing to teach an introduction to programming in my Technology program.  My new knowledge has made it a lot easier to understand how the coding works inside of other programs, such as using ActionScript in Flash or JavaScript with Unity3D.

Lastly, with processing, you can export your programs as executables that can run on Windows, Mac or Linux.  You can export them as webpages (they get converted into JavaScript) and with a little work, they can even be exported to Android or iOS.  I had already created my first Android app using processing after only a couple of weeks using Processing.  In a future post, I will explain the steps I went through to get my programs to run on my Android phone.

So, if you want to learn programming and are having trouble getting started, give Processing a try.  If you want to see some things people have created with Processing, have a look here.  Below is a simple example that I made while working through Hamoid's tutorials.  Just click in the window and watch bouncing circles appear.