Designing One-Stop-Shop Experience for 70 Million Indians

An insight into re-designing the DTH app journey making it simpler for the users to manage their plans through their television sets.

Stats & Impact

One-Stop-Shop for DTH users

Customer experience being the paramount concern urged us to re-design and create a one-stop-shop application for our DTH users where they could indulge in a range of activities like changing their plans to managing their Airtel accounts directly from their television sets.

Every product development is like a journey undertaken with a number of directions involved that converge to a final destination point. It involves back and forth, rerouting, misses, and eventual hits.

This journey was no different and one worth sharing.

Who did we re-design for?

To begin the process of re-design, I had to first identify, who are we re-designing for?

The project was conceptualized for our DTH non-internet satellite box users. I studied and analyzed various customer personas before undertaking the re-designing endeavor. The data for the same cannot be disclosed here as per our data privacy policy.

Our aim was to improve the users’ experience by addressing & dissolving their pain points regarding the use of our DTH box.

How do people watch TV?

The first step to undertaking the re-design project was to identify how people use their television sets in general and what guides them to make decisions. I focused on three kinds of behaviors/mindsets before venturing into the re-design process:

Approach Mindset: While searching for a plan or pack, the users are in exploration mode. It is essential to make this exploration easy and keep the next option readily reachable.

Avoidance Mindset: When a user has made up their mind and is about to make payments, it is important to eliminate doubt-creating elements that could cause dropoffs.

Ergonomics of TV viewing: It was essential to consider how people physically engage with devices like television sets, which is a lean-back device. Lean-back devices require a lower density of information. A person’s positioning in relation to the screen affects the perception of size.

Current Product Performance

Re-designing a product means re-working or modifying an already existing product. In this endeavor, it is important to closely analyze the existing product before making changes, to develop a meaningful design that is an upgrade.

To understand the current product performance and pain points, I performed a heuristic evaluation. Heuristic evaluation is a process based on Jacob Neilsen’s ten general principles for interaction design. To make a product accessible and usable for everyone, these 10 principles need to be adhered to.

Post the evaluation, I discovered 4 points we needed to improvise on:

1. Making the product more accessible
2. Making navigation & IA more reachable
3. Enhancing search experience
4. Facilitating better customer help & support system

Moreover, I considered 4 key insights accumulated through the users before starting the redesigning process:

1. Adding a new channel to the pack was not easy
2. Customers could not change or update their registered number
3. Readability of text and information was not clear
4. Many sections were not easily discoverable

I also had to keep in mind the limitations that come along with DTH non-internet satellite box in order to create a re-design plan to work around those limitations.

Technical Limitations

In the era of high-end devices and high-speed internet, designing something that runs on satellite signaling, has no internet, and has minimal internal memory was a challenge. Following were the major limitations that had to be kept in mind:

1. The box can use only a single font type
2. It allows for limited use of imagery and graphics
3. No on top of UI effects can be used
4. We had to keep both very old & new television sets in mind
5. The box cannot access much information at the same time

Final Solution

Post my evaluation of the existing product, customer insights, and limitations that had to be navigated through, I re-designed the One-Stop-Shop by adding the following features to make it more user-friendly as well as business-friendly.

1. Account Information: The overall account information related to the user’s DTH account.
2. Update/Add Number: Users can update or add a new number to their DTH account.
3. Two-Step Recharge: Simple and easy wallet recharge process.
4. Long Term Plans: Extra benefits and offers for users doing recharges for a longer period.
5. Pack/Bundle Customisation: Easy to customize of creating their own packs.
6. Value-added services: Extra on top services for our DTH users.

To improve accessibility, I identified that televisions have a much higher gamma value than a desktop, tablet, or handset. Varied television models have varied brightness and color which is why accessibility for all was a key point in re-designing.

The color and contrast were chosen based on WCAG 2 Contrast and Color Requirements.

WCAG AA: PASS | WCAG AAA: PASS

The chosen contrast and color work well for both old and new models of television.

Old vs New

The outcome of the final re-design can best be monitored through a comparison of the old design with the new one.

1. Main/ Starting Page

Improvements: Made the information more structured, concise, and contextual to guide the user. Used iconography to create more recall value, helping the user when they visit again.

2. Add Channel/Make Your Own Plan

Improvements: Improved the flow of adding channels from a tedious 4-step process to an easy 2-step process. Merging the first 3 processes gives the users more clarity regarding what options are available for them and what they are select.

3. User Profile

Improvements: We received a number of calls related to user’s account information like updating numbers, base packs, etc. I added an “Account Info” section to solve all such queries within the box. With this update, there was a 50% drop in daily support calls.

4. Recharge Offer

Improvements: I observed that a lot of users do not update their base back and keep adding channels and services to it. As a solution to this, I divided recharges into two sections — “Monthly” and “Long-term”. To facilitate the selection of “Long-term” certain discounts were given to users choosing the long-term packs.

Complete Flow of the Re-Design

My Learnings

I joined Airtel in March 2020 and this was the first television project that I was leading post my joining. I was working on the project along with Lokesh Rajput (Product Manager). The project was interesting and while working on it I had a few takeaways and learnings of my own that I would like to highlight here.

1. Television offers a big canvas that can easily become overly complex if not done right.
2. Unlike mobile devices, television interfaces are controlled by a D-pad, and navigation limits four directions: up, down, left, and right.
3. The other critical element in the TV interface is the focus state. The Focus state is the point on the television where one requires the viewer’s attention to be focused. It should be highlighted as the user navigates, indicating where the user is currently at.
4. TV apps are often referred to as ten-foot experiences. Given this distance, we need to treat a UI differently than we would on the web or mobile.
5. We should avoid over-using saturated colors and heavy use of white in large elements or backgrounds. Pure white will create halos and other visual distractions.

Positively influencing the users and the business is the ultimate test of a re-design process. It is an exciting challenge with many learnings in its path.

Thank you for reading; you are awesome!

You can connect with me on my Instagram, Linkedin, Dribbble, Twitter.

For more visit abhinavagr.com