UX/UI + Web dev - 2019
The idea

My final project of Development of Applications with Web Technologies in CIM-UPC was inspirited in a recurrent problem that I see in many companies that have a transport fleet.

The problem

In some companies, for control all their vehicles, it’s status, refueling, failures, mileage, etc, the workers using excels (lots of excels). Excel is a very powerful, popular and easy tool. But it is not always the right tool and can't replace a data base. When you need to work with many documents, these excels can be lost, repeated, accumulated and end up overwhelming the user. At this point I began to think a solution to facilitate the tasks of compilation and data mining.
So, I thought I could create a platform where users, depending on their level of authority, could register, control and / or extract data.

UX Process
1: Research

I had 6 interviews with people related to vehicle fleets and they agreed that fleet management is very exhausting without the right tools. They want something that would allow them to expedite their tasks and minimize the possibility of error in their data mining.
Among the impressions collected in the interviews and my experience, because I also managed vehicle fleets in the past, it has been very easy to make the empathy map.

The conclusions were…

  • Think and feel: they would like to do the job quickly and without errors.

  • Hear: "I am afraid that, despite my work and my efforts, errors will appear."

  • See: Your coworkers have the same problem. Everyone uses the same tools.

  • Say and Do: "Well, it is a complicated task, let's do it calmly and try to save time."

  • Pain: Invest a lot of time, hard work and chances of error.

  • Gain: Quickly, versatile and with all the information.

2: Structure


  • Access: It would be accessed through login, this means that we will need the database to save this registration data and a response when someone enters their username and password.

  • Landing page: Most of the interaction will be a nav-bar that will communicate with the rest of the pages of the application. At the bottom there will be an information board of the actions that can be carried out.

  • Main menu: The main menu of the nav-bar will have 5 main sections; the sub-sections will be pages or anchors within the corresponding section page. The actions that I was prototype are fleet/inventory (where we will enter-modify-delete the vehicle data).

3: Devise

When I designed this prototype, the first thing I thought about is who would use this platform. At that moment I saw clearly that I needed different levels of authority ( like “user persona”).

Level 1 or “The driver”. This user can record his daily activity with the vehicle (STADISTICS):

  • Km traveled or Km start (at the beginning of the turn) and Km finish (at the end of the turn), the difference is easy to calculate.

  • Refueling

  • mechanical check

  • etc

Level 2 or “The manager”. This user can control the part of the fleet that is in charge:

  • Register vehicles that his/her equipment will use (FLEET)

  • Control visits to the mechanic (MAINTENANCE).

  • Mining data of his/her vehicles and territory (STADISTICS)

Level 3 or “The controller”. This user can consult and do data mining of all vehicles in territory or department:

  • Extract reports of kilometers and refueling (STADISTICS).

  • Mechanical costs (SUPPLIERS).

  • Global insurance costs (SUPPLIERS).

  • Renting prices (SUPPLIERS).

  • Etc.

Level 4 or “The admin”. This user is the one who has full control over the platform and would be the maximum responsible for the fleet:

  • Register/delete users (USERS).

  • Assign vehicles (FLEET).

  • Massive upload of vehicles in XML (FLEET).

  • tasks (MAINTENANCE).andCreate and manage types of maintenance, periodicity.

  • Register suppliers and data: prices, terms, etc. (SUPPLIERS).

  • Mining data (STADISTICS).



  • Video

- Music by Scott Holmes.



  • In exercise (images)


- Background: Britain Cab Car in needpix.