In this article, we’ll see why humor is an incredible tool for emotional connection, and what techniques designers can use to create that connection with their users.
Why humor is so important
People don’t just use products; they experience them. Every time we interact with a particular product, we put emotions into that experience. Whether it’s positive or negative, we always have feedback in our heads. But what makes one product memorable and others easily forgettable?
"Humor sells. It makes the experience of using your product more memorable."
In the book Emotional Design: Why We Love (or Hate) Everyday Things, Don Norman digs into this question. His fundamental idea: attractive products work better. Attractiveness makes the user more tolerant of minor difficulties. But attractiveness doesn’t mean only beauty—it also means a genuine personality. And when it comes to product design, there’s one thing that helps us convey a personality—humor. Used effectively, humor can engage users and increase product stickiness. It can set your experience apart from others in a positive way.
Humor sells. It makes the experience of using your product more memorable.
Bringing a smile to a user’s face can transform that experience from likable to lovable. As a result, people not only remember the delightful experience, but they tell others about it as well.
Is humor the only ingredient of good UX?
Does this mean that to create a great product all we need to bake humor into our designs? Absolutely not. Humor cannot fix a product that has fundamental usability issues. As explained by Aaron Walter, creating a pleasurable experience is only at the top of the user’s hierarchy of needs.
This means that products we create should satisfy the basic needs of users—they should be functional (solve the problem for users), reliable (users can count on the product), and usable (easy to learn and easy to use). And when a product serves these basic requirements, then it’s possible to add delight to the user experience. Adding a bit of fun into interactions can move you up to the pinnacle of a pyramid.
4 types of humor designers can use in digital design
Humor and fun can come in many forms. In this section, we’ll review just a few basic types of humor.
Personification is attributing human characteristics to objects or creatures. It’s one of the most popular ways of using humor both in product design and advertising, because personification makes it easier for people to understand key concepts.
Designers often use mascots (nicely designed creatures intended to evoke sympathy) as a tool for personification. Many world-famous brands use mascots to bake a personality into their brand identity. For some of them, mascots became a natural part of brand identity—when people hear the name of a brand, they picture a mascot in their heads.
In digital products, it’s possible to use mascots for many different purposes. A mascot can greet your website visitors and make them feel more comfortable. Or it can be used at the time of anxiety when users need extra care and support.
When it comes to using mascots in digital products, it’s vital to make them a natural part of a user journey. That’s why timing and user expectations are two main properties that should be taken into account. The mascot shouldn’t appear uninvited; otherwise, it will annoy users.
2. Comparison with exaggeration
This type of humor puts two (or more) objects together to create a humorous contrast. This type of humor makes it easier for people to understand the point you’re trying to make.
Perhaps one of the best-known examples of comparison with exaggeration is the “Get a Mac” advertising campaign created by Apple. Each commercial in the campaign involved a general comparison of Mac and PC, but done in a hilarious way.
People feel a sense of surprise when something happens that’s not in line with their expectations. The crucial detail of successful surprise is that a person shouldn't expect something to happen (surprise shouldn’t be predictable otherwise it won’t be a surprise).
4. Easter egg
Easter eggs are hidden messages/images or secret features. The term was initially coined to describe a hidden message in the Atari video game Adventure, which soon started a trend of players looking for hidden messages in other games.
Today many digital products contain easter eggs. One good example is Google Search. Type “askew” in the input field, the page with search results will literally skew itself for you.
Surprise and easter egg may sound like the same concepts, but there’s an important difference between two—surprise always comes unexpectedly, while Easter eggs are something users know about, since they have to hunt for them to find them.
As with anything, there is no simple formula for injecting humor into your design. Each product is different and requires its own approach. However, there are a few places where humor can be implemented without too much risk.
First successful interaction with a product
Old wisdom says that you only have one chance to make a first impression. Similar to human relations, your app has only one opportunity to create an excellent first impression on your users. It’s possible to increase the likelihood of this by introducing humor and delight.
Success state—a state users see when all goes according to the plan—is a perfect place to bake in humor. This could be on a screen users see in email app when they send their first email, or an order confirmation screen in a food ordering app. Sometimes even simple things can help you make the first interaction with a product unforgettable.
The about page
The about page is one of the most important pages on your website. It’s where visitors go to find out more about a company and its culture. Even though this page is extremely valuable for your visitors, it all too often looks way too generic—necessary information about a company paired with images of people who work in it. When people visit such pages, they usually forget them as soon as close the browser’s tab.
With a little bit of creativity, it’s possible to turn the about page into a fun and memorable experience for your visitors. All you need is to figure out your company's unique identity, and then share it with other people.
One great example is Smashing Magazine’s about page, which features cartoon representations of Smashing’s management team. The page serves a clear functional purpose: it introduces the team, but it does it in a very informal way.
The 404 page
The 404 error page is another page that most websites have. Visitors see a 404 page when they try to access non-existing page. While the reason of showing 404 may vary—maybe the link the user used to navigate was broken, or the user mistyped a URL—the experience they have on 404 will impact their overall experience.
Good 404 page communicates why a particular page can’t be loaded and what users can do next. Great 404 pages not only reduce the user’s frustration of not finding what they are looking for, but also makes them smile. Below, Airbnb’s 404 page uses an animated illustration to humanize the problem.
Who enjoys waiting times? Most probably nobody. Still, waiting time is a natural part of our daily experience with products. When a system asks us to wait, we usually consider it a bad experience. And the more we have to wait, the less happy we will be about a product.
Waiting time can be caused by many different reasons. For example, the system itself might be slow, or users may be experiencing a slow internet connection. Not all problems are easy to solve. Thus, if you can’t shorten the line, you should at least make the process a bit more pleasant.
Some products have found a creative way of using the loading screens. Instead of showing an infinite loading spinner paired with the word “loading,” such products add humor. One of the great examples is Slack, which often cracks a joke when users log in into the app.
Empty states are pages that don’t contain any data. The page might be empty because users just recently started using an app and the app doesn’t contain any data to display, or the app might encounter a network error and can’t download data. Whatever the reason is, the way you design empty states plays a vital role.
Many apps available on the market today have empty states that are too...empty. They don’t provide any valuable information to users; they just state that the system doesn’t have any data to show. But in most cases, it’s possible to make empty state pages much more pleasant for your users. A well-designed empty state will not only tell users why they don’t see any data, but can also motivate users to interact with the app to fill it with data.
Let’s grow your freelance or agency business.
Get design inspiration, practical takeaways and free resources to help you find and delight clients.
Thanks for subscribing
You’ll start receiving free tips and resources soon. In the meantime, find out how Shopify’s Partner Program can help you grow your business.
Nick Babich is a developer, tech enthusiast, and UX lover. He's spent the last 10 years working in the software industry, with a specialized focus on development. He counts advertising, psychology, and cinema among his myriad interests.