The Elements of User Experience: Shape
Unlike colors, shapes aren’t as commonly associated with certain emotions and feelings. For most, it’s more underlying, a sort of unknown feeling of comfort, versus the psychology of color which is often ingrained in us from an early age. Despite this, shapes on the whole actually have a much clearer connection to our emotions as compared to the many complexities involved in color psychology.
Shape Psychology
Every object you see has a shape of some sort. Some of these are simply natural, but many of the objects we see in our daily lives are man made constructions. The biggest example of this is buildings, something we spend a good chunk of our lives either inside or observing. At times it can seem random why places are shaped the way they are, but as this study from PNAS examined, there is a reason
Our study consisted of presenting participants in a functional MRI (fMRI) scanner with photographs of interior spaces that varied in contour...In the beauty-judgment run participants were instructed to respond “beautiful” or “not beautiful” upon viewing each stimulus...Our results demonstrated that participants were more likely to judge curvilinear than rectilinear spaces as beautiful. In addition, this effect is likely driven by pleasantness, the valence dimension of the affect circumplex. These results are consistent with evidence from previous studies establishing a preference for curved objects ranging from simple lines to furniture and car interiors and the grounding of that preference in affect and extend them to the domain of architecture
To be slightly more specific, more curvy objects would activate the anterior cingulate cortex (ACC) exclusively. The ACC is connected to many different parts of the brain, with one of the biggest being the limbic system. In this system the two biggest areas are the amygdala, often linked to fear and memory, and the hypothalamus, linked to regulating emotion. Working in these areas, the ACC is almost a translator in a way, linked more to how we express and control these emotions, such as with impulse control and empathy.
Shape Your Designs
Knowing that the structure of shapes directly impacts our brain’s emotional expression, this can be used to influence the perception of some of your designs. This can best be seen in logo design. A logo is often the first impression of any business, so making sure the emotional response it activates aligns with the company is key to a successful design. This infographic from Freelogoservices gives an in-depth look at the many different strategies companies go with during logo design.
An very in depth graphic showing the many different meanings shapes have in logos
This aligns with the previous study very well. Companies like Fresh Market and Starbucks want to present a friendly, welcoming image, as they are often a part of many people’s daily routines. Knowing that, they have very curvy images, with Starbucks avoiding sharp edges entirely by using a circle. Conversely, companies like Microsoft and American Express want to present an image of trust, since you have to entrust key aspects of your life (data, financial info) to them. That’s why they have more uniform, rectangular images. While it may not give you a warm and fuzzy feeling like a more curvy logo, it does give you the sense that this is a professional company you can trust.
Applying That to User Experience
While logos are singular images, a full user experience will have hundreds of shapes throughout it. This makes it a little more complicated, as certain aspects will require specific shapes, as well as these shapes frequently bouncing off each other. Despite that, these principles can still be used to your advantage when trying to design the best user experience possible
A sample of both The Athletic's main feed and story review pages
Above shows the app The Athletic, a companion app to the subscription based sports website. As it aims to emulate the feeling of the professional journalist, it has a very simplistic, clean look. Most of the content is in sharp boxes, whether it be the scores, the articles, or even the comment icon. This helps frame the content, making it the focus of the app and giving the app stability as compared to a more eccentric, curvilinear design.
In contrast, at the bottom of all articles is a little rating system. Normally you would think it would be something basic like stars, keeping in consistency with the app. Instead, they choose colorful, rounded heads that show different reactions. While it may seem odd, it makes sense when you consider it’s mainly aiming at the emotions of a user. If it was simply something basic like stars, it wouldn’t stand out in contrast to the rest of the app, making it likely users will simply pass over it. By making it colorful heads, it grabs the user’s attention, as well as potentially guiding them to their emotional reaction to the article, making the reviews and interactions with the writers feel a little more human.
Similar again to color, this isn’t a concrete rule one must always follow. It’s all very context dependent on what you’re making, who you’re making it for, and who’s your competition. Sometimes maybe a rounded shape will actually help give a sense of stability, such as Audi, but like anything else in design, to break the rules you first must understand them.
