About the company
Conceptualized as “Amazon for fuel”, Fuel Easy is an e-commerce startup that is reinventing diesel distribution to move towards a carbon-neutral future. They enable seamless B2B diesel distribution service within Mumbai. I worked with Fuel Easy to digitize an offline ecosystem, streamlining the booking process, from order to delivery.
Background
The conventional procurement process of diesel leads to wastage and environmental damage due to pollution and spillages. Not to forget the time, manpower, and money spent on large-scale storage and handling costs.
Outcome
We fixed three key pain points faced by the consumer - ordering diesel, the guarantee of received quantity, and anxiety around fluctuating diesel rates.
My Role
-
Designed the end-to-end product experience
-
Brought clarity and structure to the product design process by facilitating workshops
-
Advocate, and educate executives about user experience design
My Role
Lead UX Designer - discovery, design strategy, user research, stakeholder alignment, information architecture, design QA & testing.
Team
Team of 1 Ui designer (design system), 1 founder, 1 business development head, 1 front and backend developer
Timeline
1.5 month | Mar 2023
Client
How does the service work?
Place an order, manage and track delivery all on the Fuel Easy app
Approach
The executives had done their research and concluded they wanted to create an MVP to enable online fuel ordering. It was challenging to know where to start, so we followed the Double Diamond mental model.
Our strategy was to first understand the business goals, company's vision, and user pain points and motivations before heading into design - our team worked in a highly collaborative, agile environment and under a very ambitious timeline.
Product Discovery
To understand the product from the business perspective, we hosted 2 hours long brainstorming sessions. We asked questions like-
-
What are the business goals?
-
What’s the advantage of this product?
-
Who is the primary and secondary user?
-
Who are the stakeholders who would use this app?
Key Findings
Business Goals: Improve market share, customer conversion & customer satisfaction
Competitive advantage: First-to-market, real-time pricing, live-order tracking
Users: Procurement managers / Site managers / Company representatives
Other stakeholders: Site workers, driver
Scope
We recognized that the app serves two distinct user groups: customers and delivery agents. However, for the scope of this project, our primary focus was on the customer-facing aspect
Customer Research
Conducting the workshop and product discovery helped us get the context of the product from the business perspective, we wanted to understand the user’s perspective and bring the user’s insights to the product development. Due to time constraints, I conducted 5 user interviews and built a persona because it gave me a clearer visualization of who I was designing for.
Omkar Joshi
Procurement Manager, 35yr old, ABC Mining
User Story
Omkar is a Procurement Manager at ABC Mining which operates in a remote location where fuel delivery services are limited. He is in charge of arranging fuel to power their equipment, vehicles, and temporary facilities. Currently, they manage their fuel supply by transporting it from the nearest petrol pump. Recent delays in delivery have led to project delays, causing them to stockpile fuel on-site.
Goals
-
Ensure operational efficiency by eliminating delays in fuel supply.
-
Spend less time and effort in fuel procurement
Motivation
-
Convenience, reliability, and transparency - willing to pay a premium for timely delivery
Pain points
-
Spillage, theft and delays cause operational disruption and financial loss
-
Limited options for fuel delivery services in remote areas.
-
No transparency and accountability in fuel transactions.
Identified journey pain points
-
Lack of transparency
-
Difficulty in scheduling
-
Uncertainty about delivery
MVP Goals
How can we enable a seamless online fuel ordering experience for customers by prioritizing trust and transparency, thereby increasing conversions and the number of bookings?
What
How
Why
Design Theme & Implications
Fuel Easy being a first mover in this space, I had to think laterally, looking at indirect competitor’s (Uber, Amazon) booking flow to better understand how these apps were building customer’s trust and streamlining checkout. I categorized my overall findings into themes
Filtering down the features
To clarify the app's focal points we facilitated a design thinking workshop involving developers and business stakeholders. Utilizing the MoSCoW method, we defined the scope for the initial version, considering budget constraints, timeline, and business objectives. This approach proved invaluable in visualizing and categorizing the app's features effectively.
Design Process
Once I had the architecture figured out, I started wireframing. I detailed all the screens involved in the end-to-end flow. At various points during the process, I would show my team the designs I was most confident about, get their feedback, conduct guerilla tests, and then go back to flesh out another iteration based on what didn't work. In the end, every single detail was laid out, and I felt as if I was trying to assemble all these important puzzle pieces before a concrete picture started forming. After going through 4+ product iterations we designed the following flows.
Final Design
Perfecting the ordering experience
1. Placing an order
To ensure that we provide our end users with a seamless experience, we looked at designing a leaner flow that reassures them, step-by-step, that they can trust the product. It focuses on the needs of the more dependent users and makes the process of ordering online streamlined by eliminating complex decision-making.
2. Scheduling delivery
3. Order tracking
4. Booking summary
5. Preventative Dialogs
Testing + Improvement
3 major improvements in the design
Based on various feedback from stakeholders. I iterated my design with 3 major improvements
Dynamic calculator
This was an important step in booking, Based on user feedback while testing, we had to make the selection process quicker. Greater control for users to input quantity or price means there are no price discrepancies.
Strengths
Users can see price and quantity in context clearly
Limitations
Requires more implementation effort when compared to V1
Location selection
The decision was taken to pre-select the address for returning users, instead of asking them to fill it in every time. Users are taken directly to the time-slot screen, skipping the intermediate screen.
Strengths
-
The location capture field does not obstruct the map, allowing for a broader and clearer view.
-
Consistent terminology - The term 'Your Location' was replaced with 'Location' to ensure uniformity and avoid potential confusion, as some customers may not necessarily order items to their current address.
Limitations
Additional step to change address
Checkout
To improve our checkout time we ran a small unmoderated AB test with the UX , we noticed participants spending the most time on the payment detail page. Version 1 emphasized pricing, while Version 2 prioritized location and slot booking. We saw faster navigation by approx 15 sec, with faster scroll and scan on V2
Design Retrospective
While the app is still undergoing development, it has already served as a valuable marketing tool for Fuel Easy's sales team and founders during partnership pitches.
Once the app is launched, some of the metrics that I would track to determine the design success are -
1. User engagement metrics-
-
Daily, weekly, and monthly active users (DAU, WAU, MAU) to assess consistent user interaction over time.
2. Navigation
-
Session duration and monitor the number of screens viewed per session (to understand where users are dropping off before completing checkout)
3. Conversion metrics -
-
Measure the percentage of users who complete desired actions (e.g., placing an order)
-
Average order value (provide insights into the spending behavior of users)
-
The volume of orders placed through the app (reflects the overall transactional activity and business performance)
Link to my Figma file here
Project Learnings
Through service discovery, and user and business research we designed an end-to-end customer-facing product experience for Fuel Easy to provide a seamless booking experience for the customers. Working fully through this project taught me the importance of trying to think intentionally about every element of the product and how it can contribute to the result.
Be prepared to advocate for design
Working in a startup can be challenging especially the ambiguity throughout the process, we can clarify ambiguity by asking good questions. In meetings and sprints, I learnt to articulate the value of my work.
Design is teamwork
Working with cross disciplinary teams helped me understand the need to understand the various product partner to define the design direction
Don’t overpromise and underdeliver
I learned how to define a true MVP vs something that is simply not usable and therefore not shippable. Rapid iteration is crucial for adaptation, but quality matters for sustainability. Striking the right balance between “build fast” and “build it once - build it right” ensures both agility and longevity in product development.
"Fuel Easy being a pioneering start-up in diesel delivery, we didn't have a comprehensive UI/UX strategy or design. Sana understood early on our desire to create an experience that would draw in our target users and deliver value very quickly. Reliable, consistent, and always willing to push boundaries”
Parth Vora, Director, Oso Petro Products Pvt Ltd
