Skin Laundry: Rebrand & Website Redesign

Role
Lead Product Designer
Creative Director

Timeline
4 months to launch
December 2023 - March 2023

Prototypes
Desktop & Mobile

Design System
View in Figma

Overview

Skin Laundry had been operating on a content management system (CMS) that was over 20 years old. The site lacked essential features such as web analytics, data tracking and the ability to create optimized user funnels. Additionally, Skin Laundry’s brand had not been updated in over 10 years, making the brand feel outdated. It was clear the brand needed an updated website and a fresh new identity that potential investors would find appealing. The business also needed a self service tool that would allow users within the organization to easily update content on the site. To address these issues, our product design team created and built a new responsive website utilizing the headless CMS platform Buider.io in conjunction with a company wide rebrand. In the first few weeks after launch we saw a 115% increase in booking lead conversion.

Role

Acting as an interim creative director I lead the rebrand for Skin Laundry working with an outside creative agency and our Chief Branding Officer. I selected and hired the creative agency and negotiated our contract and work agreement . Once a new brand identity and corresponding brand book was developed I was then responsible for transforming it into a fully responsive website. Additionally, I oversaw the QA of the website as our team did not have any QA resources for this project.

Design & Implementation

Working with my Senior Product Designer the new brand was integrated into a complete design system. The colors and typography were converted into a token system following that of Google's Material Design and Atlassian’s design systems. The intention was to create a fully usable system for not only the designers but also for the engineers to quickly make updates across the board. The design system was implemented across the newly designed website and helped us create custom reusable components and a complete component library. Together we designed more than 30 pages including a thorough navigation redesign, content pages, ecommerce shopping pages and a custom shopping cart page which was integrated with Shopify checkout.

Several other enhancements were added to the new website including a custom map component which utilizes a Google API allowing the user to book directly from the Google Map. We also worked diligently to ensure ADA (Americans with Disabilities Act) compliance was being followed not only in our design system but also across the site. To ensure this and an ADA widget was researched, tested and then implemented on the website.

Performance Data

Just five weeks after launch we saw a 115% increase in booking lead conversion.

Conclusions

Designing and rebranding skinlaundry.com was a challenging and rewarding project. Seeing the before and the after of this website shows what the power of good typography, branding and well thought out design can do. I am proud of the work and the role that I played on this project and the speed in which my senior product designer and I were able to turn around a fully designed ecommerce website (~10 working days). While a designers work is never finished we have future plans to implement a quick-view modal for the treatment product detail pages, enhancing our storytelling through new custom components and integrating booking and account functionality. These future updates will allow us to manage all of our user flows and funnels under one CMS platform.