At MadDesigns, we are neither makers nor predictors of trends (whatever …), but we are listening to the market, on standby and in constant search of everything that is said and done in terms of web design, graphic design, digital marketing or communication.
At the end of 2019, our connected and passionate web-based fireflies have compiled for you 7 trends that will influence or will continue to influence, the world of web design in 2020.
Follow and watch very closely from January next…
1. Asymmetric & Broken Layout
On the Internet, “standing out” is just as indispensable as it is complex. And if using the “broken layout” could help you there? Break the codes, destructure the layouts traditionally conditioned by the grids, destabilize the users and make them break with the monotony … These are the promises and advantages of the broken layout.
Overlay of colors and textures, texts and images that intermingle, unusual placements … This year again, web designers will be able to let their creativity express themselves and their spirits wander through asymmetrical designs and layouts “broken Which will allow brands to think outside the box and users to enjoy richer and less monotonous experiences.
But beware, surfing this trend does not just mean breaking the codes, but breaking them in a planned and thoughtful way. The challenge is to successfully combine blocks of asymmetrical elements while creating a set that remains balanced, harmonious and readable.
By Ernest Asanov for Tubik Studio
Well, balanced, asymmetrical design can help you:
- Attract your visitors’ attention to certain sections of your site (CTA / Promo / Demo / Free Trial …)
- Energize and modernize your image
- Stand out from your competitors
2. Micro-interactions and triggered animations
Micro-interactions are small animations that are triggered by the action of the user (click a button, scroll, change page …), bringing dynamism to a website, but not only. Attracting users’ attention, streamlining their navigation, guiding them on their journey, entertaining them during a timeout, … are true as many benefits as the micro-interactions with animations triggered on a website can bring. For all these reasons, they help improve the user experience, which has a direct impact on your conversion rate.
Some examples of micro-interactions and animations to find on awwwards.com
Although a trend in 2020, we recommend using it in a measured and moderate way, the risk is to drown out their impact (“too many micro-interactions kill micro-interactions”) and to harm the experience of your users, by diverting their attention from the essentials.
3. Bright and Saturated colors
If until recently, fashion was flat design, minimalist, devoid of all superfluity and colors rather sober and conventional, 2020 will give way to a different style.
Do you expect this year to see more and more sites and applications with bold colors, lively and saturated, and to take a trip back in time, towards the 80s with its explosive hues, pop, electric, tart and flashy?
Each year, the Pantone Color Institute, extractor and color maker, identifies the color palette that will influence the world of fashion and design. For the year 2020, we find in particular:
The Mango Mojito (PANTONE 15-0960
The Princess Blue (PANTONE 19-4150)
The Turmeric (PANTONE 15-1264)
The Aspen Gold (PANTONE 13-0850)
Some Pantone identified by the Institute for the year 2020 will continue this year again to inspire designers and web designers from around the world. This will be particularly the case of the following Pantone’s:
The Ultra-Violet (PANTONE 18-3838)
The Lime Punch (PANTONE 13-0550)
The Cherry Tomato (PANTONE 17-1563)
Or the Palace Blue (PANTONE 18-4043))
I like the Bose brand, you want to surf the latest trends in web design and make yourself stand out by bringing pep and dynamism to your image, we recommend the use of bright and saturated colors on your website or application.
4. The video backgrounds (or video background)
This is a real trend that has appeared for some years now but will not run out of steam in 2019. Here are 3 good reasons to include a video background on your website.
Create a memorable user experience
In the age of storytelling, video backgrounds are an ideal medium for telling a (beautiful) story. In a few seconds, they can reveal the identity and personality of your brand, immerse your visitors in your world, demonstrate your know-how, transmit emotions, enhance your human capital …
Improve your conversion rate
The average attention time of the human being is very short … of the order of 7 or 8 seconds! This is the time you have to capture the attention of your visitors. However, sites that embed a video in the background will see their conversion rate increase by 15%: this is a great reason to embed the video on your site!
Boost your SEO (SEO) If your visitors stay longer on your site, it reduces its bounce rate, which at the same time to improve its SEO.
If you plan to embed a video on your homepage:
- Prefer a short video file, from 30 to 40 seconds maximum and for a resolution of 720p. Beyond that, your video will take too long to load, which would discourage users and increase the bounce rate … impacting your SEO at the same time.
- Prefer a slow video: too fast a video would divert the attention of your visitors.
- Embedding a video in the background of your home page is a great idea to engage your visitors and capture their attention from the first seconds … but unfortunately, it is not a very “mobile-friendly” idea. Mobile devices do not (still) support video backgrounds. So think of providing a replacement image for the mobile version of your site.
I like Big Mamma, Nicolas Errèra or The Museum of Modern Art in San Francisco (SFMOMA), you want to integrate a background video to your homepage and make video marketing an asset of your strategy 2019, our audiovisual specialist team will be able to advise you and accompany you. And with the help of our drone, we can even give a little height to your image!
5. XXL Typography & the Return of Serif Fonts
Typography is gaining more and more space in the world of Webdesign. Whether geometric, vintage, handwritten or experimental, they occupy space and are large, shiny, thick or colorful to sublimate the image and affirm the messages of brands.
This year, we will certainly note the great return of Serif fonts. After being neglected (because of their poor display on the screen), they will indeed resume service, thanks to the popularity of Google Font, which has facilitated their use by web designers.
Perhaps we also need the return of Serif fonts in the world of web design to the trends mentioned in this article … Their more traditional style probably undoubtedly counteract the playful, modern and destructured effects brought by the bright colors or by the asymmetrical design!
Source website: sevenhillswholefoods.com
6. Mobile-first, again and again
Google already attached a lot of importance to mobile, but since it has deployed its index “mobile-first” (meaning it indexes priority mobile versions of websites) it is even truer! So when 60% of Internet users surf on mobile and where 89% of the time spent on screen is done on a mobile screen, you have no choice but to create a responsive design website.
The “Mobile First” is, therefore, a true trend of substance, which no brand can escape today. But it goes well beyond the “simple” design in responsive mode. It is also about making the user experience as pleasant and fluid as possible on mobile, for example by adapting the size of buttons or information levels to the size of mobile screens.
7. Progressive Web App (PWA)
How to talk about the rise of mobile in 2020 without mentioning the Progressive Web Apps (PWA)?
If you’ve been dreaming about developing an app for your brand or solution, but have not made it yet, due to lack of time or resources, you should be interested in Progressive Web Apps. Even though mobile users continue to download apps on their smartphones, they use only one-third, according to App Annie. That’s a lot of busy storage space for nothing! In this, and other aspects again, the PWAs represent a real revolution for the mobile web.
Tomorrow, mobile users will probably have the choice: download an application via a store, app that will occupy space on their smartphones … or access a PWA from a simple browser, an App whose benefits and features will be the same as those offered by the native application (offline operation for example).
