Off to a new year of UI design trends

The now two years of pandemic and lockdowns have surely been hard on many of us. But for some, being forced to sit at home all the time and bored builds up a surge of creativity. Designers and developers have time to create more, experiment, and reflect on current trends.

We are met with a continuous flow of new websites, apps and software – and with that, we also experience new approaches to and iterations of UI designs.

What has been growing in popularity these last few months, and what may be trending this year? In the next few minutes, we are going to investigate the trends that are most likely to shape the design world of 2022.

1. Minimalism and simplification

Minimalism as a design choice has been rising for many years now, and if you look at the pages of well-known, leading tech companies, you will notice that simple, informative and minimal interfaces are becoming more and more popular.

While some may find the minimalistic approach to be boring, as it leaves out many aesthetic options, it is a fact that a minimalistic design will inadvertently simplify the user-interaction process and create a smooth user-journey.

Also, it can be an interesting and rewarding challenge to aim for a minimalistic design and make it look stunning along the way.

2. The return of brutalism

Brutalism, a style that actually originated in the 50s and 60s (back then on posters and pieces of art) has made a comeback as a web design trend. On a first note, it seems to counter trend all of those designs, which consist of gradients, shadows or lively 3D elements.

Brutalist characteristics include for example flat design, strong outlines, contrasting colors ( or simply a black/white separation), bold typography, a lack of symmetry, and few or none images. Just one of its core characteristics has mostly been abandoned: the seemingly absent grid that was common in brutalist designs.

Brutalism boldly challenges the norms of design techniques we know today – and thus, may appeal to younger audiences and designers who understand the fundamentals of brutalism.

Further, due to its flat design and sparse content, brutalist pages come with a few benefits, such as:

• Fewer distractions
• Easier navigation
• Quicker loading times

Yet, brutalist websites are a challenge to implement for many companies, since brutalist design isn’t for everyone. While it may hit the right nerve with one target audience, another group may simply view those sites as ugly.

3. Glassmorphism

First hints of glassmorphism could be observed already in 2020 and 2021 in form of neomorphism. Today, it evolved into the more complete glass effect that is popular now.

Elements of glassmorphism are design pieces that look similar to glass, or aim to have a glass effect. This includes transparency, frostiness, glossiness, background blurs, spheres that look like glass, an so on.

Glassmorphism creates simplistic, but pleasing to look at effects and can be mixed perfectly with colorful or neon elements to create a beautiful prismatic effect.

4. Holographic and neon elements

With the launch of Metaverse concepts and the growing number of people investing in cryptocurrencies, holographic and neon elements on apps and web pages become more popular, too.

That is because first, the different Metaverse concepts, as well as other VR applications, make use of those elements. Secondly, the growing crypto-space also likes to use holographic design elements on their sites to show how new and futuristic these currencies are.

5. Aurora backgrounds

In a similar colorful fashion, the trend of aurora backgrounds from 2021 continues to intrigue users with subtle, blurred splashes of color that give the page a friendly and organic look. You can either choose to fill out the entire background with aurora colors, or use it to highlight certain UI elements that are relevant to the user.

6. Micro-interactions

Micro-interactions, be it small visual or sound effects, continue to gain popularity in web and app designs, due to their simple implementation on top of the many benefits they bring along. If they are used right, they successfully

• help navigate pages or apps
• explain functionalities through simple visual or sound effects
• effortlessly introduce users to the different parts of the website or app
• speed up and simplify usually tedious processes required to accomplish a specific action

Adding to this, using different micro-interactions will make your design look more lively, and improve user engagement.

7. Wild typography

Compared to the strictness that revolved around the use and placement of typography years ago, the opportunities you have today are seemingly endless. The ability to mix fonts with shapes, photos, and emojis, to play with different typefaces, and to experiment with their placement, makes plenty of room to give your page or app a unique touch.

Today, there is almost no wrong way to do typography. Almost. Wild typography can reward you with an intriguing and eye-catching effect – or result in an irritating and hardly readable page for your users. Therefore, you should still keep the user’s perspective, as well as accessibility, in mind.

8. Split-screen design

Split-screens had been quite popular years ago, and since 2021 they have been experiencing some kind of renaissance. Especially due to the ever-increasing number of mobile devices, implementing split-screens is becoming more favorable than ever before.

Split-screens allow you to design content that not only works on different devices, but also looks really neat. Many designs feature side-by-side screens that underline the importance of the larger item, especially on mobile devices.

If you are planning to implement split-screens into your web page or app, always try accomplish these two points:

1. Provide the user with a strong and appealing visual experience
2. Deploy multiple entry points for the user to dive deeper into new content

9. Scrolling text elements

Trend number 9 involves dynamic text elements on websites. By adding moving text elements (preferably in oversized fonts) you can add emphasis on certain keywords and spark user interest – big, moving text elements attract much more attention than a stale text block. Scrolling text elements also encourage user interaction and user engagement.

Though, it is usually enough to have just a few words placed at a set location, in order to have them be not too distractible. Remember the golden rule – sometimes less is more. You don’t want your page to look like a highway of moving text strips racing at different speed intervals.

10. „Scrollytelling“ – the art of telling a story through scrolling

In 2022, it is no longer enough to simply display the information on your page, or even hide them behind annoying pop-ups and additional sections that have to be clicked on. Instead, you want to take your users on a journey, on which they get to know your brand, product, and services in an engaging and interesting way.

Through „Scrollytelling“, the art of telling a story through simply scrolling down on a page or app, you present the user with different textual elements, pictures, gifs and other snippets of information that come into view, when the user scrolls down.

What we said about scrolling text elements before, applies here as well: dynamic texts are more likely to catch the eye of the user and increase his interest in the information he is presented with. Additionally, Scrollytelling has the advantage of comfort, as it simply requires the user to scroll down to gain insight of the page or app, omitting the need of having to click on several tabs or open pop-ups.

While the creation of a Scrollytelling page requires time and effort – you need a designer to create cool visuals, and someone to write an appealing story – your page will in exchange become alive, preventing your users from getting bored while reading. You also need to keep your performance in mind – if you put in to many visuals and moving images, you may risk a higher loading time. And no one likes a page that needs to load, or worse, lags.

11. A surge of new motion design ideas

Another product of the pandemic: because in-person events have been largely reduced in the last two years, video creators and motion designers took it to themselves to create marvelous new designs to battle the lack of live action – and to make websites and apps more vivid.

The creative outbursts range from light and subtle in-app animations to full-blown promotional videos, and can be observed on almost any website or in any app.

One of the new trends include liquid motion. While this technique has been around for many years now, thanks to ever-evolving tools like After Effects, liquid motion is becoming increasingly popular today. If done right, it allows content to flow seamlessly – like water – across the screen, transforming shapes without pauses, creating beautifully moving and engaging content that is sure to captivate your audience.

12. 3D design elements

Lastly, one of the biggest trends in UI design this year, and one that will surely change web- and app design for years to come – 3D design elements. For one, they give your page more character by means of incorporating shadows, animations, or layer effects to give it more depth and dimension.

For another, adding 3D elements will help providing your users with an extra understanding of the services or products you want to present, and enhance the overall visual interest. In visual storytelling, using 3D elements can capture your story or product in a way that highlights depths of field and shadows, making them more real.

While 3D design elements have obviously been around for many years now, it is only recently that, through simple-to-use and often free-to-use tools for 3D design, developers are now experimenting more with 3D elements on their websites and apps.

Conclusion

These are the UI trends, which are most likely to shape this year’s design world. Some trends, like the use of 3D elements, will surely shape the way we design apps and pages in the longterm. Bear in mind that some other trends may go as quickly as they came – so be always on the lookout for potential changes.

Thank you for reading this article. If you are looking to make some design-related changes to your website or app and need some advice, feel free to contact us. Our design team would love to take a look at your project and discuss possible changes with you.

If you are looking for some inspiration, you are invited to browse around on our Dribbble page, where we continuously post updates of our current projects.