Reshape Mobile Shopping
🔨 Complete revamp of UO, Free People & Anthropologie’s e-commerce mobile apps
🎨 Led the UX design of core MVP features
🌟 All three apps successfully boosted iOS App Store ratings to 4.9 post launch
A New Era
Before 2017, URBN Digital and URBN Engineering departments used to support 3 separate mobile apps. Each consumer brand (UO, Anthropologie & Free People) was responsible for its own business requirements and design.
In order to innovate the best-in-class e-commerce products as a whole organization, we asked ourselves one question:
What if we could meet customer needs, business objectives and creative requirements with one centralized platform?
The iOS White Label project started in May 2017 as the complete revamp of URBN's mobile apps. Our goal is to unify all applications into a single code base that can be extended and configured by brand in order to improve time to market, reduce redundant code and solution designs while updating our customer experiences to more modern iOS conventions.
Information Architecture
My first challenge as the lead UX designer for this project was to define the information architecture. Each of our legacy apps had unique navigation pattern - UO had a side hamburger menu, Free People had a four-tab bottom nav, while Anthropologie's drawer menu was suffering from usability issues.
In order to maintain feature parity with the legacy apps, I conducted a site content audit across 3 brands. I was also able to pull analytics data from UO and Free People on the top traffic sections to help inform the navigation priority. While all brands shared similar e-commerce functionalities such as Browse and Shop, I noticed that each brand had a unique program (UO Rewards, FP Me and Anthropologie Registry) that needs to be highlighted for enhanced visibility.
After consulting with the mobile engineers, I landed on a five-tab bottom navigation structure. One of the five tabs would be fully dedicated to the brand program while the rest of the tabs would be unified with the White Label design. Shopping Bag lives on its own in the header bar as the critical conversion point, instead of being one of the bottom tabs.
UI Style Guide & Component Library
How might we maintain UX pattern consistency while offering unique brand configuration capability? My teammate Chelsea and I looked up to the Atomic Design Methodology to create our own UI Style Guide & Component Library for the White Label app.
Once the White Label Style Guide got finalized, each brand then assigned their own brand styles to this system with unique font, color and margin. This approach not only reduced the amount of time UI Designers spent on redlining design specs but also signigicantly improved the coding efficiency for the mobile engineers but also. No more overlapping or conflicting codes!
MVP Feature Design
I designed the following core areas of the White Label application:
Shop Path
Search & Scan
Sort & Filter
Shopping Cart
Wishlist
Store Locator
Account Settings
UO Rewards
My feature design process includes a few key steps. The goal is to provide visibility & upfront communication with stakeholders while nourishing a fast-paced, iterative and collaborative practice. Here is a case study of the Shopping Cart feature that I designed for the White Label app.
Kickoff: define business & product requirements with stakeholders
Exploration: gather qualitative and quantitative data to inform design direction
Iteration: workflows, sketches, wireframes
Requirement Finalization: high-fidelity mockups, prototypes
Release Prep: QA & UAT, brand UI Beta build
Performance Evaluation: monitor success/failure of design post launch
The Future
It was exciting to learn that all brands observed significant success after White Label applications launched.
UO customers described the White Label app as "Engaging", "Modern", "Easy to use" and "Unique" in the post-launch feedback survey. Anthropologie's App Store rating went up to 4.9 stars compared to 3.3 stars before. Free People saw around 44% of customers migrate onto White Label on the first day, and are converting at a rate of 2.7% - 41% higher than legacy app customers converting at 1.9%.
We are constantly working on post-MVP feature improvements based on this brand new White Label code base. Meanwhile you can check out the complete White Label experiences by downloading the UO, Anthropologie and Free People apps from the iOS App Store.