Web Design Trends for 2017

Now that we’ve jumped into 2017, we’ve decided to review last year’s design trends in order to find the best upcoming trends for content marketing and web design.
After long days of research and analysis, we found 8 trends for you that you should definitely consider using in your future projects. And best part is that you can combine them, and they’ll still work.
 

1) Micro animations

Micro animations (GIFs, elements transition, easy css/svg animations) are getting more and more popular on the web. Not only are they pretty, but adding them also means adding a valuable experience for the user for many reasons:

• They keep users interested in your content
• They make the transitions smoother
• They help the user find where to focus
• They help them not to get lost (example below:)

On top of that, when used judiciously, animations are definitely a strong feature to your content, as they highlight the important points in the clearest and neatest way possible. To help you implement micro interactions, here’s a selection of ideas you could implement on your next content:

Micro interactionsGIFs (by Jonas Mossesson via dribbble)
Cinemagraphs

2) Minimalist design

In the spirit of “less is more” that’s ruled the past few years, minimalist design is still on. Often mingled with simplicity, minimalism is all about keeping the function of an object and adding a simple and clean design on top of it. The aim of minimalism is to keep everything clear.

There are many advantages in adopting this design style:

• Content and functions comes before the design
• It is easy to load, on any device
• It is timeless
• It is organised, spacious and contrasted (perfect for the user experience!).
• It respects the mobile first idea, as mobile traffic now outstrips desktop.

And even though this trend has been going on for years, we couldn’t miss it out – it’ll keep on growing more and more every year, not only on the web, but also in people’s every day life.

To find some inspirations, here’s a selection of nice minimalist websites.

Vnstar.com.ua
Anonymous Hamburger
seanjklassen.com

Also Saint-Exupery once said: “Perfection is achieved, not when there is nothing more to add, but when there is nothing left to take away.”
 

3) Personalisation

And since we’ve started quoting inspiring people, we couldn’t miss an occasion to quote our future trillionaire Bill Gates: “Content is King”. That was in 1996. And even twenty years later, it’s still true. So, following this idea, one of the most important trends to implement is personalising the content for the user.

Here are a few examples of personal data displays that will show you how the user is placed in the centre of the content:

Fubiz Creative Finder
Last.fm Weekly charts
Global Oil Map
 

4) Font, font, font, font, font

Another trend we’ve spotted in the past few years is that typography gets bigger and bolder. As design tends to get simpler because of the new web standards in terms of user experience, playing with font in terms of typeface and size is a way to give character to a content piece without even making too much effort.

A study run in 2012 showed how influential a font could be, so don’t omit this important part of your design (And imagine reading a novel written in Comic Sans. You see what I mean?). To help you choose the right fonts, there are a few things to consider:

• Limit yourself to 3 fonts maximum. Remember, “less is more”.
• Who’s the target audience? Do we need a formal/informal style? Does it need to look larger?
• DON’T USE TOO MUCH CAPITAL LETTERS BECAUSE YOU’LL LOOK VERY ANGRY
• Keep a reasonable amount of space on the line height.

Not sure how to use it? Here’s a few examples from which you can get inspiration:

Mitchell Barton
So so tasty
Fifth Sense

Other than that, don’t hesitate to experiment. Font is definitely not boring, and there an infinite number of possibilities when playing with it, so, have fun!
 

5) Bold colours

Having bold colours is a super cool trend. From the bold, simple, flat shapes, the gradients, the monotone/duotone style, everything is permitted in 2017.

Major brands such as Instagram, Spotify or even Drake’s hotline bling video clip (OK, that might not be the best reference) have used this trend, so don’t hesitate to jump on the boat. This year is going to be colourful!

Simple shapes
Gradients
Monotone

DuotonePantone

6) Unique layouts

We’ve talked about basics of design by the colour and fonts, so now let’s talk about something serious: the structure.

Even if having a nice modular grid layout is beautiful, it’s always worthwhile breaking the rules and creating unusual and unique layouts. We won’t tell you that not respecting a grid is something you have to do right now (absolutely not!), but we have noticed that more and more websites have tended to have original layouts.

It is very interesting to experiment and to play with it. You can, for example, put pictures on a slant, play with the numbers of columns, adding depth by having different layers of layouts. So many possibilities… so let your creativity flow express itself!

The xx

Format

 

7) Hand-drawn graphics

Hand-drawn graphics have been a huge trend in 2016, and that is a good reason to keep on working with them in 2017. Make the contour of the shapes interesting to add more character into illustrations, as it can add an organic mark to the drawing. Here’s a selection of our favourite works at the moment:

Mailchimp annual report

Axa

 

8) Videos

We always talk about storytelling and how important this is. So if you have never considered creating videos, that should be something you’ll need to try this year! Very eye catching and stimulating, and there are so many benefits in creating videos that it would be a shame to skip this format of content.
There are different ways in which you could use videos. It could be motion design, interviews, documentaries! Here are some reasons why you have no excuse not to try videos:

• It increases the user’s engagement
• It teaches us about a certain topic
• It makes your communication look more human and realistic
• It’s exciting
• It’s readable on your phone

From our point of view, the best way to experiment with it could be to start it in your communication campaign. So we’ve found a very interesting link that summarises all the options offered to you if you want to give it a go.

For other types of video, here’s a lovely list of examples:
Used as a story
Used as a background

Used in motion design
 

9) VR and AI

Last but not least, virtual reality and augmented reality are THE big trend in the future of the web.

For people that have been living under a rock (no offence to those who do J), augmented reality is the real world, mixed with some virtual reality. If that doesn’t make too much sense to you, consider the worldwide hit Pokemon Go, or Snapchat filters, both examples of augmented reality.

Virtual reality is a world created digitally (or recreated from real life!) that requires specific equipment such as helmet or gloves. To mention some examples, the Google cardboard and the Oculus Rift are the most prominent tools that allow you to experience virtual reality.

Inside Abbey Road Studios

Rayban virtual mirror 

So, from the Abbey Road studios (mentioned in an earlier post) to the Pokémon Go game, the technologies behind augmented reality and virtual reality are only at the beginning of their expansion. Keep an eye on it!

What can we learn from those examples?

As you probably have seen, the trends on the Internet in terms of web design and content marketing are varied and experimental. And you can combine them – you could try 1) + 4) or 6) + 9)+ 3) + 7), and everything will work.

So what we can learn from that?

The field of possibilities is infinite, and content will still be the king for the upcoming years.
So have fun!

Sandrine