OVERVIEW–
Stream Share is an app focused on group streaming that allows users to connect with friends and watch their favorite shows and movies together in real time.
As my final self-authorship project, I opted to concentrate on the development of a group streaming application. I assigned myself the task of redesigning several components of famous streaming applications and combining them into something new.
ROLE: UX/UI Designer and Researcher
(Individual Project)
TOOLS: AdobeXD, Illustrator
Timeline: 10 weeks
Overview of Design Process
DEFINING THE PROBLEM–
How can we further the inclusion of group streaming platforms to increase activity and promote community?
There are many group streaming apps/websites that people can use to chat with friends while watching movies, TV shows, and videos in sync. However, many of them lack a sense of community and have numerous navigational issues. Though most of these apps' initial goals appeal to the ideals of many young adults and teens, the overall feedback received and the app's ranking on social media suggest that there is a problem with the app's development and user experience that is preventing them from becoming successful.
User Research–
Improve user engagement and experience by identifying user problem areas in similar apps and developing a new app that is simple and easy to navigate, as well as adding new features that improve the users' understanding.
I did some tentative research by looking at app store reviews and conducting in-person interviews with people who have used group streaming apps. Because the apps are usually aimed at generations who are familiar with technology, social media, and video streaming apps, my target age demographic was young adults and teens aged 17-24.
1. Active stream service users (N=10)
I was able to survey people (varying demographics) who use / have used streaming applications. My goal was to grasp how users navigate through streaming apps and what they expect from them.
Key Insights–
1. There is a broken link between users connecting with friends on streaming apps.
There are restrictions for many streaming users who want to watch their favorite shows and movies with friends.
2. There aren't a lot of options for group stream app services on mobile.
Some streaming apps offer ways to connect with friends but are strictly limited to web based solutions.
User Personas–
EXPLORATION–
Ideating Solutions
What are the main goals to focus on?
GOAL #1: How can a user access third-party streaming services while staying on one app?
GOAL #2: How will users be able to choose what to watch?
GOAL #3: How will users connect with their friends?
USER FLOWS–
Following the ideation process, I created two user flow charts to help layout the overall flow of the app. I was able to expand on the interface frameworks as well as the initial interactions to help communicate the concept and information architecture.
Following the ideation process, I was able to create flow charts for two specific tasks...
1. Log in to app, access third party applications.
2. The user chooses what to watch and then begins a stream session with friends.
3. Add, Message, and manage friends.
Sketches & Low Fidelity Prototypes–
To help me visualize my idea, I first made quick sketches using the user flows. Then, while keeping the three goals in mind, I was able to create low-fi prototypes. I have outlined the goals for each screen in the screenshots that follow.
Flow 1. This chart integrates our personas because it directs users to the correct third-party streaming service login page. The Home Page serves as the entry point. The user can log in or out of various applications by clicking the "manage streaming apps" section, which will take them to a page where they can do so. While streaming with friends, users can choose exactly which apps they have and want to use.
Flow 2 aligns with the personas because it emphasizes the specifics of allowing users choose what they can and can't watch. The home page remains the entry point, from which you can either select the search option or begin a selection immediately. This flow is crucial for this idea because it focuses primarily on how streaming sessions are created.
Flow 3 aligns with the personas because it focuses on how the user might interact with friends. The user can manage their friendships on various pages after entering through the home page, which is still the entry point. This flow is particularly crucial because the main goal of the concept was to develop a group streaming application. The overall concept would fail without these components.
HIGH FIDELITY WIREFRAMES–
What design decisions were made?
Several users mentioned that the visuals on most competitor apps were either underwhelming or extremely overwhelming during usability studies. Backgrounds were either too chaotic or didn't engage the user at all. To improve readability, I decided that darker and less saturated colors were to be used as the solution.
I worked on refining the visual design of the app at the same time as we improved the User Experience. To achieve visual consistency with the app's styling, I created a rule-based system to support branding, typography, icons, and colors that flowed well together.
Visual Identity
OnBoarding & Sign up–
Get Started / Sign Up / Login
Onboarding
I decided to emphasize the three application goals on the onboarding page section to help users understand them better.
Connect - Choose - Start
Choosing and connecting–
Users can browse what is available to them on the home page and the search page, which makes it simpler for them to find exactly what to watch.
GROUP STREAMING–
A feature was implemented where groups can easily communicate with one another via video and audio on the streaming page.
REFLECTION AND ANALYSIS–
1. Design is not always linear... and that is okay!
Throughout the process, I had several hiccups (not understanding exactly how to approach the issue, making many unsatisfying design mistakes, users not responding as I expected, and so on), but each obstacle encouraged me to improve and deliver the greatest end result.
2. Test! Test! Test!
Although I began this project with user research and testing, I now understand how much testing and iteration allow for the absolute best user-focused results. Although I believe that the idea is workable, a better result might have been achieved with a more thorough analysis of the functions.
3. Addressing Final Issues
I quickly realized that there would be some misunderstanding about the app's third-party log-in feature and how users would go about setting it up. As a result, I decided to concentrate my efforts on the main community sections as well as the app's layout in order to create a visually appealing and effective design.
Areas for Improvement–
If given more time, I would…
• Learn how to deal with any problems the concept may have. I came to the conclusion that there were a lot of unresolved issues after going over my assessment several times. In order to identify these flaws earlier in the production, I could have benefited from a group perspective going into this project.
• Conduct additional in-depth user research and some sort of user testing. Although the reviewers and other participants praised the approach, I am unsure about its usability to the target audience.
• Make transitions more smooth. Despite the fact that I was able to prototype each screen, with more time I would've wanted to include clever animations for more smooth transitions and a more finished app overall.
