I recently stumbled across two inspiring examples of clear, simple user interfaces. (Hat tip: RJS.) Both are mobile apps, but perfect representations of what a UI should be.
They were also great reminders of the tools we as designers have and often forget about, including myself. First, the products:
- Scorekeeper by Zach Klein
- Clear by Realmac Software
Designers have a toolbox. Inside are tools, which include:
- Contrast
- Color
- Grid
- Proportion
- Line
- Shape (and iconography)
- Sound
- Consistency
- Motion
- Texture
- Photography
- And others I’m sure I’m forgetting
(Some may argue that all of these are subsets of Contrast. I personally don’t use proportion enough.)
The clearest, simplest, most effective user interfaces relentlessly focus on the minimal execution of these basic tools. It’s when we as designers make complex combinations of these tools that the UI begins to muddy. The higher level concepts like affordance, heuristics, taxonomy, and so forth—although valuable—often help us forget the effectiveness and elegance of the simple use of these core tools.
I find the toolbox metaphor useful when talking about design with others. I say
You have a toolbox. Inside you find a hammer, screwdriver, saw, and many other tools. Each tool has it’s own purpose. Sometimes you might use two tools together, often you might just choose one. Generally, you choose a hammer to pound a nail or screwdriver to fasten a screw. So if you have 100 tools in your tool box, think through which one is the best for the job ahead. You might choose tool 87, 92, and 14. The more tools you have, the more tools you understand—the more options you get to choose from.
When others think of concepts like grid or color as tools to get a job done, they become more comfortable understanding you don’t use a dozen tools to pound a nail.
I find this explanation to be transferable to other disciplines, like marketing or programming.