10 UI-UX design trends in 2020

10 UI/UX Trends in 2020

It’s the new year, and time for another list of design trends! Tbh, design trends hardly see a drastic change with the onset of a new calendar year. It’s more like a smooth gradient; trends change gradually over the years. Drop a few years in the timeline, and then take a look at design styles. It is now that you will notice a stark difference.

With the onset of 2020 the internet is already flooded with articles on new design trends in UI/UX. While most of them brood on aesthetics and animation styles, I would like to tread on a slightly different path.

I feel that aesthetics and animation ideas cannot and should not bend the knee to trends. These are the outcomes of a creative mind, and creativity should not be restricted by opinions. I had once read on an advertising board:

Teach your child how to think

Not what to think.

Well, while others guide you on what to design, let me talk about how to design.

. . .

#01 Balance User Experience and Business Goals

Image showing a happy girl holding a paper crown to her head. It is used here to represent that the customer is king or queen.
Oh yes! We all know that, right?

Customer is King

We are all well-acquainted with this maxim, aren’t we? Customer satisfaction is the tax on which a product’s empire is built. They are our critics, our fans and the source of our revenues.

But while we are so busy going head over heels to invent new ideas let us not forget why we started creating the product in the first place. Whatever you design, be it a website or an app, the key to success is to set the business goals clearly, pave the way to achieve those goals, and implement them in your design.

Remember, a customer can land on any page of your website from any source. It can happen through a Google search or a social media post or a paid ad. So, every page should welcome visitors with the same enthusiasm as your homepage. More importantly, every page should have a prominent gateway to the conversion page.

Similarly, screens or modules in an application should be interconnected, and should gently remind the user to go to the conversion screen.

. . .

#02 Valuable Content

Image showing a blurred image of a speeding train while an empty advertising board with the text "CONTENT", situated on the opposite platform, is visible through the blur.
Good content is just what you need your audience to know

Let’s be honest: by the grace of our busy lifestyles, we are getting more and more impatient. Well, at least the majority is, especially when it comes to taking in information.

To add to this, most people refrain from reading. So, the content that you provide must be concise. There are various ways to present information. It can be through well-structured words, through images, through shapes and icons

or through videos.

The best part is that the ways in which images and videos can now be presented is limitless. Thus, one can, and must, exploit every opportunity to express oneself or a brand in a unique way.

. . .

#03 Human-centred Words

Image showing a little girl holding a megaphone, with the words "Who doesn't like to listen to a story!" coming out of it.
Story time is the best time to memorise words!

This has been the trend since..umm…probably always. The idea behind this is:

Who doesn’t like to listen to a story!

We can’t deny that we have always enjoyed and remembered stories a lot more than classroom lessons. The same happens when you take your user through an engaging story about your product or service, and not make them sit in a classroom where technical or statistical details are delivered.

Don’t guide the user with sign posts. Lead them into an experience. Create content that is in an engaging tone with normal conversational vocabulary.

. . .

#04 Meaningful Animation

A GIF showing an animated prototype of a BMI calculator (mobile app).
Hey, that’s created by Design Studio!

I guess some of my readers might be wondering what I mean by “meaningful”. Let me try to explain.

Take a look at the landing page for Pixel buds on Google Store, if you haven’t already.

A GIF showing the animation slip of a pair of Pixel buds going into their case.
Animation and storytelling hand-in-hand

This is what I would call a fantastic example of meaningful animation. The site not only gives a complete overview of the product but also guides the user through the website.

There can be many other forms of animation but let’s pledge to create something that is actually useful, and not simply a showpiece. Of course, we sometimes need things that are only pretty to the eyes and do not make sense; but these can be used in considerably less number and in small dimensions. What do you think?

. . .

#05 Memorable User Journey

A GIF animation showing the journey of an apple from an online store through the shopping cart to the plate.
The journey of an apple?

We want to be remembered, don’t we? Well, I want to be. The best way to assure that at least some generations remember us is through our work.

In a similar way, no one remembers a website or application that offers a generic UI or (especially) UX. We need to stand out from the crowd. The most important way to do this is to give users an experience that they wouldn’t have expected…in a positive way, of course!

– Make the journey as intuitive as possible — easy to figure out and to-the-point. — Introduce acknowledgements for every action taken by the user and by the product.

– Put in micro-interactions to liven up every click, tap and swipe.

– Go beyond micro-interactions and introduce words, icons or animations even when they move to a different tab.

Just a note of caution: don’t go overboard!

Browse through Hello Monday, for example. Start exploring right from their favicon through the animation in the first fold to the face that appears on hovering on their latest stories down the page. And don’t forget to access their menu from anywhere on the right of the page!

Now that’s what I call a totally memorable experience.

. . .

#06 Accessible Designs

Two side-by-side images showing a basin that can be used by people who can stand and by people in wheelchairs.
Smart sinks!

Now, this is nothing new. We will be needing accessible designs for as long as the internet will exist. We — the ones blessed with sound mind and health — are so used to using technology the way we do that we forget that there are many others who are not as deft in sight, sound and cognitive ability the way we are.

Have you seen the radical innovation by Tanvas? They have brought textures to touch screens through the use of haptics. This will not only make the experience incredible for all but will immensely help those with visibility issues.

Now, this is a huge example but we can make our contributions by adhering to the accessibility guidelines whenever we design a website or an application.

. . .

#07 Mobile-first Approach

Image of a mobile phone showing the title of this article "10 UI-UX Trends in 2020" via typography.

We carry our world in our mobile phones. Given that more than 50% of global internet users access the web through their phones, it wouldn’t be very wrong to say that our world is getting smaller and smaller, enough to fit into our pockets.

Gone are the days when we used to be happy with a web design that could be rearranged into a mobile responsive one. It’s the other way round now. Start with the design for a mobile phone, and then reframe it for a desktop. This approach would help you to know what would work best in a mobile device. Almost anything and everything works on a desktop, right?

. . .

#08 Exploit Technology

Image showing a mobile screen for a smart home app.
A lot can be done if we use technology the right way

2019 saw some big steps in technology for the web. We had started the year with AR and VR shaping up into a colossal form. These were later joined by major upgrades in browsers, motion design, voice UI, wearables, codes, prototypes and now Tanvas.

Being a designer, it is essential to keep everything on your fingertips. You might feel like things are happening too fast to catch up with. Take your time. These technologies are here to stay and evolve.

Learn, practice, adapt and build something new. Just don’t let go.

. . .

#09 Utilise the Colour of the Year

Abstract image showing bubbles in classic blue, the Pantone colour of the year 2020.
Adding some blue would be good

I wouldn’t ask you to dip everything in classic blue but try to use it in your designs this year.

There’s a strong reason why Pantone so painstakingly selects colours every year. The team observes colour influences from all over the world, combing through different sectors like entertainment, art, fashion, popular travel destinations, socio-economic conditions and a lot more.

So, basically, the Pantone colour of the year represents people, their choices, their conditions and their lifestyles from across the globe. I think our products should reflect some of it.

. . .

#10 Original Ideas

Image showing the original Adidas logo and an almost duplicate one.
If it’s not original, it’s not worth it

Originality matters. You can create something which is similar to a winner on Awwwards.com, and be proud of your achievement. But you might hear people saying, “Hey, this reminds me of one from Awwwards!” And after a while, they will forget.

If it’s not original, it’s not worth remembering.

The good thing here is that you can observe the best and worst of different websites and applications, and create something which is a package of the good things. However, remember not to be a copy.

Take inspiration but be original.

. . .

So, here ends my list. While we look forward to producing some great stuff which are already in our pipeline, I would also look forward to see more awesome creations from my peers all around.

Happy new year and even happier designing!! 🙂

P.S.: If you or someone you know would like to get some good design for your upcoming project, feel free to drop us a mail!