Roku Audio
Lead Interaction Designer
OVERVIEW
As Roku audio products expanded, users required flexible setup options. Our project aimed to achieve three goals: streamline setup for different device combinations, ensure compatibility across Roku platforms, and minimize setup time.
​
The Problem
-
The Roku TV or Player needs to know what devices a user is setting up in order to suggest the optimal sound configuration
-
Due to technical limitations, users couldn't set up multiple audio devices together leading to a cumbersome setup process (see Roku wireless speakers project here).
EXPLORATIONS
Accessory setup varies depending on the Roku platform. For example, with Roku TV, users can set up a remote (see the setup here), wireless soundbar, speakers, and Bluetooth devices. To evaluate accessory setup options, I initially considered several choices and narrowed them down to four:
We chose option 4:
Multi-Select Itemized Setup
Design
After testing different layouts, we settled on the following design, aligned with Roku's design system. The left side triggers actions, while the right side reflects corresponding changes.
SCREEN OVERVIEW
-
Checkbox enables multiple-item selection.
-
Imagery to represent each device type.
-
Instructions guide device preparation for setup.
-
Continue button progresses setup.
-
Disabled category indicates unselectability.
-
The already set-up streambar is grayed out in the image to indicate its inclusion in the setup.
-
The left side provides speaker placement instructions for the user.
-
Layout options, along with the system's recommended best layout, are presented to the user.
-
The left highlight corresponds to the right image. For example, when "Rear speakers" is highlighted, the image displays speakers positioned behind the couch.
