Web design trends for 2019: Part II – Bold visual styling
In the second instalment of a three-part series on design and UX trends, we're looking at the move away from established patterns in colour, layout and typography.
We’re seeing a real push away from the ‘banner and three blocks’ (or what I like to call ‘the meat and three veg’) approach to visual styling. And we’re seeing it pop up in all basic areas of design. The combination of technology advancements and a deeper understanding of user experience is driving a new wave of experimentation within digital design.
There has been a rise in the uptake of visual techniques such as colour blocking, duo-toning and multi-step gradients. All of these are new tools for digital designers and are thanks to modern browsers supporting technologies like CSS3 and HTML5.
The palettes themselves have also become much more unusual, with contrasting and competing colours selected over ‘safer’ options. We’ve seen a huge uptake in retro, 70s or 60s palettes, and also a lunge in the other direction with the use of blacks and fluorescents.
Spaceship Super uses a midnight blue, a highlight of bright purple and a set of other bright colours that print designers could only dream of.
Colour-blocking and electric bright
The Clipsal Iconic website utilises strong blocks of vivid green and grey to convey a solid, attractive brand feel while also presenting rich, detailed content. We focused on uplifting the feel of Clipsal’s new range with generous blocks of colour that delineated sections while increasing visual interest. (Read a case study on this project.)
Bold and brave
With transitioning blocks of colour that change when the user scrolls, this music app maquette is blurring the lines between interface and illustration.
All the way back to retro
Again, on Great Jones we’re seeing a balancing act between thoroughly modern interactive elements (such as a non -standard menu) coupled with a 70s colour scheme and font choice. The colour palette here is evoking memories of simpler times, where mum made casseroles and kids played in the street, playing to this company’s brand values.
See also, the Chobani rebrand. It’s not solely digital but the use of a retro colour scheme deserves an honorary mention.
The advent of @font-face, Google fonts and other new typographic technology has seen a huge uptake in both unusual typefaces and grid-breaking typographic layouts.
We’ll be seeing a lot more layouts inspired by past design movements like cubism and de Stijl. While not appropriate for all brands and messages, it’s pattern-busting layouts like these that show us what is possible and give us a wider range of tools to make interfaces that reflect brand values and voices.
The rise of the Serif
Serif fonts have been typically seen as old fashioned and stuffy. In addition to the feel of them, it used to be that serif fonts didn’t play so well on a typical user’s monitor, with the serifs causing blurriness and aliasing issues.
Again, tech advancements to the rescue. Consumer uptake of ‘Retina’ or 4K monitors and devices (e.g. all new phones) pluse operating system level anti-aliasing means that more and more users are now enjoying crisp fonts (with none of the fuzziness depicted above), allowing the little ‘bits on the end’ to shine. All leading to a huge rise in bold, generous and curvy serif fonts.
The popularisation and understanding of user experience has introduced a more purposeful approach to page layouts. Rules can be broken and grids can be smashed once you understand your users’ journey though your brand.
We’re seeing way more consumer sites leaning in to ‘the scroll’, reserving that ‘above the fold’ space for a single static message (the carousel will not be returning for 2019). These large messages often change frequently, and are the easiest thing to personalise with a marketing tool.
From a design perspective, sites feel much more luxurious as we’re not cramming everything into a short and wide rectangle (an awkward shape at the best of times).
Here we're seeing just enough information to tease. Leaving users, in this case hololens fans, wanting more. And making that "watch the video" call to action irresistible.
The key to these is knowing your users, and adapting that space for them, not for you. Out are the vanity slides that are ignored by users but mandated by management.
Wine label Brown Brothers’ award-winning campaign microsite Colourful Conversations made use of bold typography and layout, presenting the user with a screen’s worth of information at a time without the need for scrolling.
The broken grid
These overlapping and dynamic layouts are becoming more and more common. While initially only found on edgy studio and agency sites to show off skill, this style has spread and we’re now seeing it pop up on fashion and e-commerce sites.
Characterised by overlapping copy and elements and international misalignments this is another trend that takes its cue from the avant garde and postmodern graphic design movements.
High quality bespoke imagery
As with brand guidelines generally, photography is now being looked at more holistically. Rather than having many different focal points, colour treatments and angles, there is a very strong trend towards a uniform photographic style that complements and enhances the brand.
As with the fold-busting layouts above, the single focal point of these images is such a divergence from our usually content-crammed screens that we can’t help but look. This style of studio shot is already extremely common in e-commerce, however we’re seeing more and more of it in editorial and content images.
No camera, no problem
It may be the case that photography isn’t available or even appropriate for a use case. Rather than seeking out stock photography, more and more we’re seeing brands use both typical and 3D illustrations to lift their content.
The most common style of 3D illustration we’re seeing currently are these hyper-real compositions. Characterised by too-realistic shading and shadows, perfect lighting, excellent textures and often a lack of gravity.
What does all this mean for you? Be Bold!
From contrasting colour schemes to grid-breaking layouts, digital design is becoming more adventurous. Users are expecting unique and on brand visual experiences. And sticking with what’s safe can mark you as old hat. Don’t be scared to stand out from the crowd.
This is one of a three part series where we look into visual and user experience trends to expect in 2019, so keep an eye out for our next instalment where we look into what to look for behind the scenes when considering interface design. Up next: Web design trends for 2019 - Part III: Interface smarts.
Want more? Here are some other blog posts you might be interested in.
Creating a digital strategy roadmap
Creating a digital strategy roadmap
A good roadmap not only outlines what you want to achieve with your digital strategy, but sets out the detail of how you're going to get there. Here we provide guidance on how to do it, along with a downloadable Digital Roadmap Toolkit.
How to choose the right CMS
How to choose the right CMS
You’ve decided you need a new Content Management System – but where do you start in deciding which one to go with? Here, we distill our learnings over the past two decades of advising clients on choosing digital platforms. We’ve even included a downloadable decision matrix for you to rank contending CMS or DXP options.