Co.Design Finally, An Interactive Coding Class That's Fun

The lessons employ clever game mechanics to create an effective user experience.

I’m like a broken record at this point: designers, filmmakers, and creative communicators of all stripes should to learn how to code. Clever tools and study guides abound for helping non-hackers start getting their hands dirty on the command line. But speaking personally, none of them have done the trick of getting me to actually just do it. Why? Because they’re not interactive. Reading a book or watching a video series (no matter how well-designed) just isn’t "sticky" enough to get me to stick with it.

So when I saw, I literally shouted "Hallelujah!" Finally, here is a teach-yourself-coding tool with a UX that actually makes sense: it lives in your web browser, it’s simple and game-like, and most importantly, it gets you coding. Immediately. If I weren’t spending most of my non-working hours taking care of my infant daughter, I’d be blowing through Codecademy’s addictive lessons every weekend.

First things first: Codecademy isn’t conventionally "pretty", design-wise. Its interface consists of a small terminal window in your browser and a sidebar where your digital "instructor" issues instructions and chipper words of encouragement. "We didn’t hire a UI designer to design the site," says Zach Sims, Codecademy’s co-creator (with Ryan Bubinski). "We wanted to focus on the essence of programming, the terminal. We wanted to bring the magic of programming back to people and to take away everything else, like the process of choosing a text editor, a language to learn, or a place to store your code."

In other words, Codecademy is well-designed in the same way that Jason Fried claims The Drudge Report is: perfectly functional with no unnecessary calories. Of course, the same thing could be said of BBEdit, but Codecademy has some key design touches that make its simplicity feel friendly and Tumblr-esque, rather than spartan and intimidating. For one, the homepage offers a frictionless "onboarding" experience by greeting new users right within the terminal window itself. You don’t even have to click the bright green "Start" button (or hem and haw about what you might be getting yourself into)—by the time you tap your name into that terminal window, Codecademy already has its hooks into you, playfully introducing simple Javascript commands that feel more like doodling than doing homework.

Codecademy also includes other "game mechanics" designed to keep you motivated (you earn badges for each lesson you complete, which can be shared socially with other n00b coders on the site or on social media). Unlike most other "gamification" gimmicks, these actually work, because they’re pegged to actual accomplishments ("Hey, I learned how to spawn a dialog box!") and because, like any well-designed video game, the first few "levels" are fast and easy enough to be fun without feeling like work.

"Learning is most often a solitary activity, with people reading books and attempting to program alone," Sims explains. "I stumbled with progressing through programming books because there wasn’t a reward at the end of the process. We thought game mechanics would help to keep people motivated."

For now, Codecademy focuses on teaching the JavaScript programming language, although other languages will be rolled out soon. "Languages like Ruby and Python become popular and phase out of popularity just as quickly, but JavaScript remains because of its connection to browsers," says Sims. "We’re focused on creating a great user experience right now and on educating the world." I’ve used Codecademy a handful of times, and I’m already hooked — so I’m inclined to believe these guys might just pull off that ambitious goal.

[Read more at]

[Top image by Superbomba]

Add New Comment