Wayfinding at Lovepop
Discovery + Strategy + Taxonomy + Design + Testing
Overview
Overhauled the existing navigational structure & product taxonomy for better usability and SEO
Improved findability and discoverability of all products
Established filters on PLP to enhance usability, increase conversion, and dramatically benefit SEO
The Problem
Leadership had known for some time that Lovepop.com’s navigation likely needed an overhaul. Organic traffic was so low that the marketing spend on social media was unreasonably high, new product launches were getting little to no attention from users, and the loss of table-stakes features like filters was a known pain point.
Users can’t find Lovepop.com, and have no incentive to engage with the site once they find it.
Analysis of traffic on Lovepop.com shows that users rarely navigate away from their initial landing page.
Most users land on Lovepop.com through social media ads and rarely through organic search. This contradicts the research indicating a consumer desire for unique greeting cards.
Hypothesis
Lovepop.com fails to match its users’ intentions.
We hypothesized that both the high exit rates and low organic search traffic were due to an outdated product taxonomy and a poor wayfinding experience.
Users immersed in social media likely have lower motivation to convert than users whose current objective is to purchase unique gifts or cards.
Upon reaching Lovepop.com, motivated users are unable to find exactly what they are looking for. Both the search engine and taxonomy of the site were suspected to be poor. They cannot easily find a specific product or group of products to meet their intention, or they do not understand the full product offering available to them.
Proposal
Our solution had three main facets:
Improve SEO to meet the need of users actively searching for products Lovepop offers.
Improve users’ ability to navigate Lovepop.com to ensure they can easily find what they initially are searching for.
Enhance discoverability to ensure users are informed of Lovepop’s full product offering.
Discovery
Questions to answer
Before diving in to design work, I wanted to gather existing information to validate my hypothesis.
How do users navigate the site? Do they browse or search more?
Do users begin with one method and switch to the other?
Which product categories do users navigate to?
How does seasonality affect users’ wayfinding behavior?
How does page depth map to ATC rate (or exit rate)?
How do different devices impact the answers of all of the above?
Existing Data
Search v Browse
Unlike most major e-commerce sites, Lovepop.com users prefer browsing over searching. Knowing our search engine was poor, I suspected that users who began with search likely gave up and would try browsing. I found this to be true. Given that updating our search engine was too large an ask, we opted to focus on the Browse experience.
The majority of our users are on a mobile device. Knowing that Google’s SEO ranking focuses on mobile navigation, and knowing that Lovepop’s mobile navigation is not optimized,
Comparison showing that Browse is wildly more utilized—and successful—than Search.
Comparison of session engagement for Search vs Browse (nav links) by device. Users who engage with the navigation convert at a much higher rate than those who engage with search.
Testing the current site
To better understand our current users and the existing problems with wayfinding on the site, I conducted a series of usability tests through Usertesting.com for both desktop and mobile.
Tasks
Pretend that Mother’s Day is coming up. Find something to give a maternal figure in your life.
Goal: Evaluate wayfinding path of users searching during Loveop’s peak holiday, and when users are given free reign to decide on an item.
Pretend that you are attending your friend’s son’s Spiderman-themed birthday party. Find something to bring along with a gift to the party.
Goal: Evaluate wayfinding path when given something very specific.
Results
Taxonomy
The results of the usability test indicated some significant issues with the overall taxonomy of the site. Given the importance to both the user experience and SEO, addressing the hierarchical problems was an important first step in the process.
Card Sorting + Tree Testing
Two card sorting exercises were run to determine how users might organize all the product types (giving the L1 categories), as well as the Pop Culture products. I ran tree tests to validate the results, and determined
Design
Low Fidelity
Cross-functional sketching Sessions
I ran two “Crazy 8s” sketching sessions with members from the engineering, marketing, product, and brand teams, in order to generate lots of novel ideas from a diverse group of minds.
Conceptual Sketches
I combined the collaborative sketches with my discovery work to sketch out initial concepts and begin defining the scope of MVP and consider longer-term solutions for us to move towards. (My toddler added his contributions in pen and crayon.)
Mid-Fidelity
With the scope confined to updating the taxonomy with minimal UI changes and introducing filters, I converted my initial sketches into “snazzy” wireframes for feedback and testing. Our established design system allowed us to wireframe with existing components, lending a little bit of reality to the designs and making it easier for stakeholders to understand.
Navigation
Filters
Testing
The proposed changes involve two main components:
1. Updated navigation and taxonomy
2. Adding filters to the product grid page (PLP)
Changing the navigation posed a good deal of risk, given how visible and global an element it is, and given that the taxonomy still needed further testing. Therefore, we discussed the timeline for pursuing filters in time for a Q3 launch.
See the Figma prototype 🖇
(opens in new window)
High Fidelity Prototype
While the engineers began their investigative spikes, I continued to iterate on and validate my designs for filters.
The final usability test compared users’ success rates on similar questions to the current state usability test, as well as additional questions on their understanding of the UI.
Primary test case
The data showed that the more users browsed through the products, the more impressed and inspired they were to explore their options.
To capitalize on this, the filters only appear after the user begins scrolling. The usability test was structured to determine both the utility of the basic filter structure, but also to ensure that the hidden-until-scroll feature did not cause friction.
See the Framer prototype >
*Prototype is best viewed at mobile size or on a native mobile device
Test Results
Users rarely spoke about the filters themselves, but had no trouble using them. Only one user noticed that the filters were not immediately available before scrolling, and only after he was prompted with follow-up questions.
We suspect the design was so intuitive that users didn’t even think to talk about how they used the filters!
High fidelity filters prototype. Best viewed on a mobile device.
Next Steps
Engineering will continue to investigate the level of effort, and product will continue to collaborate with the SEO team to determine the best way to utilize the filters to improve SEO.