MobiPalma

Released

2020

Art Director

ALEX BONNIN

Headquarter

MALLORCA

Redesigning the mobility

These past few months I had to use the public transport «again». I say «again» because since I have a driving license I usually travel by car.

To know the route of the buses, schedules, stops… as well as, for example, the charging points for vehicles, taxi stops or the availability of BiciPalma there is the MobiPalma app that encompasses everything.

This app is an all-in-one app that people use for public transport and in my opinion, it’s chaos. The menus change depending on the last one used, there are features that are unnecessary and the architecture is quite hard to use.

So I decided to redesign the interface of the app along with its architecture and interaction, simplifying steps – focus on the user experience – and asking myself if a change in the design could improve the app’s score.

MobiPalma - AlexBonnin UI Design Palma mobility app features

There is a menu where you can select the type of vehicle that interests you: Car, Bus or Bike.

Each of the «menu items» has its characteristics. When you select Car, its color is green and only information about car appears. I added a button to exchange between Car and Taxi, so within the same section such as Car (vehicle in general) you can find information for personal use of your vehicle or for taxi use (stops and phones).

MobiPalma - AlexBonnin UI Design Palma mobility app features

You can customize the notifications and set your favourites bus stops or BiciPalma stations. I kept the different color for each «service» because – as I said before – MobiPalma is an app that merge different services and each service has its own color – the color of the brand. Also, it helps you to know where are you while you are using the app.

MobiPalma - AlexBonnin UI Design Palma mobility app features
MobiPalma - AlexBonnin UI Design Palma mobility app features
MobiPalma - AlexBonnin UI Design Palma mobility app features

This project helped me to consolidate the knowledge that I have been acquiring through the Interaction Design Foundation and Material.io. Some problems that I had during the design was the integration of Personal Vehicle and Taxi in the Car Section. To integrate it, I decided to include a filter button in the bottom right of the screen. When you touch it, the Taxi options appear. When you select one of them, a notification appears on the button, indicating that there is an option selected.