Shara Designs

BeautyBook

IOS MOBILE APP

| ROLE

UX/UI Designer

UX Researcher


| DURATION

10 Weeks

| TEAM

  • Leah Idris
  • Madeline Packard
  • Raven Lankford

| TOOLS

InVision

Miro

Trello

Adobe XD

OVERVIEW

BeautyBook helps consumers who want to be acknowledged for their product endorsements by rewarding their participation in an authentic beauty community.

THE PROBLEM

How might we reward consumers for their authentic product recommendations?


Often times, beauty products are recommended by word-of-mouth through personal contacts. Consumers seeking an authentic recommendation may conduct research, weigh the initial recommendation, and make their purchase or opt for a different solution and earn rewards for their purchase. Meanwhile, those making recommendations to go unrewarded for their vote of confidence.

PROCESS

Research | Define | Design | Validate


We initiated the project by outlining the creating the project brief and research plan. We asked ourselves what the product should look like, what value will it bring to consumers, what problems could it solve before moving into the research, define, design, and validate stages.


My Role

While I actively participated in each phase of the project, I led the research effort and guided the UI design. The team had a wide-range of skills to offer thus allowing each person to assume the lead role when appropriate.

THE SOLUTION

A platform that creates a curated experience for beauty enthusiasts where they can recommend & share products, review, and earn points to use towards exclusive rewards.

KEY FEATURES

Personalized Profile Creation

Whether the user wants to select each product staple or just jump to the shopping experience, they can choose how much or how little they want to tailor their experience in 4 steps. 

Rewarding Reviewers

When a user reviews a product, they receive a sharable endorsement code that when used, earns them points for future redemption.

Rewarding Made for Sharing

Keep them or share the wealth, it’s up to the user. Have multiple rewards? Share with others and keep one. The user has full control.

DISCOVERY

PRIMARY RESEARCH

We surveyed 22 individuals ages 18 to 55 both male and female about their habits as beauty product consumers. We established research goals early on to ensure we identified and solved the right problem for our users. We sought to understand:


  • - beauty product consumer habits
  • - how consumers research products to purchase
  • - pain points surrounding receiving & giving recommendations
  • - factors that aid in their buying decisions

Stats for Beauty Retailer reward program participants

 reflect 11 of 22 surveyed participants

MARKET OVERVIEW

We examined Emma, LIKEtoKNOWit, IPSY, Brandefy and MiaMia, all known apps in the beauty eCommerce space. In a saturated market, we wanted to identify an opportunity to fill a specific void. Many apps we reviewed were similar however, they were lacking rewards or only included rewards in the traditional sense.

KEY INSIGHTS

ONBOARDING FATIGUE

Onboarding for several of these apps had nearly 11 steps resulting in fatigue and negative experiences.


CANNED CONTENT

Some apps didn’t integrate curated content based on the user’s interests.


  • LACK OF REWARDS
  • No clear rewards programs or rewards for users recommending products.


DEFINING THE APP

We set out to understand what our users felt, thought and believed during their shopping experiences based on the data obtained during the research phase. The team developed an empathy map and persona to help us identify pain points and potential opportunities.

User Empath Map

Sarah Salazar – BeautyBook Primary Persona

MAPPING THE CUSTOMER JOURNEY

As a team, we examined the traditional purchase sequence to review the buying process for in-store shoppers. We used what we learned to understand the parallels between an online & traditional in-store experience as 77.3% of our surveyed participants stated they prefer in-person shopping. Mapping the customer journey outlined the process these users went through to complete the task of purchasing a beauty, skincare or hair product.




As a result, we developed 17 ‘How Might We' statements and proceeded with the design phase.


‘HOW MIGHT WE’:

  • • make the experience of researching products exciting and intuitive?
  • • help users save time and trust making online beauty purchases?
  • • encourage users to use their recently purchased products?
  • • simplify the review process but still get informative feedback?

OPPORTUNITIES TO STAND OUT

  • CONTENT CURATION
  • Create a custom app experience through curated content

  • PRODUCT RESEARCH & RETAIL

Establish a platform where beauty consumers can research and purchase products


  • REWARD USER ENGAGEMENT
  • Award users for making recommendations that result in purchases

  • SHARING THE WEALTH
  • Allow users to share their rewards with their friends or keep for themselves

DESIGNING THE EXPERIENCE

We initiated the design process with product definition and feature ideation. The team used the foundation set by research insights and identified five epics. We proceeded to created multiple user stories to inform the product features.


Developing these epics and user stories helped us define the experience the team sought to create.

WORKFLOWS

After ideating product features with epics and user stories, we used the outcomes to inform the workflow for first-time and return users. We took this approach to further design the experience and identify gaps & overlaps.


On the first iteration of the functional group workflows we discovered several overlaps in the first time user flow. We realized the product search, review, redeem and workflows weren’t applicable to the first time user:


  • Product Search
  • Because of the commitment the user makes to curate their app content, they should be encouraged to shop the curated content from the Beauty Library, not search all products.


Review & Redeem

Both of these functional groups take place post product purchase and we recognized that these workflows were specific to return users. Therefore, we moved the review and redeem functional groups belonged in the beginning of the return user sequence.


DESIGN STUDIOS

We knew we wanted to conduct a design studio for the Beauty Library & Rewards functional groups. This exercise generated necessary conversations around how we would approach our interactions and potential navigation solutions. It also pushed us to revisit the HMW statements and consider how we might innovate. 


Themes we identified during the design studio:


Community/Purchase/Rewards: We believed these functions should have high visibility to inform the users of what’s possible with the application


Personable UI: Giving ownership to the user through thoughtful copy and infusing personality Create an elegant & intuitive pattern for the layout


Interactions: The design studio helped us take an aligned approach across functional groups for consistent interactivity


Remote Design Studio using Invision

Sampling of Design Studio Sketches

FINAL

DESIGN

Visually, we aimed to achieve a high-end, sophisticated appeal. Warm skin tones served as inspiration for the color palette. We wanted to avoid overtly feminine colors in an effort to be inclusive. During the design of the UI we discovered accessibility issues with the contrast of the palette with Adobe XD's Stark Plugin and made modifications using strokes and shadows to add depth.

VALIDATING THE DESIGN

USABILITY TESTING

We’ve done the work but we needed to know how it would function in the hands of our users. We established user and testing goals before creating multiple test scenarios.


Usability Testing Goals:

  • - Validate usability of reward redemption
  • - Ease of navigation (user profile creation, multiple steps, etc. (user fatigue?)
  • - Usability of app navigation and hamburger menu
  • - Testing shopping cart navigation and functionality

Our limited timeframe required us to prioritize the review and redeem functional groups for testing. Over the course of three days, we asked 8 testers to navigate through the prioritized workflows.

FEEDBACK

Overall, our testers provided positive feedback.


“Chic and minimalistic”

“I didn’t have to think too much”

“I like how I can see how much I’m saving on each reward”

“Easy to navigate”


While enthusiastic about the responses, there were a handful of usability issues we needed to address. 

Our app’s System Usability Scale (SUS) Score wasn’t reliable as the test performs best with a higher number of participants.

The team uncovered some moderate and severe usability

issues during the testing phase. 

The rewards user flow had a several issues ranging in severity.

Plotting the usability issues on a problem matrix allowed the team to get a comprehensive look at the challenges our users faced. The severity range for the top 3 usability issues were moderate to severe. The top three usability hurdles occurred within the first scenario. Users experienced:


- confusion with the step indicator on the review product screens

- confusion caused when sending endorsement code – within the app

- had a missed opportunity to close out & explore the final screen


Each participant’s usability issues were applied to a problem matrix, providing clarity on next steps.This is a little description underneath your image.

NEXT STEPS

We would like to incorporate the feedback received during usability testing into a new prototype:


  • - address high-level cosmetic changes
  • - revisit the user instructions for the review workflow
  • - build out dynamic search function from feature list