Discover User Problem

In Jun 2019, we interviewed 6 users (age 15 - 25, mix of gender) in person to understand user behaviors and first-time experience with Firework. We wanted to learn more about how users felt about our onboarding, and determine what problems they were encountering. 

User Interview Questions

Screening questions (15mins)
How old are you?
What social media do you use?
How often do you use social media? 
How much time do you spend consuming videos? 
What do you consume videos for? 
User testing questions (15 mins - 3O mins) 
Finish the onboarding. Speak your thoughts out loud. 
At first glance, what is the purpose of the app? 
I noticed you did… can you tell me why? 
What do you think about the way information is presented on X page? 
Overall, what’s your experience been with the onboarding? 
If you could change one thing about the onboarding, what would it be? Why? 

Key User Quotes

“I selected phone number because it was easiest.” 
“How could I skip it?”
“What are differences between 5 topics and 5 hashtags? The content looks overlapped”. 
“How could I revise the info for the previous step?”
“The onboarding looks a bit too long.”
“ 5 topics and 5 hashtags are a lot. I wish to have fewer selections.” 

User Journey Map and Empty Map

3 of our designers started by exploring the problem, creating empathy and journey maps together to get a better understanding of the experience.

User Problems

1. There were redundant steps and repetitive info in terms of picking 5 topics and 5 hashtags. 
2. Users were comfortable sharing information but did not want to overshare.
3. It was time consuming and painful for users to come up with a user name, fill in the email address, and pick 5 topics and 5 hashtags without a skip option.
4. Users could not go back and did not understand where to revise their information. 

Define the Direction

Product Strategies

Provide progressive profiling strategy and prioritize two requirements considering the impact: 
1. Reduce friction in account creation: combine step 4 (select categories) and step 5 (select hashtags) into one step.
2. Request only the most important and necessary information: enable auto complete in user name and get rid of email input.

Explore and Iterate

Based on product strategies, we came up with a new flow and two interactive prototypes, and tested them out with 12 target users through face-to-face user interviews and NPS scores. (Credit to Tia for the first solution)

User Testing

In-person User Feedback for S1
“Why do bubbles come in different sizes? I would like to click the big bubbles first.”
“If I have signed in with Google/Facebook, should my personal information be autofilled?“

NPS survey for S1
We had one people click 1 score for the first prototype. The NPS score was 17.

In-person User Feedback for S2
“Very brief and easy to understand.”
“I might not scroll all the way down the list."

NPS survey for S2
For prototype 2, the NPS score increased from 17 to 33 because it is smooth and short, and it is the most popular from the users’ perspectives.

Design Decision

We selected prototype 2 as the final prototype to iterate for the following reasons: 
- It is very brief and easy to understand for first-time users.
- Users love to see all hashtags sorted according to big topics fitting onto one page.
- It was feasible to launch on time.

UI Exploration

I explored three different layouts for the final step because there were different ways to present information, and each of them had pros and cons. We selected this highlighted option for the final layout because content team would be able to adjust the content without changing the design, which could save maintenance costs for the team.

Final Design Walkthrough

MVP Launched