User psychology principle UX designer should know (Part 1)

UX/UI

User psychology principle UX designer should know (Part 1)

line-PC.png
line-phone.png
 

In recent years UX/UI become a natural expression you see when designing user interface. Since the primary user is human the best way to create a smooth experience is to have profound comprehension of the user's habits, preferences, and behavioral trends. Psychology has an important role in designing the user experience because it helps the customer solve the right problem. I have assembled in multiple webs from Law of UX and Human by Design to some other reliable references like iDesign, UXBert, and medium.

Part 1 of the series has compiled and simplified 4 psychological principles that will help improve the aesthetics, effectiveness, and usability of your designs.

  1. Hick’s Law
  2. Psychology of Colors
  3. Psychology of Shapes
  4. Doherty Threshold
 

Hick’s Law

 
The time it takes to make a decision increases
with the number and complexity of choices.
— Jon Yablonski
 
responsetime.png

Hick’s Law (or the Hick-Hyman Law) is named after a British and an American psychologist team of William Edmund Hick and Ray Hyman. The equation for Hick’s Law is defined as follows:

RT = a + b log2 (n)

Where “RT” is the reaction time, “(n)” is the number of stimuli present, and “a” and “b” are the total time that is not involved with decision making and the conditions under which it will be carried out. 

In other words the more options you offer the less likely any one of those options will be taken. Think of a typical eCommerce site. How often do you see them overwhelming users with many categories as possible in a sidebar menu or attempting to pack as many products as possible on the home page? If the tasks too complex users end up stuck in the decision-making process of “what next?”, they may become confused, frustrated, or leave your website. More choices mean fewer sales.

 
The website is cram with too much information and look confusing.

The website is cram with too much information and look confusing.

 
MMORPG game with too many buttons and choices.

MMORPG game with too many buttons and choices.

 
 
Group 22.png

In cases you the finale decision to shorten the long list of options, limit the number of options the user can view at a single time to make scanning easier and faster. If minimalism is your thing then a bit of color or carefully organized negative space could help to break down the top-level decisions that users need to make.

Another better approach would be sort out items into a hierarchy with a few high-level categories shown in the sidebar and present a smaller step in the home page to ensured maximum benefit out of it. If the costs outweigh the benefits, users won’t take action. This is known as the cost-benefit analysis.

What we do with the page stacked with text. We could utilize graphics and images to make a heavy page easier to read. Users don’t read content until they are motivated and empowered to do so. Along these lines, we need to take titles seriously and use the imagery in the right way.

 
Pinterest page without graphic and image

Pinterest page without graphic and image

 
Pinterest page with graphic and image

Pinterest page with graphic and image

 
 

Psychology of Colors

 
Colours, like features, follow the changes of the emotions
— Pablo Picasso
 
Color Psychology

Color Psychology in medium

Do you feel hungry or want to buy the product, while also feel happy when looking at McDonald's shop? Does looking at the blue sky make you feel calm and relaxed? Artists and interior designers have long believed that color can dramatically affect moods, feelings, and emotions.

Studies show that up to 80% of people think that color increases brand recognition. A well-considered color palette can upgrade a design from good to great. Depending on their age, gender, purpose, and timing of their actions, users have different reactions and emotions to hues and shades.

Users often perceive web with more pleasing design as a more usable design. With a good color application, we can make users more tolerant of minor usability issues. This is known as the Aesthetic Usability Effect.

favorite-color.png

Positive feelings and attraction can cover problems and keep issues from being found by the user which gives design higher quality. Which means if your users like what they see, your sales will increase. People will often believe the design works better because of pleasant aesthetics. Is there a difference between genders and age regard to their response to color? Examination on color observation indicates that men favor bright, contrasting colors, while women lean toward milder shades. Blue is consistently preferable throughout life by most people. Yellow is preferred in early childhood, which preference tends to decline as we age.

60-30-10.png

To make color palettes look pleasing and adequately balanced we could apply the 60-30-10 rule. It states that the 60% is the overall dominant color, 30% should be the secondary color or texture, and will support the main color. The last 10% should be an accent. It can be bolder or more subtle depending on what look do you need. It could give the design more character or keep it more neutral.

 

Psychology of Shapes

Our eyes are often misleading by illusion caused by the visual system and described by a visual percept that seemingly appears to be differ from reality. We often break down object into basic shape, a house may be perceived as a rectangle with a triangle on the top.

People study and claim that that each shape has its own significance and influences our minds which give different reactions and emotion. 

Some commonly used geometric shapes that people see daily are squares, circles, rectangles, and others. What do they mean?

 

Squares and Rectangles

Photo App by tubik on dribbble

Photo App by tubik on dribbble

 
discipline
strength
courage
security
reliability

The walls and windows, books or tables, cell phones, and cameras as well as many other everyday things have square or rectangular shapes. Straight lines and right angles of these two shapes give a sense of stability, strength, and professionalism. People strongly associate squares and rectangles with buildings the reason why they bring the feeling of trust, authority, and masculine quality.

 

Circles, Ovals, and Ellipses

 
eternity
female
universe
magic
mystery
Art Courses App in tubik blog

Art Courses App in tubik blog

Round shapes may give the sentiment of enchantment and riddle and a positive emotional message. Many also convey the meaning of this shape is infinity since they have no start or end. Also, unlike the previous shapes circles don’t have angles so it makes them softer and milder.

 

Triangles

Detaen consulting

Detaen consulting website

dynamics
strength
action
tension
balance

Triangles are related to power, and associations with science, religion, and law they also associated with movement and direction. Our eye naturally follows to the top of the triangle or the direction it points to. Different positions can give a positive or negative meaning depending on it.

 

Organic shape

 
originality
organic
balance
refreshment
Andre. Rebranding Logo in tubik

Andre. Rebranding Logo in tubik blog

Shapes have clear meanings of the plants and animals which they symbolize. They frequently bring a feeling of refreshment and solidarity with the natural environment. Each plant and animal likewise have a different meaning.

 

Doherty Threshold

 
Users tend to be “addicted” to the feeling of experiencing everything quickly and smoothly, and calling them to take some action later will become a lot easier.
— Dong Dong
 

Laggy websites suck. Users don’t want to wait all days for your page to load, their start to lose focus and productivity decrease. In the late 70s, it was ok for a computer to take 2 seconds to give a response because they thought it took people around 2 seconds to respond to their next task.

Groceries Shopping App Interaction by  Curbeto

Groceries Shopping App Interaction by Curbeto

Thing change in 19179, computer performance improved and reaction times started to fall under 2 seconds. Now we have to provide system feedback within 400ms in order to keep user’s attention and increase productivity.

Doherty notices that when you improve the performance of the system response time, the user response time has a massive increase.

Users think time (User Response Time) and time for computer response and transit command (System response time) have a very cozy relationship. The long system response times were an interruption that made user loses their train of thought and ultimately caused lower productivity because theirs react slower.

 
raph.png