Soft Remote

The Story

A soft remote is a UI remote control in the app that allows the customer to control their STB when in-home.

The Ask: To design a soft remote that uses familiar functions from the physical remote and enhances them with the interaction capabilities of a mobile device -- so it can be an equal or better substitute to the physical remote.

Project Details

ROLE: UI Designer, UX Research, UX brainstorming

TOOLS: Sketch, Confluence, Slack, Abstract, XD, Figma

What We Know

OLD REMOTE

• Original design was made for the iphone 5 size and was never updated to newer phone sizes

• User needed to swipe to 2 different pages for more remote options

• Original design was for original remote style. DIRECTV updated their hard remote style

Research Findings (from what users expected from the remote)

• When flipping channels: 83% (20/24) hit Previous button to return to previous channel

• When using the trickplay: 87% (20/23) used the traditional Rewind/FF button to navigate backgrounds

• Desired Aspects: 25% (6/24) of participants wished that there was a voice control on the remote

Usability Issues

• There is no onboarding message for the remote. Users have to trial and error to learn how it works.

• Users complained that connecting to the server can take a while (up to 3 minutes).

• Users complained that pressing buttons on the soft remote sometimes crashes

Competitive Audit

Roku

FireTV

Apple TV

DISH

Xfinity

Key Findings

Multi-Screen vs Single Screen
- Smart TV remotes use a single screen. There are less buttons
- STB remotes use a multi-screen for more buttons.
Notable Patterns:
- D-pad is usually centered on the the first screen for STB remotes
- The power button, Home, menu, and shortcuts to other screens are on the first screen.
- The device or receiver is displayed on the screen to indicate the connection
- Most remote apps show the channel up/down and volume up/down buttons
- Most remote apps use brand colors (i.e. Roku, AppleTV, FireTV)
- Dish and LGTV use a different color scheme from the hardware remote
- Most apps require a device to be connected first before they can see the remote control
Nice to Haves
- Onboarding tips for the remote
- Display the receiver/device that is currently connected
- Bypass the connecting state and show the remote control
- Simplify and update UI for the current DTVE remote (remove drop shadows)
- If connected to a receiver, display the current program title that is playing on TV
- Volume up/down buttons to control TV
- Troubleshoot instructions (FireTV displays a partial overlay for instructions on how to connect)

Design Approach

• Determine which features from audit would help enhance current experience

• Create use cases to test against

• Design different directions and see which direction holds against

the use cases

• Prototype and User Test

Top Use Cases

• Watching LIVE TV

• Watching & Managing My Recordings

• Setting up a Recording

Design Directions

The directions were based on whether the remote would be a 1:1 to the traditional remote or would it relate to another style. It was based on traditional to abstract from the original physical remote.

User Testing

What was Tested

• Can the user find the ch up/down area?

• Can the user control the video on screen?

• Can the user easily move around the TV from the remote?

What did we Learn?

• The users expected the trickplay and ch up/down to be with the rest of the remote rather than being in a separate area

• Overall the users were able to find what they needed to move around the tv from the soft remote with the given buttons.

Design Challenges

• Designing for different remote styles

• Finding enhancements that were easy to understand

• Understanding the user type

•. Designing for different phone sizes

The Final Product

This is the prototype of the final product.