Streaming Entertainment Interface and Hand-held Controller
Design interacting physical and digital user interfaces.
Background
For this project I created a prototype to deliver a streaming entertainment video interface that was paired with a hand-held controller and a dongle connecting the system directly to a T.V. The project requirements specified that the system needed to be connected to a T.V. in a similar fashion to a ChromeCast or Fire TV stick.
Discovery Phase
UX Research Methods & Techniques
- Researching existing streaming entertainment services.
- Assessing existing onboarding, navigation and menu functionality used by popular services.
- Field researching existing hand-held controllers used by similar devices.
- Conducting user research regarding satisfaction with existing, popular services.
- Conducting user research regarding the ease of the onboarding experience.
- Conducting user research regarding the digital information interface (user expectations and journeys to “get the job done”.
- Conducting user research regarding the ease of use of hand-held controller layouts.
- Conducting user research regarding sub-sets of button groups for assignment to functional groups.
My first steps included examination of hand-held controllers in my home as well as a field trip to a nearby electronics shop. I noted the various button layouts and controller sizes and considered how the buttons might best be grouped for functional purposes. Further examination of how certain buttons showed most common use (through wear and tear) was noted to aid prioritization of location on the controller. I also noted various methods of affording tactile feedback (i.e., shapes and raised features). These supplemented an intended back-lit feature to highlight the controller buttons used in darkened rooms. I also decided to make my controller brightly colored (orange) so that it might be easily spotted among all the other items found in typical “family rooms”.
After thinking through the project, I determined the on-screen interface prototype (and its features) was required for first consideration. This would then provide greater understanding needed to for the controller designs. My decisions regarding functionality were driven by my personal experience with multiple streaming services and took into account features that I found most useful as well as those that were absent or constraining. This information was supplemented with interviews with participating users (family, friends and co-workers). Once the on-screen interface functionality was sketched, I was able to specify the required buttons and button layout on the hand-held controller.
I tested multiple controller button layout designs using prototypes printed on paper attached to a representative controller body large enough to contain a battery power source. The size of the hand-held controller built was slightly larger (as measured by diameter at mid-section) than many other controllers examined. I made this decision purposefully in order to apply a potential constraint factor to test ease of use with people who may not have large hands. This proved to be a very useful exercise minimizing the number of considered buttons down and prompting the design of multi-functional buttons that perform additional, related tasks, depending on the length of the “press” (short-press, or long-press).
Additional requirements were created to account for an app-based controller to be installed on a smartphone. I determined the best solution for the app button functionality and layout requirements to replicate those of the hardware controller. While the app version would lose tactile feedback (with exception of common haptic feedback), the positioning of the “buttons” would remain familiar to the user.
An equally weighted set of requirements were considered for the Onboarding experience of adopters. The two guiding primary user centered design requirements were simplicity and the minimization of necessary steps.
Results
Onboarding/Set-up
The onboarding/set-up required only five distinct steps. The final step would only require repeated action if multiple, unique, users required customization that would enable individual family members to set their own preferences. These five essential steps are all that is needed to activate and use the streaming service.
On-screen Interface
In addition to the feedback necessary for onboarding, it was determined that only two primary views (the third, supplemental view, was the streaming content) were required for a user to (1) navigate the video library, (2) select a video from that library and then (3) view the streaming content.
The first view, the “Grid” view, opens a menu that offers the user options to select from various entertainment categories. Within each selected category a sub-selection of within-subject videos are displayed by a thumbnail cover image. Details of any particular video can be viewed if focused upon using the controller. The default screen would include multiple categories viewable through scrolling. Navigation is enabled via the controller or app.
The second view, the “Single Column” view, opens an expanded menu that offers the user options and expanded information, per each video within a selected category. Here too, navigation can reveal a focused, in-depth description of a selected video.
Controller Button Requirements
I organized button groups within distinct and complementary sets. Button groups are positioned to afford a short reach of a user’s thumb with those most accessible groups consisting of those buttons most likely to be used during navigation and video play. I made use of buttons of various shapes and sizes to aid tactile feedback affording ease and accuracy — this was in addition to raised shapes and symbols embossed on the button surfaces (note those differences in collection of Button Group C). Buttons were also enabled with a back-lit feature to aid identification and use under less-than-optimal ambient room lighting conditions.
Lessons Learned
The top-line lessons learned from this project were:
- The design of a complex system, like that presented in this project, where there are a mix of features and interfaces, both tangible and digital, require not only an iterative design approach — but also an iterative, and likely repetitive, approach to research. A designer must be prepared to reinterpret previous assumptions and research-driven conclusions in order to produce an integrated design that meets the requirements of both business drivers and end users.
- With the understanding that each sub-system can, and likely will, affect the design of the other (potentially in unexpected ways), it is important to communicate to the stakeholders that early designs ideas will certainly evolve and the designer should caution their stakeholders to refrain from committing too early to developing initial ideas.
- The design of a complex, integrated system, is best approached initially from a reductionist perspective. This is one where the designer should prioritize efforts to provide for the primary, necessary, requirements. Then, when these solutions have been provided the designer can be freed to attempt the addition of those “like to have” requirements.
