Back to blog

Where to learn user interface design

Here are the books and online resources I recommend for learning user interface design. This list is based on the layers of user interface design that I've identified in another post. This list does not cover techniques usually associated with "UX design", like research and ideation.

Content, including imagery

Books

Everybody Writes by Ann Handley will teach you how to write better.

Letting Go of the Words by Janice Redish is a highly recommended book on writing.

Content Strategy for the Web by Kristina Halvorson will teach you about content strategy.

Content Stratey for Mobile by Karen McGrane will, well, the title should explain it all.

Online

David Perell's ultimate guide to writing online will help you write better.

This Nielsen Norman Group article on using photos in your content will help figure out what types of photos work best.

Layout

Books

Grid Systems by Josef Mulller-Brockmann is the classic book on creating and using grids.

Web Form Design by Luke Wroblewsky is your best bet if you're interested in laying out forms specifically.

The Non-Designer's Design Book by Robin Williams is a beginner's look at graphic and page design, and teaches layout fundamentals that every designer should know.

Mobile First by Luke Wroblewski dives into techniques specifically for mobile layout.

Responsive Design: Patterns & Principles by Ethan Marcotte goes into what makes layouts responsive, and is written by the person who coined the term "Responsive design".

Designing Interfaces by Jennifer Tidwell is a collection of UI patterns, but it's also a great source of inspiration for layout, especially at the component level rather than the page level.

Online

The 8-Point Grid, and vertical grids in general, is a vital technique to understand for laying out scrolling interfaces like web pages.

Priority Guides are a very useful technique for figuring out what order things should be laid out, especially on a small screen.

Optical Effects in User Interfaces by Slava Shestopalov helps you to realise that aligning things mathematically is not a good idea.

Typography

Books

The Elements of Typographic Style by Robert Bringhurst is the bible of Typography. You could read just this book and be set for life.

On Web Typography by Jason Santa Maria is a lighter, more modern look at the fundamentals typography.

Online

FontPair provides resources for helping designers pair typefaces together, which is a big part of web typography.

Jeffrey Zeldman wrote an iconic post about why you should use large type in your websites.

The Five-Minute Guide to Better Typography is a quick introduction to the principles you should be following when setting type.

Typewolf is the best website for keeping up with good typefaces.

The Elements of Typographic Style Applied to the Web applies the principles in the famous book to web typography.

Practical Typography by Matthew Butterick is an online book about typography. Check out the page on "Typography in ten minutes".

Colour

Books

Color Design Workbook from AdamsMorioka is a practical and complete look at the use of colour in designs.

Interaction of Color of Josef Albers is a good book if you want to get really deep into the perception of colour, and exercises you can use to help your understanding of colour interaction.

Online

Picular is like Google, but you get colours as results. Useful if you want to know what colour to use to represent a concept like "justice". It's usually grey or brown, apparently.

Canva's colour site provides tools for understanding colour. I especially like their explanations of the meanings of each colour.

Ian Storm Taylor's article on never using black makes a good point about flat black being an unnatural colour. One of the most important colour tips I've learned in my design career.

Laura Elizabeth's guide to choosing a colour palette is simple and practical. Very useful if you have't got an "eye for colour".

Erik Kennedy's guide to choosing a colour palette is also simple and practical. You should probably read this and the one above to get two slightly different perspectives on it.

Non-content imagery

Books

The Icon Handbook is a reference about all aspects of icon design.

Online

The Ultimate Guide to an Interface Icon Set is a practical look at designing icons.

This article on branding in interfaces by Christian Beck is full of tips on how to add branding imagery.

Polish

Books

Refactoring UI by Steve Schoger and Adam Wathan is the most polish-focused book I've come across.

Online

Better UI Design is my own website, where I catalogue every UI technique I've ever come across that adds that little bit extra.

Erik Kennedy at Learn UI Design is probably the best source on the planet for practical UI techniques, including polish.

Refactoring UI also has a website with lots of very useful tweets, videos, and articles.

Animation and other visual interaction feedback

Books

Animation At Work by Rachel Nabors is a quick look at web animation.

Designing Interface Animation by Val Head is a longer look at web animation.

Dan Saffer's book on microinteractions isn't only about animation, but animation is very important for microinteractions.

Online

Val Head is an expert on animation, and she's shared her top resources for those looking to learn.

Rachel Nabors is the other big name in web animation, and she links to a lot of her writing from her website.

Nielsen Norman Group's article on Microinteractions is a practical dissection.

Disney's 12 principles of animation, as presented here by Disney, are important to understand if you want your animations to have character.

Back to blog