Spotter — Streaming Assistant App

Category

User Experience

Project Timeline

Feb 2020 — April 2020

Team Size

3

Project Goal

Enhance users streaming experience

mockup_watchlist.png
mockup_moviedetails.png
mockup_home.png

Project Overview

The focus of our this project deals with the concept of delivering a solution to help our users discover, track, and browse digital streaming content across a variety of platforms. Our team uses the Goal-Directed Design process to reach a design solution that best suits our users goals and needs. 

Goal-Directed Design (GDD) is a design process learned within our Interaction Design program. This process starts with a research phase to discover information to help inform the design such as current technologies and users goals before moving into modeling to define what our users look like and what their goals are. This research allows designers to define requirements for the product in terms of how the product aims to help solve the users' goals before finally creating the framework which is the actual wireframe design and prototype of the product which can be tested and refined to better meet user goals and expectations.

Research
Modeling
Requirements
Framework
Refinement

This page details and explains our goal-directed process for a mobile application designed as a class project. This page summarizes the steps that we took from beginning to end to establish the groundwork for creating our streaming assistant application as it establishes expectations, information on the potential domain, and ultimately user goals.

 

The process for this project starts broad with exploring what the purpose and challenges our application seeks to achieve before narrowing into more detailed research, interviews, and finally a clear definition as to what our users’ goals are. The purpose of these steps are to set our group up for success when designing our application focused on our users’ goals. 

Meet the Team

Throughout the different stages of this project, members shared and rotated roles and responsibilities. These roles included recording key points during interview sessions, analyzing the data recorded, constructing personas based on research, defining user requirements, and testing those requirements to see if they are truly being met. 

My specific roles on this project include:

  • Researcher (Moderator)

  • UX Analyst

  • Visual Designer

  • Information Architect

Anthony Jones

Christian Christiansen

Jordan Costley

Research

 

Kickoff Meeting

Because this is a project and we have no real clients, one of the things we had to think about was how to understand what stakeholders would be looking for. Although we did not have real stakeholders, we approached a few areas of concern that stakeholders may have. We determined that, in general, they would be most concerned with product vision, scheduling, user identity, and technical feasibility.

 

Competitive Audit/Lit Review

Before conducting stakeholder interviews, our design team reviewed any literature pertaining to our app domain. Normally, as a team, we would collect this literature and use it as a basis for developing questions to ask stakeholders. Because we have no real stakeholders for this project, our literature review is used to give a deeper perspective of the domain we are venturing into. 

20200227_120835(0).jpg
20200227_120835.jpg
20200227_114007.jpg
20200227_111413.jpg
20200227_123635(0).jpg

User Research

Interviews & Observation

  • Who: 5 participants

  • Where: Kennesaw State University

Process

Once we established who our users might look like we were able to create a set of questions to help jumpstart our interviews. Although we established a set of questions, we did not strictly ask every question or ask them in a particular order. Rather we simply had a gently guided conversation with our participants allowing them to talk 

about specific while utilizing open-ended and closed-ended questions when needed.

In order to have an insightful interview we had one moderator who focused on having a conversation while there were two facilitators who made notes and asked the participant to clarify points or speak more deeply about comments that came up in the discussion. In total we interviewed 5 participants which will be used to establish our persona once mapped and synthesized to create an application according to their goals in context of their life.

Interview Results

After completing the interviews our team affinity mapped to create discussion from each team member's viewpoint. Each team member wrote down important thoughts and details observed in the interviews on sticky notes before coming together to group them by similarities. This allowed us to discover key factors established by commonalities found in our research. We each placed our sticky notes on the wall and discussed with each other what we noticed others had written and where it lined up with our own thoughts.

The main groupings that emerged covered personality type, time management, work-life balance, pain points with stress, where the participants spent the majority of their time, what participants did when they were relaxing, and how participants would spend their time if they had more time on their hands. These commonalities discovered between the participants determine what the goals of the users are and define areas that our application will help the user achieve.

Image_1.png
IMG_5588_edited.jpg
20200303_131042.jpg

Modeling

 

Because we are designing for users, it is important that we can understand and visualize the important aspects of their relationships with what they want, with their social and physical environments, and with the products we hope to design. We have found that using our research to create descriptive models of our users, what we call personas, serves as an extremely powerful tool when designing toward user needs.

 

Personas provide us with a precise way of thinking and communicating about how groups of users behave, how they think, what they want to accomplish, and why. Personas are not real people, but they are assembled from the behaviors and motivations of the actual users we encounter in our research.

We use two types of personas:

  • Primary — The primary persona is chosen out of several models designed for the same scenario. It will be most suitable to serve its purpose and can be adopted by the majority of users.

  • Supplementary — Their needs are completely represented by a combination of primary and secondary personas and are completely satisfied by the solution we devise for one of our primaries.

Our design team began constructing our personas based on those commonalities we discovered that our users goals were to make the most of their free time, discover new movies and shows, be entertained, and ultimately feel relaxed. Our design team established two personas by analyzing the commonalities identified from our research. The first is our primary user who watches content on a streaming platform on a regularly. The second persona is the supplemental user as their needs are represented under the primary user needs and they are satisfied by the solution devised for the primary user.

Meet the Personas

Primary_Persona.jpg
Supplemental_Persona.jpg

Requirements

The sequence of events created during this stage is intended to understand the purpose of each persona – rather than paying attention to general user tasks, the design is focused on behavioral specifics of each scenario. The connection between all of the models in the project is set up in this phase. This establishes a completely goal-driven process with enhanced productivity since true priorities are better understood.

 

The objectives of this stage will direct the analysis and breakdown of our apps functions. This is accomplished through the construction of a contextualized scenario. Eventually, this leads to the requirements definition setting technological, business and consumer needs at equilibrium. 

 
Problem Statement

Design Requirements

After analyzing our context scenario we were able to extract the personas needs. 

We decided to create a function tree to show the different features that will be needed in order for our persona to accomplish their goals while using the app. 

Our team decided that the primary functions of the app include personalized content and the ability to track content entering and leaving various platforms.

 

Key Requirements

  1. Recommendation of content personalized to the user

  2. Easily sift through content on various platforms

  3. Easily display information in a user friendly way

  4. Track content entering and leaving platforms

Design Framework

 

Design Framework defines the overall structure of the users’ experience. This includes the underlying organizing principles and the arrangement of functional elements on the screen, work flows, interactive behaviors and the visual and form languages used to express information, functionality, and brand identity.

Unfortunately, due to the events of COVID-19 our team had to reconsider how we would continue the project. After looking at various digital offerings and alternatives to a physical whiteboard our team leader, Jordan Costley, landed on InVision Freehand as it offered real-time collaboration and would allow everyone to quickly sketch wireframe designs. After generating ideas as a group, we individually began sketching each screen as we thought it might look based on our research. We then brought our ideas together as a way to generate discussion about our apps functionality. 

ixd_wireframe.jpg
sketch_Page_1.jpg
sketch_Page_2.jpg

Key Path Scenario

After sketching the interaction framework, our team constructed a key path scenario. This scenario describes how the persona interacts with the product. The key path also depicts the primary pathway through the interface that the persona would take. We started by drawing out the key path for our primary and secondary personas.

Jordan_wireframe.jpg

Prototyping

Prototyping is an extremely valuable step in the design process. Keeping the user at the center of the process required our team to test our designs on real users. We used prototypes to identify any usability issues or design flaws before it’s too late. 

Usability Testing

Usability testing is a way to see how easy to use something is by testing it with real users. Users are asked to complete tasks, while being observed, to see where they encounter problems and experience confusion. Feedback is then collected from the user and then analyzed as the design moves toward the refinement stage.

Refinement

 

The aim of this phase is to create a mature and detailed design specification to the goal of its persona. The process here is similar to that in the previous stage, only with greater focus on improvement, refinement and making the task-oriented structure and function more consistent relative to each other. 

After conducting usability sessions, our team sat down to reconfigure the functionality of our app. We decided to update the functions of our app based on the feedback given during user testing. We knew that our app would have the ability to allow users to search various streaming platforms for available content. We had a general idea about the features that would make up our app but after testing those ideas with users, we had a better sense of what to build upon and what to get rid of. 

High-fidelity prototypes are a more detailed and realistic version of what the final product will look and operate like. High-fidelity prototypes tend to include all the visual components, interactive elements, and content that will be featured on the final product. 

Final Product

The tests proved beneficial in verifying the user flows we defined. The primary areas of concern circulated around the homepage content and clarity, search filtering options, lack of search bar on the explore page, and ability to mark content as watched. Other areas of concern were minor design errors such as incorrect color and interactions behaving differently than expected.

 

The largest area that needed adjusting was the homepage. Although users liked the concept of a homepage tailored to their tastes, it was not apparent that the content on the homepage was targeted at their tastes. Users also felt that the homepage was fairly empty when compared to the explore page. We have addressed these issues by adding features offered on the explore page to the home page. We also tweaked the verbiage and titles used on the homepage to make it into the For You page.

Other areas of concern were easily addressed by adding content that users expected in sections. We added a search bar to the explore page to make it easier to search for content. We expanded the genres offered on the explore page to give more options to the user when searching for genres beyond their taste. Additionally, we added genre filtering to the search navigation to give users more control when searching for specific content.

mockup_watchlist.png
mockup_moviedetails.png
mockup_home.png