Looking for a splash of 2019 design inspiration? You’ve come to the right place.
With each new year, designers are welcomed by new trends to introduce into their workflow. The arrival of 2019 looks to be the year of mobile-first design, video backgrounds and the use of animation and micro-interactions to bring websites to life.
It’s no secret that consumers have been shifting away from desktops and towards mobile devices. And with the introduction of mobile-first indexing, Google is spurring on this trend.
Google first shared its plans to introduce mobile-first indexing back in 2016, and the last couple of years has seen a steady increase of brand’s adopting a mobile-first mindset. Fast-forward to December 2018, Google announced that over half of the pages shown in their global search results now use mobile-first indexing.
Indexing is the process of evaluating the relevance of a webpage based on a user query. Historically, this has been measured using the content found on the desktop version of a site, but Google’s latest announcement may lead more brands to design for mobile first.
This change of approach is down to the rapid increase percentage of people using mobile devices to access content on the web. Between 2016 and 2017, the percentage of traffic coming from mobile devices grew from 57% to 63% – and 2018 Black Friday stats show an enormous increase in mobile sales.
With Google concentrating on mobile indexing, it’s no wonder that mobile-first design has become a common trend in the design community.
Mobile-first design is the practice of designing the mobile version of a site first, and only starting the desktop design once the mobile site is completely finished. This structure allows designers to build a site that optimises content for mobile, preventing the obstacles that can occur when a desktop design is translated to a mobile device.
Here are some of the brands already killing it with mobile-first designs:
While conversion rates can be increased by excellent copywriting and beautiful imagery, the ease and accessibility of watching a video are second to none.
An eye-catching and informative video can capture the attention of users within seconds. It conveys a brand message almost immediately. In fact, research suggests visitors are up to 85% more likely to buy from an ecommerce site after watching a product video.
With this in mind, it should come as no surprise that designers and brands are starting to use this to their advantage. After all, what’s more striking than opening a page for the first time and seeing a video spanning the entirety of the browser window?
Here are a few of our favourites:
Google Arts & Culture – The Hidden Worlds of National Parks
Animation & micro-interactions
Although computer animation has been around since the 1940s, it has only started working its way into web design in the last few years.
One example everyone can think of is Google’s beloved Doodles, which capture the imagination of search users every day. But in terms of web design, it’s the use of thoughtful transitions and creative animations that are becoming most widespread.
A perfect example of this can be seen on the homepage for the UI design tool Sketch:
In this small segment alone, there are at least half a dozen different animations. Besides the introductory vertical fade-in of the ‘Find your focus’ text, there are a couple of other animations that you might not notice at first glance.
For example, as the user first sees the interface of the application, the artboard in the UI actually moves upwards as the user continues to scroll down.
The next section has an extremely subtle but well-balanced bouncing animation, highlighting specific elements in the UI by creating a layered visual for the user.
Incorporating these small but effective animations can make a huge difference to your overall user experience. It’s something different, something special. And web animation is looking likely to be even bigger in 2019.
Expanding on this idea and taking it one step further, you’ve got micro-interactions. These are miniature animations that occur after the user has performed a particular action, such as interacting with a button. Micro-interactions can be implemented anywhere and serve one key purpose: to delight the user.
Well-designed micro interactions can be the difference between a great site and an exceptional one. Not only do they communicate information more effectively and make it easier for users to navigate a site, but they also humanise its contents and increase the retention of its users.
Here are a few of our favourite examples:
Upgrade your website
See something you like? At Juno, we build ecommerce sites with a difference. From bespoke themes to animated flourishes, we build websites that encompass and celebrate your brand. And with ongoing design, marketing, SEO and growth support, we’ll keep taking care of your site, even after your launch.
Got a project you’d like to discuss? Get in touch here.