Booking system and responsive marketing website redesign for a result-driven facial service.
Silver Mirror is a result-driven facial bar that provides fast and affordable facial services nation wide. Their goal is to transform facial care into an ongoing maintenance routine, similar to going to the gym to see results. With today's hectic schedules, they rely heavily on their digital experience to ensure efficient booking of facial services and products for their clients, as well as facilitating effective workflow tracking for their estheticians.
Tools
Sketch / Figma / Illustrator / InVision / After Effect
Methods
Website Audit / Wireframes / Visual Design / Icon Design / Brand Reposition / Quality Assurance / Usability Testing
Teams
UI / UX Designer Me
UX Lead Tamara Olson
Design Director Bruce Viemeister
Creative Director Allis Chang
UI / UX Intern Elaine Shih
Duration
6 months - currently ongoing
View Live Site
01 Context
Problems
The owner of Silver Mirror Facial Bar initially reached out to us to revamp their booking system. They had noticed that customers were having a tough time booking facials, mainly because the existing system was confusing and didn't perform well in user experience testing. As our collaboration progressed, they realized that their website's design system was being misapplied and user interface was falling behind industry standards, especially compared to their competitors. Therefore, they decided to embark on a comprehensive brand repositioning project. The goal was to maintain their brand's colors and logo while giving their online presence a significant upgrade to match the quality of their physical stores.
Target Users
These are young professionals juggling their busy work lives while finding some extra cash to pamper themselves. They're all about getting tangible results by sticking to a regular self-care routine.
02 Research
Understand the pain point by visiting the physical store, studying competitors, and studying businesses with similar models.
On-site Interviews
Our design team went on-site to personally experience the entire customer journey at the facial bar. This immersive experience enabled us to align the visual aspects of our design with the ambiance of the physical store. During our visit, we also identified a few booking issues and observed instances of customer and esthetician frustration, providing valuable insights that informed our redesign process.
03 Design
Booking Flow Redesign and Client Portal
Product Problems
Lack of information in the booking interface
Limited service information on the interface, with only facial names and prices, might deter clients from exploring new options and decrease their interest.
Booking and schedule finding are non-reversible processes
When selecting an esthetician's availability, the user flow can lead to a dead end if the esthetician has no openings. This requires users to make extra clicks to discover an available booking time.
Design System
The booking platform employs a reduced color palette while maintaining cohesiveness with the marketing website. It retains a clean aesthetic and upholds the visual hierarchy, ensuring users can concentrate on their tasks and successfully achieve their goals.
03 Design
Responsive Marketing Website
Design Process
Bringing store-front white space to the website and toning down vibrant colors
Silver Mirror's Creative Director, Allis Cheng, has art-directed all our inspiring photoshoots. As the photos themselves are vibrant, I have maintained a limited color palette for the website, exclusively incorporating the primary brand colors.
Reduce unnecessary icon usage while maintaining clear communication
I designed a set of icons to improve communication regarding various unfamiliar skin problems. To maintain a more sophisticated and upscale website aesthetic, we've consciously restricted the widespread use of these icons for decorative purposes.
Let the typography do its work
We selected a serif font, Freight Display, known for its timeless and elegant qualities, which contribute to enhancing the brand's professionalism.
03 Design
Facial Quiz
Design Solution
Quiz logic
Our UX lead collaborated closely with the Silver Mirror Team to streamline the complex quiz logic that guides their team of estheticians in recommending the appropriate services and products.
Interactive quiz through visual storytelling
I proposed a solution that involves users cleaning up their virtual vanity table as they progress through the quiz, with the level of cleanliness reflecting their quiz progress. Additionally, I designed out various interactive UI elements, icons, and loading animations to enhance the overall facial quiz experience.