-
Tech
- February 8, 2023
In the previous article, we discussed 4 groups of criteria related to the user’s perception of the interface. These are sensory and tactile sensations, emotional response, social aesthetics and principles of perception determined by gestalt theory. In fact — what and how the user perceives and how it affects his assessment.
Today we will talk about the factors that interface developers can influence.
Ethics
Ethical solutions in the field of interfaces include accessibility of perception for each user, consideration of opinions and concern for reasonable energy consumption.
Accessibility of perception can be called inclusive design in another way. The current trend is not to create separate interface formats for people with disabilities, but to adapt existing resources to any perception as much as possible. This takes into account the size and clarity of important information, the most neutral color combinations, built-in interface tools that allow you to customize the color scheme and scale. The full rules for creating an inclusive interface are described here.
Consideration of users’ opinions can manifest itself in the form of a brief survey, a request for evaluation, or a feedback form. Seeing these elements, users note that their opinion is also taken into account – even if they do not participate in the collection of opinions.
Concern for reasonable energy consumption is expressed in the desire to make interfaces more “light”, as well as in the ability to use a dark theme or simplified display of screens.
Ethical solutions evoke positive emotions and show users that interface developers are thinking not only about making a profit, but also about people and the environment.
Pale icons in the top menu will be clearly visible only to people with excellent eyesight. Elderly people or users with visual perception problems may find it difficult to count them. The lower version with large and bright inscriptions looks simpler, but takes into account the peculiarities of perception.
Technique
What distinguishes a self-taught designer acting “on a whim” from a pro is the technique and the ability to choose tools and means to create a product.
The concept of technology is also present in the design of interfaces. There are rules for choosing shades, creating gradients, and combining fonts. Despite the constantly changing trends, the basic principles serve as a good guideline.
The aesthetics of technology is what distinguishes the interface created by a pro from the work of a novice designer.
The differences may not be noticeable to everyone, they are often hidden in minor details – but experienced UI specialists will be able to see the difference. For example, according to this concept, you can see how painstakingly the work was carried out. Complex, but at the same time recognizable shapes, interesting visual solutions and at the same time ease of use.
System
Many designers and web agencies begin their work on the interface by creating a UI kit – a set of elements on the basis of which the design will be built. The UI kit may include the colors used, buttons, icons, fonts, and other visual elements. And this also has its own aesthetics.
Individually, all the elements can be beautiful and aesthetic, but they are completely incompatible with each other and do not meet the requirements of the interface. Consistency, following the rules adopted when creating a design – that’s what creates a true aesthetic.
Also, the use of long–known harmonious principles – symmetry and the golden section – can be attributed to the system. Aerobatics is to go “in violation” of these principles, while maintaining the overall aesthetics. For example, to correctly place one asymmetric element among symmetrical ones in order to attract attention to it.
An interface based on the golden ratio principle
Semantics
If you look deeply, then colors and shapes are not just visual elements. All of them have a certain meaning based on associations and psychology. For example, the orange color is perceived as warm, joyful, encouraging to action. Blue is the color of the sea, sky and freedom. Websites of official institutions are often designed in such shades. The Alterspark resource even published an entire article on the effect of interface colors on user perception.
There are also unspoken rules for the use of a particular color. For example, red means an error, yellow or orange means a warning, green means that everything is fine, a light gray button indicates its temporary unavailability. If, for example, we make the warning icon blue, many users will experience inconvenience because it goes against the generally accepted rules.
Shapes and fonts matter too. For example, it is strange to imagine a kindergarten website with chopped fonts, decorated in the style of brutalism. And, on the contrary, the online resource of a financial company will not look at all with soft outlines of buttons, creative animation and “funny” fonts.
Of course, such a definition of semantics is quite primitive – experienced designers and marketers “dig” deeper. But taking into account even such simple rules, you will get closer to creating an aesthetically beautiful interface.
The dark palette of the Bork website (black, dark brown, gray) speaks of seriousness and technology. At the same time, the bright orange “Buy” button awakens positive emotions and encourages targeted actions.
Here, even if you do not take into account other UX problems, the discrepancy between the theme of the site and the semantics of color immediately catches your eye. Bright, joyful colors would be more suitable for the nursery’s website, rather than gloomy black.
Relationship
It is believed that true beauty and aesthetics are harmonious. The aesthetics of the relationship is how harmoniously the interface fits into the context of use.
For example, why are Kindle readers so popular? If we evaluate their interface in isolation from the context, then it significantly loses to the interface of the same iPad: only gray in 16 different shades is used here, there is no animated scrolling, etc. But if we take into account the terms of use, then everything falls into place.
The reader is initially designed for comfortable long–term reading, and for this the interface does not need an abundance of multicolored graphics and animations – with such effects, on the contrary, the eyes get tired faster. Therefore, in the context of the task being performed, the Kindle interface is considered one of the best.
Kindle interfaces are considered one of the best among readers due to the maximum compliance of the function performed.
The aesthetics of the relationship can also manifest itself as the compliance of the interface with the usual norms. For example, popular fast food manufacturers – McDonald’s, Burger King – have set a standard for kiosk interfaces for ordering products. We are used to a certain kind of kiosk screen, where the menu categories are located on the left, the products themselves are on the main part of the screen, and the basket is at the bottom. If we see a different interface in some fast food establishment, we will consider it inconvenient and unaesthetic, since it will not meet our ideas.
Conclusion
- Of course, the concept of aesthetics will remain its own for everyone, after all, it is an empirical concept. But if we summarize rational hypotheses, it turns out that the aesthetics of the interface is:
- In accordance with the trends and trends of society (advice: train your vision);
- A well-chosen visual, sound and tactile accompaniment (tip: work on the content, bad content will kill the best design);
- Agrees with the context of application;
- The emotional component is the appropriate use of humor and care for users.
It is difficult to fit all these hypotheses into one design, and it is not always necessary. The main thing is compliance with the target audience and the functions that the interface performs.