END TO END UX/UI PROJECT

L’Oréal – Vichy Mag – Revitalise the L’Oréal, Vichy Mag blog to incorporate the buying experience into the content experience.

The problem

L'Oréal's skincare range, Vichy had an eCommerce platform and a blog called Vichy Mag which offers tips, advice and inspiration for healthy-looking skin, but the two websites weren't integrated with one another.


The brief

Redesign Vichy Mag to incorporate with vichy.co.uk helping customers find the right skincare product on their quest for healthier-looking skin.

Development work

To see all development work for this project including research, user definition, site map and UX design, download the UX design principles document.

DOWNLOAD

UI Kit

All the components needed to match those of vichy.co.uk in look and feel, the header nav needed to be consistent. Adding a secondary nav when on Vichy Mag felt like the user never left the main site.

A revitalised look

A fresh take on the layout and design based on mobile-first Ui principles and AA accessibility. The key change was integrating a buying journey with the content and the stories within Vichy Mag.

Category and subcategory filtering

When on a main category page, we added the functionality to filter sub-categories and based on the user's previous browsing history, or which articles they like to read most, the most relevant stories and related products would be displayed.

Quick view

An entirely new component needed to be built which enabled users to quickly view a product within an article or a category without needing to go to the full product description page. So, we included a quick view component incorporating tabs to flick through a detailed overview in a small amount or real estate.

An article

Following the same UX principles, each article now has defined components which allow the customer to shop the article. Any products mentioned in the article will be featured here.

Product pages

Over on the eCommerce platform, product pages have also been updated to include a more detailed version of the Quick View component and also dynamic links over to the latest related articles on Vichy Mag.

Who we are

And finally an engaging about page explaining who Vichy Mag are, what their goals are and the benefits of reading the Vichy Mag blog.

CV

More about me

ROCKET FUEL

Why hire me?

I have a strong understanding of what’s involved in taking an idea and turning it into a tangible product.

My clients

Ranging from startups to global enterprises, my clients push the boundaries of innovation and excellence in design, technology and engineering.