Fleet Reservation

An app that allows employees make new reservations and monitor reservations to meet business needs.

Team

Agile Team

Role

Product Designer

Project Overview

This mobile application was built to ease the process for users/employees seeking reservations in an organisation. After research and multiple Usability studies, clients requested an application that could control and monitor company trips and reservations. This project was based on designing a better experience with better functionality. This project was further conducted using an agile process

Agile UX Process

Discover

Problems

Companies with hundreds and thousands of staff need an effective way to ease and monitor movement/transportation across different branches and destinations.

Companies need a useful technology to enable employees prepare ahead for trips and business journeys.

Companies find it difficult to track vehicles that have been requested by employees, what they are being used for, and why it was requested.

Problems- Previous app

Design lacks aesthetic usability effect( Users perceive aesthetically pleasing design as more usable)
Design lacks goal gradient effect (Approaching a goal with proximity to the goal)
Design does not meet with company's new branding guidelines, and requirements.
Design needs improvement to enhance a seamless user experience and retention.

New Function List

After a sprint of ideation with cross-functional teams, we came up with new functionalities to enhance a seamless experience, and to meet business needs in the redesigned version.

New activation process with QR Code or Domain Link to sync with web app.
A simple and intuitive Login process.
Application of FAB's (Floating Action Buttons) to ease user experience.
The use of goal gradient effect when creating new reservations.
Create a new Ongoing reservation tab with functionalities to enhance better experience.
Use of our telematic system to track vehicles location via application.

Plan

I aimed to develop strategies to achieve the objectives described in the new function list. Traditionally, I came up with flows on a new and improved sign up process. I further created a task flow for ongoing reservations as that is a new feature, I then created an Information Architecture (IA) to properly organise all of this information effectively.

Design

The purpose of the Design Phase was to transform the project requirements, and ideations into complete and detailed system design specifications. This was done with approach of creating paper wireframes with the aim of:

Organising Information With Wireframes. I created thoughtfully designed wireframes, such that we can have a visual representation of the determined structure, hierarchy, flow and relationships between pages and content on the mobile app.

To foster client Involvement.
Improve Collaboration and Efficiency.

Once the design is tested and approved, the Development Team begins the Development Phase.

Paper wireframes

I started sketching out possible solutions on paper to come up with unique representation of the flows created in the plan phase.

I created wireframes of upcoming, and ongoing journeys, rating, an past trip screens.

Hi-fi Prototype

After creating wireframes, I obviously came up with high-fidelity prototypes which are generally used for usability testing with real users or to get final design approval from stakeholders. I ensured keeping to the new design system and guide. Worked and created on new design components to have a consistent visual language across the product.

Activation screen

Here I worked with existing components on the new functionality of activating mobile applications by scanning the QR Code or pasting the domain links to sync the two platforms together.

Login screens

With existing components and the design systems, I added an easy login process and a rather intuitive process when users forget password and need to renew their password.

Upcoming reservation screens

Following the design systems, the use of FABs (Floating Action Buttons), is highly compulsory to maintain the same design language across all other platforms. Implementing the rule of the thumb, the button was positioned where it's easy to reach by users. The aim of the button was to :

Perform primary tasks with the click of a button
Use the app efficiently with one hand.
To add dynamism to the screens

With the FABs (Floating Action Buttons) users are able to create reservations easily.

Detail screens

When reservation request is submitted, managers are able to approve reservations, users can view the approval status and also resources that have been assigned to them for that particular reservation.

Upcoming reservation screens

Users can start monitoring reservations 15mins -1hour before scheduled time. Users can follow up with their assigned drivers, make calls, and even cancel trip before drivers arrive.

Start trip screens

Users/employees can start trip when assigned driver arrives and end when they arrive at destination

Employees would then rate the ride and leave comments if needed. Completed reservations could be seen in past trips.

Profile screens

Users can access their profile, edit their details, and change passwords if needed

Check out on Play store

Check out on App store

Thanks for watching, The End :)