7 UI trends to watch in 2020
New year resolutions are everyone’s favorite thing I’m sure. But researching and knowing where to take a product’s creative direction should be on a to-do list before just going ahead and doing solely what has been done so far.
Trends take new turns often enough that a product can be rendered outdated pretty soon, and this is why we, at Imaginary Cloud, decided to go ahead and make a list. Yes, another one, but stick with us on this: we’ve selected only the most visually relevant and summed it down to the top 7 trends you need to watch in 2020.
1. 2D & 3D illustration
As mentioned in a previous blog post, illustration acquired a new weight in our digital products. Even the best looking stock photos won’t do anymore, and flat animations are counting their days too. This doesn’t mean one should go super complex to make it work, but consider all the incredible stylistic references an illustrator / designer has at their display. Hand-drawn, 2D, or even 3D are very viable styles to take into account today. As you can see from the website examples below, creatives had no fears when adopting styles that have definitely steered out of the normal day-to-day UI illustration, and it went very well for them.
We should also take into account that illustration too is entering a period where the demand is high enough to the point where stock vector illustration is the fastest solution to an urgent design. But that too is falling into the same stylistic choices everyone else is making, meaning stock vector illustration’s most common style’s days are counted and it’s definitely not a longer term solution. Thinking outside the box is pretty much always the way to go, just notice how much of a difference it makes.
2. Animation
If you wish to take it one step further, animating those same illustrations will take you a long way too. It feels less like a placed “stamp” when even idle illustrations have their own flair of movement, nothing too major.
Of course nothing should stop a design from going all out when trying out something more dynamic, as the above examples have done so very well. But it should take into account the noise it might be creating that can distract the user from more important information, especially when talking about text-dense pages.
3. Fullscreen smartphones & mobile first
System and hardware changes on both IPhone and Android resulted in the disappearance of both on-screen buttons and screen borders.
Apps go all the way to the sides, top and bottom edges of the screen, considerably increasing the size of the interface.
The industry is so obsessed with it that new frontal cameras are pretty much obliged to disappear or be placed somewhere else, just not in the screen! And designers have been using that space in more and more interesting ways both on a UI and UX level too. Take a look at the following images.
Interesting, right? Thanks to this absence of buttons that take away screen space, gestures became crucial for the navigation within and outside our mobile apps. So consider having shorter on-boardings that won’t bore new users and force them to skip, so you can easily let them know where the hell they should swipe to get where they need to.
4. Longer color palettes
Your brand doesn’t need to be so restrictive concerning color palettes anymore. Two to three colours will prove to be too repetitive for the current taste. Dropbox, as you can see, for instance, has been doing it for a while, and Figma took follow too.
Of course there is a system and style guide to it, the colours are not picked at random, it’s just that now, what used to be a 4 or 5 colours palette, will give place to much more diverse color palettes that make sense and represent your brand in an established and harmonious way fashion. Depending on the subject or environment a specific screen is trying to convey, different colours taken from that big palette will be used.
5. Oversized fonts
Make it efficient — bold and huge text will go a long way when creating a first impact of a product, depending on how relevant the sentence is. And it doesn’t need to look aggressive or used solely for landing pages, one can go the extra mile and use it for menus too, if that’s a viable choice.
As you can see from the following examples, adopting huge font sizes gave them the graphical impact of urgent-looking posters.
Once again though, the pitfall is having text that is so large that obfuscates any other elements that guide the user deeper into the experience, and we don’t want that.
6. “Broken grid”, asymmetrical layouts
Remember how brutalism was becoming a viable style even for more commercial and established brands? This style has come to stay, at least for a while. Grids are flexible and don’t need to be super rigid as the user has become more and more proficient with the ins and outs of digital products. The truth is that pages become a bit less predictable and more interesting to read, as the following concepts exemplify.
The key is taking from the more “extreme” examples and adapting it to the products needs, when possible, unless the product is establishing itself as cutting edge — in which case, experiment and test — we don’t want anyone getting (too) lost.
7. Neuomorphism design
Material Design came along and brutalism was its counter-reaction. But those principles of material design were meanwhile also taken to the next level through pushing graphical objects to a whole other ambition of realism.
A button looks like a real-life button and minimalism helps to an aesthetic that is actually new and usable.
It’s not an easy style and does benefit from some spatial notions, but it doesn’t actually require the designer knowing 3D modelling.
The following artists decided to explore the come-back of skeuomorphism whilst fitting the current colours and ambience that are expected from certain types of products. The results were incredible.
Let’s address something though: this is not a quick style to make, highlights and shadows have to be on-point so that the elements actually look like how they’d be in real life. And it’s hardly one of those situations where one design element fits all, but surely designers will come up with quicker ways to achieve these effects.
To wrap things up
At ImaginaryCloud, we feel like there’s plenty of new stuff to be excited about in this coming year. Designers and product owners alike can start looking at their work with a new spirit of trying something new that stands out in the market, as new trends should always be a motivation to go further in what comes to stylistic choices. Who knows, maybe our explorations will build upon what’s being done and set the new trends for 2021. One can dream.
Originally published at https://www.imaginarycloud.com on January 8, 2020.
