From the very beginning, flat design was, in essence, a reaction to such phenomena as skeuomorphism, realism and three-dimensional style. Each of these trends had its own aesthetics and philosophy, as well as virtues with flaws. They were designed to adapt the virtual environment for the mass user, making it more recognizable and less frightening, because when a person finds familiar outlines in something completely alien and new, he feels much more confident.

Over time, it became clear that skeuomorphism, like any other design trends that appeal to everyday reality, loses its relevance. And if recently they seemed friendly and comfortable, now they have become bulky and clumsy.

This change in the perception of the virtual environment took place when the mass user gained sufficient digital experience and various graphic euphemisms became unnecessary – the user was finally ready to perceive the interface design in the purest and easiest way possible, without any analogies and references to “real” The world. At the same time, characteristic fatigue from heavy skeuomorphism, 3D aesthetics and realism arose, as well as the need for something truly new, fresh and in keeping with the spirit of the times.

The answer to this situation was a flat design – a concept that defined the vector of development of graphical interfaces for many years to come. This small revolution changed the look of our gadgets, and the flat design itself began to evolve, constantly evolving into ever more successful and convenient varieties. In practice, the interpretation of the initial provisions of the philosophy of flat design has been very fruitful.

Despite the fact that flat design elements have been used to varying degrees since the early 2000s , when the mainstream consumer still dealt with skevomorphism, three-dimensionality and realism, a truly flat design declared itself along with the release of the first interfaces Metro style.

Thus, Microsoft designers launched a trend that is rapidly developing and transforming to this day. It is noteworthy that the initial implementation of the concept turned out to be controversial, despite all its obvious innovation – Windows 8 proved to be one of the most unsuccessful Microsoft products , and this happened not least because of the interface.

To understand what a flat design is today, we first consider the trends that it contrasts with, and elements of which are not used in principle when developing flat interfaces especially for affiliate projects.

3D effects

From the very beginning of using graphical interfaces, designers and developers were looking for ways to visually highlight major and minor objects. And, although the capabilities of the first computers with a graphical interface were extremely modest, the designers still found ways to designate the visual hierarchy of elements. It was possible to achieve the three-dimensional effect with the help of various gradients, shadows and other pseudo-three-dimensional graphic techniques.

When using this technique, the main interface elements are divided into convex, implying clicking on them, and recessed or hollow ones, which, as a rule, can be filled with text and which are mostly of various forms.

Even today, three-dimensional elements are widely used in the development of interfaces, but the earliest examples of them were rather rough and not very attractive visually – just recall the Windows 95 interface.

Skevomorphism

Skevomorphism was thus a way to adapt the mass user’s perception to new digital realities. At the very beginning of its appearance, skevomorphism seemed attractive and convenient – users appreciated it for its high intuitiveness and the ability to quickly understand what this or that element is responsible for.

However, as we have said, over time, Skevomorphic design began to bother both users and designers themselves. In addition, some experience was gained in interacting with the digital environment, which avoided the need to create metaphors and showed the potential intrinsic value of interfaces without elements that refer to everyday, “real” experience.

Realism

Despite the fact that realism in the design of interfaces is very similar to ske-morphism, these are still different directions, although their elements are often combined in one or another proportion.

Realism differs from skeuomorphism in that it does not have the same pronounced functionality. If the basic idea of ​​skeuomorphism is to intuitively designate functions with the help of those objects that we encounter in the real world, then realism merely imitates the visible properties of various objects, for example, the texture of wood. At the same time, such an imitation is not a metaphor, it only makes the interface more “real” only in an aesthetic sense.

Flat design captures the world

The general rejection of any unnecessary conventions associated with realism and ske-morphism began after Microsoft began to introduce its Metro concept . From now on, flat design has become a real trend, which has become widely used and interpreted in interfaces of a wide variety of different gadgets.

However, the most important adherents of skevomorphism of that time – the Apple company – until the last time resisted the change of design priorities, defending skevomorphism as a distinctive feature of their products. Ultimately, they had to adapt to the evolution of interface design, which took on more minimalist and practical “digital” forms.

In the context of this story, it is rather curious to look at the chronology of changes in the design of the Apple site, which gradually and consistently transformed from traditional skevomorphism into a modern flat design.

In the 12th year, Apple designers took the first step toward a flat design. And, although, of course, this cannot be called an example of a real flat design, it was a kind of compromise between the new developing trend and the principles that Apple has been true for a long time.

The aggressive three-dimensional navigation bar gave way to a more accurate and aesthetic roundness. Nevertheless, both navigation bars and multi-colored icons at the bottom of the page still have a characteristic gloss, and in the case of icons, this gloss does not allow us to see at a glance exactly which functions are hidden behind these icons:

In 2015, the Apple site gave up and abandoned any elements that are not compatible with the principles of flat design. Any textures, shadows, three-dimensional, realistic and even more ske-morphic details disappeared:

Disadvantages of flat design

From the very beginning of the massive and ubiquitous introduction of a flat design, optimizers and usability specialists faced characteristic difficulties, which were the result of abandoning the usual intuitive elements and realism.

From a purely rational point of view, a flat design in its original form brought users notable inconveniences. It must be borne in mind that over the years, users have been guided in the digital environment with the help of numerous metaphors and references to the real world. Now, users had to master a completely flat two-dimensional environment, but it seems that the flat design still won because of its aesthetic advantages and consistency with the spirit of the times.

Of course, the modern user has become experienced and much more trained, but even with the evolution of user experience, people still need tips.

Suppose we can no longer make them as obvious as it was in the era of realism, three-dimensionality and skeuomorphism, however, in our arsenal there are still effective methods by which we can make a flat design much more friendly and responsive to good usability .

Understandable and intuitive references to traditional designations – for example, underlined text of any color (and not just blue), the use of frames.

Context. Its perception also depends on the context in which the element is located – for example, the text located at the top of the page is usually perceived as clickable.

Next to WHAT`S NEW we see the usual blue underlined text View All.

The search button, Find, is fairly intuitive, even though it has no three-dimensional or realistic details. This is possible due to the combination of a good color designation and a noticeable inscription.

The navigation bar, consisting of the names of the black sections, is obviously clickable solely because of its location.

The development of a flat design and its more functional manifestations
Over time, designers and developers began to abandon the original radical principles of flat design, excluding any manifestation of depth and realism. It became clear that in its pure form a flat design is not very convenient, but it has great potential to become truly effective, aesthetic and modern.

First of all, the designers involved in the development of flat design, found ways to organic use of shadows in the context of two-dimensional interfaces.

Various light effects, as it turned out, complement the concept of flat design, increasing its usability and making it more attractive from an aesthetic point of view.

A remarkable example of the evolution of flat design – the so-called Google Material Design, which opened a new page in the history of flat interfaces. We talked about material design in detail in a large material “ Google Material Design – a possible look of a new era ”.

First of all, the flat design, rethought Google, really became “material”. The intuitiveness of the interface is provided not by pseudo-volumetric elements, but by the fact that all elements are subject to the laws of physics in force in the real world. Objects have a characteristic resistance and inertia, and, in addition, the interface has a multi-layered, which facilitates the perception of the hierarchy of elements.

It can be said that the material design used in the Android OS combines high practicality and adherence to fashion trends. It is in the delicate balance between the pursuit of trends and good, meaningful usability, is the secret of high-quality and convenient modern interface.