Vaseline.com Redesign

At the beginning of 2018, I was contracted to help lead the design group at Sapient Razorfish on the Vaseline.com redesign project. Under an extremely condensed timeline and working closely with a fabulous ECD, two hard-working designers, a super detailed UX/UI guy, and a stellar project management team (!!), we collectively created a cohesive visual language to bring our concept to life - resulting in what I personally believe to be a pretty good-looking and worthy redesigned e-commerce website. Tl;dr = I led a team to make a nice ecom site. I did some of the art myself. They did some art. Collaborativey, we made it great. 

As the first of the Unilever brands to launch with the new AEM (Adobe Experience Manager) platform, we also helped create a digital styleguide and solved problems that allowed the newly crafted US website design to translate to the many other international markets planned for the future Vaseline.com redesign roll out. 

This is how I summarize this project in an equation:
Google collab spreadsheets + hands-on design work + 2 major snowstorms + 40+ pages + 3.5 week timeline + great team + AEM + digital styleguides = Success = Happy clients = Burger at Minetta Tavern

A "Premium" Look

With retouching and faux lighting effects, we created a "premium look" for product photography – elevating the brand's everyday products and setting a standard for all future product imagery. Along with a restructuring of content for the product detail page, the new website in its entirety shapes the user's exploration of the Vaseline.com website. 

The Grid

The main focus of the website is to relay product information succinctly and cleanly –creating the need for a standardized product grid display. Keeping in mind that all the products and their titles/descriptions will vary (in both English and other languages), we created an ideal styleguide for the product displays online. 

A 73-page Digital Styleguide

As the final work product of this project, we created a deeply comprehensive digital styleguide to help hone the creative through the development process. With the usual deep cuts (pixel specs & font styles) to the more whimsical fun stuff (animations & parallax effects), the digital styleguide is intended to make sure that developers and future markets (international, and other languages) maintain the look and feel of the newly redesigned website. 

Mobile forward

Unilever expressed that their users came via the mobile site more frequently than desktop – a trend that will increase over time. We welcomed that in our design process -  focusing on mobile first - making sure that the work looked great across all devices. 

...Mostly shopping

Overall, the project was about e-commerce, but as a team, we also ensured that:

• The research/shopping process was easy

• The site had intense flexibility for growth

  • Third-party applications (ex. rating systems, product ingredients, social media features - which can be different per different markets)

  • New products

  • New editorial features

  • New markets

  • New languages

And that’s the story of Vaseline.