⮐ Back to Case Studies

Finding Fuel in the aftermath of a Hurricane

Client

Wright Express

Overview

Create a cutting edge, dynamic data driven, cross platform fuel finder app that pushes the capabilities of mobile

Impact

WEX Inc. Recognized by InformationWeek as a Top 500 Technology Innovator—WEX was recognized for “Octane,” the first fuel site locator mobile app to combine real-time fuel price data & text-to-speech capabilities to direct drivers to the lowest fuel prices in the area.

Step 1 // Proof of Concept

We started this project with a solid understanding of what was needed to meet our stakeholders needs. Take the example of a segment leading fuel finder app, and clone it with a dynamic data driven back end to inform fuel pricing and availability. We quickly mocked this up in BalsamIQ & validated usability, while the development team worked on building out the API connection.

Step 2 // Subject Matter Experts

We had a strategic advantage in that one of our founders (me) was a fleet delivery driver before entering tech. I didn’t think it was going to be very easy to navigate a map route, with a phone in hand, while driving. With this in mind, we took the mock up & tested it real time in as we drove. We quickly realized we needed to add some additional features to keep drivers eyes on the road. So we added a Text to Speech feature, and tested that.

note: This app was developed before the SDK was available to put driving directions directly into your apps. This was cutting edge stuff in 2011, before hands free laws were created. Man we have it good today.

Step 3 // Prototype & Test; Rinse & Repeat


We made a LOT of prototypes. Prototypes not just for the core functionality, but also for advertising, coupons & offers, & a fleet manager version. We spiked on walkie talkie functionality, gamification. There was a lot that didn’t make it into the app, and that’s a good thing.


This wireframe demonstrates the processes of saving a prefered search, selecting a location, & how to get turn by turn directions

Step 4 // High Fidelity Mocks


One of the most difficult challenges to overcome happened late in the process. The stakeholders were insistent on specific design patterns. So we built multiple iterations & tested those. What we ended up with worked, but also left room for improvement in future versions.

These mockups were used for usability testing different Interface layouts.
*"Octane became a critical resource for drivers during Hurricane Katrina relief efforts by providing real time information on fuel availability in storm ravaged areas."

Lessons Learned

This project was an exercise in Lean UX process. Both the product team & stakeholders would identify new assumptions on a regular basis. We learned early that we could quickly build out prototypes and spikes to test and validate these assumptions.