Services

Absurd, Asymmetry And 33 More Trends In Design In 2021-2022

Our design team has shared their vision on trends in UI and UX for 2021-2022.

January 19, 2021
$
HK$

A couple of months ago our design team decided to discuss the changes in the UX/UI design industry that they expect in 2021-2022. The meeting was bursting with ideas, and we decided it would be useful for both you and us to leave the wrap-up of the ideas discussed here. Or you can watch a 31-minute video here:

The post will cover quite a few trends, hence the contents:

Industries COVID-19 Is Going To Affect Most

Technologies

——1. Virtual reality

——2. Augmented reality

——3. Artificial intelligence

——4. Voice user interfaces

User Experience

Flow and Navigation

——5. Absurd navigation

——6. Uninterrupted UX

——7. Inclusive design

——8. Varying UX

Writing

——9. Human writing

Feeling

——10. Storytelling

——11. Meaningful value

Team Work

——12. Designer + Developer

——13. Data and design integration

——14. Device synchronization

User Interfaces

Colors

——15. Gradients

——16. Natural colors

——17. Unusual and futuristic patterns

——18. Bright UI

Typography

——19. Type overlap

——20. Bold fonts

Style and layout

——21. Neomorphism

——22. Dark mode

——23. Empty space

——24. Asymmetric Web Layouts

——25. Unusual Illustrations

——26. Soft shadows, layers, and floating elements

——27. Mixing photography with graphics

——28. Abstract data visualization

——29. Fabulous product photos

——30. Minimalism and buttonlessness

Animations

——31. Microinteractions

——32. Animated illustrations

3D

——33. 3D graphics and 3D animation

In addition

——34. Mobile-first for the web

——35. Tactile interfaces

 

Industries COVID-19 Is Going To Affect Most


Because of the pandemic, we're moving toward the tendency of remote work and complete digitalization. Once the lockdown and the quarantine are over, many businesses – including us, the EGO custom web design company – will most likely allow their employees to continue working remotely.


Author: Jure Tovrljan. https://www.instagram.com/p/B-fABXolz_Y/

 

That means the products for remote work and communication will gain more demand and popularity. We expect the entertainment industry – games, music, streaming services, Youtube – to grow fast, though not surprisingly fast. 

The crisis also stimulates the growth of online museums, online amusements parks, 3D tours, and similar. Provided via websites and applications, they all require efforts for maintenance and support, and only time will tell if they will sustain after the pandemic.

Then there is healthcare. We see an increasing need for remote communication with doctors. Self-care apps related to sports, nutrition, scheduling, meditation, etc. also notice a spike in downloads and in-app purchases.

Many offline businesses seek ways to deliver their goods and products to customers. Some partner with existing delivery services, others hire couriers and manage them via ready-made systems. 

Next comes automation. Automation is aimed at minimizing contact with people and with some products. Everything that can make people keep distance will be automated and digitalized. 

There will probably be more surveillance projects initiated, like in China they have movement tracking apps, health tracking apps, medical records, tests, and so on, to make sure that people infected with certain types of viruses don’t hang out in the streets and infect others around them. 

Because of this, we will have more trackers. After all, not all people are honest citizens and once they get to know, say, that they are not allowed to go outside, they will not always follow these instructions. Trackers might help prevent that.

Who is going to suffer and undergo financial hits now?

The tourism industry has been impacted heavily by the crisis. It may only recover next year.

Retail trading suffers as well. Pandemic affects luxury goods, clothing, makeup, and all the other industries that we need to be able to look well when we go out. 

The majority of industries of lower priority are experiencing a financial crisis, because now people are mainly focused on essential products, such as nutrition and healthcare. More attention is also paid to entertainment, like reading books, doing jigsaw puzzles, etc. we've been noticing complaints that it is hard to order jigsaw puzzles from the stores because they are regularly sold out.

Technologies

Now, let's talk about technologies that should get a major boost and thus become trendy in the coming year. Again this is our opinion since our design and development company has been involved in this industry for more than a decade.

Virtual reality

In the next couple of years, it will reach a new level because of the gaming industry. Its development will be more active than before since there are more wireless glasses already coming out, as well as new consoles.


Author: Valve. Source: https://arstechnica.com/

 

The release of Half-Life Alyx turned the world of virtual reality upside down. It created a completely new experience and new impressions for users and is becoming an example for other game producers. 

I expect that soon this technology will spread not only in the gaming industry but also appear in common apps such as messengers and social networks, VR meetings, etc. This industry is long beyond the starting point and inevitably will be developing further.

Augmented reality

This is what Apple is now investing in with its AR-Kit 3. Apple plans to introduce brand new AR glasses in 2022-2023, which will help bring all the augmented reality projects currently developed to light.


Author: Apple. Source: https://developer.apple.com/augmented-reality/arkit/

 

There are already a lot of AR apps and games. For instance, not so long ago, a new application from IKEA has come out in which you can add interior items to your apartment in augmented reality to see how they will look.

As augmented reality becomes more popular, it continues to improve over time. As a professional web design company, we selected AR as one of our focuses in 2018, and since then we see the rise of AR-related projects. 

Artificial intelligence

This is not even a trend anymore, it's a new reality.

Machine learning is already a requirement in Silicon Valley. This is neither something new, nor it's an innovation.  It is integrated everywhere: Apple and Google Photos are actively using machine learning for face and object recognition, creating folders, sorting photos, collections, albums, etc. All this can be done automatically now. 

It’s almost a standard thing that is going to be present in all areas: search engines, selections, advertising. Eventually, all of this will work with the help of artificial intelligence, personalization of data, personal data analysis, etc.

Products will not only be able to offer initially expected value, they will also analyze the behavior of people and create relevant collections interesting to a specific user. There will be no need to ask people for their preferences or what they like or dislike. The system will be able to recognize them and offer exactly what those users are searching for.

Voice user interfaces

They already exist and will develop further. Virtual assistants and voice chats like Alexa are already a part of many people’s lives. 

They can change the way you search for information on the Internet and increase the speed of working with interfaces, filling out questionnaires, etc. They also improve the quality of interaction with interfaces and increase the level of trust from users.

User Experience

Flow and Navigation

Absurd navigation

We will see more ideas in an absurd design. It might be menu bars that won't look like menus and other unusual ways of navigating through the site. As long as the navigation fits the information flow instead of being a part of a difficult-to-access element, it can exist.

Author: 2nd street. Site captured: https://2ndstreetusa.com/

Uninterrupted UX

Have you ever noticed how many interruptions there are in modern interfaces? 

Want to see more photos? Click a button. Want to see product details? Click a button. Want to read reviews? Click a button.

If you want to buy something, you add that product to the basket, then place an order, then you must sign in, or even worse – sign up, implying filling up to 20 registration fields, adding your credit card, agreeing with terms and conditions, and finally confirming the email. So many opportunities to start doubting whether you want to make this purchase in this store.

Recently one of our designers was placing another order at one popular local e-store that they have been using for years. And they realized that they needed to fill at least 10 fields to make a purchase. 

Companies should be seeking ways to reuse the information users provided before. Of course, confidentiality and ethics should be followed in such cases. And if you run a digital advertising agency, web design with uninterrupted UX should be your next bet.


Author: Den Klenkov. Source: https://dribbble.com/shots/7120561-Bike-Configuration

 

That’s critically important because the simpler it is to make purchases, the more likely is the user to pay you money. Mobile phones have already succeeded in this direction by allowing app purchases with a single tap and automatic facial recognition.

Inclusive design

Inclusive design is something to think about when we're talking about healthcare. The design should be comprehensive and meet the individual needs of each consumer: old people, children, adults, visually impaired, well-sighted, different nationalities, different gender, different races.

 

The design should seek ways to support different groups, and take into account the needs of those groups that have traditionally been left aside.

Varying UX

Thanks to new analytics tools, products can not only determine who came to the site but also adapt the site for a certain user experience. For example, the Apple site adapts the web page to how fast you scroll.

 When one of our designers was sharing their thoughts on that, they said:

“If I go to some landings, I scroll fast, because I am most often interested in some kind of visual art, or the general feeling, and if there is something that got me excited, then I stop and study the details. So, when I first went to the site to see the presentation of the iPhone 11 Pro, it showed me this variation of the cut-down presentation of the phone.”


Captured on apple.com


But if you go to the same site on the same page anonymously, i.e. as if visiting the site for the first time, then you’d get a full presentation of the phone and further description. 

Captured on apple.com

 

—Writing

Human writing

Human writing should replace UX writing, and it is not about the substitution of the concept. It’s more about making texts that are easy-to-read, personalized, and informal. 


An anonymous example of how a viral message about Australian fires could be redone to be  easier-to-read.


Working in a web design and mobile app development company, we know how often companies don’t pay enough attention to UX writing, so you can imagine how critically important it becomes.

People are already tired of the same slogans and the same standard way of advertising products, and standard phrases. So the content will be created in a dialogue-like manner with a little humor and by all means will try to attract attention so that uses become excited and stay on the site.

—Feeling

Storytelling

Storytelling is almost everywhere. It’s already the standard, it’s not a trend. It’s something that should be in any product presentation. There is a storytelling subject that is taught in American schools. It teaches you to make a self-presentation, introduce your ideas, thoughts, projects in the storytelling style. For them, it’s already a standard of life. For example, a second-grader or a third-grader can not only come to his dad and say: "Buy me a cat", they can make a presentation and explain step-by-step and sell the idea why the dad should buy them a cat so that he would agree and want to do that.

Meaningful value

Value is the difficult part to communicate, because this is already a process of transferring the communication of the product with the user into meaning and narration, and not to emotions and feelings. Emotions and feelings will remain, the product will still need to trigger the user’s emotions. But now it’s not going to be about sweeties and cuties, but more about a social impact on society by using the product.

 It means that soon it will be more about why something is being done, and not about what exactly is being done. If we create a product, it will be more about why it’s being done, and not about what exactly this product is. It’s a kind of substitution of concepts.

Team Work

Designer + Developer

The eternal question: should a designer be a developer? Thankfully, not all designers are required to be able to code so far, but it is best to understand the basic coding principles to avoid creating a design that is impossible to implement or extremely costly (especially if you work at a custom web design company where fitting the budget limits is critical).

We are lucky that now we have products as Webflow, Tilda, Readymag, using which designers can not only get acquainted with some layout basics but also create their own pages, understand their mechanics, etc.

Data and design integration

The teams will have more focus on analytics. More trust within the teamwork will be crucial because brainstorms in design will no longer consist only of designers. They will also engage analysts, developers, managers, etc. Each team member is important and irreplaceable for the decision-making process. More ideas are now considered and taken into account from different spheres of a company.

Device synchronization

This is a must-have thing in our opinion. When you start using it, you realize you want everything to be synchronized between your devices. 

This is because we acquire more and more devices and people feel a lot more comfortable if all of these devices behave like one system and can synchronize with each other. This allows us to integrate daily tasks into the system and coordinate them with a lifestyle.


Author: pursuer. Source: https://zhuanlan.zhihu.com/p/97575026

 

For example, you can change a specific setting or make an operation on one device and it will get applied to other devices as well. Say, if you open Google Chrome on a tablet or my phone, you instantly see the icon on my computer, notifying you that you have a webpage opened on my phone, and if you click on it, it will immediately open the page on my computer, so you can proceed to work with it. 

In the same way, you can synchronize your watching progress for the movies or TV series across your devices. 

User Interfaces

Colors

No matter if you have a startup, run a small coffee shop with a mobile app to provide bonuses, or manage a design and development company, in any digital product color evolution is always about a contradiction: bright versus pale colors, artificial versus natural.

Gradients

Author: Sebastian Jungbluth. Source: https://dribbble.com/shots/6527381--10-Quota-Get-your-daily-quote-Animation

This year, the gradients are finally turning into light, dreamy, and subtle minimalist colors, and bright colors are out of trend now. Now we’ll be using light colors because the gradients are no longer used to speak up and highlight something, but rather to create a slight feeling of depth, give emphasis, and drop slight shadows.

You might like light gradients, but we’ll still see strong colors, it’s inevitable. Nevertheless, the trend is now focused on light colors.

Natural colors

Author: Zhenya Rynzhuk. Source: https://dribbble.com/shots/7112757-A-WQ-Young-Lab-Slider-Animation

More and more you can see the usage of natural, pleasant colors that are close to real life. Bright elements for emphasizing stuff. 

Overall, the color palette now tends to be more pastel, and more vital.

Unusual and futuristic patterns

At the same time, there are still unusual and futuristic patterns and wild combinations. This is especially relevant if there is a strong need to draw a user's attention to something new because most of today’s sites – even the ones created by professional web design company experts – are created in minimalist style with a chance to be remembered and attract attention.

You can often find a bright pattern on some minimalistic sites, for example, on the main page or somewhere in the middle, i.e. the section on which users must pay attention to. 

So today, to attract attention, all you need to do is attach a bright unusual wild pattern and everyone will pay attention to it and remember it.

Bright UI

 

Author: Cadabra Studio Source: https://www.behance.net/gallery/87883263/Do-Better

This again refers to combining incompatible colors. These are natural colors but at the same time bright UI elements such as icons, buttons, backlights. The whole site may look minimalistic, pale natural with a couple of bright colors.

Typography

We believe that bold fonts and overlap fonts will serve us for a long time.

Type overlap

Orkestra home page Source: https://orkestra.ca/en/homepage


The trend of overlaying fonts on interface elements will continue its development in 2021-2022. Combinations of barely compatible fonts and bold headings are something unavoidable, since it goes well with both minimalism and absurd design, and allows you to highlight the idea, as well as to divide content.

Bold fonts


Bold fonts not only attract attention but also help make the brand style more individual. 

Author: Muzli. Source: https://medium.muz.li/8-ui-design-trends-for-2020-401a61cbb836

In visual design, bold fonts will become and more used to help visually divide particular sections and underline the main message, which perfectly fits the currently-trending minimalism.

Style and layout

Neomorphism

Neomorphism is about repeating a cycle and returning us to the years 2009 and 2012, to the unpopular skeuomorphism, but in a new shape.

 

Author: lolux Source: https://dribbble.com/shots/10740152-Healthy-store-Product-page-Organic-Milk


It is also related to virtual reality and augmented reality development because it is literally about creating a 3D effect in a plane. Some web design and mobile app development company specialists believe that neomorphism is perfectly combined with minimalism. Merging them allows coming up with new solutions for shadowing and other types of styles.

Anyway, neomorphism is expected to become even more popular in 2021-2022. But neomorphic also has a slight drawback: it is not accessible for everyone. If a person has poor eyesight, he may simply not see these shadows normally, nor see the separation of blocks. Or if a device has low color rendering (if it’s an old device), then it’s not a viable solution. 

N.B.: The design team agreed that they doubt that neomorphism will be applied everywhere.

Dark mode

One thing that we will have for sure is Dark mode. Since last year, Apple has strongly recommended for all apps to integrate a dark mode. Soon it will not just be a recommendation, but a mandatory requirement, maybe for mobile apps on iOS and Android as well. All top brands have already introduced the dark mode.

Many sites are already implementing dark mode as well.

Most users like it and approve it. Many users even use the dark mode by default and it’s going to become even more popular. There will be an increasing number of apps with dark mode. Among the major advantages of the dark mode is a significant battery saving and it does not hurt your eyesight.

Empty space

There is a new trend of empty spaces, which is also associated with minimalism and the way the human brain works. 

Author: Nick Herasimenka Source: https://dribbble.com/shots/5605770-SURF-Interactive-storytelling

Indeed, it is much more difficult to perceive information when it’s overloaded on a page. And vice versa, it’s much easier to perceive it if there is little information on the page and it’s a single block surrounded by plenty of empty space. This gives us maximum perception and processing of information.

Asymmetric Web Layouts

They appeared mainly because people got tired of the same sites that are built under the same bootstrap grids or any other grids. They have gotten simply boring. 

So asymmetric layouts are intended to personalize the experience and add more dynamics to the sites. This is why you can often meet it in the creative agency web design works.

One of the designer had even come across a site that was divided into two parts like a split-screen, and there was different information on the product on these two parts, or even some unrelated topics, for example, two different categories of the site, one is placed on the first half and the other on the second part. This is done to cause wow-effect, something which users don’t expect to see.

There is such a thing that is used for ordinary sites called grid splitting. Grid splitting is when one type of grid is used on one block and another type is used on the other block. This is done to switch attention so that the content does not look monotonous; different blocks are built in different ways and this way users switch attention between them.

Unusual Illustrations

There is an increasing number of unusual illustrations coming out in the design. Everything transforms into a more artistic and unusual style, more creative with some sort of drawings. Users are not getting surprised by standard and classic illustrations.

 

Author: Qode interactive Source: https://www.awwwards.com/sites/qode-interactive-catalog


The standard stock illustrations will remain and still be relevant for a commercial standard product, but if you need to attract attention or surprise in a certain way, then designers apply hand drawings or bright illustrations for this purpose.

For example, as you can see there is a fisheye effect on the screenshot, but it doesn’t have to be there. It's just something that is now applied from time to time and it has so far been going very well. This is also associated with the style of absurd design.

In other words, if the site is created in an absurd style, then inserting a stock illustration into it will look strange. It should have something unusual.

Soft shadows, layers, and floating elements

It’s something that already exists but it is still gaining popularity. We are now leaving the flat elements behind and moving towards the voluminous ones. More volume is created thanks to these soft shadows. This is again associated with the 3D development, and with the development of augmented reality and virtual reality. 

It is already used both in mobile and the web: all these floating elements are aimed at creating the feeling that it is all voluminous and everything is floating in front of you, just right here: just click on it and take it. 

Mixing photography with graphics

This is not a new topic either, but it will continue to be exploited (especially in custom web design company projects). 


Author: Planit Inc. Source: https://www.awwwards.com/sites/oh-by-curio-wellness




This includes the collage effect, the effect of an unusual photograph. If an unusual illustration gives a shock effect, then in the case of photo fusion it gives a softer effect, which can surprise in a certain way, or make something interesting, individual and enhance, or highlight something by adding a photo. 

Abstract data visualization

No matter how we style some tables, graphs, lists, databases, it looks more and more outdated, unattractive, and tedious. Therefore, there are ideas on how to visualize the data in such a way that it does not look like data, but more like common information flow and more exciting by supplementing it with graphs and tables. 


Author: nickscrown Source: https://dribbble.com/shots/4021947-Koniku-Homepage-illustrations


This is the screenshot from the koniku.com site. They have used an extraordinary visualized technology of their product. It’s not just tables, but illustrations that you can play with: pull, move, etc. It’s quite illustrative and interesting.

Fabulous product photos

 

Author: Gucci Source: https://zumi.gucci.com/

It was introduced last year and it also involves 3D and graphics, and it is more about surrealism with the key idea of stunning the buyers and attracting their attention. Some people call it shocking content because it demonstrates some unreal objects, unrealistic elements, and forces potential consumers to use their imagination to view and stay longer on the site.

Minimalism and buttonlessness

Since the amount of information that every person digests every day is constantly growing, now users tend to avoid visual garbage and mainly choose interfaces that do not require a lot of effort to work with. That is why minimalism is starting to be used everywhere. Minimalistic websites and phone interfaces will continue to gain popularity.

Author: Cadabra Studio Source https://www.behance.net/gallery/78747825/Landing-Page-Transformer

The tendency to use buttonless interfaces, to make the design more native for common gestures like swipes and scrolling will continue to grow. Fewer actions – more effect.


Animations

Microinteractions

Often we don’t even notice they are there, but if microinteractions would suddenly disappear we would immediately notice their absence. They create an effect of completeness of an app. 



Author: Andrew McKay Source: https://dribbble.com/andrewmckay


In the EGO design and development company we know: microinteractions add imperceptible charm and increase the quality of interaction with certain elements and draw attention to small details. Generally, microinteractions can bring the product to a new level of engagement. Validation and page redirects are especially helpful in this case. This small feature is extremely useful.

Animated illustrations

Author: Minh Pham Source: https://dribbble.com/shots/3982257-Neo-Kids-Onboarding-Concept

They add more details and can reinforce the importance of a block. For example, you need to add storytelling, you can use animated illustrations to somehow show the user what to do instead of telling him what to do. It also refers to attracting attention and creating a sort of emotional linking between the user and the interface, increasing engagement, especially if you can interact with the animation by clicking on it.

Animated illustrations are extremely exciting, and this is the most effective way of storytelling. The example in the top shows us the case when onboarding is made using animated illustrations and you don’t need to read the text, because you can just look at the animation and understand what they are trying to tell you.

3D

Finally, the main part, which is the top of all currently existing trends. 

3D graphics and 3D animation

New-generation web browsers and mobile apps widely support various 3D elements and their interactions. It both allows showing a product or service and also introducing it in a much more fascinating way, creating a wow-effect and imitating the feeling of a real product. Not only does it allow you to see the product, but you can also rotate, disassemble, touch it. Americans would probably say “it’s real, I can smell it” about it.

It creates an effect that you not only see a 3D model in front of you, you wish you could touch it as if you already are holding it in your hands. This feature significantly increases sales. 3D is also used for creating patterns, elements, and illustrations. It creates an effect of something voluminous: 3D volumes and augmented reality, a sort of a supplement, some new volume, which is not only real but also surrealistic and new.


Author: Ming Pham Source: https://dribbble.com/shots/4773637-3D-flip-menu

 


At the same time, the traditional 3D geometry will remain a trend that perfectly integrates into the idea of ​​both minimalism and absurd design, as well as into abstract compositions. It allows you to emphasize a brand or a product, but at the same time, the type of design remains minimalistic and light.

3D is now probably the largest sphere where you can be creative without limits. This is where you can design whatever you want, there are no restrictions at all. You can do products, patterns, scenes, separate elements, etc., and the integration into sites and applications is not even some kind of a new feature, it is something that will force the user to download your application and use it.

At least, it makes us download applications with all sorts of things. One of our designers recently took the iPhone 10 we use for QA purposes because her current iPhone does not support augmented reality. So, she downloaded several new applications and it was exciting for her to see how they work. 

In addition

Mobile-first for the web

More and more people use mobile phones for work and stay in constant touch with employees and customers, etc. More people also use mobile phones for surfing the Internet and most of the site visitors are mobile users. Any professional web design company has already noticed this trend with their own eyes.

That’s why web development is now switching from the standard web interface to the mobile web. There are even sites that first created as mobile interfaces, and only after that they got a desktop web interface. This is also due to trend of web applications, i.e. when you can install a web page on your phone as an app.

One of our designers already has several web applications installed on their phone (these are just shortcuts on the home screen opening the necessary web address in the browser). She says they take up ten times less memory space and everything works just like ordinary applications. 

For example, one of her installed web pages is Facebook. Why should users install the Facebook app, if they can simply open the web page? It does not consume any memory space and works perfectly. 

The screenshots for this presentation are taken with the Keik app, it is fully adapted for a mobile version and it works specifically as a mobile web browser. What we mean is that all these swipes, scrolls, and switching are adjusted to how a person works with their mobile phone rather than with a desktop browser. 

Tactile interfaces

There are more and more wearable devices such as rings, pendants, all kinds of fitness bracelets, and others coming out. They offer a higher tactile interaction. Now developers are integrating touch panels into watches for better manipulation or interaction with information.

If we take more simple watches like smartwatches or fitness bracelets, developers are now developing all kinds of switching vibrations and other useful stuff into them through tactile features. For instance, some watches are controlled by an outer crown. 

The development of all these new wearables will create new opportunities to interact with high tech devices, new interfaces, new ways to handle them, synchronize them, and new ways to get to the future with flying vehicles.


devops ninja animation
LIKE THIS ARTICLE? Help us SPREAD THE WORD.

More Articles

Back to blog