GapFit Navigation Update
UX / Web Design
Project Overview
Role: UX research, testing, prototyping
​
Team: Gap Online Leadership, Content Management, UX, Consumer Insights, WCD
​
Duration: Jan—Mar, 2019
GapFit is an affordable athletic-wear line from Gap, distinct from Athleta, another Gap Inc brand. However, engagement levels are low, significantly impacting the business.
Objective: Boost engagement by enhancing the usability of gap.com’s main navigation to increase conversion rates.
Challenge
The Gap website attracts over a million daily visits, making essential for business. Data indicated that the GapFit tab had nearly zero engagement. We aimed to implement a significant change to enhance engagement and conversion without disrupting the mobile shopping experience. First, we needed to identify the reasons for the low engagement.
Research
First, we wanted to learn about the key words people were searching for when shopping for exercise apparel so we set up a survey to retrieve this information. Our target audience was 100% female due to GapFit being a women’s only brand.
Activewear was the most used word to search workout clothes amongst the group of ladies we surveyed.
Familiarity
Next, we wanted to know how familiar customers were with the GapFit brand so we surveyed two groups: People that have shopped at Gap before and people who have not.
Previous Gap Shoppers
1 in 3 are familiar with GapFit
New Gap Shoppers
1 in 15 know what GapFit is
Total of Shoppers
Of people surveyed are
familiar/know what Gapfit is
Oh yeah, isn’t GapFit like a FitBit but with bands made by the Gap?
-Emily, Connecticut
These were two of the most notable quotes received in our user interviews during the research phase that pointed out the lack of brand knowledge both of our previous and new customers have.
So if...
Engagement & conversion is down
SEO is not suited
for GapFit
Majority of shoppers
don’t know GapFit
Does GapFit have to live in the main navigation?
Key points to keep in
mind were:
1. Data shows that over 50% of our audience is female.
​
2. The “Women’s” category is the most clicked part of our navigation
​
​3. Most conversion comes from the sub-categories in Women’s
Based on the data we had gathered, it made the most sense to remove GapFit from the main navigation and place its content in the Women’s category.
User Flows
The idea was to run two A/B tests to then run a final A/B test between the journeys that were chosen from the initial rounds to cover all bases before making a final business decision.
A/B Test 1
We set up user interviews with customers from all around the country and ages ranging from between 17-40 years old to test the prototypes I built. First, with A/B test 1 from the user flow above.
​
Here we learned that the word Active was favored vs GapFit but that less scrolling would be beneficial to the overall experience.
JOURNEY A
The word Active caught
testers’ attention quick
​
Easy to know where to find the right product
​
Neatly spread out
​
Too much scrolling
A bit confusing compared to other categories
JOURNEY B
Many testers skipped over GapFit
​
It was confusing as to what GapFit means
​
Some asked “why don’t
these just live within their respective categories?”
​
Too much scrolling
A/B Test 2
In this second test we learned that by keeping the GapFit products in its own category under the Activewear title, it was easiest to find because the users knew what to expect from this tab. This was the strongest performer out of all four journeys we tested.
JOURNEY B
JOURNEY A
JOURNEY A
Activewear stood out immediately very clearly
​
While in this subcategory, users knew that this product is for working out
​
Neatly organized
​
Clearly labeled
​
User friendly
JOURNEY B
Neatly organized
​
Some testers still skipped over GapFit
​
It was still confusing as to what GapFit means
​
Once in the subcategory, “active tops” was the only clear indication that this is an activewear section
Final Deliverables
We ended up running the two top performing prototypes with journey 2A (Activewear Subcategory) being the preferred flow by 100% votes.
Finally, we integrated our learnings into desktop and showed improvement made from the former experience.
New Nav Look & Feel
The Activewear subcategory’s final look that is live on the Gap website for both desktop and mobile. To see the live result, please visit gap.com and explore for yourself!
Insights & Results
In the first four weeks after this update, we saw engagement slowly grow and remain steady.
This is the lift in conversion that we saw in the same four week period.
In retail, these small percentages make big differences to our quarterly results. This positive return continued to grow over time which lead to GapFit merchandise gain more demand compared to recent years.
Learnings & Takeaways
In this project, I discovered the importance of large-scale testing. To gain stakeholder support for new ideas data is crucial, especially in a large corporation like Gap. Fortunately, our results confirmed our ideas, leading to positive changes. I also realized that impactful business changes can come from small adjustments rather than complete overhauls, simplifying the approach to achieving significant results.
*Due to NDA made with Gap Inc, I cannot provide exact numbers in data in regard to the research, business gain/loss, and or results that may still be ongoing.