TOMO
An end-to-end mobile app that helps gaming content creators discover and connect with like-minded collaborators to build meaningful friendships.
The Challenge
Gaming content creators struggle with finding like-minded individuals to collaborate with.
In recent years, there has been a significant rise in people engaging in streaming activities. Since the COVID-19 pandemic, approximately 3.5 million individuals have started streaming on Twitch.
Many have utilized streaming as a way to meet new people. However, it can be difficult to form a new community when one first starts out.
Individuals face difficulties in finding creators of interest due to the absence of structured methods in doing so. The prospect of meeting new people also becomes daunting and anxiety-inducing due to the potential for negative interactions.
My role as a UX/UI designer was to help creators find like-minded individuals to collaborate with and form long-lasting friendships.
Final Solution
Community Dashboard
A centralized hub that gives gaming content creators a snapshot of what’s happening in their community.
Trending: Highlights popular games within the community, helping creators discover titles that may lead to more collaboration opportunities.
Creators: Showcases potential collaborators based on shared interests, increasing visibility and connection opportunities.
Forum: Displays recent posts from the community, offering a space for creators to ask questions, share experiences, and support one another.
Finding a collaboration
There is currently no structured way for content creators to view key information needed to decide whether to collaborate with someone.
To address this gap, each collaboration post displays essential details including the game, date, host, and other information to support decision making.
Content creators can use search and filter features quickly to find games they are interested in.
After selecting a post, content creators can view additional details to determine if the collaboration is a good fit.
Opportunity to learn about potential collaborators
Before reaching out, many content creators try to learn more about potential collaborators but that information is difficult to find.
Instead of searching through multiple sites or platforms, content creators can view everything they need in one place.
Each profile includes:
Responses to interest prompts
Games they play
Stream clips
Upcoming collaborations
Research
I conducted online surveys and user interviews from gaming content creators to understand their motives and process in finding other creators to collaborate with.
Why become a content creator?
Connect with like-minded individuals: To build a supportive social group where people can enjoy spending time together and having fun.
Social interaction: While many individuals identify as introverted, there remains a genuine longing to engage in conversations, share memorable moments, and enhance their gaming experience.
Background research: Users have access to content creators social media or VODs to assess their likability.
Current methods for finding collaborations
Discord servers and Twitter were the most common platforms used. Creators vet others by reviewing social media profiles to evaluate personality, content style, and overall likability.
Important Criteria for Choosing Collaborators
From a Likert-scale survey, creators rated these five factors as most important. Additionally, many creators noted they are more likely to collaborate with someone if they share mutual friends, as it adds a layer of trust and familiarity.
Why are finding collaborations difficult?
Lack of information available about potential collaborators
Many creators, being introverted and cautious about meeting new people, prefer to have information about potential collaborators before reaching out; however, it's not always readily available.
Hesitant to make posts due to unspoken first-come, first-served rule
Creators are often obligated to accept someone who expresses interest to their post on a first-come, first-served basis, even if they don't necessarily want to collaborate with that person.
Information is not easily accessible
The ineffective organization of posts in Discord servers, along with the limited accessibility of crucial information makes it difficult to find collaborations of interest.
Ideation
Drawing from user research, I created user flows for both finding collaborators and creating a collaboration post. However, due to time constraints, this project focused exclusively on designing screens that support the flow of discovering collaborators through existing posts. The flows for creating a post or accepting collaboration requests were not explored.
Key Takeaways
Many become content creators to form a community of people to game with but many suffer from social anxiety.
Due to previous negative interactions with people online, content creators put in time and effort before reaching out to others for a collaboration, which can be taxing.
Content creators need:
A safe and pressure-free environment to connect with others.
A structured and accessible way to review collaborator information, helping creators make more informed, intentional decisions.
Finding inspiration from competitors
To inform my design decisions, I conducted a comparative analysis of apps with similar goals, including ePAL and dating platforms, to explore proven patterns for connecting users with shared interests.
Branding
TOMO means friend
As the primary goals of content creators were to create new friendships, I named my product “TOMO”, which is the word for “Friend” in Japanese. The name reflects the app’s core mission: to provide a safe, welcoming space where creators can connect with like-minded individuals and build genuine relationships.
Designing the logo
The gaming controller motif is created by two people forming a circle through a hugging gesture, representing a community of gamer friends.
The people in the design also resembles eyes, highlighting the viewership aspect of streamers in the gaming community.
Style tile
“TOMO” is built around the values of connection, trust, and happiness, which are conveyed through a calming, blue-centric color palette.
To cater to the gamer demographic, a darker shade of blue was chosen as the primary color, complemented by pink accents to create visual contrast and highlight key actions.
Initial mockup designs
Home dashboard
Users have quick access to:
Trending games: Games that are popular among the community
Recommended Collabs: Collaborations that might interest the user
Upcoming Collabs: A reminder for all upcoming collaborations
Creator Spotlight: Content Creators that might interest the user based on interests
Community Forums: Recently posted forums from the community
Collab(oration) page
Displays a list of currently available collaboration opportunities.
Includes filter, sort, and search functions to help users find collabs that match their interests.
Allows users to create and publish their own collaboration posts.
Mutuals
Users can easily identify collaboration posts involving mutual connections by looking for the mutual icon displayed above.
Knowing that a potential collaborator shares mutual friends helps foster a greater sense of trust and safety.
A toggle switch allows users to filter the list and view only posts made by mutual connections, making it easier to find collaborators within their extended network.
Selected collaboration post
When a content creator selects a specific collaboration post, they are taken to a detailed view of the collaboration. This page includes both the Info Tab and Group Tab, allowing users to review key details to help users determine whether the collab isa good fit before requesting to join.
Info tab
A brief description of the collaboration's purpose or goals
Game settings (e.g., platform, game mode, region)
Scheduled date and time for the collaboration
Group tab
Displays a list of all participants involved in the collaboration.
Users can tap on any creator’s profile card to view their full profile and learn more before deciding to join.
Creator profile page
The Creator Profile Page offers a deeper look into each creator’s personality, interests, and gaming habits.
BIO
GAMES
CLIPS
COLLABS
About me
Meow meow! I’m Jessica, a cat vtuber with psychic powers. I’m still new to gaming so don’t expect any pro games from me~
Mature
Easy-going
Friendly
Chaotic
Energetic
Can’t live without...
COFFEE!!! COFFEE!!! COFFEEE!!!!
Favorite Anime
Mutuals
Creator profile prompts
Creators can showcase their personality and interests by responding to a series of curated prompts.
These prompts highlight each creator’s individuality and make it easier to identify shared interests to spark meaningful conversations.
Users can also see any mutual connections they share with the creator, adding a layer of trust and familiarity.
Creator games
Users can browse a carousel of games that the creator plays.
Selecting a game reveals additional details about the creator’s rank, server, and console.
Each game card includes personal commentary written by the creator. It may include what they’re looking for in collaborators or how they typically engage with the game.
Testing
Many users expressed positively to how the collaboration system works. They particularly liked how easily accessible information regarding collaborations were and the information provided on the profile page.
Across all users, there were consistent problems during the usability testing that must be addressed.
“This is so awesome! It's exactly what I need! When is this going to be released?”
Profile Card
Collab Card
80%
of users could not navigate to creator’s profile page
Cards were visually indistinguishable
The collab and profile cards looked too similar, leading to confusion and low interaction with the profile card.
Poor text hierarchy
Lack of clear visual hierarchy made the card content difficult to read and scan.
Collab card iteration
Removed creator tags
Tags lacked clear purpose or meaningful context, and were removed to reduce visual clutter.
Improved readability
Applied color coding and text styling to create stronger visual hierarchy and make key details easier to scan.
Before
After
Profile card iteration
Redesigned profile card
Switched to a square profile image occupying one-third of the card, creating clear visual distinction from the “Collab” card.
Removed unnecessary information
Removed the intro text and game rank to reduce clutter and prioritize key details like tags users identified as most important during testing.
Creator profile page iteration
Standardized profile visuals
Updated the profile image to a square layout for consistency with the Profile Card design.
Enhanced information hierarchy
Removed the navigation bar to reduce visual clutter and help users stay focused, as it was found to be distracting during testing.
Rethinking what is essential...
Removed overlapping pages
Removed “Homepage” due to significant content overlap with the “Community” page.
Reorganized navigation to support creator goals
Prioritized easy access to the collaboration schedule to better align with user preferences and task flows.
Also moved the “Messages” feature from bottom to top navigation to reflect lower usage while still keeping it accessible.
Before
After
Lessons Learned
Not all information must be presented at
all times
In an effort to streamline user tasks and reduce complexity, I initially presented a lots of information on all pages. However, this led to a cluttered design. As a result, I have learned to prioritize what is most important to users at each step, allowing for cleaner and more user-friendly designs.
Excessive consistency can sometimes hinder the design rather than benefit it
Due to designing the 'Profile' and 'Collab' cards too similarly for consistency, many users had difficulty distinguishing between them. It is crucial to employ distinct designs that assist users in differentiating various components of the interface to accomplish their goals effectively.