RoC Skincare
ROLE: UI/UX Designer, Creative Lead
RoC Skincare rebranded in 2020 to highlight its scientific innovation and retinol expertise. As part of this shift, they launched their first e-commerce site on Shopify, to reach a broader, younger audience.
As the lead designer on this project, one of my main goals was to create an elegant and scalable interface, considering that the plan was to expand the global presence and product lineup with several innovative additions over the next few years.
The project began with a review of topline research report that was conducted to refine RoC’s positioning as a new entrant in the e-commerce space. As the brand transitioned from traditional retail to direct-to-consumer sales, these insights helped shape both language and imagery, guiding the site’s layout, visuals, and interactive elements to create a more effective and user-friendly interface which served as a platform for education
and regimen building.
WIREFRAMING
During the wireframing process, I worked closely with stakeholders and technical teams to create a roadmap for a modular and flexible framework within Shopify that aligned with main goal of scalability and other insights gained during research.
With RoC’s refreshed brand identity still evolving during this phase, the ability to make quick updates to the homepage and product offerings was essential. Starting off with the basics, I designed flexible templates with reusable modules which allowed the site to be quickly populated, once the assets were ready.
The design of a robust, easy-to-read product detail page allowed the focus to be on key brand elements such as ingredient storytelling and science-backed insights into the proven efficacy of RoC’s products while also making decisions easy for the consumer by keep price, size and CTAs clear and easy to find.
Additional priorities such as creating an intuitive menu structure helped to enhance product discovery and encourage browsing as well as highlighted the brand’s most popular and award-winning products. The topline research helped guide the organization and naming of the collections and imagery used.
PERSONALIZATION
I choose to use intuitive UI to design tools such as personalized skincare regimen finder to help assist consumers in making informed decisions. Incorporating age-specific options reinforces that there are products available for a younger, more proactive audience.
The Regimen finder accounted for 20% of revenue and had more than a 3.5x impact on conversion as well as had a higher AOV then overall AOV. As a result, I designed a banner tout for the homepage to further increase its visibility.
Research revealed that customers were drawn to the superiority of retinol and RoC’s origins in a French pharmacy, so we strategically emphasized those concepts.
Ongoing efforts included designing their Amazon storefront, email campaigns and flows, and implementing subscription and referral programs. These initiatives were part of a strategic shift to incentivize e-commerce as the preferred purchasing channel for RoC products, moving away from just the traditional in-store shopping experience.
The site was also efficiently cloned for the UK and later expanded to 7+ countries across the EU and South America, all within a consistent design system.
Overall, since 2020, RoC’s revenue has grown by 70%, indicating the effectiveness of their digital transformation and marketing strategies.
POST LAUNCH INSIGHTS
Personalization isn’t just a feature—it’s a critical strategy for modern e-commerce platforms looking to enhance user experience and drive revenue.
The Regimen Finder emerged as a revenue powerhouse, generating 20% of our total sales while delivering a 3.5x boost in conversion rates and a significantly higher average order value compared to our site-wide metrics. Recognizing its potential, I strategically designed a homepage banner to amplify its visibility.