return to blog listing Reading time 9 min

8 trends in UX and UI in 2022

Masa Gavran UX Designer
Published on:
Share this article!

Studies have said that 94% first impressions are design-related which means there is basically no second chance for first impression. If you want to be trendy and user friendly, and even eco-friendly, here are the tips and advice on what to apply to your UX and UI. Traffic and conversions are very directly related to User Experience and User Interface design. Trends do change quickly and tools for UX UI design update frequelnty but there are some things that are timeless – intuitive design, sustainability, and efficiency. Now, here are some of the trends that are happening right now and some that are likely to stay.

Eco friendly design

Whole world is going towards sustainability even in software development and UX UI design. There is something called design for sustainability which applies sustainability from several perspectives like a green hosting service, images used on a website, and even SEO.

The most pervasive example of this happening around the web is apps and webpages changing to the so called dark mode, whereas this was optional before meaning users could choose whether they want to use light or dark mode.

The new theme setting is being pushed on users more because in dark mode, smartphones and other appliances use less battery than with brighter backgrounds, which in turn makes users charge their appliances less therefore conserving energy. However, dark themes are not just used for energy conservation but also for user’s wellbeing. Darker screens are said to decrease the straining of eyes, particularly in low light environment, and emit less blue light which negatively affects our sleep in a prolonged use.

Source: Aleeto

Source: Aleeto

When it comes to web design, the push for sustainability comes from the growing digital carbon footprint made mostly by various servers. The sustainable design gives various options for web designers and devs to implement on their products to reduce the so called digital carbon footprint and “green up” the website:

  • Check your carbon first

You can use websites such as www.websitecarbon.com to calculate your site’s carbon emissions. This websites give specific numbers and advices on how to decrease your footprint.

  • Use a green host

Some hosting providers are more strongly committed to sustainability than others. This means using renewable energy generation, local renewable energy providers, and checking the Power Usage Effectivess of data centres.

  • Compress and reduce visual content

Images and videos make the pages heavy. Check if your photos and videos add value to the user, and just compress them and make them smaller – easy as that!

  • System fonts can be cool too

You can consider using system fonts rather than custom web fonts, and you can use less font variations which refers to the bold, italic, thin, and other variations of the same typeface.

  • Keep the code clean and efficient

Behind the design stands the code. And it should too be clean and efficient to run the whole machinery efficiently. On mobile devices, you can use Accelerated Mobile Pages which cuts out the unnecessary code and file weight.

Interactions over big animation – it’s the small things

Long animations are slowly becoming thing of the past and it also overloads pages and slows down their loading. What emerged as a trend recently are microinteractions which are small and subtle animations such as button hovers, and transitional toggle switches, or text highlights.

These create memorable moments in user’s perception and make the whole experience dynamic and joyful.

Here's an example

Source: https://www.justinmind.com/blog/microinteractions/

 

What is Neumorphism – or is it Neomorphism?

Neumorphism emerged in 2020, but it’s popularity is rising to the trend levels this and next year.

Not to use plenty of words, I will show what this trend is:

Freebie Icons and elements by MazePixel
Source: artofofiare.medium.com/

Now that you get what this is, Neomorphism is appealing in a way that it creates a softer feel of the interface with light colors, and matt effect, and a tangible product with the protruding elements. This look is achieved with same color backgrounds and double drop shadows.

If you want to read a short but comprehensive article on Neumorphism, with tutorials, I suggest an article by David Ofiare.

 

Typeface at center stage

While videos have been stealing the show on homepages for a while now, Type Only design with the typeface at center stage is being used more and more. This not only makes the web page lighter, but also puts the message up front.

When it comes to the font types, the trend is going towards experimental and psychedelic, with BIG FONTS on landing pages but the classic Helvetica, Garamond and Futura are still very much used.

Here are some of the creative use of typography.

100 DAYS OF POETRY - Awwwards SOTD

 

 

https://feijoomontenegro.com

https://loconoco.webflow.io 

Color design - Pastel Please

Colors are very powerful. They can alter our mood and perspective. They can cheer us up and create a whole ambiance. It is therefore important to use colors in a way to create a feeling and draw user’s attention to what is important to use. 

Some colors never go out of style and that is why we find a lot of minimalist pages using only black and white that won awards for its classical and strong look. Using black and white as main colors of your web and app is almost always unmistakably trendy, which doesn’t mean colorful webs and apps aren’t great too.

 

https://www.gtheimagineers.com/en.html 

However, color palettes and themes do change with the trends. It is all about what you want to achieve, with the color and what emotion you want to provoke. That’s why you will see almost every site or app related to ecology or environmentalism to be green nuanced or have natural earthy shades.

There’s a whole psychology behind using colors for marketing and evoking emotions, but here are what’s trending in 2022:

  • Pastel colors and natural shades – these are extremely trendy right now
  • Minimalist look with black and white as main colors
  • Vivid, neon like colors- especially purple/green combinations
  • Purple shades – the color of 2022 is Very Peri, a purple hue so we can see a heavy presence of lilac and violet color pallettes 

Pantone Color of the Year 2022 / Palette Exploration | Pantone

Source: Pantone

 

Illustrations & photos

Art and illustrations can add value to the users visiting your website or an app. Now, it is impossible to pinpoint users’ taste but there are certainly trends that are created to innovate the aesthetic and draw even more attention to a website or an app.

2021 has seen a lot of collage and surreal collage aesthetic, while in 2022 illustration and art will go more towards 3D objects and experimental abstract art.

 

Source: The Guardian                                                              

Source: https://dribbble.com/shots/15997709-Ready-Brand-Characters-III

Mobile first, obviously

It is nothing new and innovative to say that mobile first design is extremely important. The mobile over desktop trend is something that really changed during the pandemic, even though the trend was here before. UX UI design tools are also changing rapidly for designers to create reponsive designs more easily.

2021 saw 1,8 million more smartphone users than in 2020 on a global level, and 55.7% of people used smartphones for web traffic.

Mobile phones account for 53% of the time the world spends online, but the data shows that multi-device strategy is still key, and that other device like laptops still play an important role in our IoT connected lives.

More emotions in UX writing

UX writer is the person behind the (micro)copy, or content, that helps the user navigate the content either on web or an app. UX writing can be found on website’s/app’s Menus, Labels, Alerts, Error messages or Instructions.

UX designers and writers are always looking for a way to improve experience for users, even with the smallest things like error messages. This kind of copy may seem ubiquitous, so why is there a problem in getting an 404 error message that says “Page Not Found”? The copy itself seems pretty normal and adequate, but the small changes in the Tone of Voice of that message could be appealing to a user.

There is a somewhat of a trend to humanize this UX microcopy to feel more relatable, engaging, empathic, evoke emotions of security and being guided to keep the user on a site or an app.

Here is an example of creative 404 error message.

 

https://mailchimp.com/404/ 

Conclusion…or two

As we said in the beginning, there are a few things that never go out of fashion and that will always be the most important no matter what. Those things are: Functionality, intuitive UX, and simplicity.

Yes, design is very important for first impressions, and people are more likely to buy something with an appealing packaging, but all of this won’t work if your web or an app isn’t functioning properly, isn’t intuitive to use, and if it isn’t simple to use. Especially if you’re working in the area of payments!

Now, another thing that will never go out of style is caring and inclusion. There is a push for developers and designers to make their webs and apps accessible for people with permanent or temporary disabilities.

This can be done by simply adding a special dyslexia font, providing audio content, color desaturation, screen reader etc.

 

Source: Diginomica

Don’t forget to share this article!