Learning design: resources for non-designers
Every now and then, a programmer, product manager, or marketing person will ask me how they can “learn design”.
It’s understandable that they think I can help. The problem is, I learned the principles of visual design through osmosis, growing up in a household with two graphic designers as parents. I learned front-end web development through a decade of experimentation, back when “web 2.0” was just becoming a thing. And I learned user research and UX design on the job, first at ScraperWiki, then at mySociety.
But I appreciate “spend 20 years doing it” isn’t a very useful answer to people asking me how they learn. So here’s a list of resources that might actually help. Some of them I’ve used myself, but most are just resources I’ve seen recommended by people I trust. YMMV!
This list is by no means exhaustive. I’ll try to keep it up to date with new resources as I discover them. If you know of something that helped you learn design, and you think I should add it to this page, drop me a line on Twitter.
All-round guides
- Hack Design – a free, 50-lesson, self-paced course for “hackers” learning design, that touches on everything from visual design principles, to UX research, UI design, and some basic front-end skills.
- Ben Brignell’s archive of third party Design Principles – the guides that other organisations use to guide their product decisions, covering ethics, accessibility, performance, user research, and everything in between.
Visual design
- Design for Hackers, by David Kadavy and The Non-Designers Design Book, by Robin Williams – both books explain fundamental design principles like contrast, repetition, alignment, and proximity. I’ve heard particularly good feedback about the Kadavy one.
- One of many articles about Gestalt Principles – see for example, this Smashing Magazine summary from 2014.
- Designing for the Web, by Mark Boulton
Usability
There are a few foundational texts here, that are well worth your time, if you don’t mind a more theoretical introduction to the way designers think:
- The Design of Everyday Things, by Don Norman – the origin of the term “affordance” in design. My awesome colleague Gareth Rees summarised the book here.
- The Inmates Are Running the Asylum, by Alan Cooper – the origin of “personas” in design.
- Designing for People, by Henry Dreyfuss – the godfather of industrial design.
- Don’t Make Me Think, by Steve Krug
There’s a small cottage industry in Tumblr-like microblogs poking fun at poorly designed experiences online. These are two I follow in my RSS reader:
Modern web technologies
Things move fast here, so it’s hard to recommend specific resources!
- MDN CSS guide – a bit dry, but a great intro to modern front-end web development.
- Layout Land YouTube channel, from Jen Simmons – be aware this was released just as modern CSS features like Flex and Grid were becoming standardised, so some advice might already be out of date.
- The Google Chrome Developers YouTube channel – be aware that some things they talk about aren’t standards/cross-browser compliant.
- Google’s web.dev “Designing in the Browser” YouTube series
Performance
- MDN Web Performance reference
- Google’s web.dev guides to performance – just bear in mind that Google has a vested interest to push its own Chrome/Pagerank concept of performance here, and some of their ‘best practices’, such as AMP, are more about consolidating Google’s monopoly than actually serving users.
Accessibility
- MDN introduction to Accessibility
- Inclusive Components, by Heydon Pickering – about a dozen examples of the considerations that go into an accessible web component. Really fascinating.
- Cards for Humanity – nothing to do with that obnoxious American card game. This is a great tool for testing out your solutions against randomly selected personas.
- GDS’s inclusive design posters