Interface mutations, multi-layered animation and structured visual chaos: an overview of trends for the web in 2019


The web is a phenomenon that has many sides. The dynamics of development of each side is hurtling ahead to new horizons, it extends far beyond just the usual boundaries. Well-established methods and elements will be gradually replaced with new, more efficient forms of human communication with brands and technologies.

01 / Techno Trends

Tech trend 1: Machine Learning

This methods class of artificial intelligence is on everyone’s lips. And all because it solves problems not directly, but by learning in the process of performing many specific tasks.

To succeed, you definitely should love machine learning.

With the help of machine learning, it is possible to increase manyfold the work of websites and applications, so, in the upcoming year such tasks as speech, face and visual images recognition, process of diagnostics and results prediction, analysis and sorting of large data volumes will become even easier.

Machine learning will also be one of the most trending marketing techniques, because it provides an opportunity to use tools for improving user communication with brands, select content that is relevant to people’s interests, analyze behaviors and make predictions of subsequent events.

Tech trend 2: Chatbots

In 2019, human communication with technologies and brands will become more personalized by distributing alternatives to the interface. Chatbots will have different types of interaction, thereby covering absolutely all layers of consumers with a different physical and material abilities.

People will be able to receive information, ask questions and make purchases using a single chat bot instead of using a complex of services. The underlying machine learning bots will expand the functionality of the user flow, simplify and speed up it.

User flow, transformed by simulating communication with a consultant.

There are huge advantages for the emotional component of communication. Instead of pressing the button, more and more people will be able to simply ask about a bot with the voice of their favorite character. The interaction with programs will be freshened with the new coat of paint, and users will prefer such interfaces.

Tech trend 3: Page Loading

Given the dynamic growth of content consumption through mobile devices in last years, the need of fast and adapted website loading on phones is a purely rhetorical question, and the 2019th year will bring in new solutions.

For example, the AMP (Accelerated Mobile Pages) technology, that’s promoted by Google itself, is already quite relevant today and improves the conversion of website almost 2 times due to the loading speed. AMP is based on open source code, and the pages are cached on the Google cloud, which ensures faster loading. The technology is used by companies such as The Washington Post, Tesla, eBay.

The other common options for speeding up page loading include Lazy Load (there is as many as 4 varieties of it), content and code optimization, and systems of distributed servers.

An example of Lazy Loading, Pinterest.

02 / Interfacity

Interface trend 1: Interaction

Visual feedback will become an even more important part of the UX (thanks to technologies and the high speed of the Internet :) In 2019, the interactions will acquire a multi-layered structure and go to new levels of dynamics, color and sound.

To better understand how to convey the maximum info with the help of animation layering, let’s analyze its anatomy of interaction using the example of Shazam.

1. Micro Interaction: listening to the nearby playing music by device.
2. Micro-Mini Interaction: the ability to activate or deactivate the song recognition mode using a tap on the Shazam button.
3. Nano Interaction: the Shazam button is responsively resized with pressing, simulating a real interaction; the animation of the inner circles reacts to the sounds of the bass, the outer circles moves according to the higher timbre.
4. Pico Interaction: the Shazam button increases by a couple of pixels with the animation of “emitting” waves, the sign inside the button slightly changes its size in conjunction with the bass.

The animation will become even integrated with the user’s actions and interface. It will be a distinctive part of brand, organically fitted into the plot of the website and fulfill the role of a visual guide. For example, on the Family Garden website, the cursor is a part of the logo, and actively interacts with other UI elements:

As we can see, an implemented multi-layer cursor animation helps to inform user in high-level.

Interface trend 2: Voice UI

People have always sought to make things easier, but more effective. Digital area has already grown out a bit from regular graphical navigation, and one of the most affordable alternatives is the voice interface. However, it will replace not all the functions of the UI, but will only become an intermediary between the user and the main function of the site. Why? Here are some of the key arguments.

Advantages:
1. Simplicity and speed. Voice command is really very fast. A person does not need to learn how to navigate the graphical interface and how to use it for an intended purpose. We began to speak almost from birth, and this our skill is very well developed.
2. Availability. While cooking a dinner, driving a car, painting a picture or taking a shower, we don’t always have the opportunity to touch the device. Voice commands in such situations are a great solution.
3. Capacity. A voice can convey much more information than printed text. The sound enhances the emotional design due to the expressiveness of intonation, tempo, humanity.
POD for pulling out files from Dropbox for Brain.ai. Image: Gleb Kuznetsov.
Weaknesses:
1. Privacy. Not many people will want to share the private information to everyone around them, so VUI is still very impractical for use in crowded places. However, for several years there have been devices doing an excellent job according to sound blocking function, but they’re still not so popular.
2. Noise. In the book “ Hard-Boiled Wonderland and the End of the World” Haruki Murakami illustrative described the reality of novel where people learned to turn off the noise in order to preserve the eardrum. Today this is impossible, so, dozens of people who giving commands to their devices by voice would have turn the streets into a buzzing swarm.
3. Irreversibility. Is that once a story is out, it’s out forever. This popular wisdom is still relevant. There is no “Cancel” button or CTRL+Z shortkey combination in the voice, so VUI still requires a lot of refinement in terms of implementing more flexible functionality.

Interface trend 3: Gestures

One another alternative to graphical UI is gestures. More and more standard navigation elements will be replaced with interactions using touch features, thus allowing the user to focus on content.

Content will gradually move to the top of the screen, and the main elements of the UI will be concentrated at the very bottom. That’s due to the thumb-friendly zone. The gestures will help to expand the variability of actions. Along with new UI solutions they will gradually force out the usual burger icon, arrows and other boring details.

The concept of a social network, where developers transformed a part of the navigation to gesture actions.

Gesture interaction will be an indication of a high level product, since it requires a seamless and uniform consistency, and therefore, a particularly strong user experience.


03 / Contento

Content trend 1: Videos instead of text

The next year, changes will affect not only the types of content feed, but also the types of content itself. The protagonist of these change is a video, that will aggressively displace photo- and text blocks, and the availability of technologies will let people easy and quick create a video content. The format of presenting information with video is much more capacious and deeper than just letters.

Many publications will prefer to serve content in the form of video storytelling, as they did, for example, the New York Public Library. Even Dribbble finally made it possible to upload a video format to the design platform :) The video confidently finds new ways to exist and does not slow down along the way.

Content trend 2: The Rise of 3D

Also will increase the amount of 3D content. Nohow, voluminous forms are more natural and more understandable for people.

Probably, in the future the verge between reality and a digital environment will gradually erase, and online world will also become volumetric. For example, today 3D content is the catalyst of a very rapidly developing A-Сommerce, where virtuality completely replaces real shopping process.

3D is an integral part of AR, which is becoming one of the most successful marketing tools.

Content trend 3: Sense

The amount of evergreen content will decrease. Publications and news will be more personalized, and the way they can be shown will be determined by new algorithms.

To become more visible, companies will have to devote more resources for development of the content plan and its virality, to create additional value for promotional products and to engage users in communication with brands.

Just bon appetite, sir.

03 / Visuality

Visual trend 1: Color

Pastel, native shades that are associated with organics will still popular — hello to responsible consumption (read more about in the subsection below). Special attention should be given to the semitones, since the quality of display matrices is growing by leaps and bounds, and this is a guarantee of the rich depth of the picture.

The second direction of color hype will take energetic and vibrant colors. They will be combined in the most unimaginable compositions to express a wide range of emotions and atmosphere conditions.

Visual trend 2: Illustrations

According to statistics, an illustrative image is 7 times more effective than a regular photo. Illustrations will replace most of the photographies because they allow to convey more abstract sense and allegory, allow to exaggerate the details and give them a new meaning. In addition, the illustrations perceive as entertaining and easy to material consuming. It helps to dilute the boring or too complex information with the scope of positove emotions.

Illustrative Google Assistant.

One more advantage of an illustrative graphics is individuality and self-expression in detail for companies. It is easy to weave the character and elements of the corporate style into the illustration, it grabs a user’s attention and invoke thought.

Visual trend 3: Chaos

In general, graphic style will be characterized as the randomness. The usual staff will be replaced by unpredictable, asymmetric, experimental. The variability of graphic techniques and their forms will grow. Styles, fonts and shades will become very dynamic, but this dynamics will have consistency.

Combining the incompatible is what will become even more trending. We cannot invent a new color, a new sound or a new taste, because our perceptions are limited by the neuro-sensory capabilities of human organism. But with the help of daring non-trivial combinations of the already existing things we create ways to get a new experience of perception.
You can learn more about hyping brutalist style, for example, here and there.

04 / Psychologility

Psychology trend 1: Responsible consumption

This trend is about a reasonable approach to the use of resources, awareness of the direct affection of actions on the future of the entire planet. Such a worldview even extends to making decisions of a small domestic scale and teaches to consider each step of consuming.

People will more often choose products or services that have a positive social or environmental value. Using the website, you can enhance the effect of this value through tone of voice, color gamma and font solution, high-quality presentation of content.

The companion of deliberate consumption is a slow living. It also will gain the actuality, as the people realize more and more clearly that today, in conditions of complete abundance, it is important not only to have time for everything, but to avoid stress and maintain the inner balance. Therefore, services and products which have a vector to “slow down” the lifestyle will be a trend in response to social and environmental problems.

And how often can you afford to stop and truly enjoy the moment?

Psychology trend 2: No Concerns (separation of actions)

Oh, how many beautiful and interesting things I want to place on all these large screens of smartphones! But, of course, I will not do this in any way. Always the easiest route is the way without turns for an unknown corner, without getting out from the main road and without difficult interchanges. The name of such an ideal route in the online world is linear navigation.

The less choices the user has, the greater the chance that he will take the necessary step.

Only one key action should correspond to one screen in order to avoid anxiety and concerns. In 2019 the user path will be more straightforward and shorter, because the pace of life is growing, and it seems that time is going faster. Let’s keep it up! :)

Psychology trend 3: Engagement + Easy Re-Engagement

How often do you try new websites, services and applications? How often do you return to the already known, time-tested one?

Getting started using the product should be as simple and quick as possible. Loooooong and boooooooring registration is extremely tiring for user, because the basic information about him is easy to pull up from sources already filled in by him.

Having a huge amount of products launching to the market every day, it is very easy to pause in the use of the old product, and it is very important to give the user an opportunity to easy come back. The prodigal son does not need to be censured for a long absence, he must always be waited, at any moment, meeting with something interesting.

Re-engagement should be as fast and simple as possible, as if nothing had happened at all.

Both situations can be complemented by another feature – a feeling of freedom. Poisoning the user with questions about nationality, gender and age will become almost vulgar. Selection of suitable content algorithms will be based on practical actions and interests of the user, rather than using stereotypes and prejudices.


Bonus Info

Another trick that wins hearts of users are sudden flashes of joy.

A compliment to a people when they does not expect it, a surprise or spontaneous praise is a small but effective tool for involving and keeping a client. Any reward is perceived as an achievement, a trophy and brings joy to a person.

Give a happiness, usability and beauty — stay in trend!