Faces.com
Gets A Facelift!
UX & UI Design
Revamping an existing website/design to re-platform from Magento to Salesforce
COMPANY & DEPARTMENT
Company: Chalhoub Group. The Group is based in Dubai, UAE with retail networks across the GCC and Egypt.
Department: Digital Team, Beauty Vertical
DURATION
July 2019 - January 2020
PROJECT TYPE
Product Design
THE CHALLENGE
Working with and updating existing Faces designs, along with creating new sections and tools for the website.
All designs were approved by the Head of Digital and brand managers of Faces.
TOOLS USED
Adobe XD: for designing and mapping interactions
Zeplin: for sharing files and design specs with developers
Jira: for product management, logging issues, and testing
MY ROLE, SCOPE & METHODOLOGY
Role: UX & UI Lead working with 2 junior designers (direct reports). We worked cross functionally with IT (developers), a product manager (external), and the Faces team. Additionally, I also made frequent contributions to the product roadmap.
Scope/deliverables: Front-end design for website and iOS app, design validation, UAT prior to launch
Methodology: Lean UX (think, make, check); agile with 2 week sprints
Problem Setting
THE FOCUS
The focus of this project is Faces, which is one of the largest beauty destinations in the Middle East with stores across UAE and KSA. The store’s largest customer base is in KSA.
THE REASON
Faces was previously hosted on Magento and load time was slow. Additionally, the designs were a bit dated. With new competitors in the beauty e-commerce space, it was time for Faces to strengthen their online presence.
User Research & Analysis
Majority of Faces’ customers live in Saudi Arabia, so to conduct research, we flew out 2 store trainers, one from Riyadh and one from Khobar — the Faces stores in malls in both regions have high footfall.
Store trainers train store staff (sales associates) and also have close interactions with customers — our store trainers brought with them a wealth of information.
We gathered qualitative data by:
Interviewing store trainers with an in-depth questionnaire
Training store trainers to conduct their own interviews, so they could get us feedback from customers in Saudi Arabia. Both store trainers ended up interviewing over 50 customers to get us insights.
QUALITATIVE DATA INSIGHTS
The Website
We used an agile methodology when developing the website and the website was designed and developed in phases in both English and Arabic.
Phase 1 of the website included the core of the product and designs were provided for mobile, tablet, and desktop — mobile & desktop were the most prioritized.
Phase 2 of the product included additional features. The additional features were picked and prioritized after user research and interviews as well as understanding business needs and tech feasibility.
Visit the website here.
Ideation / Additional Features
Since the core of the solution, the Faces website, already existed, we wanted to make incremental improvements to fine tune the site and take into consideration the user needs of our Saudi customers.
MAIN IMPROVEMENTS
Adding “Gift Sets/Value Sets” and “Sale” as categories on the main navigation: these are the two categories that customers and store trainers talked about during our workshops
Guaranteed authentic: add a line of copy on Product Display Pages that reassures users that all products are authentic
Adding more detail on Product Display Pages: this adds an element of ease because users don’t have to navigate between pages to find more information on the product. Adding more detail means there’s a lot more to explore on pages, which would in turn create engagement.
Engaging elements: add more engaging elements on the website, such as “Gift Finder” a wizard that helps users find the perfect gift within their price range
Gift Finder
The Gift Finder tool was one of my favorite prototypes — based on our user research we noticed that users see Faces as a gifting destination and this was a fun way to keep users engaged.
Users answer 4 questions and are taken to a landing page with filters applied, they can then browse the selection and add products to cart.
All of these products are available individually as well, and we made sure this wasn’t the only path to products — which would be a pain point for users and a break in their experience.
