Design With Dissonance

About The Author

Tad Fry is a web developer who likes to combine design & theory. He can be found on Twitter @tadfry and enjoys writing, sketching, and problem solving. Get … More about Tad ↬

Email Newsletter

Weekly tips on front-end & UX.
Trusted by 200,000+ folks.

Dissonance occurs when something disrupts your consonance. Go through this post to know why you should use dissonance as a new way to design and write.

You might consider yourself knowledgeable, but you’ve probably never heard of this powerful communication and design technique that I’m about to share. I’m sure you’ve seen it in practice but never knew it was working on you — that’s how good it is. I’m here to shed light on this technique so that you can use it as an approach to your design or writing.

See what I did there? I introduced you to dissonance by using the technique itself. If used correctly, it can enhance your approach to design and copywriting in certain projects. Welcome to designing with dissonance!

What Is Dissonance?

To understand dissonance, knowing first what consonance is would help. Consonance is when you feel comfortable with your beliefs; a certain harmony exists in how you’re feeling right now. You feel good. Dissonance occurs when something disrupts your consonance. It challenges your beliefs and makes you feel uncomfortable. You feel bad, or you think to yourself, “What the heck is going on?”

So, why should you know about dissonance and consonance? How are they relevant to design and writing? They are relevant because they are the key ingredients in cognitive dissonance, one of my favorite theories of Leon Festinger.

Festinger’s basic hypotheses for cognitive dissonance are as follows:

  1. The presence of dissonance, of being psychologically uncomfortable, will motivate the person to try to reduce the dissonance and achieve consonance.
  2. In addition to trying to reduce dissonance when it is present, the person will actively avoid situations and information that would likely increase it.

Why Should You Use Dissonance?

We are going to focus on the first hypothesis as a new way to design and write. Put simply, it stipulates that we always want to reach consonance when we experience dissonance. May the persuasive madness begin!

We often try to convince people to use our solutions through our writing and design. In your attempt to persuade them, design with dissonance as a way to challenge their beliefs, and then introduce your service as a way to help them achieve consonance.

Writing With Dissonance

My introduction to this article uses dissonance. I suggested you were knowledgeable but that you haven’t heard of this technique. If you felt uncomfortable about not knowing this technique, then perhaps you chose to read on in order to learn it and feel comfortable again. And because I’m also a detective (well, not really) and possess mad deductive-reasoning skills, I can infer from the fact that you’ve read this far into my article that the dissonance may have worked on you! Aside from my attempt in the introduction, some amazing articles in our industry use dissonance beautifully.

An Essay By Paul Scrivens

A good example is Paul Scrivens’ essay, “You Are Not A Designer And I Am Not A Musician.” I love this essay, and many designers have shared it with their peers. Here’s an excerpt, in which he begins to use dissonance:

“No, you are not a designer. You are someone that can piece together some stuff in Photoshop or add the right pieces of code in XHTML/CSS. You aren’t the person that creates experiences. You aren’t the translator of ideas that people never thought could be produced visually. You aren’t the person that can toss their own style to the curb and come up with something even greater because of it.…

We live in a world of hobbyists and the majority of our peers are hobbyists parading as professionals. They are not designers.

But you could be. Maybe. Just take the time to study like the greats before you. Push your limits. Test your boundaries. Designers like to work within their comfort zone because they know what they will like. Make something ugly to help you come up with some ideas on how to make something beautiful. When you need inspiration create your own.”

Scrivens has disrupted your consonance here, which created dissonance. He challenged your beliefs. He blatantly told you that you are not a designer. But in the midst of your dissonance, Scrivens offers solutions: he suggests that you study like the great designers before you, and he makes recommendations on how you can find your own inspiration to become a designer. These are solutions you could follow to bring you back to consonance. Cognitive dissonance at its finest. Yes, you could have simply dismissed Scrivens’ attempt at dissonance, but then the theory would have worked even then; you wanted to maintain your beliefs and feel comfortable.

An Article By Whitney Hess

In her article “You’re Not a User Experience Designer If…,” Whitney Hess demonstrates wonderful writing with dissonance. She could have taken the easy way out and written it as the “Top 10 Ways to Be a Better User Experience Designer,” but I doubt it would have had the same impact as the real article had on that glorious day when user experience designers shared it with their peers to defend their work.

Dissonance was possibly created when designers read the title of the article. I’m sure many designers must have thought, “How dare she say what I am and am not. I must read on to refute this nonsense!” But as they read the article, they would have found Hess offering a list of things that do not make them user experience designers. The list might have made them psychologically uncomfortable (dissonant), but they may have decided to act on the list items to make themselves feel more comfortable and to bring back consonance. The article challenged beliefs and fostered great discussions.

A Project Built On Dissonance

You can base an entire project on dissonance. McKinney made an amazing online game about surviving poverty and homelessness, called Spent. Visitors are challenged to live on $1000 a month. Most people think that it’s easy to make a living and act like no one has an excuse. They accept the challenge because it seems easy enough. In the end, they walk in the shoes of someone less fortunate and begin to understand their hardships.

We see dissonance right away on the main page, “But you’d never need help, right?”

Spent Intro
Spent - online game.

We feel psychologically uncomfortable and try to correct it by accepting the challenge. We are then presented with the following narrative:

“Over 14 million Americans are unemployed.

Now imagine you’re one of them.

Your savings are gone.

You’ve lost your house.

You’re a single parent.

And you’re down to your last $1,000.”

Then we are asked whether we can make it through the next month or would like to “Find a job.” If we choose the latter, we are presented with current job openings: restaurant server, warehouse worker or temp.

When we make our choice (in this case, warehouse worker), a description of the job is shown and we continue:

Spent Health Insurance
Spent - Health insurance.

We continue to face more choices that make us uncomfortable, such as whether to opt in for health insurance. If we opt in, we see the impact on our finances, which helps us understand something meaningful about low-income workers.

Spent Result

We then need to choose where to live relative to our place of work. Living closer means higher rent, while living further away means higher transportation costs. You are then asked to pay your rent and transportation costs.

Spent Find Home
Spent - Find a home.

And then we are presented with even more uncomfortable situations that create yet greater dissonance!

Spent Small Apartment
Spent - Small Apartment.

When we finally reach our tipping point and want to correct the dissonance, we can get out at any time. A small link in the corner reads, “I can’t do this.” And then we are asked to take action and help by getting involved:

Spent Final

As you can see, the website creates an intense experience of dissonance. And it offers a way to help us reach consonance by donating, sharing and getting involved with Spent.

More Dissonance In The Wild

As mentioned, dissonance is already being used, and you might not have even noticed its power. Let’s look at some attempts at cognitive dissonance, where businesses challenge our beliefs and then suggest their services as a solution.


If you’re a PHP developer, Adobe will definitely disrupt your consonance by asking, “Who needs PHP?” The ad leads to Business Catalyst, where Adobe explains how you can build database-driven applications without writing code!

A Book Apart

HTML5 - A Book Apart
“The HTML5 spec is 900 pages and hard to read. HTML5 for Web Designers is 85 pages and fun to read. Easy choice. HTML5 is the longest HTML specification ever written. It is also the most powerful, and in some ways, the most confusing. What do accessible, content-focused standards-based web designers and front-end developers need to know? And how can we harness the power of HTML5 in today’s browsers? In this brilliant and entertaining user’s guide, Jeremy Keith cuts to the chase, with crisp, clear, practical examples, and his patented twinkle and charm.”

The introduction to HTML5 for Web Designers creates dissonance by suggesting that we don’t have the time or energy to get through the HTML5 spec. It recommends that we use this book to learn the important parts of the spec, which will bring us back to consonance.


Projects Manage Themselves with Basecamp. Millions of people use Basecamp, the leading online project collaboration tool.

The subheading for 37signals’ Basecamp is powerful. Knowing that millions of people are using Basecamp to get stuff done and that you’re not one of them might challenge your thinking. Are you missing out? Are those people more efficient than your team? You might consider using this product to gain efficiency.


Send Invoices. Accept Cards. Tired of PayPal? Signup for Blinksale with Blinkpay. Just $24/month for both.

For those of us who use PayPal, Blinksale attempts to create dissonance through its ad on The Deck by asking whether we are tired of our current service. Some of us feel that PayPal is a good enough service, but Blinksale claims to be the easiest way to send invoices online. With our beliefs challenged this way, we might decide to look further into what Blinksale has to offer in order to resolve our dissonance.

Where To Start?

If you’d like to apply cognitive dissonance, I suggest starting simple so that you can A/B test and gather feedback more easily. Then, you could incorporate more of it as you become comfortable with applying the theory. For now, start by using dissonance in a few of the headlines on your website to convince people to do business with you. Take the boilerplate headline that we see on most freelancers’ websites:

“Hello. My name is Tad Fry, a Web developer and designer who makes websites.”

Apply some dissonance:

“Your competitor’s website is better than yours. Let’s work together to change that.”

This might be blunt, but we want to challenge beliefs. If someone feels that their website is better than their competitors’ but then is challenged by your headline, they might be inclined to call you to resolve their dissonance. If you want to appear less provocative, you could phrase it as a question.

“Is your competitor’s website better than yours? Let’s work together to change that.”

Even though we are phrasing it as a question and the potential customer might agree (consonance), we are still creating dissonance because they might not have even considered that their competitor’s website might be better. We’ve now made it less direct and perhaps less insulting. Getting the right balance between dissonance and a respectful tone is sometimes difficult, but as with most of our work, gathering feedback and making changes based on it is important. This brings up another part of the theory.

In his book A Theory of Cognitive Dissonance (see pages 3 to 18), Leon Festinger writes (18):

“The strength of the pressures to reduce the dissonance is a function of the magnitude of the dissonance.”

We might prefer to be more direct, because that will create greater dissonance, which would put more pressure on the audience to reduce it. Again, it comes down to how much dissonance you want to create without insulting the visitor or completely missing the target. After all, the visitor could achieve consonance simply by choosing not to listen to you at all — which is why testing your work is so important.

Now Go Forth And Challenge Beliefs!

Hopefully I’ve whetted your appetite for this approach. I encourage you to look more into the theory, which is more involved than this introduction. And that’s the beauty of it. The various degrees of dissonance offer new approaches to your next design. Try adding dissonance to just a headline or page element at first. Be careful not to insult; you simply want to challenge beliefs and offer your product as a solution.

Further Reading

Smashing Editorial (al, mrn)