Psychological Principles for Better UX Design
In order to increase the number of satisfied customers, it is important for us to understand how the psychological principles in design influence the user’s decisions.
The customers are driven by their emotions when are looking at a website or considering if they need your product. The effect of interacting with your site, such as whether user completes a purchase or not, depends on what they see on your site.
In this article, we will discuss the following topics:
1. Psychology of colors
2. Visuals dominate but text matters too
3. Hick’s Law
4. Social proof
5. The Von Restorff effect
6. The theory of double coding
7. Fitt’s Law
8. The Psychology of Shapes
9. The 80/20 Rule
1. Psychology of colors
Color psychology studies how different colors determine human behavior.
They can have a huge impact on the emotions your visitors feel as well as guide their behavior when they are using your website. Colors can affect how we feel and act, but the effects depend on personal, cultural and situational factors. Further studies are needed to better understand the psychology of color, because this concept has become extremely popular in marketing, art, design, fashion and other areas.
Color psychology is the study of how colors affect perception and behavior. In marketing and design, the psychology of color is concerned with how colors affect the consumer’s impression of a brand and whether they persuade consumers to buy a particular product.
If we are talking about colors, we have to start with the introduction. We can group colors according to different characteristics, but let’s start with the simplest one. Primary colors are the three colors that make all other colors. They are red, blue, and yellow. These three colors can be used to create the others colors, called the secondary colors. We also distinguish other groups, such as cold and warm colors. The cold colors include: green, blue and other cool shades. To warm colors: red, orange, yellow.
Psychological Effects of Warm Colors:
Red
As you may have noticed, promotion signs are usually red. This color is a color that stimulates and encourages immediate action. It also stimulates the appetite, which is why fast-food chains or restaurants often use it. The sight of a red color has been shown to physically energize the body, increasing blood pressure and heart rate.
Red in Marketing: McDonald’s, Coca Cola, Netflix
Red is commonly seen: Food products, Restaurants
Yellow and Orange
These two colors are cheerful, energetic and optimistic. Yellow, however, can make babies cry. These colors are often used by brands based on a sense of joy and carefree, aimed at children, or sports companies.
Yellow and Orange in Marketing: Fanta, Amazon, Snapchat
Orange is commonly seen: Fruitty products, Sporting events, Board games.
Psychological Effects of Cool Colors:
Green
This color is associated with health, peace, strength and nature. It is primarily used as a “sedative”. It stimulates harmony and peace. One of the most recognisable examples of using green in the logotype is Starbucks, a global brand. This color provides a feel of relaxation in their cafes.
Green in Marketing: Starbucks, BP, Spotify
Green is commonly seen: Nature, Health-based stores, Restaurants.
Blue
Blue color often means typically male products. Its meaning is associated with silence, water, peace and reliability. The sky-blue color gives the impression of security and trust. It is the most popular color used by brands that want to build confidence and trustful relationship with the customer, such as insurance companies. It provides a sense of security, stimulates productivity, which is why blue is used in social media logos more than any other color.
Blue in Marketing: PayPal, Facebook, Linkedin, Visa, BMW
Blue is commonly seen: Workout facilities, hospitals, and spas.
Psychological Effects of the others Colors:
Black
Black is a neutral color, which is often used to subdue more vibrant colors that run the risk of being overpowering. Because of these stabilizing properties, black can be very powerful. It is associated with authority, stability, self-confidence and strength. It is often a symbol of intelligence, used by exclusive, luxury brands that focus on elegance. Many fashion retailers have used black in their logos.
Black in Marketing: Nike, The New York Times, Tesla, Apple, and Chanel
Black is commonly seen: Professional attire, Luxury products,
White
White is associated with a sense of cleanliness and security. It is a neutral color that provides visual space. This space stimulates creativity, suggests minimalism and delicacy.
White in Marketing: The North Face, Zara, and Jeep
White is commonly seen: Wedding services, Motorisation, Sport brands
Pastel colors
Pastel colors prove that the product is made for women or children. Pastel colors are subtle and provide many emotions such as love, affection, joy, romance, peace, and serenity. Using pastel colors in product marketing is very beneficial to the customer as it identifies the product as “relaxing”.
Pastel colors in Marketing: Pampers, Always, Etude House, Laneige,
Pastel colors are commonly seen: Womens brands, Kins products
2. Visuals dominate but text matters too
90% of information transmitted to the brain is visual. Statistically, posts and articles with visuals get 94% more visits and engagement than those without them.
People evaluate objects, people, and situations as soon as they see them. The first impression about the new person takes only 1/10 of a second. The websites do not differ in their assessment at all. It takes 0.05 seconds for users to get feedback on your site to decide whether to stay or leave the page. This first impression depends on many factors: structure, colors, spacing, symmetry, amount of text, fonts, and more.
According to the British researches the first impression about the website is 94% design related. Only 6% of the feedback is about the actual content. Visual appeal and website navigation had the biggest influence on people’s first impressions of the site.
When you break down your text into several attractive images, people are more likely to finish reading what you wrote. People are naturally more attracted to images than text, which means that for example Facebook posts with a photo receive on average more than twice as many comments than without.
However, if we are talking about company marketing, the right text is essential.
Users make split-second decisions about what they think about a specific project as soon as they see it. It’s important to have an interesting visual of your product as it becomes more attractive to your customers. Simple design elements such as fonts, colors, images, or icons can determine the overall appearance of your site and product. The description and specifications are usually checked later, but if they do not meet the expectations, or if they do not provide the expected information, the user will end the action.
Undoubtedly, the UI can significantly influence the user’s feelings. An example that is now the most up-to-date are the maps of the coronavirus occurrence that are known to all.
Let’s look at these graphics that appear many times on portals and websites. The first thing to notice is, of course, the red value in the upper left corner, i.e. in the place where our eyes naturally fall when visiting a new site. This number in animations is constantly increasing causing fear and panic to the user who pauses the animation. Additionally, the red dots on the map are constantly growing. This trick was used to show the public the magnitude of the threat and motivate them to follow the instructions.
3. Hick’s Law
Hick’s law (the Hick-Hyman Law) says that the more options a person has, the longer it will take for them to make a decision.
There is evidence that if we give too many options to the user, they will not make a decision at all, because they will analyze each option and compare it with others available on the market.
This law translates directly not only into the marketing strategy, but also into the UX project. When it comes to designing your web pages, this means keep things simple. Giving users a good user experience requires that you first find out what features they will need. By limiting the possible actions to the most necessary, it ensures that the user does not get stuck while using the page asking, “what’s next?”. If users get stuck in the decision-making process, they may feel confused, frustrated or leave your site.
As you might expect, the more stimuli to choose from, the more time it takes for the user to decide which to interact with.
Overall, Hick’s law in UX is simple and tends to reduce the number of stimuli, which will ensure faster user decision-making.
The design principle relating to Hick’s law is otherwise known as “K.I.S.S.” (“Keep It Short and Simple”). Some will overwhelm K.I.S.S. as “Keep It Simple Stupid”.
4. Social proof
Have you ever bought a product after a recommendation from someone else?
This means you have been influenced by social proof and you have shown why it can be an excellent marketing tactic for businesses. It was a positive opinion that convinced you to buy the product, and this is how social proof in marketing works.
There’s no denying the power of social proof. Studies show 92% of online customers look at a product review prior to making a purchase.
Social proof is basically the concept that people will follow the actions of the masses.
To increase the level of trust for brand, websites use social evidence such as ratings and reviews in e-commerce. This helps you get customers who will “follow the crowd” and choose your product because they can see that other customers were happy about your product.
6 Types of Social Proof
There are 6 major sources of social proof:
· Customers: social proof from your customers or users
· Experts: social proof from credible and esteemed experts in your industry
· Celebrities: proof from celebrities or other influencers
· Crowds: large numbers of people who provide social proof
· Friends: people who are your website visitors and users
· Certifications: a credible, 3rd party entity that certifies that you are a knowledgeable, high-quality or trustworthy source
Some interesting statistics about social prove:
· 61% of customers read online review before choosing to buy a product or service
· Nearly 70% of online customers look at a product review before making a purchase
· 91% of 18–34-year-olds trust online social proof reviews as much as recommendations from someone close to them
Source and more informations about social proof:
https://www.oberlo.com/blog/social-proof?fbclid=IwAR07CVbB7LF2zkLThg2Os-5IQtcFBSwGFZgZsIUHKb1QfL59qTYd7tmgItU
5. The Von Restorff effect
This principle, also known as the “isolation effect”, a state that among many objects the user remembers the characteristic ones.
Basically, The Von Restorff effect predicts that when multiple similar objects are present, the one that differs from the rest is most likely to be remembered. Characteristics can be appearance or experience. In order to stand out from the crowd, your projects should provide users a non-standard experience.
This effect refers to the phenomenon whereby people judge an item differently depending on whether it is placed in isolation or alongside other alternate versions of the same item.
It is easier to direct the user to a given product if it is placed next to an alternative to which it is clearly superior in some respects.
Source and the short video which will help you better understand this effect:
https://www.clearsalesmessage.com/the-von-restorff-effect/
Focus their attention on a specific element
This effect allows you to drive the user’s decision. When most of their attention is focused on the highlighted item, less attention will be paid to remembering the rest.
As a result, the user is automatically most likely to choose the product or website that he remembers best.
How to use it in UX design?
· Make important information or key actions visually distinctive.
· Be careful when doing visuals to avoid competing with each other.
· Consider motion-sensitive users when using motion to communicate contrast and highlight an element.
· Customize your visualizations to suit all your users so that you don’t exclude people with color blindness or low vision, relying solely on color to convey contrast.
If you would like to increase your email click-through rates, or explore what is the difference between click rate, click-through rate, and click-to-open rate you should also check:
https://www.klaviyo.com/blog/increase-average-email-click-through-rate
It would be really helpful for you, if you want to focuse a bit more on this effect.
6. The theory of double coding
The double coding system will make it easier for the user to remember the information.
This theory suggests that memory has two different but connected systems. The user remembers verbal (analog) and non-verbal (symbolic) information. Analog codes are used to mentally represent images. Symbolic codes are used to create mental representations of words. If we provide both, the user is more likely to remember the information. Dual Coding is not only applied in regards to problem-solving and concept learning but also inhibits significance in spatial intelligence, mnemonics, and language.
Because memory is stored in more than one place — in our word bank and picture bank.
Information that is integrated in the mind is more likely to stay in mind. So the idea of using verbal and visual content together seems to lead to the best results, especially in marketing.
Integrated Marketing Communications (IMC) means the use of messages in a variety of media (broadcast, print, billboards, etc.). This allows obtaining the best possible effort because information about a given product is provided to the user in various forms. Concatenating messages in the user’s mind is more powerful than any single message.
Numerous studies also show that customers remember better when the brand name is associated with visual elements, e.g. characteristic graphics or logos.
7. Fitt’s law
Fitts’ law suggests that the time it takes to travel to the target area is a function of target size and distance to target.
This law dictates that it is best to place the buttons closer to the probable locations of the mouse when clicking on an element. As well as enlarging them to shorten the user’s interaction time. The time needed to take a given action affects the level of the convention, and each additional time is a risk of losing a potential customer. Therefore, the application of this law is extremely important in website design.
For example, on Macbook devices, menu bar items grow when you hover over them. It is useful for increasing the utility index.
In applying this law, it is important to know where the user’s cursor is when he starts the application. This point would be called Prime Pixel, the point from which the user would perform all their tasks. By setting this point, you can adjust subsequent actions and design a comfortable page for the user, setting the shortest paths to actions that the user will take.
8. The Psychology of Shapes
The human brain reacts to shapes by assigning them features that are associated with a given shape.
These associations arise from the combination of associations and experiences without even being aware of them. Brands use shapes along with colors to create their logos and other visuals to evoke emotional ties to their brand. Shapes, just like colors, build emojis in the recipient and help associate a brand with a given set of features.
Commonly used shapes are:
Circles, ovals and ellipses
Round shapes create a very positive emotional message, suggest gentleness, community, infinity, relationships and unity.
Squares and triangles
A logo with straight edges suggests stability, strength, professionalism and efficiency. Triangles are associated with science, religion and law, as well as power. These shapes are often seen as a male trait.
Vertical Lines
Vertical lines in logos such as Cisco and SoundCloud are associated with masculinity, strength, and aggression.
Horizontal Lines
Horizontal lines in logos such as AT&T and Human Rights Campaign are connected with community, equality, tranquility, and calmness.
9. The 80/20 Rule
The Pareto Principle, also known as the 80/20 rule, or the Law of the Few of Matter is a productivity hack of sorts.
The idea behind it is: 80% of the effects of any given process come from 20% of the effort put into it. Basically it says that only 20% of your work accounts for as much as 80% of the results you achieved.
To illustrate this in a UX context, it’s like that:
· 80% of your users use 20% of your features
· 20% of the code causes 80% of the errors
Trying to solve and improve all problems at once is extremely difficult; time consuming, and produces less results. Maximizing your work on a small part can be the key to success. It can make the biggest difference; it will definitely help you better. By having fewer elements to focus on, you can maximize precision to increase conversion rates with minimal effort.
In summary
The best way to improve your design is to understand how your users react to the information you give them. Analysing psychological principles and understanding a few key concepts can be great ground for creating user-friendly projects. The principles mentioned in this post should be enough to keep the right mindset when designing and getting more users or customers.
While you may have excellent UX design skills, they can’t always answer your questions about how users will perceive the interface, what colors should you choose.
Since psychology studies how the human brain perceives and processes information, theories of cognitive psychology can be of great help to UX designers. From well-known tricks like isolation effect and colors to various laws, UX designers can reap many benefits.
