Web Design Trends: What to expect in 2018

As an interaction designer, I love finding inspiration online, especially in the current digital space. Sites like Awwwards, FWA or CSS Awards are filled with phenomenal inspiration. These platforms help any designer, amateur or professional, venture outside the proverbial box and into a world of beautiful chaos coupled with confident structure. Having access to this virtual world of glorious inspiration makes following design trends online so valuable.

Watching others work helps us learn, discover and grow. Whether from your tiny office cubicle or at your desk at home, keeping up with new visual worlds integrated with modern technologies can truly revolutionise the way we think and create. There is so much to explore; and in this two-part series, I share my favourite trend predictions for 2018.  


1.     Open Compositions

Until recently, designers preferred compositions that were closed, equally balanced and static. But about a year ago, this all changed. The world of beautiful, open compositions was born, Hurrah! While closed design is still the perfect choice for many types of websites, open composition is fantastic for creating visually compelling and imaginative website designs. It leaves you feeling that whatever you were interacting with on-screen continues to live off-screen. In the end, this kind of visual execution creates so much more engagement, leading to what we all our clients love – conversion!

These are a couple of examples of my favourite open composition websites:

Boone Selections website
Visit the Website: https://booneselections.com/
Play Gusto Studio Website
Visit the Website: http://play.studiogusto.com/

2.     Asymmetrical Design

Similar to open composition, and in fact, a big characteristic of this previous trend is asymmetrical design. Symmetry conquered the design world for many years, but this all changed sometime in 2016 when designers started experimenting with various asymmetrical layouts. The obvious definition of asymmetry it the lack of symmetry, but this does not translate to a lack of balance, quite the opposite actually.

The two sides of a web page don’t need to emulate each other to look balanced. If this is done right, by balancing both positive elements and negative space, the designer will able to utilise potential focal points without unsettling the user. The site will look beautiful while still feeling trustworthy.

“Although somewhat new to the web, asymmetrical design has been around for hundreds of years, saturating every corner of craft—art, architecture, interior design, and fashion, to name a few. It's evident this trend is the most likely to evolve into a staple of web design.”
Andrew McClintock - Creative Director, Amazee Labs Austin.

Here are a couple of my favourite asymmetrical interfaces:

Polish Culture Website
Visit the Website: http://culture.pl/multimediaguides/
Stine Goya Website
Visit the website: https://stinegoya.com/

3.     The Apparent Chaos

Designers have always seemed to embrace a clean, simple and minimalistic approach in their composition. But deep down, there was an intense desire to break free from this mind-set, a demand for greater expression or kind of organised chaos. Designers felt a need to change, we were fed up with rigid and simple design, we wanted more, we wanted expression. We found the answer in apparent chaos.

This trend to many is conflicted. It’s understandable to think that basic, symmetrical websites are easier to understand and tend to get the job done. But why settle for basic? Our clients deserve better than basic, our creative minds deserve better! Applying this trend creates engagement, far more than simplicity. If done correctly, the chaos acts only as a superficial cloak, the functionality underneath fully considers the user and promotes the purpose of the website.

"An aspect of this trend is extreme contrast. Be it use of negative space, bold colour choices or unique typography layouts. Taming ourselves to focus on one “extreme” is helpful to create balance elsewhere."
Mayce El Kharouf - UX Designer, Amazee Labs Zurich.

A few awesome examples of this trend are:

Melanie F website
Visit the website: http://melanie-f.com/en/
Melville Website
Visit the website: https://www.melville-design.com/

4.     Richer backgrounds and patterns

Over time, designers have introduced more patterns into their compositions. These elements are usually fine and elegant and can be used to frame or emphasise buttons or informational elements on a page. Examples of these, are pages showcasing small dashes, thin lines or dots.

The 2018 favourite within this grid pattern, is definitely the grid on the parallax principle, this is when an effect allows the user to move single columns of a grid at different speeds while scrolling. It’s important to remember to use this trend wisely, as it can be confusing for a first-time user. Keeping the movements simple and constructively-timed can help initiate conversion,without generating an overwhelming experience. The website functionality slowly leads the user down the page to the main call-to-action.  

A few great examples of this trend are:

Cappen Website
Visit the website: https://www.cappen.com/en/works
Maison Ullens website
Visit the website: https://www.maisonullens.com/home

5.     Decorative Details

The clean, modest and simplistic approach has definitely had its heyday and we loved it! Using minimalism in our work has really helped our designs transition, transforming it into highly responsive, user-friendly creations. But why stop there? It’s time to get creative this year with geometric shapes, iconography and refined design elements. Why are we adding these seemingly unnecessary embellishments? Because they work awesomely as attention-grabbers, as engagement-creators, to emphasise the quality of your content. The only thing to remember is to use this trend wisely, it’s important that we don’t detract from the actual function of the website.

A few examples of decorative details online are:

Riccardo Zanutta Website
Visit the website: http://riccardozanutta.com/
Bouguessa Website
Visit the website: https://bouguessa.com/collections/spring-summer-2018

This concludes part one of my trend predictions for 2018. Like what you see? Then stay tuned for part two next week, where we explore 5 more trend predictions for the year and learn about the importance of user experience along with clever interaction designs.  

Stay in the Loop

We will use the personal data you are sharing with us solely for the purpose of sending you our newsletter. See more here: Data Privacy.


Let us know how we can help you.