M1_QSG.png
 

User-Centered Setup Design

At Sling Media I designed the installation and setup experience for the Slingbox M1. What naively began as a modest project evolved into a meticulous end-to-end overhaul of the previous generation's entire setup and installation experience, and the redesigned flow was able to cut aborted customer setup attempts by more than half compared to the previous generation.

Design Roles

Matt Weldon - UX and Project Lead

  • Performed almost all user testing

  • Designed entire information architecture for redesigned flow

  • Created wireframes for all desktop OS and Android - based flows

  • Created and maintained desktop master spec documents

  • Created low-fidelity Quick Start Guide (QSG) redesign

Brian Dils - UX Design Contractor

  • Created and maintained HTML prototypes and cross-platform deltas

  • Created wireframes for iOS flows

  • Maintained mobile master spec documents

Lester Lee - Production Designer

  • All final graphics, production layouts + redline specs

Outside Agency - final print design of QSG

Collaborative Stakeholders - Customer Care Team, Data Science Team, Backend Data Team, Software Engineering Team

Slingbox System Overview

The Slingbox was a delightfully innovative product that allowed users to view, control and program their TV and DVR from any place in the world with an internet connection.

 
 
Screen Shot 2020-05-25 at 3.00.44 PM.png
 
 

The Slingbox User

I did not have access to full demographic information from our users, but in 2013, when streaming services were starting to gain traction, the Slingbox was still the only solution for business travelers and expats who wanted to enjoy local TV from a different market (think college sports, international programming, etc).

High Setup Failure Rate

Screen Shot 2020-05-25 at 3.17.13 PM.png

Sling customers loved the Slingplayer app and the features it provided, but they didn’t always love the Slingbox installation and setup experience. Our customer care team frequently reminded the product team that setup-related support calls were costing the company hundreds of thousands of dollars per year.

No Video Signal.png

The top reported call topics in setting up the models at that time (Slingbox 350 and Slingbox 500):

  • Video feed to the app simply didn’t work

  • Video feed to the actual television stopped working, even when cables appeared to be connected correctly

  • Some virtual remote commands would not work, or performed the wrong function

Opportunity: New Slingbox Model

 
slingbox combo.png
 

Sling was already planning to develop what would become the Slingbox M1, which introduced some opportunities to improve the installation and setup flow:

  • The new packaging presented an opportunity to update the printed Installation Guide if needed

  • This Slingbox would need UI to support a new Wi-Fi-based setup, making it easier to advocate for additional design changes of the in-app setup flow if needed.

User Testing

Sling had no UX research program or budget at this time, but I was able to acquire six of the current-generation Slingboxes, arrange in-home interview sessions with brand new Slingbox users, and watch them attempt to install and set up the device. I interviewed all six users, recorded the sessions on video, and presented findings to the internal design, product and customer care teams.

Findings Summary

Screen Shot 2020-05-25 at 4.09.02 PM.png

Most users from both groups failed to successfully set up their Slingboxes on the first attempt. Some of the issues they encountered were similar to what the customer care team had been reporting.

Any redesign would need to provide a clearer mental model and anticipate skimming of instructions.

Making Sense of the Data

I worked with our data team, hardware product management team, and customer care to find out what was happening on the technical side to cause some of these problems. Soon I began to understand some key pitfalls even an advanced user could fall into.

The Full Monty

The system logic for setting up the Slingbox M1 was daunting. Flows needed to exist for:

  • Downloading + installing Slingplayer software to both Windows and MacOS, with installer logic that would work with all major browsers (Internet Explorer, Firefox, Chrome)

  • Slingbox setup flow for all major desktop AND mobile platforms (iOS, Android, Windows Phone), with different layouts for tablets vs phone.

The flowchart I created and maintained over several months became fairly epic.

 
Apollo_setup_flowchart_master_file.png
 

The large scope of the project quickly became apparent, and my UX Director Jane Irwin was able to secure budget to hire a great contract UX designer I had worked with in the past, Brian Dils. Under my direction, Brian created HTML prototypes of the “happy path” flows using a tool called Tumult Hype, so that we could get gauge time-to-task and get hallway-test feedback from co-workers as we built out the flow.

New Setup Flow Features

While Slingbox M1 setup was built on the flow from previous generations, this version essentially became an overhaul. There were several different new features, as well as improvements based on the UXR study:

  • Video Troubleshooting Wizard. This flow had the user test whether changing to different cables would fix the lack of a video signal. It accounted for the SOC copy protection issue mentioned earlier in this article.

  • Remote Troubleshooting Wizard. Most errors around remotes were either due to a weak IR signal (fixed by adding the included IR blaster), or from the user accidentally choosing a similar, but not quite exact, model of remote. The wizard walked the user through these steps until the remote was working properly.

  • Wi-Fi based setup. Out of the box, the Slingbox M1 acted as a Wi-Fi access point. We took inspiration from the recently-released Google Chromecast as a design pattern for the flow.

 
Wireframe excerpts from the video troubleshooting wizard (desktop / tablet layout shown).

Wireframe excerpts from the video troubleshooting wizard (desktop / tablet layout shown).

Final screen samples for desktop version. Visual / production design by Lester Lee.

Final screen samples for desktop version. Visual / production design by Lester Lee.

 

Installation Guide

I also took over the UX design of the Slingbox M1 printed installation guide, since it was part of the same user experience and because some of the issues I encountered in testing were the result of hard-to-scan directions with too many decision branches.

My guide was fairly low-res. I literally printed out my new instructions, and glue-sticked them to an existing Slingbox 350 installation guide so that it could be folded into a box and manipulated by a user in a realistic way. The final revision was sent to our packaging design vendor, who provided final assets and print-ready files.

Unfortunately my working file has not survived, but it maps almost exactly with the final official version in terms of content and layout.

 
QSG Edit.png
 

Outcome

It was difficult to validate the installation and setup changes until we had a fully functioning system. Jane Irwin (UX Director) and myself did eventually perform additional user interviews with new users with the Slingbox M1 before launch. All 3 users were able to complete setup on the first attempt with little hassle.

By the time the Slingbox M1 was released in summer of 2014, I had accepted an offer to join the team at August. However, I was told that the customer support call rate for Slingbox M1 was less than half that of the previous generation!

This was a challenging but gratifying project to work on, as it truly did reduce frustration and improve the setup experience for Slingbox customers.

Screen Shot 2020-05-25 at 7.18.37 PM.png