Case Study: Star Streamer — Enhancing User Engagement Through UX Design Improvements

Victorakimoto
20 min readNov 12, 2021

--

Introduction

This case study details the inaugural project I completed during my UX/UI Design course at Awari, focusing on enhancing the growth potential of small-scale streamers via improved user experience and interface design.

Objective

The primary goal was to identify and mitigate usability obstacles faced by new users on Star Streamer, a platform known for its potential yet hindered by user interface complexities. By streamlining the experience and personalizing user interactions, the project aimed to boost overall user engagement and retention rates.

About the Project

As a novice streamer myself, I experienced firsthand the difficulties small streamers face in gaining visibility and growing their audience on popular platforms. Motivated by these challenges, I chose to focus my UX/UI design project on creating solutions that could help small streamers expand their reach.

Context

This project aimed to tackle the significant growth barriers small streamers encounter on game streaming platforms such as Twitch and Facebook Gaming. By enhancing the user experience and interface, the project sought to democratize visibility and growth opportunities for these individuals.

The Challenge

During the COVID-19 pandemic, live streaming platforms saw an exponential increase in both viewership and the number of active streamers. This surge resulted in a highly competitive environment where only well-known, often sponsored, streamers managed to thrive, while smaller streamers struggled to achieve visibility.

Evidence

In collaboration with fellow streamer friends, I observed that successful channel growth transcends regular streaming. Effective growth strategies also require robust engagement across various social media platforms, including Instagram, Twitter, and Facebook. This multi-platform presence is crucial for building a sustainable viewer base and fostering community engagement.

Desk Research

Understanding the Streaming Landscape

To validate the necessity for this project and ensure its relevance, I embarked on an exploratory study into the world of streaming. The core activity of a streamer involves broadcasting gameplay to an audience, which can range from playing video games live to reacting to videos in real-time for viewer interaction.

Industry Growth and Challenges

Key findings from Streamlabs and Stream Hatchet highlighted a dramatic surge in viewer engagement: in the first quarter of 2020, Twitch amassed 3.1 billion hours watched. This figure more than doubled to 6.3 billion by the same period in 2021, marking a 106% increase year-over-year. Despite this growth, Twitch Tracker reports that the number of active streamers, after peaking in early 2021, has begun to decline and stabilize, underscoring the competitive nature and visibility challenges faced by newer streamers.

Objectives of the Project

Primary Goals

  1. Channel Growth for Small Streamers: The main aim is to facilitate the growth of small streamers’ channels, who often struggle to gain visibility amid the saturated market of large, sponsored broadcasters.
  2. Development of a Supportive App: I plan to develop an application integrated with streaming platforms, specifically designed to bolster the growth of small streamers. This tool will focus on strategic engagement across streaming and social media platforms, enhancing content discoverability and viewer interaction.

Benchmark Analysis

Comparative Study of Leading Platforms

To lay the groundwork for this project, I began with a benchmarking analysis comparing the current giants in the live streaming sector: Twitch, Facebook Gaming, Trovo, and YouTube. The goal was to dissect the operational dynamics of these platforms to identify prevalent strengths that could be emulated and weaknesses that needed addressing.

Insights Gathered

  • Twitch: Dominates the market with extensive user engagement and a robust monetization model. However, its oversaturation makes it difficult for small streamers to break through.
  • Facebook Gaming: Benefits from deep integration with the social network, enhancing discoverability for streamers. Its weakness lies in less developed infrastructure and community features compared to Twitch.
  • Trovo: A newer platform that offers promising growth opportunities and less competition. Nonetheless, it lacks the comprehensive feature set and audience of more established platforms.
  • YouTube Gaming: Excels in video algorithm optimization which aids content discoverability, but its live streaming features are not as refined or popular as Twitch’s.

The analysis confirmed the necessity for a new, innovative product tailored to small streamers. The envisioned solution is to create a platform or application that not only integrates the best features of these existing platforms but also introduces unique functionalities focused on amplifying the visibility of small streamers, effectively putting them in the “spotlight”.

Research Plan

To validate the initial concept and gather direct feedback, I devised a user-centered research plan. This involves engaging with potential users — small streamers — in a structured manner to uncover key insights that would guide the subsequent development phases of the project.

Objectives

  1. Understand User Needs: Gain a deep understanding of what small streamers require to grow their audiences effectively.
  2. Identify Key Issues: Pinpoint the main challenges and obstacles that prevent these streamers from gaining visibility and traction on existing platforms.
  3. Explore Potential Solutions: Determine how an app can facilitate and promote the live streams of these small streamers to a broader audience.

Methodologies

Qualitative Research

  • User Interviews: Conduct in-depth interviews with a selection of small streamers to explore their experiences, challenges, and needs. These discussions will help clarify what hinders their growth and what features might aid their progress.

Observation

  • Streaming Practices: Observe how streamers currently promote their streams and engage with their audience to identify effective strategies and common pitfalls.

Hypotheses

  1. Stagnation Despite Activity: Streamers who consistently produce content do not necessarily experience growth, indicating potential issues in content discoverability and audience engagement strategies.
  2. Functional Necessities: Determine which app features are essential from the user’s perspective, and which are superfluous, to streamline the app’s functionality.
  3. Promotion Methods: Understand the various ways streamers promote their broadcasts across different platforms, including the use of social media, collaborations, and interactive content.
  4. Simplification of Promotion: Explore innovative ways the app could make it easier for streamers to promote themselves and gain visibility without extensive marketing knowledge or resources.

Initial User Engagement

Recruitment and Interaction

I reached out to 11 small streamers from diverse backgrounds to understand the challenges they face on popular streaming platforms. These interviews were crucial in identifying common pain points and varying needs based on their unique streaming styles and audience demographics.

Common Challenges

A universal challenge highlighted by all was the lack of support from the platforms in promoting new or less popular streamers. Despite the effort put into their channels, without proper visibility mechanisms, growth remained elusive.

Diverse Streaming Styles

The variability in their streaming styles and audience types underscored the need for a flexible support system that catifies to different streamer needs. This diversity has opened avenues for personalized assistance, which could be pivotal in helping them reach their full potential.

Analysis of Interviews

Platform Limitations

Streamers consistently reported that mere activity (i.e., frequent streaming) isn’t enough to “climb the ranks” of the platform algorithms. Active self-promotion and strategic content delivery are essential to break through the noise.

Importance of Scheduling

Maintaining a regular streaming schedule was akin to traditional TV programming — it helps viewers know when to tune in, thereby stabilizing and increasing viewership. This routine helps build a loyal audience, which is critical for sustained growth.

Attitudes Towards Fame and Income

Interestingly, most streamers indicated a preference for engaging with their community over seeking fame. They value the interactive aspect of streaming and expressed a desire for platforms to offer incentives that support making a livelihood from streaming, without the pressures of celebrity.

Final Notes and Viewer Insights

Despite the diversity in responses, several consistent themes emerged about how platforms can better support small streamers. Moreover, a subsequent viewer survey revealed that infrequent live stream viewers are less likely to contribute via donations or subscriptions. These viewers prefer channels that incorporate humor, suggesting that entertainment value and content style are significant factors in attracting and retaining audiences.

Personas and Empathy Map

From the insights garnered through interviews and analysis, I developed two detailed personas representing typical small streamers. These personas — Lyan and Laura — help illustrate the diverse needs and experiences of streamers within the community.

Personas

Empathy Map

The empathy map was created to delve deeper into the emotional and psychological landscape of these personas, considering their shared and individual experiences as small streamers:

Job Stories

As the project begins to take shape, utilizing job stories is crucial. These stories help articulate the core motivations of the users by focusing on their needs while maintaining solution flexibility. This approach allows for identifying and implementing the most effective solutions to specific issues encountered by small streamers.

Can’t Grow as a Streamer

  • Job Story: When I start doing live streams, I want a platform that not only guides me through the basics but also teaches me advanced techniques for producing high-quality live streams, so I can attract and retain a dedicated audience.

Cannot Get Help from Those Who Are Already Established

  • Job Story: When I feel stuck and unsure about how to improve my streaming content, I want easy access to experienced mentors who can provide practical advice and feedback, enabling me to enhance my skills and channel quality.

Don’t Know How to Handle Potential Hate from Others

  • Job Story: When I encounter negative comments or hostility in my stream’s chat, I want resources and support that help me manage these interactions confidently and maintain my mental well-being.

Change of Plans

Reevaluation of Initial Beliefs

Upon completing the initial research and analyzing the data from personas, my understanding of the challenges facing small streamers evolved significantly. Initially, I believed the primary barrier to their growth was insufficient platform support. However, the insights gained suggested a different path to empowerment.

Insightful Discoveries

It became apparent that the key to growth for small streamers lay not in platform promotion, but in mastering the art of streaming itself. Most interviewees had started their streaming journeys by emulating successful streamers, without any formal knowledge of the technicalities or presentation skills involved. They expressed a need for guidance on:

  • Professional Behavior on Camera: How to maintain poise and engage with viewers.
  • Overcoming Shyness: Techniques to boost confidence during live sessions.
  • Technical Skills for High-Quality Streaming: Understanding the right tools and settings for optimal video and audio output.

Strategic Shift to Masterclasses

These revelations led me to pivot the project towards developing a masterclass platform specifically tailored for small streamers. This platform will offer courses and tutorials designed to enhance their streaming skills effectively, covering everything from camera presence to technical setup, helping them maintain their authenticity while professionalizing their approach.

Next Steps

With this new direction in mind, I plan to conduct further research to:

  • Identify Optimal Learning Methods: Determine the most effective ways for streamers to learn and implement new skills.
  • Analyze the Current Market for Courses: Explore existing educational resources and identify gaps that our masterclass platform can fill.

Desk Research

Identifying Gaps in Current Offerings

Through comprehensive analysis, I observed that existing streaming courses largely lack interactive components like live lessons or personalized mentoring. This absence is notable, particularly when considering the dynamic and immediate nature of streaming itself. Interactivity, especially the ability to engage directly with instructors for real-time feedback and doubt clarification, is crucial for effective learning but is currently underserved in the market.

Lesson Format Decision

Online Adaptation and Preference

The shift to online learning has been universally adopted across educational institutions due to the pandemic, making it a familiar format for most people, including streamers who are inherently tech-savvy. This familiarity, combined with the inherent flexibility of online learning, makes it a natural fit for this project.

Live vs. Recorded Sessions

While recorded lessons provide convenience, live classes offer dynamic interaction essential for real-time learning and immediate application, which is more suitable for the practical skills required in streaming. Considering the absence of live instructional offerings in the current market, introducing this could significantly enhance learning outcomes and provide a competitive edge.

Differentiator

Unique Selling Propositions

The platform will distinguish itself by not only incorporating best practices in online education but also tailoring these for the specific needs of streamers, both novice and experienced. Key differentiators will include:

  • Interactive Live Classes: Unlike typical pre-recorded sessions, our platform will offer live streaming classes that allow for real-time questions and interactions, closely mirroring the real-world scenario of a live stream.
  • One-on-One Mentoring: Personalized coaching sessions with experienced streamers provide bespoke guidance, helping users refine their style and overcome individual challenges.
  • Comprehensive Branding Support: From logo creation to social media packs, we equip streamers with all necessary branding tools to professionalize their presence from the start.
  • Emotional Resilience Training: Unique to our platform, sessions with psychologists will prepare streamers to handle online interactions positively and maintain mental health.
  • Community Learning Environment: Incorporating group sessions fosters a community among learners, facilitating peer support and collaborative learning.

Conclusion

This approach not only sets the platform apart from competitors but also deeply aligns with the needs of streamers aiming to professionalize their streaming endeavors. By offering detailed courses on streaming software, branding, audience engagement, and emotional resilience, the platform will provide a holistic educational experience tailored to the realities of the streaming world.

Research

Reinforced Qualitative Research

To enhance the validity of the project’s direction, I revisited the qualitative research phase with a fresh perspective, focusing on deeper behavioral insights. This involved not only re-engaging with small streamers but also integrating psychological expertise to understand the broader impacts of public exposure associated with streaming.

Conversation with a Psychologist

Psychological Impacts of Streaming

My discussion with a psychologist was enlightening, revealing the significant psychological demands placed on streamers. They highlighted several points:

  • Exposure to Varied Feedback: Streamers are exposed to a wide array of comments, ranging from supportive to harshly critical. This exposure can make individuals vulnerable to psychological stress, including anxiety and depression.
  • Social Fulfillment: Many individuals have turned to live streaming as a means of social interaction, especially during times of increased isolation such as the recent pandemic. This platform not only serves as a creative outlet but also fulfills a fundamental human need for connection.
  • Therapeutic Potential: Interestingly, while live streaming can introduce stress, it can also serve as a therapeutic medium for many, providing a sense of community and support that is vital for mental well-being.

Changed Perspective

The insights gained from this conversation fundamentally shifted my understanding of the needs within the streaming community. It underscored the importance of preparing streamers not just technically, but also psychologically, for the challenges of live broadcasting. This realization has profoundly deepened the project’s approach, integrating mental health support into the core framework of the masterclass platform.

Further Reading

For a detailed account of this enlightening conversation and my perspective of the importance of a psychologist in UX research, refer to the full text available at the link below:

Conversation with Small Streamers

Revised Focus on the Learning Process

In this renewed phase of research, the focus shifted to understanding the learning processes and needs of small streamers more comprehensively. This effort revealed significant insights about the educational and psychological aspects of streaming.

Initial Naivety and Psychological Risks

Most streamers begin their journey with minimal understanding of the complexities involved in live broadcasting. They often start with an assumption that if they are comfortable playing games or discussing topics, they can easily handle live streaming. However, this naivety can lead to severe psychological challenges as they face real-time feedback and public exposure, which are often harsher than anticipated.

The Need for Professional Guidance

The conversations underscored the critical need for professional guidance in two main areas:

  • Technical and Tactical Expertise: Streamers benefit immensely from learning about the technical aspects of streaming, such as setting up equipment, optimizing video and audio quality, and understanding streaming software. Additionally, tactical knowledge including how to engage an audience, how to handle trolls or negative comments, and how to maintain a consistent streaming schedule are vital.
  • Psychological Support: Given the exposure to potentially negative interactions, professional advice from psychologists can prepare streamers to handle these situations without compromising their mental health. This support is crucial not only for dealing with stress and anxiety but also for building resilience against the volatility of viewer interactions.

Importance of Social Media Savvy

Furthermore, mastery over social media is highlighted as a key component of a streamer’s growth strategy. Effective use of social media can:

  • Attract New Viewers: By engaging potential viewers on platforms like Twitter, Instagram, and Facebook, streamers can significantly broaden their reach and attract viewers to their live streams.
  • Professional Growth: Building a strong online presence can help streamers professionalize their approach, attract sponsorships, and develop a brand that appeals to both viewers and potential commercial partners.

Conclusion

Thus, it is essential to integrate established streamers and psychologists into the educational framework of the platform to address both the skill and emotional well-being aspects of streaming. This comprehensive approach will not only enhance their broadcasting abilities but also safeguard their mental health, contributing to a more sustainable and fulfilling streaming career.

Sitemap, User Flows, and Wireframe

Sitemap: Structuring the Platform

The development of our platform begins with the creation of a sitemap, which serves as the architectural blueprint of the website. This crucial step involves mapping out the entire structure of the site to ensure that all parts are logically organized and interconnected properly. Here’s how the sitemap preparation unfolded:

  • Identifying Main Sections: The major categories such as Home, About, Course Catalog, Community, and Support were identified based on the platform’s goals and user needs.
  • Subcategories and Features: Each main section was further broken down into subcategories to accommodate all necessary features, such as individual course pages, mentor profiles, and interactive areas like forums.
  • Navigation Logic: The flow of navigation from one part of the site to another was meticulously planned to ensure a user-friendly experience that minimizes confusion and maximizes efficiency.

User Flows: Defining the Interaction

After structuring the site, the next step was to define user flows. This involved creating detailed diagrams that illustrate the path users will take to complete specific tasks. These flows help in understanding and optimizing the user’s journey through the platform.

  • Registration to Course Enrollment: A flowchart was created from signing up for an account to browsing courses and finally enrolling in a course.
  • Community Interaction: Another flow outlined the steps for a user interacting within the community section, including posting queries, responding to discussions, and accessing group mentorship sessions.

Wireframes: Decision for Desktop-First Design

In designing the wireframes for our platform, I opted for a desktop-first approach. This decision was based on the nature of the content being delivered — comprehensive educational courses that benefit from the wider display and richer interaction capabilities of desktop environments. Desktop interfaces typically allow for more extensive content display and more complex interactions, which are beneficial for learning platforms where users engage deeply with the material.

Rationale

  • Enhanced Focus and Usability: Desktop screens provide ample space to design cleaner layouts with well-organized elements, which can enhance user focus — a crucial aspect of learning environments.
  • Complex Task Management: More complex tasks, such as live class management and detailed course creation, are more easily handled on desktop due to the greater screen real estate and more powerful interface options.
Wireframes

Planning for Responsiveness and Mobile Access

Acknowledging the importance of mobile access in today’s digital landscape, the following steps are planned to ensure the platform is fully accessible and optimized across all devices:

  • Responsive Design: Post-desktop wireframing, the next step will involve adapting and optimizing the layouts for mobile screens. This ensures that the platform remains functional and user-friendly on smaller devices, catering to users who prefer mobile access or those who wish to learn on-the-go.
  • Mobile App Development: To complement the responsive website, a dedicated mobile application is in the pipeline. This app will not only replicate the website’s capabilities but also leverage mobile-specific features such as push notifications and offline viewing modes.
  • Live Class Capability: Both the responsive version and the mobile app will support live classes to ensure that users can participate in real-time interactive sessions without being tethered to a desktop, enhancing the flexibility of learning.

Style Guide

Color

Selection of Primary Color: Yellow

Yellow was chosen as the primary color for our platform for several strategic reasons:

  • Symbolism of Yellow: Yellow is often associated with optimism, clarity, and energy. By using yellow, the platform immediately evokes feelings of enthusiasm and vibrancy, which are essential for a learning environment that aims to be engaging and stimulating.
  • Modern Tech Appeal: Yellow is also suggestive of innovation and modernity. This aligns with our goal to present the platform as a cutting-edge solution for streamers who are looking for contemporary educational resources.

Implementation of Dark Mode

To complement the primary color and to cater to our specific audience — streamers and gamers — the site has been designed in dark mode:

  • Community Preferences: Dark themes are not only popular among gaming communities but have become a standard in most gaming interfaces due to their aesthetic appeal and reduced glare, which can decrease eye strain during prolonged use.
  • Accessibility and Visibility: Using yellow as a contrasting color against dark backgrounds significantly enhances readability, accessibility, and navigational ease. This is particularly advantageous under various lighting conditions, especially in low-light environments where users prefer dark mode settings to mitigate light sensitivity.

Typography

Choice of Typeface: IBM Plex Mono

For the textual content of our platform, we have chosen IBM Plex Mono as the primary typeface. This decision was influenced by several factors that align with the goals and aesthetics of our educational platform for streamers.

Reasons for Selection

  • Availability and Versatility: IBM Plex Mono is readily available on Google Fonts, making it an accessible choice for a global audience without compromising on quality. Its extensive family range offers versatility in application, from body text to bold headlines.
  • Designed for Readability: This typeface is designed with increased letter-spacing and open forms, which enhances readability. Its monospaced nature means each character occupies the same horizontal space, promoting a tidy and uniform appearance ideal for instructional content.
  • Modern and Technological Aesthetics: The clean, modern look of IBM Plex Mono complements the technological theme of the platform. It embodies a professional yet approachable tone that is crucial for educational environments, especially those tailored to digital content creation and streaming.

Contribution to User Experience

  • Enhanced Readability on All Devices: The clarity and spacing of IBM Plex Mono ensure that text is easy to read on any device, from desktop monitors to mobile phones. This is particularly important for our platform, which emphasizes accessibility and usability across different devices.
  • Consistency in Visual Design: Using a single, versatile typeface throughout the platform helps maintain visual consistency. This cohesiveness aids users in navigating the site more efficiently and reduces cognitive load as they switch between different sections.
  • Alignment with Digital Themes: The monospaced feature of IBM Plex Mono not only appeals to the tech-savvy users but also subtly nods to the coding and gaming culture, which is familiar to our target audience of streamers.

Buttons Design

Style and Aesthetics

In our design, we have opted for a sleek, flat button style by setting the border-radius to 0px. This choice not only emphasizes a modern and technological feel, appropriate for a digital platform aimed at streamers, but also adds a distinctive, clean edge that complements the overall minimalist design approach.

Specifications

  • Shape: The sharp, square corners of the buttons convey precision and align with the geometric clarity of the site’s visual theme.
  • Size: Each button has a standard height of 44px. This dimension is selected to balance aesthetics with functionality, ensuring that the buttons are easy to interact with across all devices, particularly on touch screens where tap targets need to be of adequate size to prevent user errors.

Color and Contrast

  • High Contrast Design: We employ a high contrast color scheme for the buttons to ensure they stand out effectively against varied backgrounds, whether that’s on light, dark, or vibrant sections of the site. This visibility is crucial for user navigation and interaction.
  • Text Visibility: The color of the text on the buttons is deliberately chosen to contrast with the button color itself, enhancing readability. This is particularly important in maintaining accessibility standards and ensuring that all users, including those with visual impairments, can easily navigate the site.

User Interaction

  • Comfort and Accessibility: The size and sharp design of the buttons make them comfortable for users to interact with, whether clicking with a mouse or tapping on a mobile screen.
  • Consistent User Experience: By maintaining consistency in button design across the platform, we help users quickly learn and become familiar with the site’s interfaces, reducing cognitive load and improving the overall user experience.

Alignment with Design Philosophy

These design choices for the buttons support the site’s overarching modern, tech-oriented theme. The use of square buttons integrates seamlessly with the geometric focus of the layout, contributing to a cohesive visual identity that is both appealing and functional.

High-fidelity Prototype

Overview

The high-fidelity prototype was meticulously crafted based on the foundational wireframes and the comprehensive style guide specific to this project. This prototype represents the culmination of the design process, showcasing a polished and interactive model of the application.

Development Process

  • From Wireframes to High Fidelity: Transitioning from the basic wireframes, the high-fidelity prototype incorporates detailed visual designs, including color schemes, typography, and UI elements as defined in the style guide. This transition is crucial for visualizing the actual user experience and interaction dynamics.
  • Integration of Style Guide Elements: Every aspect of the style guide — from the precise use of colors like the vibrant yellows and deep blacks, to the application of IBM Plex Mono typography — is embodied within the prototype. This ensures consistency and coherence in the visual narrative and user interface.

Features and Functionality

  • Interactive Elements: Unlike static images, this high-fidelity prototype is fully interactive. Users can click through links, buttons, and menus, experiencing the flow and functionality of the app as if it were live. This interactivity is essential for testing usability and ensuring the interface is intuitive and user-friendly.
  • Comprehensive Layouts: The prototype displays complete layouts for various screens including the home page, course pages, and user profiles. This not only helps in visualizing the spatial and aesthetic aspects but also in understanding the navigational flow and information architecture.

Visualization and Access

See how our prototype turned out by viewing the app navigation image below, which illustrates the sophisticated design and user-friendly interface. For a hands-on experience, test the navigable prototype through the following link:
Test the navigable prototype here

Final Considerations

The journey of creating a project, especially one as intricate as a platform for streamers, is filled with learning, challenges, and moments of insight. From the initial concept, through the research phase, to the final touches on the high-fidelity prototype, every step has contributed significantly to the final outcome. This process highlights the importance of user-centered design, where understanding and incorporating user feedback is pivotal to developing a solution that truly meets their needs.

The Star Streamer project, aimed at supporting and elevating small streamers, underscores the value of addressing the specific challenges these individuals face in a competitive digital landscape. By focusing on professional guidance, including lessons from established streamers and psychological support, the platform offers a holistic approach to personal and professional growth within the streaming community.

This endeavor also showcases the importance of a well-thought-out design process, from wireframes and style guides to high-fidelity prototyping. Each design choice, be it the color scheme, typography, or the layout of buttons and navigational elements, has been made with the user in mind, ensuring the platform is not only functional but also visually appealing and accessible.

Acknowledging the contributions of mentors and instructors along this journey is crucial. Their guidance and expertise have not only shaped the project but also the designer’s approach to problem-solving and creative thinking. This collaborative process highlights the value of mentorship and learning in the field of UX/UI design.

As this chapter closes and a new one begins, the anticipation of what lies ahead is thrilling. The lessons learned, skills acquired, and connections made during this project lay a solid foundation for future endeavors. The Star Streamer platform is just the beginning, a stepping stone to further innovations and contributions to the digital world.

Thank you to everyone who has been a part of this journey. Your support, guidance, and feedback have been invaluable. Here’s to the next challenge, and the continuous pursuit of creating impactful, user-centric designs.

--

--

No responses yet