When many designers have the same challenge, (e.g. — mobile app menus) and someone solves it in an elegant way (e.g. — Facebook’s hidden menu) and many designers use that solution, it helps users understand those sites and apps faster, because they see the same solution over and over.
These commonly-used solutions are called:
Design Patterns
(If you are just joining the UX Crash Course, start here.)
****
A design is not necessarily good just because it’s common. To be a “good” Design Pattern, a solution must be common and usable.
Some design ideas become popular because they allow lazy UI designers to ignore a challenging feature. It’s like putting a bag over someone’s head because they are ugly.
For example: Facebook’s “hamburger” button — which represents the hidden menu in many mobile apps — has started appearing on full-size websites that have plenty of space for a menu. It’s common because hiding the menu is easier than designing a nice one, not because the results are better.
In real life, many users don’t notice the hidden menu at all, and they leave the site or get lost.
That’s bad.
And lazy.
“Don’t do it, bitch.” — Jesse Pinkman.
****
Now, there are hundreds of design patterns and they are changing all the time as devices and technologies evolve, so I can’t really make you a list.
But here are a few links to explore:
1) GoodUI — A great list of simple, illustrated ideas that are usually good things to do, or at least try, when designing.
2) PatternTap — A library of user-submitted examples of all the parts of a website you might need. Note: Some are good, some are bad, but looking through examples will definitely give a sense of what is common and what isn’t.
3) The Anatomy of a Perfect Landing Page — This article isn’t super new, but it still holds up. Following this will allow you to quickly create a generic, but effective page for users that find you via search. i.e. — the first page people see. If you’re lovin’ it, I recommend the Unbounce blog.
4) Mobile Patterns — Similar to PatternTap, this isn’t a list of perfect designs, but it is a good way to look at a lot of mobile app designs and get a sense of what is “common”.
5) Timoa on Pinterest — A very organized collection of UI elements, sorted by feature.
6) Did I miss a good patterns site? Tell me on Twitter.
****
Tomorrow I will introduce you to the part of User Experience Design that separates us from the animals: Information Architecture.