Here comes 2022, and as usual, we have prepared for you the list of the top UI/UX design trends to follow.
Design in the coming year is about taking care of users, their uniqueness, and avoiding the “perfect picture”. Therefore, real-life photos, live artistic illustrations, and asymmetry are gaining more popularity.
And by the way, did you know that according to Pantone, the color of 2022 is violet (Very Peri)?
Let’s now explore the leading UI/UX design trends of 2022 in detail and see how popular brands successfully implement them.
UI trends
The user interface (UI) defines an interaction between the user and the product or service. Simply put, UI design includes all the interactive and visual elements of the interface. They are buttons, icons, menu bars, and more. Many companies focus on UI design to refine the user’s overall experience.
Some UI trends that were in great request a few years ago, have remained at the top. At the same time, some have become common in 2021 and will continue gaining popularity this year.
So, let’s have a look at them!
1. Vintage, 90s
Vintage style in 2022 is trending in many areas: clothing, interior, music, print. Besides, it is organically integrated into web design.
The remarkable features of this style were inspired by the example of retro magazines. Vintage style includes the combination of bright and pastel colors, line graphic elements, shadows, rounded and at the same time sharp shapes, elegant serif fonts, and round text elements. All these features stood out in a completely new way in website interfaces in 2021. Moreover, this style remains one of the relevant UI trends 2022.
In that way, vintage style combined with a modern approach becomes a fresh and unusual trend. However, it’s no wonder they say that everything new is well forgotten old.
The brand Plus is one of the coolest examples of implementation of the vintage style.
Source: Plus
Below you can see an example of a more restrained vintage style by a furniture marketplace Sol’ace.
Source: Sol’ace
You may also like: How Much Does it Cost to Build an Online Marketplace in 2022?
2. 3D and 3D animations
3D in UI design will definitely enter our lives in 2022. 3D elements have been used before, and this year, they can be found even more often. Therefore, designers will use their skills to maximum, creating interesting concepts and animations in 3D.
3D, as one of the most popular design trends 2022, is used in many areas. They are e-commerce, architecture, fashion industry, business, culture, education, and many others. For example, Apple actively uses 3D models of its products to show their best side to future customers.
Below you can see how The Originals Museum Renault marketplace uses a 3D model to demonstrate the automobile. The user can choose the vehicle and spin the model to see it in detail.
Source: The Originals Museum Renault
Another example of using 3D in design is demonstrated by Platoon aviation.
Source: Platoon aviation
3. Artistic Illustrations
Obviously, designers are looking for a way to hook the user, and to keep their attention on the site or application. And while neat vector illustrations of people and objects have been relevant for several years, now it’s time to change direction.
So, what about less-than-perfect illustrations? These can be images with natural textures, varying line width, and those hand-drawn by an artist.
Let’s take a look at how this design trend is implemented on the site How many plants.
Source: How Many Plants
Another one of the latest UI design trends is depicting people with different skin colors, body types, and nationalities. We are all unique and beautiful the way we are.
Below you can see an example of how to implement this user interface trend by the microsite Listen to Girls that explores the point of view of young girls.
Source: Listen to Girls
Notably, hand-drawn digital illustrations look organic and cozy in their naturalness. Therefore, this approach positively influences the brand and attracts the audience.
4. Brutalism
You’ve surely come across sites with huge titles, hard fonts, and a combination of bright or even neon colors. Furthermore, elements of these sites are scattered in a chaotic manner.
Nevertheless, this is what creates the composition. All this is brutalism, one of the UI design trends 2022. Obviously, this style does not seek to be comfortable and convenient. Instead, it is challenging and breaks the rules.
Although brutalism is now at its peak of popularity, you need to clearly understand when to apply it and when not. For example, this style is perfect for portfolio design. Also, it is appropriate for a conceptual clothing brand landing page or a website dedicated to a topic under discussion.
The MSG brand shows how to implement brutalism in website design.
Source: MSG
Below you can see another example of the brutalism UI trend from the portfolio of Mirelle Borra.
Source: Mirelle Borra
5. Asymmetry
Asymmetry in UI and graphic design is not a new trend, but it will still be relevant in 2022.
People are used to standard grids and classic site structures. But what if you shift the focus and concentrate the user’s attention on the main thing?
Notably, the asymmetry can be different.
- Barely noticeable
Photographs at different heights, graphic elements present only on one side, different fonts and styles in one sentence. - Striking
Displaced blocks, lack of the usual grid.
We can find the perfect implementation of this UI trend of 2022 on the website of Revolt. The designers have significantly changed the classic arrangement of some blocks: header, tabs, and ladder of text. Nevertheless, the page looks clear and harmonious as a whole.
Source: Revolt
Here’s another example of slight asymmetry implementation by the Bergen Assembly website.
Source: Bergen Assembly
6. Real photos
This one of the design trends 2022 is not new, but it continues to hold and will only gain popularity this year. Hands in front of a laptop, a guy in a shirt making a drawing, people smiling against the background of a growing diagram… Definitely, such pictures are familiar to you. Many designers use them, but such images don’t provide any information about the nature of the website.
We recommend you to arrange a photoshoot, and show the people behind your MVP product or website. For instance, make a collage or add a block of your photos from Instagram. Notably, live and real photos are one of the keys to user confidence.
Figma is a good example of how to use real photos in design. On Figma’s website, you can get to know the team that creates and enhances this site, and experience the atmosphere of their workspace.
Source: Figma
Below you can see another example of the real photos trend implementation by a wine production company. Their photos are quite simple – a company’s employee and the product itself. Nevertheless, they are very catchy, and above all, real.
Source: Verre Vert Glass
At Codica, we also follow this one of the latest UI design trends 2022 on our website. For example, recently we updated our Careers page, which now can offer a quick glimpse of the team and describe how we work.
7. Scrollytelling
A new way to tell about your brand, product, or company is scrolling. Every day we scroll through the Facebook or Instagram feed, our photos on the phone, the correspondence of messages, and much more. This pattern is already familiar to the user, and therefore it can be used for other purposes. For example, you can develop a site where the main idea is explained step-by-step when scrolling.
Furthermore, it is important to understand the subject matter and the area for which this trend is applied. Not surprisingly, no one wants to scroll a site to order an urgent product for a long time. Nevertheless, you can safely implement this trend where it is appropriate.
For instance, the Blue Marine Foundation has used scrollytelling to draw attention to the ocean inhabitants’ issue.
Source: Blue Marine Foundation
Another great example of implementing this latest UI design trend is the website of Kirifuda. A Japanese digital studio shows how to implement scrolling for the portfolio properly.
Source: Kirifuda
8. Minimalism
Minimalism stands proudly among the latest UI trends and is not going to lose ground. In a sense, it became a classic. However, even in the classical approach, it is appropriate to bring something new, creating simple but catchy solutions.
Minimalism is based on free space, contrasting text, graphic elements, shapes, and a limited color palette. All these characteristics are aimed at simplifying the site’s visual perception. Furthermore, they ensure the convenience of interacting with it, which is always a priority for the designer.
The more simple and clear the interface is, the more pleasant it is for the user. Frequently, users want to use an application or website for their needs quickly. Therefore, minimalism is ideal in this case, without distracting or overloading the perception. Each element of this style is not just a part of the composition but also a functional component.
Interestingly, minimalism in 2022 isn’t all about monochrome or white backgrounds. This direction expands the boundaries and becomes bright. Nevertheless, it retains the general concept of simplicity and convenience.
Neuro is a brand of gum and mints and a great example of vibrant minimalism.
Source: Neuro
At the same time, a beauty care brand Rudolph Care prefers a combination of light tones and harmonious palettes. However, this type of minimalism is also relevant through UI trends 2022.
Source: Rudolph Care
UX trends
The UX (User Experience) is a broad definition, including all the experience users get when interacting with a website or application. To compare, UI focuses on how a product’s interface looks, and UX focuses on the user’s way to solve a problem. Undoubtedly, a good user experience is the best indicator of proper design for different websites, for example, e-commerce platforms, or SaaS applications.
In addition to UI trends, we decided to share a selection of UX design trends that arise from situations over the past few years. So, you can adopt a few and apply them to your product or site.
1. Inclusiveness
First of all, the designer thinks about the users’ needs. Hence, inclusiveness allows users to feel comfortable and safe while using the product.
In order to create a design accessible to everyone, it should be tested by different people. There are four principles of inclusive design:
- Determine what exactly in design may not be available to users with unique abilities;
- Find out what situations may arise when all users will not be able to fully use your product;
- Involve people from different communities in the development process;
- Offer several options for interaction with your design and strive to provide an equal experience for all users.
Therefore, inclusiveness is all about the individual characteristics of a person. For example, physical and mental disabilities, race, cultural background, gender, age, language, etc. Thus, all these aspects must be taken into account when developing a design.
Hence, more and more companies are paying attention to the diversity of their users. For instance, sites and applications where you can add custom gender and not report it at all are now common.
For example, Twitter knows perfectly how to implement this one of the most important UX design trends. On the site, developers added a column where users can not only choose, but also add their gender.
Source: Twitter
A customer service website WolmartPetRx is another example of an inclusiveness trend. They plugged in a widget that makes their design more inclusive. So, users can customize the website according to their preferences.
Source: WolmartPetRx
2. VR, AR
These two technologies will definitely become interesting trends in UX design 2022. Virtual Reality (VR) and Augmented Reality (AR) connect the real and digital worlds. They enable users to perceive information visually, in a similar way they perceive the world.
Now you can imagine the selection of furniture from IKEA Place sitting at home or see if the Lipstick from Sephora is right for you. AR is a good opportunity to bring the product closer to the buyer, and clarify what it is. It is great to be used for e-commerce projects.
You may also like: How to Create a Website Like Amazon?
The popularity of VR was fueled by the news of Metaverse, a new project from Facebook. The company changed its name to Meta to strengthen its ties to this project. Metaverse is a 3-dimensional projection of the world in which a user can create their 3D version and meet other users online.
For example, this approach can be used for meetings, conferences, and lectures. Thus, the goal of the project is to help people communicate, work, and develop business.
Source: The Wall Street Journal
3. Super app
Essentially, the super app is an application in which many services are combined. For example, ordering goods, delivery, messenger, social network, electronic payments and others. Consequently, you no longer need a dozen applications. With super apps all services are collected in one.
Such applications are common in Asia. The two most popular supers are Chinese apps – WeChat and AliPay. Obviously, for people in this region, using such applications is an essential part of their daily lives. Now super applications are also conquering Latin America. However, it is still difficult to answer whether it will be relevant to the United States and Europe. Perhaps super apps will become one of the UX trends 2022 for these regions.
Source: WeChat App
Nevertheless, despite all the advantages of super applications, creating them is a very painstaking and time-consuming job. It is because the designer’s task is to maintain a uniform style for a large number of modules, each of which has different functionality.
At the same time, when building such an app it’s important to follow one of the UX best practices, and to make a clean and understandable design. Thus, development and design teams try not to complicate the interface and force users to take extra actions. All apps, which of course includes super apps, need to be convenient in use because customers are motivated to save time and effort.
Recommended reading: 5 Major Principles for a User-Friendly Website You Need to Know
4. Audio only app
When we talk about audio apps, the first thing that comes to mind is the Clubhouse, which was at the top in the first half of 2021. Although its popularity subsided, Clubhouse did not disappear without a trace. So, what are the advantages of this type of app?
- There is no video, which means it will be easier for people to have voice calls, staying in their comfort zone;
- It is a great chance to listen to interesting people on the topic you need, without any links or registration;
- It adds privacy to communication.
Therefore, the principle of audio dialling in groups has been adopted by some large companies. For example, Spotify launches its live audio app Greenroom. It is an app that lets creators interact with fans in real time by creating rooms, selecting speakers and discussing topics.
Source: Spotify
Telegram has also added the ability to create audio rooms for group chats.
Source: Telegram
5. Design systems and libraries
Earlier the design of the system was relevant mainly for large corporations, but now this trend has been picked up by everyone. Thanks to tools such as Figma, Adobe XD, and Sketch, designers have the ability to create uniform components for all pages of a site or application. Furthermore, they can collect them into a single library, which is available to all team members.
Thus, you can call and discuss any element from the library with other members. In addition, even being far from each other, it is easy for designers working on the joint project to understand the structure and spirit of the brand and maintain its integrity.
Source: Figma community
6. Customization
Let’s see how great it would be to customize the sites and applications that we use every day.
Certainly, designers try to think through all the needs of the target audience, but it is impossible to take everything into account. Customization as one of the UX trends 2022 allows users to choose some design elements themselves.
As an example, the custom settings of the Instagram messenger can be cited. Now it is possible to change the theme or colors of the chat. Also, in Telegram you can change the color theme, scale, wallpaper, and even install custom languages created by other users.
Source: Instagram, Telegram
Notion is another good example of environment customization. This is an application where you can write notes, create to-do lists, knowledge bases, spreadsheets, and so on. Hence, these functions can be used in any convenient way.
For example, users can use them for self-organization, work, or as a personal diary. In addition to the variety of use cases, users can also customize the visual part as they like.
Source: Notion
Nevertheless, this UX trend 2022 may be unnecessary, for example, for marketplaces. Usually, a marketplace user wants to log in, buy an item, and log out. But customization is a great solution for products where frequent and long-term interactions are expected. If customers can customize the application, they are more prone to like and buy the product.
Further reading: How UX Design Solves Online Marketplace Issues
7. Page speed prioritization
When we navigate a site, we switch many pages. So, how often do we pay attention to page loading time? Obviously, when we start to notice it. Thus, a slow loading speed becomes the reason for leaving the page.
Clearly, nobody wants to wait for a photo or video to load. We live in a time of rapid consumption of content. So optimizing web pages to speed up their loading is very important.
A designer needs to understand how to build an interface in such a way that optimization is not hindered. For example, it is better not to use a large number of fonts. One for headings and one for text will be enough.
Moreover, images often can slow down loading. Hence, designers need to compress them, but without losing quality.
Without any doubt, loading speed is essential for startup sites. When a business is just launched and you need to gain an audience, it is very important that users do not leave the site immediately.
Besides, it is equally important to be among the first lines of search results. Still, well-optimized pages are ranked to the top by Google’s algorithms. Therefore, page speed prioritization will become one of the UX best practices this year.
8. Mobile-first design
Smartphones win popularity day by day. According to Statista, global sales of mobile devices reach about 1.53 billion yearly.
Source: Statista
A great number of people prefer browsing pages on their phones, instead of the desktop and tablet. Therefore, mobile-first design has become a must for websites and building SaaS products and will remain at the top in 2022.
This trend changes the way websites are designed in principle. It means you create a project with mobile users’ needs in mind:
- Make it as simple as possible;
- Keep only the required elements;
- Use chatbots and push notifications;
- Design user-friendly CTAs to have more leads and sales.
The mobile-first approach is about convenience and satisfying mobile users’ demands. It influences the number of your site visitors, improves your SEO, thus providing more web traffic.
Thus, it becomes extremely valuable when developing an online marketplace as a great part of e-commerce is handled via mobile devices.
For example, let’s compare Airbnb’s website desktop and mobile versions.
Airbnb’s platform pays attention to a mobile-friendly interface, and uses organic shapes to look trendy.
Source: Airbnb
The best advice to designers here is to make convenient mobile-first layouts a priority and experiment with typography, colours, and overlapping elements.
Source: Airbnb
