Trends in the design of UI and UX 2019
Illustration by J.HUA.
A year ago, we made a forecast of trends in mobile UI design. This year we decided to go beyond the mobile interfaces, because the trend number 1 in modern design is the context. No more generalizations - now everything is tied to context.
It seems that we have made some progress with the development of technology and a growing understanding of how the products offered to the user should work.Sooner or later we will develop a universal design philosophy that will be used to create everything that we produce, and not only what we sell. Everything around requires good design decisions, even the images of our countries. But let's not talk about the future; Let's look at the main trends in interface design 2019.
Not a single trend can do without a spoon of tar: remember that everything is good in moderation.
The browser is not just a transport for moving around the Internet, it is a means of influencing the user. Browsers are becoming even faster, more powerful and more attractive.
- Benchmarks and performance tests show a significant increase in the performance of most popular browsers.
- Increasing the speed has a huge impact on design through streaming compilation . According to Mozilla, the new compiler runs 10-15 times faster than its predecessor.
- All modern browsers support WebGL 2 technology, which allows you to bring 3D textures, object rendering, fragment depth, and vertex arrays to a new level.
The capabilities of browsers, both on mobile devices and on PCs, make it possible to bridge the gap between conceptual design and reality.
It is a pity that evolutionoftheweb.com stopped in 2012. This scheme is simply gorgeous
Yes, but all these bells and whistles in browsers are still aimed at promoting individual products, and not at developing the industry as a whole. There is so much happening on the Internet that it’s difficult for browser developers to come up with universal solutions for all problems.
No matter how cool the browser, if you go to a poorly written site, a talentless UX will ruin it. To unlock the potential of browsers, we should demand better design solutions.
Because of the disgusting design of many sites, browsers look like bad software.
Animations with meaning
Thanks to the new possibilities of browsers, animations have become a full-fledged design resource, ceasing to be a simple movement of objects. The discipline, known as interactive design , includes many aspects of design, as well as elements of psychology and biology.
We have no doubt that this direction will be further developed in 2019. The complexity will be the main feature of animations in the design. It is the movement of elements and transitions that carry a huge amount of information that would otherwise be lost.
The place between the screens used to be abandoned. Now it belongs to you.
Zhenya Rynzhuk blog design
To involve a client at a deeper level is to accompany him at the moment of interaction with the interface and not to lose a single second. Designers enthusiastically take up the possibility of using empty spaces until they are spoiled by bad marketing.
But the interests of interactive design extend much further. Today it has become an integral part of branding. Logos - the same totems that are formed in our imagination under the influence of experience. Why not give free rein to this imagination, sending it in the right direction?
Animation from Eduard Mykhailov
If you have never wondered what the logo consists of, what it tastes like, what it smells like and sounds like, now is the time.Animations are more eloquent than the lighting, the materials and the arrangement of the elements: one single animation tells the whole story. If you can make the logo part of your personal story, go for it. Zlatko Kelemenić
’s Lakko company logo
Yes, but the animation should also be considered in context. What you see as a designer is not the same as what a customer sees. If the product has a purely practical application or deals with emergency situations, the animation should not be used. When contradictions arise, always choose neutrality.
Do not create animations impulsively.
Interfaces with 3D and the plane with the effect of depth
Changing video and images using computer graphics and 3D rendering have been around for quite some time. Previously, designers sought to avoid complex 3D-models in the UI for the sake of speed and performance, as well as for convenience. With new browsers, 3D has ceased to be a luxury, and now you can create cinematic scenes for websites.
3D graphics in the interface blurs the line between reality and digital animation.This trend will be especially useful for companies working with complex processes that were previously difficult to visualize. Using 3D-visualization, you can look inside any technological process and achieve a higher level of understanding.
Render for Baker Hughes from Sanu Sagar
This looks impressive in movies and games, because 3D images take only short periods of time: they should be designed to create a superficial impression and not to look at. Coupled with well-designed 3D animation becomes a powerful design tool.
In the mobile industry, new chips have made possible not only the rendering of 3D objects, but also their use in interfaces. Small screens are perfect for this.
3D transition of cards fromGleb Kuznetsov
3D turn of the menu from Minh Pham The
flat design of the UI has been the main trend of the last 5 years, and little has changed since then. Recently, we have seen a clear shift towards adding depth to a flat design, which, however, did not touch on the basic concept.
It is the presence of depth that caused the appearance of a flat design, and the reason is simple: in order to understand the world around us, we need symbolism. The plane is symbolic in the highest degree.
The plane with the effect of depth - is a rethinking of the plane in the design.Users liked the combination of Real 3D and computer graphics, which allowed them to interact with realistic objects. A flat design is also capable of this, but he does it in his own way, using so-called pseudo-three-dimensional or pseudo-3D. In fact, it is a layering of planes, creating a sense of three-dimensionality. The effect of volume in a flat design creates shadow, lighting and reflections. Mike's
logo for ARTA | Creative Mints
The pseudo-3D effect, which can be created using Principle or After Effects, is now gaining popularity.
"Astronaut" by Markus Magnusson
In 2019 we can even see the triumphal return of skeuomorphism. If the plane is capable of having a depth effect, it might as well be isometric. The combination of realism and symbolism of the plane is a trend that is yet to be explored.
Yes, but sooner or later we will have nothing to offer the user. Already, 3D-interfaces do not have a clear direction of development. They move simultaneously to simplify and to complicate. In order to impress us, more and more technological efforts are required, and remarkable bravery is needed in order to give off a crazy - and elegant in its simplicity - concept. At the same time, if in the most complex interface there is no meaningfulness or at least an original idea, no one will need it.
We can create stunning images. It is time to add humanity and address more serious problems. How do we do this?
All these new features of 3D and interactive design do not cost a penny if they are not capable of evoking an emotional response. The irony is that the user is not impressed with the complexity of the product. But people are peculiar to nonconformity due to its natural attractiveness.
We always need something as opposed to the mainstream, a sort of devil sitting on his shoulder. And sometimes we just want to fool around.The designs and illustrations of some services that decided to redesign came out as bold as possible:
“Shop Small” by Joe Montefusco for Mailchimp The
cartoon style of illustrations and the UI has a clear goal - to highlight their originality. If your brand is popular, this way you can create even more excitement around it. No matter who the design is aimed at, let it be strange - this is the case when the “uglier” the better. Rest assured, 2019 will bring us even more avant-garde design.
Yes, but not all companies can afford such courage. The larger the audience, the more neutral the design should be. Even if well-established brands are lucky, small companies will have to act cautiously and adhere to conventions.
First build a fan base, then surprise them with your new product vision.
Gradient 2.0, bright colors and dark background
New screens have stunning color reproduction, marketers demonstrate it even with the help of default wallpaper. Designers are exploring the use of spectacular gradients in the UI and the availability of such interfaces.
Gradients no longer serve to attract attention: they now give the interface the effect of volume.
Grabient 2.0 by Eddie Lobanovskiy
Gradient 2.0 is very simple. It uses matching colors, has a specific light source and creates a depth effect in combination with shapes.
Vivid colors are also in place. This trend will bring more combinations of colors and different layers. Moreover, even a monochrome palette can become more aesthetic if we add to it the effect of volume.
“Valley” by J.HUA for Tunan
We became mistrustful and pessimistic, and rich colors set up a positive mood. Would you trust this cryptocurrency application?
Application for cryptocurrency from uixNinja
Even more spectacular bright colors and gradients look on a dark background. Dark themes are all long and long, and they will become even more beautiful. Here we wrote about the dark themes of design and the secret of their success in terms of anthropology.
So, in 2019, those who succeed in finding a balance between accessibility and the aesthetic appeal of a dark UI will be especially successful.
The plane with the effect of depth, bright colors and 3D - all against a dark background.
Information panel from uixNinja
Yes, but accessibility is not the only problem with gradients, color palettes and dark themes. Bright colors are traditionally accent. If all elements are colored, how do you single out one thing? OLED screens are not available to all users, and some gradients may be lost, and too much contrast may interfere with the focus of view. And dark themes are not suitable for sunny weather. Although it may be a plus ...
A font is traditionally perceived as a static element with a limited number of variable parameters. Designers and writers must consider readability in the context of the height of lowercase characters, strokes, and character widths.
To create a refined font design of the product you need to think everything over to the smallest detail. If the project uses multiple fonts, it must provide files with all the styles used. In the case of variable fonts, you only need one file that contains an infinite number of outlines.
Variable fonts can fill any text space.
Font Marvin Visions
Variant fonts thrive in responsive design and localization - where designers used to break their heads over how to cram text into small screens or, on the contrary, how to stretch it if less characters were translated into another language.
“VOTE” by Josh Rinard
When web fonts first appeared, they had problems with rendering. This led to problems with legibility and skewing markup. Variable fonts load faster, and their application generally speeds up the design development process.
And this is just the beginning. The artistic application of variable fonts is yet to be explored in 2019.
Yes, but how long does it take for this smart font of yours to bring economic benefits? And, if your text is like all existing digital content, what protects the reader from manipulation? For the first time the text with the given parameters appeared in typography. This forced humanity to abandon manuscripts as an unreliable method of storing information and madereadingone of the most important engines of progress.
It is time to ask the perennial question: "Do designers also need to program?" And also: "Should developers understand UX?" Everything is simple: it is important for us to avoid disagreements during the design implementation. So, if you are focused on the result, you need to think about how to achieve it.
Learning to program would be most logical. When implementing your own design, you can avoid many problems. However, to be a good designer and at the same time a capable developer, you need a huge amount of knowledge. Can you pull it? Glad for you. And for those who can not afford it, there should be other options.
The point is not to bring a universal designer, but to create quality products and enjoy the process.Another way to achieve this goal is to use and promote effective tools. Figma is just such a tool. Previously, designers had to take into account many factors: OS, builds, plug-ins, synchronization, co-editing and, finally, how to collect everything in one place. Those who have managed to set up such a complex workflow deserve respect. But we need something simpler.
“Completely switched to Figma” by Alexey Kolpikov
Figma is a tool created by designers for designers. Encountered with a wave of skepticism, it exceeded all expectations.
Figma destroyed Sketch.It can do everything that Sketch and Adobe XD do, only bigger and better. Most importantly, Figma aims to create projects that are easy to implement. Each Figma component can be converted to a React component using an API, and implemented in the front end. Now Figma wins in cost, performance, ease of implementation, ease of collaboration and sharing, support and other parameters. But this is not the limit, because Figma will continue to develop in 2019.
Yes, but when we create a great product and do not prescribe the ethical principles of its use, we contribute to our own collapse. Look at Twitter, which can not restore its good name. 2018 generally remembereda large number of managers of IT-companies who testified in court. It turns out that it is not enough to give the community tools, you need to monitor their use. Can Figma protect users from the "dark patterns" in the UX, poor design and fakes?
Spectacular design does not have to be catchy or even visible. Through trial and error, we found that when creating non-tactical sensations, the toolkit does not play a big role. The logic of this design is based on human psychology and the recognition of natural speech by the machine.
Voice UI is sensual and elegant.It implements the concept of zero UI at its best. This is a purely internal process, more similar to writing, building context and summarizing data than the design itself. And yet, designers are obsessed with finding ways to represent the voice UI. Usually they are inspired by the interfaces and animations from the movie “ Minority Report ” ( Minority Report , 2002).
The design of organic artificial intelligence from Gleb Kuznetsov.
As a rule, such futuristic UIs do not reflect the real structure of voice interfaces; their task is to warn the user about the absence of controls and to teach how to work with technology, in which they are completely unnecessary.
In 2019, we hope to see the development of voice UI, along with the rejection of simple visual aesthetics in favor of creating a full-fledged experience of interaction with design.
Yes, but the most difficult thing about voice UIs is not even the interaction between man and machine, but man-to-person communication. The global community is unusually unbalanced. It is hard for us to reach an understanding on a huge number of issues, including technology. Voice-operated telephones, cars and homes can contribute to widening the gap.
We as designers should always put human well-being in the first place. If technology, no matter how elegant it is, serves someone at the expense of others, it must be fought.
UX Copywriting and Editing
Last year, designers seriously thought about the meaning of the words they put on fonts. Science-fiction writers and technical writers, journalists and just amateurs got a new space for the development of their talents. We were able to formulate the role of writing in design as follows:
You need to control how your business interacts with customers.Previously, marketing looked like an automaton line of technical terms generously decorated with ponts. The company's activities were mistakenly measured as benefits that it had for consumers. Even successful businesses suffered from a lack of simple, clear and convincing language in communicating with the audience.
UX copywriting is based on two simple principles: be respectful to the user and be useful. Everything else comes from them. So, being concise means respecting people and appreciating their time more than their own; it is you who must suffer your text, not the user. To be frank is to avoid hypocrisy and to protect the user from unpleasant experience - therefore, to be useful. Being clear means being honest and not hiding flaws. Always focus on helping the user, not to show off his eloquence, and do not use marketing cliches. Everything is good in moderation.
UX copywriting is easy. Aim to be polite and helpful to the user.No one wants to watch you show off and praise yourself. It is important for people to know if you can help them. Let your service speak for itself.
In 2018, we observed significant progress in the rhetoric of large companies. They stopped pursuing the complexity of products and focused on their customer value. It is worth expecting that in 2019 UX-editing will evolve and become a full-fledged direction in design.
The difference between UX copywriting and editing is in the amount of work. Copywriters create text that the user sees, while editors analyze and transform the text, making it simple and understandable to humans. Express courses on editing UX simply do not exist. To master this craft, you need experience, observation and, of course, love for people.
In 2019, every major redesign project will need a UX editor.
Yes, but each new trend goes through several stages: distrust, admiration and oblivion. Unfortunately, any idea, even a good one, can become a joke and fail. UX copywriting is no exception. So, the simplicity of the wording may seem primitive to someone, and honesty can be interpreted as immodesty.
Yet in the development of products and services there is a place for literary creativity, even outside the landing pages. For example, Nike and Boeing companies are paying science fiction writers to predict their future.
Design as a profession
The design of the UX includes a lot of things. It belongs to the design of services and is used in a variety of industries. As a result, designers and design firms assemble huge portfolios, where there is a place for both very simple applications and complex financial platforms.
The scope of service design covers all industries and offers them universal solutions.Service designers can have their own unique style, which they bring to the new product. That's what makes them famous, and companies - willing to pay them. This is the same as purchasing parts from a trusted supplier.
However, manufacturing companies may need a deeper level of designer involvement. Such firms need a designer who is fully integrated into the team and has the data and tools to influence the entire production system.
Product development has a significant advantage over service development - access to analytics and the ability to test design solutions in real time.Designers in such projects can focus on a particular product, without being distracted by anything else. They have detailed information about the target audience of the product and proceed from real data, unlike service designers, whose work is based on assumptions. Sasha Turischev's
innovative eye patch page.
Yes, but the transition to product design requires a lot of effort. At the risk of devoting ourselves to a certain niche, we often make a fateful choice. Therefore, the decision should be balanced, taking into account both the viability of this sphere and the prospects for professional development in it.
Good luck accompanies the brave, and in 2019 we will still see talented designers who donate everything for the career of a niche specialist. Time will tell.
Finally, the most significant emerging trend is a request for sincerity . The user does not like to feel cheated. As in life, there is nothing better than good intentions, and they are at the origin of good design.