The Year 2017 is off to a fast start and it is time to set the tone for what we will be seeing featured in designs this year. We believe that the the following 10 trends will continue to be important: minimalism, material design, white space, duotones and gradients, geometric shapes, videos, micro interactions and SVGs, and lastly customization and personalization.
Minimalism is not a new concept, we have seen a move towards minimalism in the past few years. However, it is still difficult for some people to think of minimalism as a powerful and purposeful way of designing websites and applications. Some of our clients have the desire to create more complex websites and tell us to put more elements on their page as minimalistic design somehow feels empty for them compared to the crowded pages they have used before.
Material design is an important new trend that we will see included in designs this year. It comes at the intersection of art and technology. Material becomes the metaphor, surfaces and edges of the material provide additional visual cues for the design. The use of familiar attributes from the real world helps users understand affordances in the websites and especially applications without the need for a lengthy description or a manual. These cues are specifically important for communicating motion and interaction, the use of light, surface and movement helps us define relationship between objects. When material design is used properly, it not only creates beautiful looking designs but it also improves app usability and flow.
White space is intentional. White color signifies goodness, innocence, purity and means safety and cleanliness. White space is not to be regarded as lack of imagination in design, it is quite the opposite, an impossibly difficult balancing act of leaving everything unimportant out to highlight the most important elements.
Use whitespace to draw attention. By surrounding an element with white space, you are pointing out the element. The natural reaction is: “Why is that thing the only one in that part of the screen? It must be important!”
We have all heard that a picture says a thousand words. Our minds are drawn to them and when used well, they can increase conversion rates, create trust in a brand, communicate with your customers on a subconscious level. However, it is not easy to keep producing high quality pictures and sometimes even the best pictures do not properly fit with a specific brand identity. There are two approaches you may find helpful for your designs, duotones and gradients.
Duotones can be a very powerful way of using stock images and creating something unique that nobody else will be using on the web.
Gradients (merging one color into another) are another visual element that can be used in the background or to dress up a stock image to create a unique feel to it. If your brand uses multiple complementary colors, this may be one way for you to highlight all of them in a herobanner or even in a newly redesigned logo.
Geometric shapes can create depth in your design and create a unique futuristic look. Especially the use of irregular shapes (hexagons, triangles) can draw attention and break the symmetry in your design in a very positive way.
The only thing that tops a beautiful image is a catchy video. We are seeing a move towards short, funny, catchy, high quality videos in designs. We will see videos playing in the background (perhaps even using dotone to tone the look of it), we will see video tutorials, we are seeing carefully crafted video ads.
Micro interactions, animations and SVGs
Microinteractions can add a playful feel to your website or app and can also serve as a visual cue of what is happening. They can signal status of your action (upload, download) or draw your attention to something that is important (animated message bubble). Overall, they are purposeful animations that improve the experience for the user while helping conversions.
Scalable Vector Graphics (SVG) are the perfect file type for basic icons and vector web graphics. Along with their low filesize, they can also be quickly manipulated and updated with ease. Controllable SVG animation only increases the value of this modern image filetype.
Personalization and customization are often used interchangeably, however there is a big difference in the terms. Customization requires you to actually actively engage in some action to get the result you want. You may tell the Starbucks barista to give you 2 pumps of flavored syrup instead of the 4 that are customary for the drink. Or you may ask a web portal to only show you news from a particular part of the world.
Personalization on the other hand happens without your active input, it is the magic of algorithms that happens behind the scenes. Pandora just magically plays the next song that you also like without you ever asking for it. Your Facebook feed offers ads for products you actually need to buy.
User will want to customize your offerings, it is something they expect, you should design keeping this in mind. However if you can offer personalization, you have hit the jackpot. People are overwhelmed and anything you can do for them without their active involvement creates value.
We hope you found these insights helpful. We are looking forward to seeing everyone’s beautiful designs created in 2017. If you need help with yours, do not hesitate to let us know ;)