top of page
Dağ sırtı

Otobilim

Project Overview

Otobilim, developed for Opet, is a next-generation fuel management and payment app for corporate fleets. The app enables users to purchase fuel via smartphones, eliminating the need for hardware installation. It also provides bi-monthly invoicing to help users track and control vehicle expenses effectively.

As the UX/UI designer, I focused on creating a seamless user experience by simplifying account setup, fuel purchasing, and expense management workflows. The interface was designed to be intuitive and aligned with Opet’s brand identity. Through iterative testing, the app was optimized to meet user needs, resulting in a practical and user-friendly solution.

Project type: UX/UI, App

Case study timing: 12 Week

Role: UX/UI Designer

Sayfa sayısı: 100+

Tools: FIGMA, Photoshop, Zeplin

Group 873.png

Problem

Corporate fleet managers and drivers faced inefficiencies in traditional fuel management systems, such as the need for hardware installation, lack of real-time tracking, and challenges in expense management. Considering the diversity of the user base, there was also a need for interface solutions that could be easily used by everyone. These issues resulted in increased operational costs and reduced productivity. Otobilim aimed to address these challenges effectively by providing a seamless, digital-first solution.

Project Goal

The goal of the Otobilim project was to develop a user-friendly mobile application that simplifies fuel purchasing and management for corporate fleets. This included eliminating the need for hardware installations, ensuring real-time tracking of fuel usage, and providing intuitive expense management features. By delivering an accessible and efficient solution, the project aimed to enhance operational efficiency and improve user satisfaction across diverse user groups.

Project Plan

Initially, the client did not provide a clear workflow, requiring collaborative analysis meetings to clarify requirements and expectations. Following these discussions, wireframes were created to identify and resolve potential issues in the user flow. Once the wireframes were validated, the interface designs were developed, and the process was structured into sprints to ensure efficient and iterative progress.

Group 406.png
Group 874.png

Fuel Purchase Flow

When a user goes to a fuel station to refuel, they first park their vehicle at the pump of their choice. Using the Otobilim app, they select one of their registered vehicles, then choose the station and pump they are at. Once these selections are made, the fueling process begins seamlessly through the app, providing an efficient experience.

Group 361.png
Group 361.png

Dashboard

The dashboard was designed to clearly display key information such as the remaining credit limit, single transaction limit, and monthly consumption data. These elements were visualized to make the structure more comprehensible and user-friendly, allowing users to easily track and manage their fuel expenses at a glance.

Group 337.png

Contact Us Section

The "Contact Us" section was thoughtfully designed to ensure users could easily reach out to Opet for support or to report issues. Within their profile, users can access this feature to create detailed requests by selecting a relevant topic from a predefined list, making the process more efficient and structured. They also have the ability to attach images to provide additional context to their requests, enabling faster and more effective resolution by the support team.

To further enhance accessibility, the contact number for customer support was prominently displayed at the very top of the page. This strategic placement ensures it is immediately noticeable, reducing the time users spend searching for help. By structuring the information hierarchically, the design prioritizes ease of use while maintaining a professional and user-friendly interface. Overall, this section empowers users to communicate their concerns seamlessly, enhancing their experience and satisfaction with the application.

Group 361a.png

Listing Page

On the car listing page, a swipe-to-delete feature was implemented, tailored for app usability. This functionality allows users to easily remove vehicles from their list by swiping left, providing a quick and intuitive solution. The interaction was designed to align with common app behaviors, ensuring familiarity and ease of use for the diverse user base. This approach simplifies vehicle management while maintaining a clean and efficient interface.

Group 363.png
bottom of page