When developing interfaces, we primarily think about functionality and convenience. Meanwhile, it is aesthetics that distinguishes truly memorable works. Why are most people so attached to Apple products when some of their competitors are more productive and more attractive in the price-quality ratio?
Their interfaces are undoubtedly convenient, but they are also distinguished by a high degree of aesthetics — in the design of interfaces, thoughtful animation, tactile response, sound. So the interface has a decisive impact when making a purchase decision — being influenced by aesthetics, we are ready to close our eyes to some imperfections.
So what are the criteria for evaluating this very aesthetics? This is a very difficult question, plus aesthetics is an empirical concept, so we can only talk about hypotheses here. We will consider them in our article.
What parameters determine the aesthetics of the interface
The basic principles of visual perception aesthetics were highlighted by psychologists. Among these principles:
- The halo effect – the first impression of the design plays a major role. That is, if, when getting acquainted with the interface, users appreciated its aesthetics, they can close their eyes to some of its inconveniences.
- Ease of use.
- Easy to understand, no unnecessary details.
Aesthetics are often perceived as a combination of factors — for example, poorly chosen colors can “kill” the entire effect of a concise and thoughtful interface.
The criteria of visual perception are constantly changing. Not so long ago, interfaces in the style of skeuomorphism seemed aesthetic, then flat design replaced them, and now glass morphism and other trends.
We decided to move away from the sensory-empirical assessment and identify several categories of factors that will help evaluate the aesthetics of interfaces. We have brought a purely intellectual explanation to the fore. Let’s go through the categories:
- Sensorics — how much interaction with the interface excites our senses.
- Perception — how we intellectually perceive visual, sounds and tactile sensations.
- Public aesthetics — compliance with the norms, trends and trends of the modern world.
- Emotionality is the ability of the interface to awaken certain emotions in us.
- Ethics — how designers take care of our convenience while interacting with the interface.
- Technique — how well the colors, fonts and shapes are chosen.
- System — how interface components interact with each other.
- Semantics — how thoughtfully the meaning of colors and shapes is used in the design.
The relationship is how much the interface corresponds to its purpose.
In the first part of the article, we will look at the first four groups of factors — they relate more to the user’s perception of the interface. And in the sequel, we will analyze the factors that designers are responsible for.
In the application interface, we read not only the colors and images used, but also sounds, tactile responses to pressing or performing an action. Aesthetic design stimulates our senses, forcing us to experience positive emotions.
For example, the iPhone has a very well-developed tactile interaction with the user. Each successful or unsuccessful action has its own type of vibration — even without seeing the screen, we understand what happened. The same vibration accompanies actions in some applications — for example, we feel it when the timer wheel rotates. At the same time, the tactile effect is very delicate — vibration harmoniously complements the visual and sound effects, but does not switch attention to itself.
Designing sounds for the interface has become a real difficult profession. They should be unobtrusive, but at the same time clearly reflect their task — to reflect the nature of the actions to which they correspond. For example, turning on a gadget or opening an application may be accompanied by a melody built according to classical canons, an error message — a short, rather sharp combination of sounds. Some sounds completely copy actions — for example, the sound of typing on a smartphone.
As for aesthetic colors, their use is closely related to trends. Now pure colors, light gradients, as well as neon and aesthetics of the 90s with their muted shades are in fashion. All this combined with high-quality images and unobtrusive minimalistic graphics gives positive emotions when interacting with the interface.
Slightly muted pure colors and harmonious gradients look aesthetically pleasing in this interface.
The faster we perceive and process the interface information, the more harmonious it seems. The peculiarity of our brain is that it does not like to strain — if we immediately read the picture and understand how to move further on the screen, then we experience satisfaction and positive emotions. That is why overloaded websites and applications cause us irritation.
Perception is closely related to Gestalt theory, on which advanced modern interfaces are built. Here are a few of its principles:
- Similar elements are read as a whole;
- Details located close to each other are perceived as one group;
- Elements that are on the same straight or smooth curve are also perceived as belonging to the same group;
- The content brought to the foreground with the help of a background, shadow or darkening of the background is read first.
Competently using the theory of visual perception, it is possible to create harmonious, not overloaded interfaces, with an understandable grouping of objects and explicit accents on the necessary information.
The speed and comfort of perception is also affected by the combination of colors, the correct use of headings and subheadings, typography, alignment of elements on the grid.
As a rule, a minimalistic interface design with a small number of colors selected according to the principle of a color circle, unobtrusive fonts and infographics instead of large arrays of text is considered aesthetic.
Here we turn to the dominant trends and trends in society. This may concern both the visual and the context of the interface application and its relevance — society should be ready for the emergence of a new trend. At the same time, public aesthetics is inextricably linked with visual aesthetics.
For example, the iPhone was far from the first smartphone with a touch screen, but it was its interface that became a role model — and in the end, the era of push-button phones has sunk into oblivion. The iPhone interface combines innovations (touch control) and high-quality visual elaboration. If the main thing for other models of touchscreen smartphones was to show a unique solution, and convenience and aesthetics faded into the background, then Apple has developed not only an innovative, but also the most thoughtful interface. The trend for touch screens had already begun to emerge, but it has not yet become commonplace, so Apple has received well-deserved fame as an innovator.
Here it is appropriate to recall another example from the same field — Vertu smartphones. Their laconic interfaces seemed to be among the most aesthetic, and positioning played a significant role here. Vertu became the first smartphone, the cost of which equated to the price of premium jewelry. Ringtones, case materials, front panel design — everything was thought out to embody luxury. And the possession of Vertu, although formally, ranked you among the few elite — this is the very social factor.
The main thing is to get to the right moment, when trends are already beginning to be traced in society, but have not yet become a “mass market”. If you bring an innovative interface to the site too early, as happened with the first touchscreen smartphones, you may simply not be understood.
The laconic interface of Vertu has become an indicator of high aesthetics due to identification with the elite.
According to this hypothesis, an interface that evokes certain emotions in us is aesthetic. This includes the use of humor, gamification, and a sense of caring for the user.
Just a beautiful and user-friendly interface will not necessarily cause us special emotions. Yes, we note the comfort of interacting with him, but no more.
Our feelings are affected by a more humane approach to design development. We notice this, for example, when we see more thoughtful stages of interaction with an application or website. We subconsciously value such interfaces more.
If something went wrong in Slack, the interface does not just report it, but gives solutions to the problem. Such concern for the user will cause us a positive response.
The RememBear app uses a bear mascot to reward the user for successfully completed actions
The factors considered explain the peculiarities of user perception of interfaces. They need to be taken into account, they will help to predict the reaction of the audience. But it is impossible to guarantee 100% success, taking into account only these factors. There are a number of criteria that can have a greater impact on the user — the designer is responsible for them. About these groups of factors — in the second part of the article.