T-MOBILE'S

DATA CALCULATOR

The Last Project,
Our Final Chance

One of our two largest clients at the design agency Ascentium, known today as SMITH, was T-Mobile. We’ve been working with them for several years, until one day they (sadly) announced they could no longer afford an external design agency like ours. This meant a major income loss, one we weren’t prepared for. So, this would be the last project we’d design for T-Mobile, and we wanted to impress them, make it a project they’d remember us by.

Our core project team consisted of a design lead, a UX architect (myself), front and back end developers, and a QA Engineer.

T-Mobile's Data CalculatorT-Mobile's Data Calculator

Redesigning the Data Calculator

T-Mobile’s data calculator is a tool intended to help customers decide which data plan best fits their needs by allowing them to evaluate their current data usage.

The calculator at the time looked like this -

Old Data CalculatorOld Data Calculator

We started out with usability sessions to test the current experience, and discovered it to be confusing to people.

The two main problems were, (1) People were unsure how to answer some of the questions - How many emails do I send per day? How many web pages do I view? Most people don’t know the answer to these. And (2), People don’t think in MB and GB. So, asking someone how many emails they send per day in measurements of MB, is like asking what you had for breakfast, in measurements of calories…. Most people just don’t know!

Understanding Data Usage

I wanted to find a way to indicate to people that a text email, for example, requires less data than a video. I experimented with interactions that required physical force from the user, making some items virtually “heavier” and therefore harder to drag along the screen. In order to drag a movie file customers needed to use more force than to drag an email.

SketchesSketches

The Big Challenge

After several design iterations we settled on one which we wanted the client to implement. But how do you ensure the client will go for the design you want them to? We thought a lot about this, and ended up creating two other designs, very radical in what they offered, placing the design we wanted them to choose as the desirable middle ground.

Concept 1 - Rearrange items on the page

The first design we introduced involved almost no change to the original layout. We told T-Mobile - at almost no cost, you can improve the experience of your data calculator, just by rearranging elements on the page, bringing informational text to the top, and adding names of plans to buttons. We did some testing, and this new hierarchy makes the page more understandable to users.

Solution 1Solution 1

Concept 2 - Tell Me Who You Are,
I’ll Tell You How Much Data You Use!

The second design introduced a concept & style that were far from aligning with T-Mobile’s methodology. We called it the ‘Persona Calculator’, as it uses archetypes as a starting point. The top of the page asks the question: How do you use your device? Which is followed by representative models, such as – the businessman heavy data user; the cool dude text only user; etc. The user can either choose an archetype he identifies with to see sample usages, or manually drag the handles next to each icon to get a plan recommendation. The thickness of each tube indicates how heavy an item is in terms of amount of data it uses (for example, email uses less data than games, therefore its tube is thinner).

Solution 2Solution 2

Concept 3 - The Desired Middle Ground

This is the design we wanted the client to chose. Addressing the problems we saw in the original design, instead of asking users to remember a number of how many emails or web pages they view per day, I decided to use words that are less committing such as ‘once in awhile’ and ‘regularly’. As a user adds or subtracts data in the calculator, a recommended plan gets highlighted.

When we tested this design, users didn’t need any explanations to use it. They started playing with it immediately, and enjoyed the ease of getting immediate feedback to their answers.

Solution 3Solution 3

A New Data Calculator

Using this approach of presenting two design extremes and one desirable solution, we were able to lead the client to choose the design we were aiming for.

Final DesignFinal Design

In the process, we reached our three design guidelines:

(1) Simple: The controls should be known and obvious; It uses natural language and asks questions that the customer has to think very little about to answer meaningfully.

(2) Fun and playful: The data calculator should allow a customer to easily change settings and get immidiate feedback, and it should not have perceived cost (page loads, wait time, etc).

(3) Informative: The data calculator should leave customers with a better understanding of what they can get out of their data plan, and feel confident that they are choosing the best plan for their usage.

Final DesignFinal Design
VILLAGEHUNT EXPEDIA
T-MOBILE MICROSOFT