UI Design - Visual Attraction

Why does visual attraction matter?

This was originally published at One Small Step on August 13, 2015.

The influence that the visual appearance display in human judgments has already been the subject of several studies in different areas and almost all of them highlight the same issues.

According to the study by Gitte Lindgaard — a distinguished research and strategic design professor, people are able to make up the first impression about a web page in 5 seconds. In other words, affected on appearance alone, people tend to make quick decisions about what they are seeing so your interface’s look will immediately affect how your users feels about it and may even affect the perception of how well a product works.

The visual importance goes far beyond “looking good”, that is, most users establish a relationship between aesthetics and ease of use, as well as the quality of the content of a website.

Sounds weird?! The University of Stanford developed a study where 46.1% of users stated that a website was trustworthy based simply on the look (layout, typography, color scheme, etc…).
The visual importance goes far beyond “looking good”, that is, most users establish a relationship between aesthetics and ease of use, as well as the quality of the content of a website.
Several users take, as evaluation criteria, some visual aspects to assess the credibility of an application. It is important to remember that the initial “pre concept” is hardly to be forgotten by users, which proves the value of a positive first impression.

An appealing and attractive design helps to win and hold the user’s attention. When an emotional connection is established through the use of visual resources, we increase user-perceived usability.

It is crucial to apply the same energy and time to optimize the appearance of the interface that applies to the development of its functionality.
Masaaki Kurosu — professor and expert in the areas of UI, UX, human-computer interaction — and Kaori Kashimura — UX researcher — performed an experimental analysis about the factors that set user’s perceived usability. Using the same graphical elements, different individuals were asked to create the screen layout for an ATM terminal. When these variations were collected, some users were invited to evaluate their functional and aesthetic aspects. The results show that the usability is influenced by the visual attraction, in other words, the users are strongly affected by the aesthetic aspect of the interface, even when trying to evaluate the functional aspects.

There are a few key elements that help you visually optimize a website:

• Decrease the number of available options (when they are not a priority). The more choices you have, the longer it will take to complete a task and higher are the odds of freezing at the time of decision. For instance, Amazon’s homepage has a few navigation buttons at the top but “hides” the sub-menus until the user needs them and click on “Shop by Department” button, in order to not overload the website and make it visually appealing;
• Try something with low visual complexity. If it’s too complex and hard to understand users will eventually give up and look for other, more intuitive solutions;
• Use visual indicators (signifiers) that suggest function to the user. It can be something explicit, like a button with text, it can be something patterned, like an icon/graphic element, it may be something hidden, which implies an initial action by the user revealing a suggestion or something negative, in order to illustrate something disabled or not accessible;
• Use of the right colors to translate the message you want;
• Apply different types of symmetry;
• Use images with impact but that look real and not from a stock of images;
• Maintain visual consistency. Pay special attention to typography, UI elements and color;
• Know that some sections like main navigation menu, main image, institution logo, search box or bottom are the ones that most determine and influence first impressions;
• Work the negative spaces (blank space). It is a mistake to think that all spaces in the website needs to be filled.

Basically, great visual design matters … a lot!! It gives the user the feeling of trust and familiarity needed to create value.
If users do not trust your website they will not know your services and probably will not want to use your products.