How much code should designers know?

How much code should designers know?

Keith Butters, co-founder of The Barbarian Group, provides a simple three-step process that guides you to learning enough code to be dangerous

I read a lot about the web design and interaction design industry – follow the blogs, LinkedIn groups, all that stuff – and one question I notice that continually comes up in heated debate is: “Do designers need to be able to code?”

That exact question is from an IxDA group and has almost 400 responses. It’s relatively easy to rationalise either side of the equation. You’re a designer, you do design, you let the coders code. Or alternatively, the manifestation of your work is code, so you should know how it's done. Back. Forth. I believe the question is phrased the wrong way. The question shouldn’t be, “Do designers need to be able to code?” but rather, “How much code should you know?”

There was this guy in my town growing up called Joe, who could flawlessly play the guitar parts to almost every Led Zeppelin song in the catalogue. He could also play maybe half of Paganini’s 24 caprices, and a bunch of insane speed-metal stuff – flawlessly. I got together with Joe and some other musicians and we started playing blues in B-flat. Joe didn’t know what a B-flat was or where he might find it on the fretboard. With all his talent and agility, he couldn’t play along. Essentially, the group had no common language for communication, and so, even with what seemed like amazing tools in the toolbox, we failed.

When you’re making things for the internet, that common language is markup and code. If you’re an established badass designer at the top of your field, you probably have people around you to translate where necessary (and you hopefully practice some Socratic honest ignorance). But, if you’re up and coming, trying to find your speciality, or frustrated that you don’t always have “someone to prototype this thing”, it’s crazy to me that you wouldn’t give learning some code a shot.

And you’re in luck. Believe it or not, those eight-minute-abs style programming books and tutorials are actually not selling you a giant rubbish bag of disappointment. You really can learn HTML in 10 hours (probably less). You can learn CSS in practically no time. I’m not saying you’ll be ready go join the conference circuit as a speaker or walk in to a new career with your new skill set, but you most definitely will be able to go make a thing.

The following is a simple three-step process (Step 3 is optional) that guides you to learning “enough code to be dangerous”. Focus on these three things for a couple of hours a day, and you could potentially be programming in less than a month.

1. Learn some basic HTML and CSS

Most people I talk to these days don’t agree with me (and that’s fine), but if you want a job doing anything on the internet, you should be able to make a basic HTML+CSS web page. In fact, I wish that was one of the tokens required to enter the industry </rant>.

There are plenty of online resources to learn HTML and CSS. Personally, I like the w3schools site for both HTML and CSS. They have nice cheat sheets for CSS properties and selectors, which is the stuff I never remember since I am not writing markup every day.

So make a page. Maybe a couple. Make them look nice. And prepare for Step 2.

2. Get an introduction to programming

This isn’t about learning how to build a site or learning how to write an iOS app. What I recommend is just getting a feel for what programming languages look like, and some basic understanding of how they work. A really interesting project that teaches coding that I happen to be a fan of is Codecademy.

Give it a shot. Or, if you're feeling ambitious, go grab just about any of those Learn-JavaScript-in-10-minutes books or a beginning PHP book. There are plenty that are freely available.

The goal is simply to understand how to make the computer do something you asked it to in code.

3. Follow a true development tutorial (optional)

It never ceases to amaze me how many wonderful development tutorials there are out there. There are a couple of ways to go here. The first (and far easier) way is to go through a tutorial such as PHP101: PHP For the Absolute Beginner.  If you can make it through to the end, you will have built a nice, basic RSS news aggregator, and will be able to actually understand how the whole thing works.

If you really want to go for it, I highly recommend Michael Hartl’s Ruby on Rails Tutorial. Don’t skip the introduction. This may be too deep a dive for you. But, once you’re done (if you try and succeed), you will have built a basic Twitter-like web application from scratch.

There are plenty of other amazing tutorials out there. Search around and find one that interests you.

Now that wasn’t so bad was it? Suppose you hated every minute of it (possible). Luckily, you’re a designer and you can go back to doing the stuff of design. But even if you never write another line of code in your life, two important things happened: first, you probably developed a newfound appreciation for the coders you know and work with. Second, you’ve discovered that you communicate more effectively when talking about implementation of your designs. Two really good things.

16 comments

Comment: 1

I dont agree with most of what you say. Code and markup is the common language for machines. Not people. Communicating with something visual ( a design, a wireframe, an infograpgic) is much easier and makes sense for people. Can you suggest UI or UX improvements by looking at the markup?
I can code more than an average designer. I can make any design in to valid CSS, HTML and I'm pretty competent with Ajax and JavaScript. But sometimes I feel my knowledge in coding limit my imagination to design things / features that I know cannot be coded. How does the design evolve if we only did what we know we can do?

Comment: 2

I agree wholeheartedly here. @Thanushka mentioned, "Code and markup is the common language for machines." Developers AND Designers need to know that language because what we're doing is manipulating machines to give people something they can use.

I'm more of a developer, but if a designer knows even a little bit about coding websites, the transition from a design to a website is much smoother because he or she understands what needs to happen in get from A- to B, the capabilities and the constraints, etc.

Comment: 3

I agree with you on this--designers do need to know some basic code. As a designer (and design instructor), the other side of the question is of equal interest to me.

How much design should developers know? I'd love to hear your thoughts on this!

Comment: 4

Yep, I think you've rephrased the question just right; it is "how much code should you know." And it doesn't only apply to designers. At the beginning of my career, I was a writer and editor. As I began to transition to web producer and web content director, it became clear that it would make my life a whole lot easier if I knew enough HTML to coherently communicate with the developers. It also added a lot to my credibility. Do I know how to "code." No way -- I wouldn't say that. But at least I know what you're talking about.

Now I'm a content strategist working with not only several different types of content management systems, but also mobile. A colleague suggested I learn iOS, and at first, I totally rejected the idea. I want to focus on content strategy, not execution. But then I realized that to have some base knowledge would open doors, not shut them. It should make me aware of what's possible -- while helping me communicate and push the boundaries of what the medium can do.

Thanks for this post, Keith! I think all professionals should have a little cross-disciplinary training. :)

Comment: 5

Maybe it's just me, but I've ALWAYS done everything myself. From concept, to design, to programming. It's not that difficult; for me anyway.

Honestly, the concept of someone else even putting their fingers into my design or code really makes me a tad antsy.

Comment: 6

w3schools.com is not a good place to learn from. It’s full of errors and “teaches” beginners wrong things. “W3Schools is a troublesome resource.” w3fools.com Please STOP advocating this site, thanks.

Comment: 7

A designer should understand the medium they are designing for. There is no excuse for ignorance in that regard.

I think the statement should be "A designer should understand markup if designing for the web". HTML and CSS is hardly "code" in terms of programming. They have no logic processing capabilites and are merely tools for representation. Programming skills are not essential for a designer, but why limit your skill set. Markup is simply understanding your canvas.

Comment: 8

I'm with most of you. I agree. Coding can inhibit creativity but if you know it well enough it will only enhance what you can do. When a designer begins the design process they want to a flow. To be able to have this creative flow in the process, it shouldn't interrupted by holes in one's knowledge.

Comment: 9

I see this discussion all the time and it's funny to me that the reverse question rarely comes up. Why don't see many topics around, how much design should a programer know? Should it be a requirement for Programmers to take a couple of Photoshop and Illustrator classes, learn how to mask things, etc?

I think it's important for designers to understand how code works or what it can do but not necessarily know how to code for themselves. Many large agencies don't require a 'hybrid' type person, but it seems like smaller ones do. Each position has so much to learn and is constantly evolving, I think you can really either be ok at both or really good at one.

Comment: 10

I can't understand the @Thanushka 's statement, "knowledge in coding limits my creativity". Would a painter complain, I find understanding how the oils dry on the canvas really limits my creativity?

Comment: 11

I usually don't get into these arguments because to me they are superficial. I have always done everything myself. If other designers chose not to code it’s their problem not mine :) Yes it may seem like you become a jack of all trades but that’s cause web / ux / ui design is seen as just designing in Photoshop or fireworks. It’s not.

Print / Graphic designers print their work to see what it will look like. They may not know the in's and out's or a printing press but they will know how to print and how to use colour separation, spot Colours, pantone paper weight etc. At the very least they can make a prototype of their book or magazine. I think the same should apply to the web people.

Comment: 12

Hey @gunnar can you post some better options in the comments? We're all here to get better.

Comment: 13

Even if web designers work is totally different from developer work, I think web designers should have some basic knowledge about php, html -coding. If a designer have this knowledge he will draw the website design in a much structured and logical way.

Comment: 14

@Thanushka I disagree. Knowing what is possible in code isn't a hinderence to design. It is a benefit, if you create a design that looks beautiful but is never going to be possible in reality then what is the point in designing it? It can't be built and probably shouldn't be shown to the client in case it builds their hopes up.

Designing to what is possible should be every designer's goal. Knowing as much code as possible will allow designers to push the limits of their designs to new levels while still being achievable.

Most designers could create something that looks great and cutting edge. Only good designers could build a beautiful, cutting edge design that is actually a realistic solution to the client.

Comment: 16

Well no, I don't think you need to know much about coding but you do need to know some. I am a designer and honestly have not much knowledge of coding. In fact I do not like it at all! For me is tedious and confusing and back in my University years, I was taught I should leave that to programmers and coders and focus on make good designs based on a user experience, how he/she would use it and the target audience it is intended to in order to have good communication design… and I attended good Universities in my country and outside, attended seminars and talks with known designers around the world…BUT… that being said, if only life could be that simple… at the end you have to look under the hood like it or not and have to know something of html, css, or when do you need java, or php. When I stumbled into the need of knowing it it was really hard for me, but there are tons of tutorials out there and free codes already written for you to modify them according to your needs, but again need to figure out how to. That taught me at least how to communicate with programmers and they find very comfortable speaking back to me. In that way I think both things are complementary.
The problem sometimes is explaining that to clients or employers which they just want all in one…
July issue on sale now!

The Week in Web Design

Sign up to our 'Week in Web Design' newsletter!

Hosting Directory
.net digital edition
Treat yourself to our geeky merchandise!
site stat collection