CloudTrucks is working with Roady’s to integrate their discounted fuel API to provide truck drivers with more affordable fuel. In this project, we designed an in-app fuel reservation feature which allows drivers to look for discounted fuel in the fuel map and reserve fuel in advance. It has helped divers get more than 52k gallons of discounted fuel. The latest design launch also saw a 351% increase in fuel reservation.
Fuel purchase is the biggest expense for truck drivers. In order to provide truck drivers with more affordable fuel, CloudTrucks is working with Roady’s - a brand of independent truck stops who offers significant discounts via its API program.
We want to create an in-app discount program to help drivers save more on fuel using the CT Cash card or Credit card. Meanwhile, generate revenue from driver purchasing fuel through CloudTrucks.
We learned more about the fuel reservation flow from meetings with Roady’s.
And in order to understand the problem better and define more design opportunities, we uncovered insights from interviewing drivers and talking with ops team. We found out:
• Drivers are not aware that we are offering different types of discounts in app already.
• Distance is more important than discounts. Drivers are not likely to make detour for a discounted price.
• Real-time accuracy of pricing and parking availability are crucial app features.
1. How might we improve the discoverability of discount program?
2. How might we clearly deliver the information that drivers need to easily select a discount truck stop to make a reservation
Firstly, me and my design manager had a brainstorming session. We sketched out some ideas and roughly came up with a user flow for the core in-app fuel reservation user experience. Then we worked with the product team to determine a road map for the discount program.
Decision between a map view or a list view to display discount truck stops was our first priority. Despite more engineering work, we decided to implement a map to display all the discount locations.
We went through a few rounds of tests and iterations. Here are some of the highlights.
The existing fuel discount entry point is under the Cash tab. Despite some concerns on discoverability, with limited time and engineering resource, we decided to ship V1 with minimal design change and monitor metrics at the same time. In V2 we made a quick update by adding fuel discount on the home page, hoping this will improve the discoverability.
However, with unsatisfying test results from V1 and V2, we decided to add another entry point to fuel discount on the Job Detail page.
How to deliver a clear visual presentation of discount information and smooth map interactions was also a big focus in the iteration process. I worked closely with mobile engineers to design the map experience.
We also did stress tests on different map designs, trying to find out the one that works the best in different map scales with different background colors and various amount of location labels.
Then we tested on different location pin designs.
This project went through 3 launches with testing and iterations, here are some of the highlights of the latest launch in 2024.
When pins are close to each other, we cluster them and display the amount of pins in the cluster. This smoothens the interactions by reducing map loading time while clearly tells users the amount of discounts in a certain area.
In our version 3, we launched Fuel Discounts on Routes, which gave users a new discount entry point, where they can see all the discount location in their trips, so that they can avoid detours in order to get cheaper fuel.
Users can make a reservation immediately or view more details and then decide.
Since the latest design shipped in November 2024, we saw there is an 215% increase in users checking the discount program map. And fuel reservation volume increased 351%. In total, drivers have reserved more than 52k gallons of discounted fuel through the mobile app.
From testings and researches, we learned that trust and reliability, both in service and financial transactions, are key drivers in building and maintaining long-term customer loyalty. Our next steps will focus on these parts while we bring more discount partners into the program.
