Linxio Vehicle tracking app

Running a business and need help tracking your vehicles? Try Linxio, a mobile vehicle tracking app that keeps you updated with the whereabouts of your vehicles.

The Background

Lixio is a time-proven solution that helps businesses track their vehicles without additional installation and maintenance costs. The app allows companies to capture information about the whereabouts, distance, travel times and upload numerous vehicles onto their profile.

The Challenge

Allow companies to have complete control and services that the app provides, which are:

See their vehicles on a map: Tapping on any vehicle should reveal a pop-up with its location (GPS coordinates), vehicle’s speed, and the date and time that the information was last captured.
Browse a list of recent trips the vehicles have completed, including start date and time, end date and time, distance, start point, and endpoint.
The app should include a navigation UI with the following items:

Vehicles
Trips
My Profile
Setting

Research

Competitive Analysis | Survey

I created a competitive analysis of other vehicle tracking apps in the market. But, first, I needed to find out if there were any gaps for improvements in the existing tracking apps and trends that I could pick up, such as similarities that users can identify.

The competitive analysis would also help develop the relevant survey questions to get the best outcome.

I gave my mid-fidelity wireframe to three participants to test out. But, first, I needed to make sure the user could:

1. Sign in
2. Onboard vehicles
3. Track the vehicles

Survey

I formulated a few questions to understand my user’s needs and how this app might help them from my competitive analysis.

1. Does your business need a delivery service?

2. Do you use an automobile tracking app? If not, how do you keep track of your automobiles?

3. Which vehicle tracking app are you currently using?

4. What does it mean to have a vehicle tracking app for your business?

5. Would you like a live chat function for the tracking app?

6. Would you prefer to receive notifications onto the app and find the information you need?

7. Would you require to upload more than one vehicle to be tracked on the app?

Empathy Map

I illustrated my findings from the survey by assembling an empathy map. I did this because I needed a way to identify recurring patterns.

Insights

The user needs to be able to track multiple vehicles.
The user needs to chat with the driver and receive Live updates.
The user needs to browse recent trips, including date, distance, speed, and route.
The user needs a straightforward vehicle onboarding approach.

User Persona

The aim here is to design an App with the user’s needs in mind. For this I needed to develop a persona from the findings I gathered in the survey and empathy map.

Define

POV | HMW | Brainstorming

The insight I got from my survey and using my persona helped me identify my POV and HMW question to help the user get a better experience from using the tracking vehicle app.

How might we assure Brad that he can onboard all his trucks and track them?
How might we provide a live chat on the App?
How might we show Brad the information he needs for his vehicles?
How might we help Brad onboard his trucks without a hassle?

After brainstorming ideas for each HMW, I decide to go with the following ways to solve the user’s needs:

The insight I got from my survey and using my persona helped me identify my POV and HMW question to help the user get a better experience from using the tracking vehicle app.

Communicate during the delivery of goods via the app.
Give Matt an option to view past trips and current information for each vehicle on the map.
Matt hovers his vehicle registration sticker and it will capture all the car information on the app.

Product Strategy

In order to understand and prioritize the product’s interactive features. I decided to create a simple product roadmap.

Information architecture

In order to understand and prioritize the product’s interactive features. I decided to create a simple product roadmap.

Card Sorting

Information Hierarchy

Interaction Design

Task Flows

In addition to the above, I created a simple chart diagram to demonstrate the task flow. I also needed this to help me pinpoint the key screens that I need to design.

Wireframe

Before getting to the visual appearance of the app, I needed to test my functionality. I created wireframes.

Whiteboard Sketches

Paper Sketches

Low fidelity wireframes

Wireflows

Visual Design and Style Guide

To make the visual more attractive I have used the linxio brand color black with other bright colors. I tried to keep the design as minimal as possible. Though there are various age groups of users for this app. I focussed on making the interface friendly for all types of users.

Logo - Usage and specifications

The logo helps our users identify our brand when using our services. The Linxio logo must be included in every digital interface created by Linxio.

A space of breathing

Colors

Typography

Iconography

Mockup and Prototype

It was time to create the realistic renderings of what a product will look like and how it will be used.

Please check the prototype

Usability Testing and Iteration

I gave my mid-fidelity wireframe to three participants to test out. I needed to make sure the user can:

1. Sign in,
2. Onboard vehicles
3. Track the vehicles