
The North Face Mobile App
ROLE
UX team manager
DEVICES
iOS (iPhone + iPad), Android (phone + tablet)
TEAM
3 mobile UX designers
PROJECT DURATION
4 years
Overview
The North Face app provides customers and brand loyalists with the ability to shop and earn points to use toward purchases in the form of reward vouchers, all from their mobile device.
VF had a mobile app-specific design and development team responsible for the evolution and maintenance of The North Face’s app.
The challenge
When VF brought The North Face's app in-house from a third-party vendor, there were considerable issues with the UI and the user experience was confusing. After conducting a heuristic evaluation, the major issues identified were:
No design system or componetization of elements with over 40 typographic styles
Violations of accessibility compliance
Dated UI was not aligned with current art direction on website
Majority of e-commerce screens were web views, slowing down performance
Significant checkout friction
Micro tap targets
Lack of clarity around loyalty perks and program rules (+ notable drop off metrics during registration)
An excess of dead code
Unclear branding of app, originally named by their loyalty program “VIPeak”, not “The North Face”
The goals
Clean up the UI
Adhere to iOS and Material guides
Reduce unnecessary steps for basic tasks
Clearly brand the app as The North Face app
Bridge the loyalty and commerce experience
The approach
The app needed a full re-design and standardization of elements to align with mobile best practices. After hiring a team of 3 designers, we started by creating a fully-functioning design system with reusable and scalable components. A re-work of the app architecture allowed us to decrease the overall screen count and amount of steps to complete common commerce tasks. We ensured existing users flows and new features went through user testing, some requiring significant iterations and research.
NEW UI
Mobile features executed:
Authentication with biometric capabilities
Simplified loyalty registration
Geo-fenced check-in
Comprehensive loyalty dashboard, promoting available rewards and earning opportunities
CMS-driven marketing modules
Native Shop screens (removal of web views)
Enhanced user account
In-app messaging
Push notifications
App exclusives
The results
After implementing the above changes, the app was modernized and frictionless. It became a favored tool in the omni-channel brand experience.
Accomplishments to date:
Mobile app revenue over quadrupled from $4M to $18M/yr in a 2-year period.
App Store ratings increased by .5 stars year-over-year across both iOS and Android