top of page

L'Oreal Garnier offers more than shampoo, and so does its fresh new global presence


Garnier is a leading brand formulating natural & naturally inspired products. This is a legacy which began in 1904. Over time, Garnier has made steps toward becoming an even more natural and sustainable brand.  Garnier, and its parent company L’Oreal, were aware that its online presence needed an update to represent the brand commitment and its range of products. The team at Publicis was enlisted to improve the customer experience, increase product awareness, expand engagement, and more clearly express the brand’s alignment with the passions of its customer. 


Product & Experience Design Leadership

Client Liaison

Project Planning & Resourcing

Product Roadmap

Research & Analytics

Content Strategy

Co-Creation Facilitation 

Experience Architecture

User & Usability Testing


Research showed that while online purchase of hair and skin care products of this pricing category were growing they are still most often purchased in-store. Overcoming this obstacle would require us to think differently about the purpose of the online experience by devising a strategy that more fully leveraged content and search to increase awareness of the breadth of Garnier’s nature-inspired products and their purpose.


To identify the direction for creating an immersive and distinctive online brand experience we dug into the competition, the brand's consumers, search data, and Garnier's website, search data, analytics, and assets. 

What we found

Competitive websites were primarily 
e-commerce and focused on product information. 

Consumers were searching online for more natural products.


Consumers sought to stay on trend and wanted help doing so.


Garnier provides greater product diversity with more brands covering more hair care, hair color and skin care needs.

Garnier possesses a library of content to help with haircare, hair color, and skincare needs. 


Consumers sought to stay on trend and wanted help doing so.




An experience connecting the needs of the consumer with Garnier products

Delivering the right content at the right time. 

To attract and engage our audience we created an approach that highlighted the product range and delivered, in a meaningful way, content throughout the consumer journey and across Garnier touchpoints.

The site and content are focused on
Learn, Discover, Engage, and Shop.



Consumers are invited to learn more about all the Garnier brands. The Brand pages express the natural attributes of the product line, and surface information and content expressing the benefits of the brand products for the consumer. 



The "needs" areas of the site provide helpful information in each category - hair care, hair color and skin care. They answer common questions, and provide related Garnier product, recommendations and links to the tips and how-to content library. The library is searchable and the articles are also surfaced on related product pages. 

The library content was part of the SEO strategy to increase the visibility of Garnier and its products.



The Shade Selector and AR Try on application help a consumer identify the right Garnier hair color for them, and see what it looks like on them. 



The Shop experience provides the ability to easily search, filter, browse and locate products based on attributes and needs. Quick-views make it simple to shop and add to cart and the product detail pages offer complete information about the product, related products and links to the associated tips and how-to articles in the library. 



We ran several formal and informal testing sessions to evaluate the concept and usability on desktop and mobile. With each testing we evaluated the outcome and modified the design and system. 

The most surprising comment from our testers was that they did not know Garnier had so many different types of products until they saw this site. They were most excited by the numerous helpful articles.


Working with L'Oreal's Website Factory, the team created detailed content matrices, the component library and the visual design guidelines for engineering and for the global implementation. 


The strategy for the Garnier design system was originally intended as the solution for the United States presence. It was well received by the New York Garnier team and upon presentation to the Global team in Paris, the decision was made to leverage the proposed system for all Garnier websites globally. To date, several sites have been launched leveraging the new system including France, India, and Germany amongst others. 

Word has it that the US site is one of (if not) the best performing websites across L'Oreal with an increase in search traffic, engagement across the site, and sales online and offline.  


You can see the US site here.

Project completed while employed as Creative Director, Experience with Publicis, New York

bottom of page