Creating a Time Bank

This is the final project for Udacity’s Intro to the Design of Everyday Things, part of the curriculum in Springboard’s User Experience Design learning path.

What’s a time bank? Let’s treat it a bit like a bank account that uses time as its currency. The Time Bank app is a kind of marketplace app that lets you trade time for a service. Think TaskRabbit or Mechanical Turk, but with time payments. The app itself runs on a credit-card sized touchscreen device perfect for your wallet.

1. Conceptual Models

The first task was to generate conceptual models for how the app could show the user an increase or decrease of time. After putting down the requisite plus/minus, arrow up/down, and clock sketches, I ventured into more interesting territory (the columns on the right). The hourglass and liquid concepts were the most interesting to me. Some initial testing showed that users were unsure of the exact amount left in their balance, so a number would need to accompany the visual.

2. Discoverability

The second task was to show how the user would cross the gulf of execution, that is, to do what they wanted to do. I created a few disparate sketches of how the user might be able to navigate through the app, and find services to trade time for. The guide video also pointed out that the user may want to check if a possible match is in range, so there are a few screens for that too.

3. User Flow I

After a few more concept sketches, I created the first version of the Time Bank storyboard. This storyboard outlines the main user flow for finding a service and conducting an exchange. Since the credit card is so small compared to smartphone screens, I didn’t see a touch typing interface as a viable option. So to let the user search for services, there are large buttons in a grid view and a voice search option.

In the Search Results, there would be a list view of potential matches, with a summary of their services, including things like instruments played, cost of service (in time), and proximity rating. The proximity rating was the result of a scan in the nearby area to find the closest Time Bank users.

4. Getting Feedback

After finishing the first storyboard, I tested it with a few users. These are some of the key issues that came up:

  • How do I go back Home from any other screen?
  • Proximity rating may not be entirely useful
  • How can I find out more about a service? (e.g. playing music could be many styles, instruments, etc.)

5. User Flow II

Improving upon the first iteration, version 2 has 4 navigation tabs: Home, Profile, Search, and Notifications. The navigation tabs are persistent in all the screens except Confirm, where the user must choose either Confirm or Cancel to complete the transaction. In the Search Results, proximity rating was removed, since users will not necessarily be nearby when doing a trade. The device should be able to detect other users via wifi, so being in close proximity would not be a requirement. To provide more information about a service, each service icon can be clicked to view more info provided by the prospective service provider. The Contact button sends the user to a new Send a Request screen to allow them to add details of their request, again via voice.

It’s a start

This exercise was great in getting me to keep putting ideas on the page. By setting strict time limits for brainstorming and sketching, it really pushes for more creativity in the last few, desperate sketches.

Show your support

Clapping shows how much you appreciated Matthew Tsui’s story.