Will web design trends continue full throttle towards fully interactive experiences, or will designers tone it down a little? Read on to see our 2019 web design trend predictions.
2018 was the year of responsive, illustrations and microinteractions. 2019 looks to be something of a mixed bag. Expect big, interactive video experiences, CSS hover and even cursor effects, and more scrolling stories than you can shake a stick at.
Color in 2019: it’s coral all the way
Kings of color, Pantone have declared the color of the year for 2019 to be living coral (RGB code: 252 118 106). And it’s quite lovely. Pair it up with some gorgeous Caribbean turquoises and palm greens to add a cheerful, tropical feel to your website design.
Neverending scrolling stories
The biggest web design trend we’ll see moving into 2019 is a hang-on from 2018: the scrolling story. Scrollable visual storytelling is compelling because it’s easy to use, helps add narrative to a webpage, and hints of content further down the page to keep the reader scrolling. As we wrote, Highline proved that this is more than a gimmick in their Poor Millennials piece, where a scrollable narrative helped to make an 8,500 word article compelling and super-readable. Here are some other ideas we liked:
Food safety firm Analytics Alimentaria uses a scrolling story to explain its role in the food supply chain, introduce its team and briefly explain its methods. When you click through to the main site at the end, you might be expecting a dull, industrial corporate boilerplate site. But pleasingly, the scrollable feel continues, using full-screen videos under a semi-opaque layer to add a little more depth to the company’s story.
Another interesting web design trend for 2019 which feels like a bit of a throwback to the days of Flash, expect to see more interactive video experiences in 2019. The best example we’ve seen recently is French pop star Mai Lan’s interactive music video, produced by the TOO SOON creative agency. The video lets the viewer change textures and views and even chop a psychedelic cactus in half with a machete.
Velux windows uses an interactive video to show how the world is better with more daylight. The user can click to switch between two very similar videos showing a family in a home before they had roof windows installed. Not very subtle, but nicely executed.
A web design trend we’ve seen in lots of newer sites is a hover effect, where hovering the cursor shows, hides or otherwise changes graphical elements.
Google’s Sustainability advice page adds cool CSS interactivity into a simple page that gives tips for reducing waste. Hover over key areas for pastel highlight disks to appear: they’re surprisingly large, but remain light thanks to the colors used. Clicking through to each section, you can play around with some nice interactive graphics which aim to guilt-trip you into reducing your food, electricity and water wastage. Hey, it worked on us.
Organic eatery Genesis has a super on-trend website. Cool retro illustrations with mini-animations and microinteractions, a scrollable story and an interesting feature: hover over the page with your mouse to cast a little extra light on things. It’s done subtly enough that the user might not immediately notice, but it’s pleasant.
A web design trend to watch out for in 2019 is the return of the custom cursor. CSS provides for designers to alter the way the cursor appears when hovering over a certain element. Of course, this can be used to change the cursor for the whole page, if that’s what you want. Frankly, we remember when custom cursors last went out of fashion. And we’re not entirely sure if we’re happy to see them make a comeback.
A purveyor of distilled beverages, Whitetail Gin uses a scrolling story for its main navigation, albeit a simple one. Numbered chapters tell the story of the company’s product, explain its unique qualities, lead you through its awards and on to some calls to action. Note the fine vertical lines which guide the eye down the page. The custom cursor used on the Whitetail site is pretty inoffensive and doesn’t really interfere with navigation, which almost makes us wonder why it’s there at all.
We wrote about Mailchimp’s big redesign a few weeks back, and one of the things everyone noticed about it was its use of serif fonts. Shock! Horror! Could the age of sans serif be behind us? The answer is: probably not. When every self-respecting web presence from Google to Airbnb has their own custom-made and definitely not at all identical sans serif typeface, we can rest assured that the style of choice for UI will continue to be sans serif. It makes for better readability in menus and buttons, and takes up less valuable space.
But for more creative moments, expect serif fonts to make a big comeback. A nice example is Two Chimps Coffee, where the serif font used for the landing page copy looks just right. It adds a touch of class and tradition, which can be important for a new brand, particularly in a luxury market. Expect to see more startup’s follow suit.
Bad design kitsch
We couldn’t end this article without mentioning the admittedly perennial web design trend that is bad design kitsch. Designers know what looks good and they know what looks bad, but every now and then they like to take a walk on the wild side.
Renowned art and design studio, Studio Job’s 2018 website is either a triumph or a catastrophe, or both. To our eyes, it’s so wrong, it’s right. With its marquee text, custom cursors, strobing patterns and lurid style, we’re certain that this strangely new-feeling homage to the worst web designs in history will serve as inspiration for many a web designer in 2019.
In 2017, we spoke with UX design experts who predicted growth for virtual and augmented reality this year. Those areas have definitely grown, and we expect to see more in the year to come. What we’re sure about is that web design trends in 2019 will be bigger and bolder than ever. We expect to see lots of bright colors and bold, serif fonts along with big interactive video experiences and innovative scrolling stories.