---
title: 'Design 101: Stop Yelling'
teaser:
tags: design
author: Chad Mazzola
published_on: 2012-02-06
---

How do you make yourself heard in a loud room? BY YELLING! And when it comes to
design, that's often the approach used for drawing attention to elements.
**LOUDER! BIGGER! FASTER!**

But there's a better way.

Imagine yourself in that loud room again. Now imagine that instead of yelling to
get above the noise, you could just turn down everyone else. Instead of shouting
at the person you're talking to and ending up with a strained voice, you'll be
able to have a nice, thoughtful conversation with them.

While it's hard to turn down the volume of a room, it's easy to quiet the
background noise in your design and let the important parts speak clearly. Let's
take a closer look at this idea.

Below is an example of a composition where everything is shouting at you. The
big red headline at the top is trying to assert itself, but so is everything
else, which means, in the end, nothing stands out.

[![''](http://images.thoughtbot.com/ui/one.png)](https://thoughtbot.com/upcase/design-for-developers)

So let's turn down the volume. You have to decide what you're trying to
communicate and how to say it in a clear and concise way. This will drive your
design decisions. In the example below, we've established a clear hierarchy
between each bit of text. The headline still dominates, but we've toned down the
other text so that your eye moves comfortably and naturally from headline, to
subhead, to body text.

[![''](http://images.thoughtbot.com/ui/two.png)](https://thoughtbot.com/upcase/design-for-developers)

Let's try another iteration that makes more dramatic use of white space. I tell
students in my workshop that white space is the secret ingredient in design.
Effective use of white space can transform a mundane design into something that
feels elegant and timeless.

[![''](http://images.thoughtbot.com/ui/three.png)](https://thoughtbot.com/upcase/design-for-developers)

In this example, I've made the headline and subhead the same size as the body
copy. I'm relying on white space to create the hierarchy, isolating the elements
within the composition so they can establish their presence without competing
with surrounding elements. Think of that loud room again. Not only have we
quieted the voices in the room, we've moved everyone to their own corner so they
can talk without distraction.

When thinking about how to create emphasis, don't be so quick to turn up the
volume. Think about how to use hierarchy and white space to communicate your
message without shouting it at your audience. You'll create something more
elegant and respectful that still accomplishes your communication goal.

I'll be teaching more visual design principles and strategy in my workshop,
[Design for Developers](https://thoughtbot.com/upcase/design-for-developers), which is
running Feb 27–28 in our Boston office.