With three months left in 2017, what are the current website trends and what will we see more of in 2018?
Frozen in Motion Cinematography
Over the last few years, we have become accustomed to seeing large hero images and videos on websites. Yes, this will continue to be popular, but curating this area to have more of a focal point using still and motion cinematography, where only one portion of the video is in motion, will gain more popularity on contemporary websites. Our customer, bestop.com has a home page section that utilizes this with only one car part moving while the rest of the image and call to action remain static. Nike also utilizes this cinematography with a black and white hero video of a still model centered in the middle and blurred people moving around that person. Having a video with one still object grabs your attention because it’s unexpected and animates the website.
***Pro-tip for Advertising: According to the Wall Street Journal, Facebook advertisements that had only one moving image were 60% more likely to be clicked on. Using a human face in the advertisement with the call to action around the eye level of the model will further increase your click chances as well.
Split Screen Design
Split screen websites offer a lot of variety of what you can do with content, imagery and focal point. Stuart Weitzman, The Chicago Auto Show, and AgroBuild are all great examples that use split screen design. Each site divides up the space to highlight text, send user audience groups to the correct conversion, or make room for more content.
Device Specific Micro Interactions
Think about how quickly we become familiarized with Twitter’s pull down to refresh and how quickly other apps adapted this gesture motion as well. Americaneagle.com has an app in development that uses this pull down functionality to update live game scores and also displays a refresh indicator to demonstrate that the feed is loading. With most mobile phones not having buttons, more forms of gestures are going to appear in 2018 and should be considered for apps and mobile website designs.
Card Based Interfaces
When it comes to a card based layout, think Pinterest! Although this is not a new layout design, there are more emerging ways of working with card design. For example, Rareseeds.com has a card based layout homepage, with one unique card that has a repeating gif image. The gif draws attention to that card and it brings movement into the site. This breaks up the repetition of the cards and sparks the user’s attention.
Speaking of animations – these are by far the most popular web fad! However, don’t overdo it when it comes to animations. Think back to the first trend mentioned –Frozen in Motion Cinematography. It’s better to show a still image with one moving part or slow transition of movement and/or color. Reactive animations, when the user needs to interact with the animation for it to move, are popular as well. An example would be hovering over an image of a dog and their tail would wag. Animation like this are very popular to younger users who are constantly interacting with technology and are seeking more from it. Gifs are another popular form of animation and are heavily used on ecommerce websites. Definitely consider how your website could incorporate a simple gif that could showcase your products or services.
Be on the lookout when you are visiting some popular websites, on social media, or surfing the web as you will surely see a lot of these trends being utilized by some of the top brands. This is where web design is trending and it’s all centered around one theme - user INTERACTION.