Home Salon
Year: 2021
Type: Online Interactive Experience
Core Skills:
Project Management Visual Design CSS & HTML User Experience Wireframing Cross-team collabProject Objective
Home Salon is an interactive online experience aimed at Superdrug online shoppers, and incoming users pushed to shop online due to COVID-19 restrictions. This interaction aimed to create an engaging experience in which new and existing shoppers could buy their health and beauty products, and get to know Superdrug’s online services (GP consultations, Psychologist from home, etc) in a space that simulated the physical shop floor, during a time when shopping had to be done mainly online.
The Problem
When COVID-19 hit in 2020 and physical interaction was mostly discouraged, online transactions skyrocketed, with almost all sales happening through the e-commerce website. As a health and beauty business, Superdrug saw an opportunity to offer its customers a fun interaction where they could browse for their products whilst complying with the ‘stay at home’ rules. During a time when morale was quite low, the aim was to uplift the online experience through unexpected and engaging interactions.
The Team
This was an initiative implemented and pushed by the eCommerce Team. My main role was leading the creative tone of voice, as well as planning and executing the user journey.
Leadership
Senior Trading Manager Trading Category Managers
Creative, UX, & Engineering
Creative Lead* Front-end developer Illustrator
Marketing and PR
Digital Marketing Online PR coverage
Research
The inspiration to create a virtual space that resembled a physical space came from Charlotte’s Tilbury Virtual Giftshop launched in 2020. The interface allowed the customer to navigate different product categories, and land in the product landing pages where they could add to their basket (convert). It also created awareness of their online services, such as virtual consultations with beauty experts, and their tutorials and blog content.
Development
The development and delivery of this experience was time and resource-constrained. The team needed to ideate an experience that didn’t require specialized techniques to build a 3D environment, and that could be integrated within the website without the need of IT resources. With these conditions in place, I created a moodboard of isometric spaces, which can be built in 2D but aim to give the impression of a 3D space.
The Rooms
The experience starts picturing the user at the comfort of their own home, and then it presents a series of rooms from which they could navigate and explore. I tested early on the design process how this navigation could take place on mobile and desktop views, and how it could be implemented using the existing code interactions that we had in place by using our test environment.
Along with the Senior Trading Manager, we selected 5 major categories that drove conversion in Superdrug.com. Based on those categories, we selected between 3 and 4 sub-categories of products for which we would create a direct link to a product landing page that contained related SKUs. For the 7th room, we decided to push and give visibility to Superdrug’s established online services, such as GP video consultation, Psychologist from home, etc. Each room would also push blog content or tutorials for customers to learn how to cut their own hair, or do their own nails.
Design Considerations
For the visual design development, I collaborated with an illustrator and provided a comprehensive brief detailing the requirements for each room. This included specifications on the desired look and feel, as well as key considerations to ensure consistency across the designs. To align with Superdrug’s existing brand guidelines, I incorporated the colours used on the shop floor. Additionally, I curated relevant marketing images and compiled a set of design considerations to guide the illustrator in accurately bringing our vision to life.
Feedback
Our illustrator provided an initial draft of each room, which underwent a final review with the Senior Trading Manager and myself before approval. We provided feedback and requested revisions for the illustrator to implement. Many of these adjustments involved refining avatar actions, correcting room names, and adding extra elements to enhance the clarity and purpose of each space.
Outcome
- Developed an interactive online shopping experience designed to engage both new and existing customers on Superdrug.com.
- Increased website traffic by 10% post-launch, with a measurable uplift in visits to key product categories.
- Positioned Home Salon as a successful case study for in-house innovation, demonstrating enhanced customer engagement without relying on third-party software.
- Boosted visibility for Superdrug’s lesser-known services, including opticians, GP online consultations, and skincare consultations, leading to increased awareness and customer inquiries.
