Makiko Harris
UX Designer, Artist, Musician
Sephora VIB Rouge Haul 2015 - The Beauty Look Book.jpg

Sephora Store Employee App

The Advisor Assistant is a brand new iOS app for Sephora store associates (Beauty Advisors) to use while engaging with customers. It incorporates clienteling elements such as waitlist, viewing client data, and reservations; and also allows one-stop access to Sephora specialty tech such as Digital Makeover or ColoriQ scanning experiences.

Cast App Hero.png

Project Overview

 

What?

Brand new iOS app for Sephora store associates to use while working with customers 

 

Why? 

 

Over 40 devices in each store, and not all digital tools available on all devices, causes a confusing workflow for store associates and an inconsistent experience for clients. 

 

Digital experiences in Sephora stores from left to right: Digital Makeover guide, ColoriQ, SkiniQ scanner, Sephora Visual Artist (VR assistant), and digital makeup skill classes.

 
 

Who?

There are many different types of users in Sephora stores (leadership, new hires, category specialists such as skincare or fragrance, cash wrap, etc.).

However, for the purposes of this project we are focusing on 1 user type: a mid level in store associate who interacts with customers daily. We'll call her Raquel. 

Screen Shot 2018-02-09 at 1.28.30 PM.png
 
 

Goal

 

Create an all-in-one ‘Digital Wingman’ for Sephora store associates; to streamline their workflow and enhance their ability to create memorable experiences with customers.

 
 

 

My Role

I was the Lead UX Designer for the Sephora Advisor Assistant project.  My role included designing the interactions, information architecture and user flow of the experience as well as analyzing research insights into actionable design feedback.

Our team:

Screen Shot 2018-01-15 at 4.49.28 PM.png
  • 1 UX Designer (me)

  • 1 UI Designer

  • 1 Product Manager

  • 1 UX Copywriter

  • 1 Engineering Architect

  • 1 Lead iOS Developer + their team of devs

  • 1 UX Researcher

  • Many business stakeholders (marketing, store operations, store education, field leadership)

My responsibilities:

  • Map out user flows

  • Design the experience using Sketch and pen & paper

  • Create prototypes in InVision and partner with research to undergo several rounds of usability testing

  • Strategize on & implement optimal content hierarchy based on research findings

  • Present designs across the organization to get buy in from key stakeholders and leadership

 

 

Design Process 

Phase 0 - Generative Research

Listening to in-person user interviews and identifying key pain points

 
IMG_3165.JPG

Research Learnings 

Key pain points shared with us by Raquel & her colleagues:

  1. Too many devices, too many apps!

  2. I don’t have access to the information I need to provide excellent customer service.

  3. It’s hard to keep track of my own schedule and what’s going on in the store, because everything is done with paper and pen!

  4. In busy stores I’m always working with multiple clients, but it’s hard to “share” clients with my colleagues. Sometimes clients have to repeat information with multiple Beauty Advisors with is a frustrating experience for them and an inefficient one for us.

 

Phase 1 - Sketching

Low fidelity sketches after listening to user interviews and identifying key pain points

Phase 1 .png
 

Design Principles 

Based on the pain points shared in generative research 

  1. Streamline device strategy - no more one device for one digital experience only

  2. Create easy access to pertinent client information at Raquel's fingertips to supercharge her interactions with clients 

  3. Empower Raquel to manage her own schedule and get ahead of upcoming work 

  4. Make the Advisor Assistant experience map back to the real-world experience of what is already happening in the store; don't make Raquel change her workflow to conform to the app


Phase 2 - User Feedback

Higher-fidelity sketches to present to users and stakeholders to gather feedback

Phase 2 .png
Phase 2 .png
Phase 2 Learning.png
IMG_3204.JPG
IMG_3195.JPG

Design Decisions

Based on the feedback from Raquel & her colleagues during sketch reviews

  1. Offer all current digital experiences on all devices - and connect them together to streamline client experience and eliminate duplicative data entry

  2. Give Raquel visibility into her day - what is happening when, who is coming into the store, and who is working with each client

  3. Enable easy sharing of clients across Beauty Advisors - if Raquel needs to go on break, she can easily hand off her client to a colleague with no lost work


Phase 3 - Lo-Fi Wireframing

Low fidelity digital wireframes to gather more feedback from users and stakeholders

Phase 3 C.png
Phase 3 A.png
Phase 3 B.png

Phase 4 - Scope & Flows

Scope prioritization and fleshing out more detailed flows 

Screen Shot 2018-01-15 at 4.51.46 PM.png
IMG_3301-PANO.jpg

Phase 5 - Hi-Fi Wireframing

Higher fidelity mocks to show learnings from user research and key tech / stakeholder decisions

Phase 4.png
Phase 4 B.png
Phase 4 C.png

Phase 6 - UI Visual Design

In constant collaboration with Store Education, Field Leadership, and our users - we developed a new visual language

Cast App Hero.png

What's Next 

  • Launched Fall 2018; currently in a Sephora store near you!

  • Currently designing phase 2 updates which will launch Summer 2019