A concept app providing real-time updates and planning tools for TMB commuters.
The TMB live app is a stand-alone app that informs public transport
users in Barcelona about the current state of trains and buses
around the city helping them to make smart decisions for their commutes.
Public transport in Barcelona is a service that locals and tourists
are in close contact with during their stay in the city, which can get
really crowded during peak season. We conceived an app providing live
information so people can decide in their best commuting option to enjoy
the city and get to their destination on time and in a less stressful way.
THE PROCESS
The Problem
Barcelona is a common touristic destination specially during summer
break and winter, since the weather is nicer than the rest of Europe.
Due to the people density in the city, using public transportation
can be a big hustle as most people want to avoid walking due to the heat.
So, we identified the main information users want to know when using
the Barcelona public transport:
Next train
incomming time
Amount of
people on board
Wheelchair/stroller
user friendly
Inoperative lines
and stations
Features
We wanted our app to display real time information and allow the users to search for routes near and away from where they were, this helped us define what the main features of our app will be:
Current Location
Train, buses and
station information
Loading screens
Search
Metaphors
Finding the best analogies and the ideal way todisplay all the live information was a long process. We needed to find a way to display all the available lines within a certain range and an easy way to represent the crowdedness metaphor along with a screen that was fast and easy to read. We came up with different options and creative solutions. And although none of them seemed to solve and convey the information in an optimal way, we found the ideal solution.
The OUTCOME
Art Direction
Since the TMB lines are already colorful, as our main color we needed to choose one that wasn't included in the current colors and didn't clash with any of them, that's why we selected a dark blue, with black and white as complementary colors.
TMB line colors
App colors
Of course we needed icononography to represent the trains, buses and trams from the TMB system, as well as the transport particularities. And we did it adding a little bit of fun in the icons and some animations.
Are you ready?
Swipe time!
