Day 105: UX & Design Trends in 2020 — Part 5: Visual Evolution
If you’re interested in designing layout and styling UI components, and also care about the trends in 2020, this post is just the right one for you!
For the past 4 days, I wrote about UX Design trends regarding new sensory design (e.g. AR/VR), emerging tech (e.g. AI Design), and design process (e.g. virtual Design Sprint). Today, let’s discuss the “eye candy” part of the design, and see what would be the most popular candy in 2020!
Extrusion from Flat
TL;DR.: More shadows, more depth, more gradation, and more 3D effect on UI component styling.
If you pay close attention to the evolution of UI design from Skeuomorphism to Flat UI to modern UI design, you’d probably notice that we can’t really give a clear cut definition to the majority of what we’re seeing these days. Obviously it’s not like the extreme of Skeuomorphism where you have a eBook app with the digital bookshelf with wood pattern and texture. However, it’s neither the original Flat UI in which you can’t see any depth of UI components (hence the name “Flat“ UI). Also, in modern UI/Web design, color gradation is resurrected , shadow is back to life, huge radius of rounded corners exist, and all sorts of decorations that live between Skeuomorphism and Flat UI are ubiquitous.
So, why are we predicting that there will be more “extrusion” from Flat UI? Let’s take a look at why back in the days, Flat UI got popular in terms of adoption, not preferences: One of the key reasons that companies and development team (note that I’m not talking about designers) decided to adopt Flat UI is because mobile web. Back then, the processing speed of a smart phone and the wireless signal/ speed were not as good as our Pixel 4, iPhone11, plus 5G network. Skeuomorphic design means there are a lot of images to download and to render, which means the performance with the technology back then will be inevitably bad. On the other hand, Flat UI provided the solution that no image is required for basic components, everything (almost) is vector based, so that there’s not much to download.
Another helping hand that pushed Flat UI to mainstream is responsive web. With Flat UI, most of the UI can be easily scaled across different sizes/ resolutions of screens. Skeuomorphism simply can’t achieve that. So, Flat UI is the savior and therefore will last forever! Wait, hold on a second; Was there any design trend that last forever? Obviously, no. On one hand, Flat UI looked fresh compared to overwhelming Skeuomorphism, also help the mobile web performance; on the other hand, the usability of Flat UI is pretty bad. People can’t tell whether it’s a static icon or a clickable icon button, or text link vs. static text. Even text in a color-filled box could be static (when designers first adopted Flat UI and didn’t know/ care about the differences).
Time travel back to 2019/2020, with the way faster downloading speed on 5G network, powered with great leap of processing speed of high-end smartphone, plus the maturity of CSS and JavaScript styling and animation, more and more designers started to play around. Take Gmail’s iPhone app for example, if you swipe left/ right on an email entry, you’ll see the email has 4 rounded corners, with borderlines around, and a shadow on the bottom (almost everything for a Skeuomorphic button?)
To sum up, the trend of the new balance between Flat UI and Skeuomorphism, which is “making interactive object looks like an object but not going crazy” is probably gonna stay for a while.
Animate Everything
With the same design and tech drivers: Designers want something different, and 5G + powerful phones can support more than the ambiguous Flat UI (in terms of affordance in usability). That being said, now designers can play with more animated elements in the design, for example: lots of animated objects/ layout, video as background, animated heavy-rendered objects, and clever navigation with different orientations, etc.
Calming Theme
A lot of things happened for the past few years. And it seems like a lot of things are settling down in 2020. Similar signs can be found in design industry. Pantone chose the calming, soothing Classic Blue as the Color of the Year for 2020.
Similar trace can be found in UI design field; In the last couple years, the high contrast, high saturated gradation (as in iPhone 10 commercials) is finally trending down, and is being replaced by more low-key color set. Moreover, the desire of trust is reflected in a way that those high energy/ density design are gradually being replaced with more white space, and simple but truthful messages.
Conclusion
In the age of Post-Truth, the anxiety in the society is seeking a safer and calmer space with less noise and unnecessary decoration. However, to balance the over-simplified, lost meaning styling, designers are tackling the challenge with simple & elegant animation and component styling to ensure the intuitiveness and delight of the experience.
To see more
Thanks for reading! Do you have thoughts around UX & Design Trends? I’d like to hear from you.
ABC. Always be clappin’.
The opinions expressed in this article are those of the author. They do not represent current or previous client or employer views.
