Code & Design: A Long Term Relationship

As code becomes increasingly visual, interactive, and jumps off screens, programming’s importance in a designer’s skill set continues to grow. Designers need to embrace it.

anatecture
4 min readAug 5, 2015

Recently, I attended my first hackathon: AT&T Mobile Hacks in Santa Monica, CA. Because I’m a designer with limited code experience and not a programmer or engineer, I can describe my mood on entering the room as almost 100% nervous. What I got out of the experience was twofold: (1) that a designer’s classic skill set can set your team apart from the others and (2) that any designer interested in interface design or IoT has to bring coding chops to the table.

When I arrived, there were already about fifty people in the room. Some had organized themselves into recognizable groups, wearing matching tee shirts or staking out a group of tables for themselves. I knew that these were not the people I wanted to walk up to. I scanned the room, found a woman sitting alone, and walked straight over to her. Nerves level: 150%.

Meeting her, however, ended up being a great match. She — let’s call her Kat- was a front end developer with HTML and CSS experience, as well as a deep professional background in project management. I also know HTML and CSS, with some Java and limited C for IoT builds. Once we realized we got along, we knew we needed back end developer teammates.

If you’ve never been to a hackathon, then this is what you learn quickly: back end developers are the magical unicorns of the hackathon world. All hacking teams are constantly up for a great, multiple language programming wiz. Kat and I went around the room, looking for teammates. Eventually we linked up with two back end developer guys, let’s call them Mike and John, and that’s when I started learning the roots of a hackathon.

As first experiences go, this was a great one. We knew each other for about 2 minutes before starting to work, and from there we worked straight through for eight hours at the same table. Being confident in my drawing skills, and having brought my Wacom tablet, I volunteered to design the UI.

From the moment I volunteered, I could see that because I couldn’t contribute code, my skills were less valuable.

As stoked as I was to be part of a team and working, I was annoyed me to be boxed in to that position that almost all designers have been in before: the one in which we are perceived as “just a designer”, ie, someone who makes things pretty.

Designers are smart, inventive, and crazy skilled. The trouble is, we are still widely perceived as just drawing pictures and picking colors.* We need to work harder to show our skills and smarts to the math and engineering worlds. And we can do this by learning a bit more of their language.

List screen: so troublesome.

For example, in the course of our app development, I had a half an hour conversation with my team about coding a list I designed. I had to explain that what I was designing was just a vertical list, pretty straight forward to code in vertical blocks. It only visually read as a floating list with horizontal elements, a much more troublesome layout, because of the design. Because vertical lists are common in apps, I knew mine would be more interesting and sleek than the default layout. I could have that conversation because I have some coding experience and knew that it could be coded vertically, but I could have avoided it all together if I could have simply showed my teammates the code from the start.

As the hackathon went on, I found myself compromising the UI for the convenience of the code. I substituted Droid Sans for Gotham (groan); I forewent some cool interaction ideas; I had to convince the team about the list layout. All because I was the designer and couldn’t contribute to the actual build.

Splash screen (nearest) and player screen (far right) layouts for our proposed bluetooth-based music app.

I know that I would be not only more valuable at my next hackathon but also a better designer if I could contribute more code. This, I think, will be a situation that we will only see increase as design and technology grow together. For this reason, designers interested in interaction should start focusing on increasing our CS skills. We already have such a vast skill set we pull from; we can surely start building this one as well.

Designers must cultivate their object oriented programming skills. I also encourage any designer outside of school to start attending hackathons and other coding events to sharpen up in this area. It’s a really different environment from what we’re used to working in, but I found that, when I showed my teammates my designs, they were impressed. My value shot up because my UX design skills were on point. Confidence in those made a strong base for taking the risk in showing up.

I know that designers already have a heavy learning curve: drawing and building and communicating are not easy, and those skills take years to grasp, but we have to take on this task as well. If you’re interested in interaction or onscreen work, you have to be able to express your views, even to a limited extent, through code. We already have a seat at the table, we just need to make that seat move up towards the front.

*Of course, in response to this “just” I would like to reference Meryl Streep’s amazing monologue about Anne Hathaway’s character’s cerulean sweater in The Devil Wears Prada.

--

--

anatecture

Designer, civil servant, founder. Specializing in helping add intention to iteration. All views my own. anatecture@typetura.social Art IG: @fitzyfitzyfitz