Designers Should Play (with code)
When I was a kid my parents bought us a Commodore 64 computer for Christmas. It was a magic machine of awesome, and all I wanted to do was play games. But of course, those marathon sessions of Summer Games pretty much always ended with getting yelled at by my parents.
When I learned that you could program the computer, I tried my hand at Commodore Basic, copying code out of books and magazines. Experimented with input & output, played with loops, and spun a lot of spaghetti code. The machine could do anything I wanted!
Dude. So rad.
Once I’d come to grips with the basics of syntax and structure, programming felt like a space I wanted to play in. Even though it was difficult, it was a rush to see a world or a story come to life on the screen. It was play, but serious play. But I’d still hear… “Stop playing those games!”
I kept playing with code as I got older, and through that I was exposed to the mind-bending eye-candy of the 1980s demoscene. Programmers from around the world competed to see who could push on the limitations of what computers could do with 3D, with animation, with fonts, with audio.
It was a riot of color, form and sound.
Most of all it was fun. It got me excited about typography and graphics on the computer and was a big part of why I got into this thing called design.
In college I pursued graphic design, but was still easily distracted with the idea of playing with code. At the school computer lab I got turned on to Adobe Flash, and one of my favorite books was Flash Math Creativity — it taught me how to play with some of the same generative techniques I’d been wowed by in the demoscene — how to make cool looking things that moved and reacted in novel ways. Through my casual tinkering with generative art I learned about algorithms and object oriented programming.
One of the generative artists who I was most inspired by was Robert Hodgin (of iTunes vizualizer fame) His work was sublime — art that could only come to life inside a computer, but somehow resembled organic, natural processes. I tried really hard to achieve the same results, and though I made some neat mouse followers and visual effects, I quickly hit the limits of my coding skill. It stopped being fun.
But I quickly realized that Flash was about so much more. It was a wonderful tool that enabled even a noob like me to combine design and code in an easy way. Images could be interactive and live on the World Wide Web where anyone could try them! Once again, coding helped define my interest in design, and set my course towards interaction design.
Fast forward to today. I spend most of my time designing interactions for Microsoft, but I still play games and write code. At Microsoft Design we play in augmented reality with HoloLens as well as immersing ourselves in virtual worlds. We party up on XBox and crush candy on Phone. We get off the screen with paper prototypes and bodystorming sessions. Through play, we can learn new things — skills, patterns, trends, understanding and empathy.
As a UX designer, a knowledge of coding and software development can be a valuable addition to your design toolkit. Knowing a little bit of code can level up your After Effects game, or help you make an impact with an interactive prototype. You can make more informed design decisions when you understand the language your partners speak, and can offer a design perspective when problem solving technical issues. Overall you’ll become more effective at working with engineering and project management.
And when you work together better, you get things done faster — which gives you more time to play!
Start Playing
There are more ways than ever to begin playing with code. Here are a few tools that you might enjoy — let me know if you have any other favorites!
Processing is a lightweight way to start messing around. With just 10 lines of code you can make simple shapes move
Arduino is an amazing platform for playing with electronics & code. Adafruit has a ton of tutorials you can try — start with making an LED blink!
Framer is a code-light framework for taking static design comps and making them interactive. The basics should get you going.
Unity is great tool to get into gaming or 3D development. Not for the faint of heart, but there are lots of great tutorials and a rich user community. Start by learning how to make a ball roll around!
To stay in-the-know with Microsoft Design, follow us on Dribbble, Twitter and Facebook, or join our Windows Insider program. And if you are interested in joining our team, head over to aka.ms/DesignCareers.
