BEAUTYCOUNTER
The Beautycounter App
Background
Beautycounter is an omnichannel clean beauty company based in Santa Monica, California
Company sells through the following channels: ecommerce website, retail locations, and direct sale ‘Consultant’ network (which consisted of over 90% of transactions and 45,000+ Consultants in early 2019)
When I joined in early 2019, existing iOS app was available to download for Consultants only and included a limited amount of Behind the Counter (BTC) features
Behind the Counter - the CRM that powered the Consultant network was desktop only, and extremely dated. When I joined, a re-platforming was about to start for desktop application, but no thought had been given to the potential that an iOS application might have on the user base.
Product Goals
Bring newly re-platformed Consultant dashboard and customer relationship manager Behind the Counter (BTC) into the app so that consultants can manage their businesses on the go
Thinking mobile first, how can we take into consideration some of the complexities of BTC and create a simplified experience that is optimized for mobile paradigm
How can we also expand this experience to non-consultant shoppers and create an experience that folds in our mission and values
Primary Challenges & Considerations
Diversity of user types and ways that they would utilize the platform
Limited resources
Inheriting and managing multiple design systems
Team Composition
I managed three Designers - two product designers focused on different verticals and one user researcher
I was the individual contributor and ‘owner’ of the Behind the Counter iOS app design. Another product designer on my team ‘owned’ the ‘Behind the Counter’ web application - our primary CRM platform. Another ‘owned’ our e-commerce platform and our design system.
We also had a dedicated user researcher that helped with user testing analysis.
Small, but agile iOS development team of 3 for the iOS app.
Existing Interfaces
iOS Application Existing
Behind the Counter - Re-platformed Desktop Application
Vision & Process
My Goals for the Consultant App
Reach parity with BTC web in regards to features, but re-evaluate how Consultants are using various BTC modules and make sure what we are designing is optimal for the context of mobile
Develop a navigational structure that is simplified and easy to understand, but also scaleable for future BTC additions. Ensure BTC modules are 1-2 taps away at all times
Design an adaptive experience that takes into account the 5+ types of Consultant and their diverse set of needs when it comes to running their businesses
Make sure app follows all accessibility guidelines since 1 in 7 people have a disability or impairment
Incorporate elements of play and delight while enabling in Beautycounter’s unique voice and mission across all touchpoints
My Plan
Test existing interface prior to designing navigational concepts
Test navigational concepts while garnering feedback on current Consultant usage of the app
Once core navigational structure has been designed, move onto BTC modules in an order that makes sense based on mobile usage patterns
Continue to user test and survey
Update shopping experience overtime to make sure it is parity with web experience
Develop set of metrics to continue to monitor post-launch
Proto Personas
Existing App Data
29k downloads (as of April 2019)
AOV $119
8,400 MAU
Average rating of 3.2 Stars on Apple App Store
Access to Mixpanel Dashboards and ability to survey in app
More Process
Communicating Design Details - Low Fidelity Sketches
Communicating Design Details - Wireflows
Communicating Design Details - Annotated Wires
Feedback from Initial User Interviews
Spoke with 12 Consultants - Made sure that all levels were represented in user group
All interviewees had used app, but many did not consider themselves as ‘active’ app users
Tools, which was one of the only BTC features included in the app at the time, did not have content of which was easy to share on social media outlets - main outlets included Instagram, Facebook, iPhone Messages App, Twitter
Needed more BTC features in order to effectively manage their businesses on the go
Downline report
Consumer App
Compiled this data with that of results from testing additional platforms (mostly BTC) as well
Redesigning Core Navigation
Process - Preliminary sketches exploring navigation options
Process - Initial Wires for Testing
Testing Navigation Concepts
User Interviews
Moderated discussions were focused on self reported feedback on existing app features. Goal was to understand general attitudes (needs, motivations, wants, desires) about the Beautycounter iOS application. Spoke with 15 Consultants.
Direct Observation
Provided a first hand understanding of user processes as it relates to an updated navigation concepts and PDP design within the app. Observation made through Lookback program which allowed me to view their screen as they navigated on the prototype.
Recorded sessions and organized responses in Excel
Major Pain Points
Unsure how to share products and social media assets
Lack of motivational content
Some of navigational concepts were difficult to master and not ‘user friendly’
Desired Ability To
Easily reference their current level
See Alerts
See/share client order information and updates
Share links to products with PWS attr’b
Share social media assets
Clear notifications
Search ingredients
Gamified experience like Start Counting
Navigation Winner & Final UI
More Solutions
Elements of Delight
Results Of The Redesign
Data Summary
AOV increased to $152 (was $119)
+18,000 MAU (was 8400)
Average rating of 4.9 stars in App Store (was 3.2)
Ease of navigability increased to ‘Very Easy’ according to survey data
Consultants started using BTC more in-app than on desktop