Design quality applied to apps, dating, and clothing

What do designers at software companies do? They don’t just make the product look good. They do the broad task of planning out how to make the product work for its users, both in its appearance and interactions.

In the book Emotional Design, design expert Donald Norman breaks down design thinking into 3 areas: visceral, behavioral, and reflective. A well-designed product will be high-quality in all these different areas. To illustrate these three separate concepts within design, I’ll apply them to the tech-industry scenario of designing a mobile photo-sharing app, and the everyday scenarios of going on a date and buying a shirt.

Some designers work across these three areas, especially when they’re the sole designer of a product, while others specialize in just one or two.

Visceral design

Visceral design refers to the aspects of the design that we respond to viscerally. It concerns itself with the immediate impression a product makes on our senses, and the intuitive responses we have to those impressions. Aesthetics fits into this category: think about a sleek-looking car, or the feel of a mobile device resting in your palm.

When designing a piece of software, the designer’s canvas is primarily visual, so visual design principles apply. For our photo-sharing app, we think about the layout of the app and the layout of content within the app: How big are the photos? Is the font readable? Is the layout sensible at a glance? If the app uses sound effects, are they pleasant or irritating?

Correspondingly, when on a date with someone, your visceral experience is made up the quick, automatic judgments we make about a date before actually talking to them: How attractive are they? How old are they? How wealthy or successful do they come across as?

When buying a shirt, the visceral experience is how does it look before interacting with it—how does it look on the rack, or on a mannequin, or in a catalog? Do you like the material and the color?

Behavioral design

Behavioral design refers to a product’s capacity to interact with the user. it concerns itself with making actions easy to discover, easy to remember, and capable of providing useful feedback. Roughly, it’s your experience trying out the product that you don’t get from just seeing it. For a product with a button, can I find the button, figure out what it does, use it properly, and tell whether I was successful?

When designing a piece of software, interaction design principles apply. Let’s say that you can comment on photos you see in the photo sharing app’s feed. Behavioral design concerns of the interface include: Is the comment entry point’s icon or text recognizable to a new user? Is the comment button big enough for them to click? Can a comment be done in a reasonable number of steps? Can they undo the comment? Will they find out if the comment failed?

When on a date with someone, the behavioral experience is how well the other person interacts with you, minute-by-minute. Are they polite? Are they good at conversation? Do they make you laugh? Do they help you learn about them, without overwhelming you or dominating the conversation? Even if someone isn’t model-attractive, often times these behavioral experiences more than make up for it.

When buying a shirt, the behavioral experience happens as you try it on: Does it fit? Do you look good wearing it? Is it comfortable as you move around in it? Is it easy to take on or off, to operate the buttons or zippers?

TryingOnShirt

This shirt has good visceral and behavioral qualities. I’ll buy it.

Reflective design

Reflective design refers to a product’s ability to meet the overall needs of its user: Does it ultimately serve its purpose? How do you feel after spending time with it? Does the user like owning the product—does it represent them? For commodity products with an identical visceral and behavioral experience, a superior brand will often result in a better reflective experience.

When designing a piece of software, user experience design principles apply. What are the user’s expectations of our app, based on what they know about the brand? Does the user like using the app: for example, when they start it can they quickly see interesting content from friends? Did the user find it satisfying; are their own photos being seen by others? And will the user come back to using it regularly, with the help of app features like push notifications?

When on a date with someone, your reflective experience is how you feel at the end of the date: Are you going to end it with a kiss? With a nightcap? Is another date in the works? Can you see yourself with this person long-term?

When buying a shirt, reflective experience comes from owning it and incorporating it into your life. Can you use it as part of an outfit with the rest of your clothing? Are the pockets big enough for your stuff? Does it retain its quality after washing?

Visceral design pitfalls

Across different fields, people often make the mistake of thinking that their visceral experience with something is reflective of its design quality as a whole. This is a very natural human mistake to make: we are wired to listen to our senses and intuitions, while it takes mindfulness to see past that and take into account our behavioral and reflective assessments of something. It’s also common wisdom to correct for this, based on proverbs like “Don’t judge a book by its cover” and “all that glitters is not gold”.

Some straightforward examples of this are dating someone just based on their looks, when they have no personality or manners, or wearing shoes that are fashionable but uncomfortable. With architecture, often times the most visually impressive buildings win awards, despite being awkward and impractical for the building’s inhabitants. On the other hand, a website might be ugly (I’m looking at you, Craigslist), but it could still enable high-quality interactions and experience.

One contemporary case of this is skeuomorphism. Broadly, skeuomorphism refer to the design philosophy of adding stying and embellishments that make an interface more familiar-looking to users but serve no functional purpose. More recently, skeuomorphism or “skeu” has referred specifically to web interfaces and mobile apps with gaudy textures that mimic their real-life counterparts, like felt backgrounds for gaming apps, dial-based controls for music apps, and paper-swiping animations, largely promulgated by Steve Jobs and Scott Forstall at Apple in the late 2000′s. Anti-skeu designers believe skeu caused designers to obsess over visual design quality at the expense of interaction design quality, while “flat” design simplifies visual texturing and emphasizes interaction design quality.

Behavioral design pitfalls

To be fair, quality behavior design isn’t the ends either. We occasionally we make the mistake of weighting our judgments of something on our behavioral experience at the expense of other types of experience. Good behavior design is important, and you need to get it right to have a high-quality product, but there are some interesting scenarios where it’s not essential.

We don’t judge a book by its cover, we judge a book by its words. Or do we? I’ve enjoyed some books that have been terribly written; while the writing style was frustrating to read—a behavioral consideration—the message came out clear and was worth my time—a reflective consideration. A restaurant might have a poorly written menu and terrible service, but the food is so good it’s worth the wait. Watching a performance with mediocre delivery might still leave you satisfied—think of a movie or show you’d describe as “campy”.

Ultimately, you have to deliver in all three areas of design to create a great experience for every second a user spends with your product.

Thanks to Abhinav Sharma, Jireh Tan, and Shawn Morel for reading drafts of this post.