Style Inspo On-Boarding Experience

UI/UX Designer

 

CLIENT: Macy’s App

TEAM: Product Manager, Copywriter, UX Researcher, Designer

YEAR: Winter 2019

 

OVERVIEW

A brand new Style Inspo to position Macy’s as a fashion authority.

The Style Inspo transforms Macy’s digital platforms as a go-to-destination for inspiration and personalized discovery of styles, trends, and fashion - all in one cohesive experience.

THE CHALLENGE

How might we create a fun and engaging on-boarding experience that orient users to the style feature while collecting preferences to personalize their feed on the new style navigation in Macy’s App.

The on-boarding experience is to strike a balance between self-identified vs. inferred personas; strike the balance between cultivating curiosity vs. barrier to usage.

Style Inspo_hero img.jpg
 

DISCOVERY

Macy's target audiences are female age between 30-50 and most of them are fashionable spender and trendsetters. Fashion spender are looking for inspirations all the time to help them for better style!

The top drivers of loyalty for fashionable spenders are being a fashion authority and source of inspiration, providing personalization to help consumers easily find their personal style, offering a seamless online experience, and having high quality / breadth of assortment. (Source: McKinsey & Company Macy’s fashion spender research report, 2019.)

68% of fashionable spenders spend up to 2 hours a week learning about fashion trends
— McKinsey & Company Report
style_img5.png
 

MARKET STUDY

 
 
 

CURRENT APP PAIN POINTS

style_img8.png
 

COMPETITIVE ANALYSIS

We studied most of the existing on-boarding experience apps that is to collect user preferences in the market; below are the analysis:

Competitive – 1@3x.png
 

DESIGN PRINCIPLE

1. Simple and easy to use of UI.

2. Introduction to the multi-category selection.

3. Fun & engaging way to collect multi-dimensional preferences.

4. Establish the curation & personalization for the feed.

style_img10.png
 

USER JOURNEY MAP

Style Inspo is a fashion hub designed for fashion spender to engage, inspire and discover by the personalized feed. Inspiration is emotional, the design goal was clear at the start: The on-boarding experience should be inspirational and not forceful to our shoppers. The experience should guide the shoppers to think more about what they like/prefer and not forcing to provide information.

User Journey: style inspo@2x.png
 

DESIGN DEVELOPMENT

How might we:

  • Create an “emotional” on-boarding experience to attract shoppers wanting to provide more his/her preferences for a personalized dynamic feed?

  • Create a fun and engaging on-boarding experience to make shoppers know more about what they like/prefer?

  • Create an inspirational, fun to shop style platform that shoppers want to use everyday like Pinterest, Instagram and Facebook?

 
brainstorming.png
 

DESIGN EXPLORATIONS

1. UI CONCEPTS

A. Tap & Touch (grid selection system) vs. B. Interactive on-boarding experiences.

A. Through the competitive studies, there are many companies used the Tap & Touch Selection Style for the on-boarding experience. It is straight forward, simple to understand and easy to use system to collect user preferences. However, this method can get bored easily and high “skip” rate when the questions are not relevant or taking too long to finish.

B. Interactive is a concept to collect user preferences by engaging with simple and playful interactions selections. The goal is to be fun and attractive that users voluntarily want to engage.

 
concepts3x.png
 
Concept A@2x.png
 
 

2. PLACEMENT OPTIONS

We need to understand how best to collect style preferences from shoppers focusing on various placements before or during the style feed.​

We designed 3 different placement options for user testing:

1. Upfront - All on-boarding steps (2-5 questions) need to be completed before viewing the personalized endless feed.

2. Embedded - Only begin with a welcome message and immediately take shopper to the generic endless feed. The on-boarding questionaries are embedded in the feed.

3. Combination - Starting with a few high level on-boarding steps (1-3 simple questions) and take shopper to the personalized endless feed. More detailed questions based on the shopper’s first on-boarding preferences are embedded in the feed to get more accurate personalization.

Placement 1@2x.png
 

RAPID USER TESTING

Objectives

  • To understand the best Style on-boarding experience for Macy's app.

  • To evaluate if customers are willing to provide their own preferences prior to reaching the style feed.

  • To assess if/how customers respond to the content within the feed.

  • We want to understand user's threshold for on-boarding before they tap "skip”.

Research Questions

  • What type of information is most relevant to collect?

  • Where is the best place for this style customization to happen?

  • How best to collect customer style preferences? (Ex. Lifestyle: active, professional)

  • Which on-boarding direction is best for the style experience? Questions upfront or in the feed?

  • How long are people willing to take? What is too long? Is it fun? Worth the steps?

  • Are they receptive to information in the feed? (Ex. How to create a taste graph around that? Are certain modules better positioned either in the on-boarding or within the feed?)

User testing@2x.png
 

UXR FINDINGS

  • Move forward with the 3. Combined on-boarding approach.

  • Upfront – UI Concept A (tap & touch) to collect preferences broadly - what to show in the feed.    ​

  • Embedded – UI Concept B (interactive) to narrow focus within feed - how to refine with taste & direction.    ​

  • Re-assess the mixed feed presentation and consider more flexibility and user control into the experience.   

User testing result@3x.png
 

FINAL DESIGN

 
Final-design-flow@3x.jpg
 

PROJECT RESULTS & NEXT STEP

  • The Style Inspo on-boarding design and research was a successful first step in getting the project funded. We received up to 5-million USD for 2020. 

  • Verification that interactive design has higher user engagement. The fun experience can guide our shoppers to provide more insightful preferences to improve the personalization algorithm.

  • From this user study, we were able to prove the need for Style Inspiration Feed, especially for our target audience. Shoppers want to see new content and new suggestions. They want to be inspired and see multiple options when making their purchase. 

  • Next step: Focused research on the style feed – content types and presentation of multiple categories.

 
Timeline@3x.png
Variants@2x.png