Product Design Lessons
Creative Direction | Lesson #21
Simplify Your Visual Design
Learn two subtle ways to give your designs a sense of order.
It’s not uncommon for clients to request simple and/or clean designs. Few design briefs ask for a convoluted mess. But what makes simple and clean? In our experience, the two don’t always follow each other. A few simple techniques can simplify even complex designs without reducing content. Here are three lesser-known tips to simplify any visual design.
1. Use Fewer Variations in Type Sizes
Like choosing only two families of type or a limited color palette, restricting typography to three, maybe four, different sizes creates a more uniform hierarchy. Using three sizes eliminates guesswork for both you and your users.
Too limiting? Not necessarily. Think of three sizes as defaults. You can always vary sizes when appropriate — just be aware that the more variations you use, the less simple the design will appear. Plus, the more you follow your own text size guidelines, the more impact you'll have when you choose to break them.
Above: Think of it visually. The left-hand blocks come in many unique sizes. The right-hand blocks have only three sizes, giving them a more orderly appearance. (Astute observers will notice that the right-hand blocks also have more elements than on the left — doing more with less.)
Which three sizes depends on each project’s needs, the medium, and designer’s judgement. But this technique works best with distinctly different sizes, not subtle variations.
2. Mind the Gaps
In print, “full bleed” refers to running an image to the edges of the page. But the idea translates to web design: the space between elements is itself a visual element.
Full bleed in any medium eliminates distracting gaps that negative space creates. Tight margins actually become lines in their own right.
Above: Both layouts use the same elements, but the right-hand layout uses fewer margins and background color in lieu of attention-hogging divider lines.
Simply having less stuff on a page doesn’t always placate clients. Sometimes we can answer “there’s too much going on” by focusing guidelines, like standard type sizes and treating empty space as a design element. The design’s in the details.
About the instructor
Ben Gremillion is a Design Writer at ZURB. He started his career in newspaper and magazine design, saw a digital future, and learned HTML in short order. He facilitates the ZURB training courses.
Product Design Lessons, Direct to Your Inbox
We're just getting started, so sign up and we'll keep you in the know with our product design lessons. No spam here.