TCB
local mobility app
I carried out an expert review, market research & competitor analysis to redesign an existing local mobility app.
May 2023
3 days
scope
Secondary research * Information architecture * UI Design
timeframe
Figma * FigJam * Notion
tools
Mobile
device
Mobility
sector
challenge
The suburban city of Lisbon, Barreiro, carries a mobility app for their local public buses, which only circulate in the municipality.
Its main feature is that you can see the real-time location of the buses as they drive around the town.
context
Redesign of the app's UX and UI - I was invited to challenge the existing information architecture and enhance the product's visual design. Still, the project did not involve creating new content or features.
The redesigning should be based on a critical analysis of the current product, and secondary research, including Market Research & Competitor Analysis.
research
current product analysis
Main issues found:
User Control and Freedom (Usability Heuristic #3)
None of the screens has a back button, leaving the user the only option of navigating the app through the drop-down menu, accessible on the logo in the top left corner
Memory Recognition and Recall in User Interfaces (Usability Heuristic #6)
When trying to plan a trip or see routes, the information is not always visible and it’s hard to navigate between screens to change information previously given
Best practices for mobile apps
Important to provide a simple user journey, one-handed navigation and and a personalized experience
Contrast
There were accessibility issues with the colour in all the screens tested.
market research & competitor analysis
I looked at similar products like the Fertagus and CP — Comboios de Portugal apps, both also only offering information about one vehicle (trains), but I also extended my search to more indirect competitors like Google Maps, Moovit and Uber.
I checked Dribble for visual design inspiration and also found a similar app with the same MVP in India (Chalo).
This process allowed me to gather knowledge on the best practices for UI element placement through the frames and therefore inform my product redesign.
Design solutions
Usability
Colours and contrast
The updated colour scheme fixed the previous acessibility issues.
One-handed navigation
To ensure easy access to the app’s features, as people usually reach for mobility apps when outside and commuting, needing fast access to the features, the position of the menu was changed.
Simplified user flow
Because mobility apps are usually accessed while the user is outside, with other things demanding their attention, the user flow should be simple and easily recognisable by the user and therefore I made an effort to shorten the user flow
Design solutions
visual design
Moodboard
Given the failed contrast test, I started working on a mood board getting inspiration for the visual redesign.
I got inspired by the city’s scenery and images of public transportation which led me into a green and orange palette.
Style tile
I opted to keep the same font used on the original and only created a hierarchy using different weights and colours.
Rounded elements were chosen to provide a friendly look and feel to the product.
TCB redesigned
next steps
Usability test the prototype and iterate accordingly;
Concept test the implementation of more features.