GasBuddy : Search Along Route Case Study
My Role
UX/UI Design | UX Research | QA & Testing
Team
Me | Product Manager | | UX Researcher | Frontend Engineers | Backend Engineers
Timeline
3 Months
Overview
GasBuddy's mission is to make fuel savings easier and more accessible for everyone.
They've helped North American drivers save over $3 billion by providing real-time gas prices at 150,000+ stations, offering cashback rewards with brand partners, and the Pay with GasBuddy™ card, which gives discounts at nearly all US gas stations.
The Problem
In my time at GasBuddy, the number one most requested feature was users wanting the ability to search for gas along their route.
These requests came in the form of countless App Store reviews, survey feedback, customer support responses, and came up in just about every user interview.
GasBuddy could already display stations on a map, but the challenge was how do we show stations along a chosen route.
This feature seemed essential for finding gas, but our priority at the time was expanding our payment program and other roadmap features.
Presenting our research and user demand secured leadership buy-in to begin the process of the highly requested Search Along Route feature.
The screens above are what the GasBuddy app looked like before we implemented the search along route feature.
Design Process
We drew inspiration from Google Maps, Apple Maps, and Waze, which used our data to show stations but lacked the robustness and accuracy of GasBuddy's real-time user data.
Once we had analyzed competitor experiences, we began to think about how to include search along route within GasBuddy search for gas experience.
After sketching and brainstorming with the team, I created wireframes to visualize our proposed solution within the search for gas experience.
We needed a starting point and destination to display a map showing stations along the route, with filters for price, distance, amenities, and other station information to help users decide where to get gas.
After multiple rounds of presenting, gathering feedback, and obtaining approval on the wireframes, I integrated the new search along route components into the UI using our established design system, which I created and managed.
These screens were then put into working prototypes for usability testing and feedback from users.
How many stations should we display along the route, and how far off-route would users go to find gas?
Users prioritized gas price and distance from the route, seeking options close to their path and the best deals on gas.
In our findings, we struck a balance by initially showcasing the cheapest stations located just a few miles from the route.
We also decided what to display regarding other stations along the route when users adjusted their zoom level.
This feature incorporated the list format from the current gas station search, with sorting and filtering options based on price, distance, and other important station details.
Based on user insights, we opted to display distance from the route rather than time, as we lacked real-time traffic data, resulting in variable travel times but consistent distances.
I closely collaborated with engineers during the feature's development, conducting testing and QA as the search along route functionality was implemented into the experience.
We tested the new feature with users before its public release, then prepared for its launch.
Solutions & Results
As I mentioned earlier, the Search Along Route feature was the most requested during my tenure at GasBuddy. Did it live up to the users' expectations? Yes, but there's always going to be room for improvement.
We continued to test and iterate on this feature until I ultimately left GasBuddy for another opportunity. I learned a lot about maps and how data is displayed on them while working on this project. I gained valuable insights through user behaviors when searching for gas.
I integrated these insights to improve savings and ensure a positive GasBuddy experience that encourages users to return for their next fill-up.
I integrated these insights to improve savings and ensure a positive GasBuddy experience that encourages users to return for their next fill-up.