Trupanion / Enroll path
Summary
Redesigning the Enroll Path was a large project working on one of the most important pages on the website. I worked closely with the ECOMM team, which consisted of devs, marketing managers, product managers and other designers throughout the process. The pages went through a complete re-design and went through multiple rounds of usertesting, mostly moderated to help us nail it. The final designs were then delivered to an external dev agency for build.
THE COMPANY
Trupanion is…
B2C: Pet insurance provider for cats and dogs
B2B: Trademarked software for veterinarian offices to allow client to pay vet directly
THE USERS
Who are Trupanion customers?
72.3%
Gender (Female)
72.3% of our customer base identify as women
33-55
Age range
The top segemented age range is 34-44
CA
Top location
California was the top state followed by FL & MA
$100K+
Income level
60% of members make over $100,000 annually
WHAT IS THE DATA TELLING US?
The Problem
Pick a price page is a consistent drop-off point in the enrollment path.
WHY: We know we are expensive and have an opportunity to reduce the number of people dropping off at this point in the EP.
When users are landing on the Pick A Price page, the price is front and center of the page, rather than the value we are delivering.
We know that many users find our prices steep for what we cover, and we need to explain coverage and benefits better.
Users are immediately engaging with the Pick a Price tool and playing around with their pricing per month without understanding what is covered, plan details, etc.
Roughly 6.82% of users enroll across both mobile and desktop, with major drop off happening at step 2 (100% to 26.2%).
HYPOTHESIS
STEP 1: WHAT ARE BLOCKERS?
Pain point discovery
Unintuitive progress bar
Blocks users from freely navigating and understand where they are in the journey.
Different plans
Users thought the different pricing options were different plans.
What am I getting?
Users expected to see coverage & product information on this page so they could make a decision on price.
Not a mobile-first design
Over 70% of our users were coming from a mobile device and the page was not optimized for that.
STEP 2: DEFINING GENERAL FUNCTIONALITY & LOOK/FEEL
Beginning iterations
At the project's onset, we inherited raw, unvetted designs from an external agency. Our team took on the challenge of refining, testing, iterating, and refining again from that point forward. We embarked on a journey of experimentation, exploring various components and observing user interactions. Our primary goal was to grasp the information and usability expectations users had for the page.
Users liked having 3 “pre-set” options
Users kept thinking these were different plans, rather than different price points
Users still did not understand the value or the “what” of the product
Users still wanted to have the option and flexibility of the custom price feature
STEP 3: COMMUNICATE THE “WHAT”
Educating & unblocking the user
As we commenced user testing, a recurring pattern emerged: users consistently mistook the various buttons for distinct plans rather than price points. Additionally, we noticed that users tended to spend minimal time exploring coverage information on the website, often swiftly transitioning to the enrollment path. Consequently, we recognized the imperative for the "Pick a Price" page to serve dual roles, not only facilitating price selection but also providing comprehensive coverage information.
Giving the user a clear overview of plan attributes
Seeing real-life reviews built trust
Users thought this view was less overwhelming, rather than having the plan attributes side-by-side with the price
Users didn’t trust this #1 banner- wanted to see real reviews from real people
The core of our product is our coverage and that information needed to be front & center + pulled closer to the fold
Many users skimmed over these val pop icon cards
Tried different application for radio buttons - users still thought the options were different plans
STEP 4: PLACE VALUE OVER PRICE
Switching up the hierarchy
The final design was a fusion of the two below concepts. We opted to utilize a slider exclusively for the "pick a price" component, effectively preventing users from conflating price points with distinct plans. Furthermore, recognizing our product's premium quality and corresponding higher price point, the page underwent a transformation, shifting its focus from the monetary aspect to highlighting the value proposition, emphasizing what users would receive rather than what they would pay.
Making the icons stack in a horizontal list made the content more digestible. Users engaged with this view considerably more in testing.
Still wasn’t clear where the user was in the journey with the minimalistic progress bar
Users preferred having the slider be directly on the page, rather than a modal/extra step. Users also found the plan details module useful.
We brought the bill example directly to the page so users could see how the values would change in real-time as they were adjusting the slider
Having review messaging directly on the page since most users overwhelmingly liked seeing them
Coverage became the focus of the page - not the price.
FINAL PRODUCT
From “Pick a Price” to “Plan Details”
Interactable progress bar with clear steps
Clear and easy to see “Add a Pet” module bar at the top of the page to add more pets to your plan
Adding taxes & fees language to be more transparent and not cause sticker shock on next page
On mobile, bill example is collapsible/expandable so user can easily navigate to coverage information
User testing
User feedback is everything
At each stage of the iteration, we showed the design to 3-6 users and based our iterations from their feedback. The product manager and design manager would run the moderated test, and I would also ask additional questions/support.
User testing was important because there was so much misconceptions/confusion about pet insurance that was blocking the user to purchase. Speaking directly to folks helped us understand what the missing links were.
“I’m a sucker for reviews. So seeing it right here with your four a half star rating with over 4,000 reviews is very impressive.”
“I liked with the last design that you could do it all on one screen and see the changes without the extra steps.”
Reflections
Future thoughts
This project stands out as a pivotal learning experience in my portfolio. It provided me with invaluable insights into the significance of rapid iteration driven by user feedback. Moreover, I spearheaded a comprehensive redesign of the enrollment process, overseeing its development from inception to execution, and facilitating a seamless handoff to both the engineering team and external agency for implementation. Subsequently, I meticulously conducted quality assurance testing to ensure a flawless final product.
