Ruchi Dangwal Process – Wireframe excercise

Wireframe exercise: Tiramisu bus tracker

For the wireframe exercise, I chose to analyze the Tiramisu bus tracker app.  I had used the app quite some time back, when I had first arrived in Pittsburgh. However, I did not continue using it because of the unappealing interface and the infodump-like feel of the app. In this assignment, I navigated the app as a user with the goal: “I want to find a bus to go to Giant Eagle”. I tried the app both with the GPS on and off, and wherever I noticed a difference in the user experience, I have demarcated my observations.

First iteration: Navigating the app with GPS switched off.

IMG_20150902_214231500

Second iteration: Navigating the app with GPS switched on.

IMG_20150902_231631723

1. Home screen.

The app has several options on the start screen, which are clearly labelled with text and universally understood icons too.

Improvements: Adding more kinds of interactions, like swiping left/right/up/down to got to different features. The app currently only utilizes single tapping, which limits the user’s interactions and is an inefficient use of screen real estate .

2. Bird’s eye view.

First iteration:

I went through the app in a cursory fashion in class, with my GPS switched off. The app gave me feedback that my GPS was switched off, only in the beginning. As a result of the poor feedback, I forgot to switch on my GPS and found it difficult to use many features.

Improvements: The location button should take the user to the GPS settings page, and give clear feedback that the GPS needs to be switched on.

Second iteration:

Bus stops are marked very clearly: with a bright red pin, and with a blue bus icon. However, the app presents some ambiguity regarding bus stops, because there are other bus stops that have a pin but no bus icon! Interactions were fairly straightforward (pinch-zoom and dragging).

Improvements: Remove ambiguity about which stops are bus stops and which are not.

3. Details about bus stop selected.

When a bus stop is selected, it is centered on the screen and an info bubble appears. The user’s location continues to be shown relative to this selected spot.

Improvements: Utilize the compass and the GPS location dot as pointers to guide the user as to where they can go.

4. Various bus options.

All the buses that have arrived or would leave from the selected bus stop are displayed, along with the real time prediction ETA.

Improvements: Showing the buses graphically instead of just representing them as text (like in the Uber app). This will orient the user and help them understand where they can go to catch the bus.

5. Select mode (of sharing bus data)

Once the bus has been selected, the user is asked what the status of the bus is.

Overall, I would

  • add a universal search bar in the app, so the user can easily find a location.
  • reduce the text and represent the information graphically on the map.
  • add functionality to the compass and GPS pointers.
  • include more concise directions.
  • use more accurate representations of landmarks.
  • add user feedback about stops, not just buses.
Advertisement