HYDRA:
designing a user-centered gaming companion
Helping You Defeat Rivals Always
Role
Skills
Timeline
Product Developer & UX Designer
Wireframing, Prototyping, User & Market Research
2 Quarters (In My Free Time)
Introduction
HYDRA, an app for gamers, facilitates seamless group formation and co-op interactions, providing access to expert-curated guides for an enriched gaming experience.
Background
HYDRA is a passion project originated from my analysis of a lack of finding a smooth way to join a Co-Op gaming group.
problem
In multiplayer gaming, players struggle to easily form compatible teams due to the random team joining or the challenge of finding friends with similar ranks.
Existing games lack native community features, leading players to rely on third-party apps. HYDRA aims to streamline these issues, offering a unified solution for seamless team formation and community discovery in gaming.
User Research & Insight
Key Pain Points
-
The majority of players experience unbalanced matchmaking within their games.
-
Toxic behavior by teammates within games hinders the experience for players.
-
Teammates who disconnect or are “AFK (away from keyboard)” are a big issue.
The biggest need of the user and gamers is to find consistent, respectful players and communities to play with. HYDRA needs to be the platform to connect players for a healthy, respectful, and enjoyable gaming experience.
Competitive Analysis
Where are players currently finding communities and gamers?
The main platform that gamers are currently connecting on is Discord, followed by Xbox Live, then Facetime/Call. However the overwhelming majority is through Discord with 64.3% of the respondents stating that they use it.
The Competitor Rundown…
Discord
Discord is a versatile cross-platform communication tool that excels in diverse group discussions. With features like text, voice chat, and video chat, it offers a user-friendly interface and robust community-building tools.
Xbox Live
Exclusive to Microsoft platforms, Xbox Live is a gaming-focused service with features like multiplayer gaming and social interaction. Tailored for the Xbox community, it offers a specialized interface but may be limited for users not using Xbox consoles.
FaceTime
FaceTime, exclusive to Apple devices, is a straightforward personal communication tool for video and audio calls. With a simple and intuitive interface, it lacks the extensive features of gaming or community-oriented platforms, making it ideal for casual personal communication but less suitable for broader group interactions.
Early Success
What helped point the project in the right direction was a mix of early user interviews that helped target pain points and user needs, and a competitive analysis that assisted in differentiating HYDRA in the market.
Overall, these early successes were crucial in addressing overlooked pain points such as toxicity.
Greyboxing
These are the main screens of the app designs including onboarding, home, search, and guides tab.
First go around of the design
When trying to figure out how to design the high fidelity screens, I realized that the first iteration was problematic in many different areas. Mainly in:
User Flow
Consistency
Visual Hierarchy
Sacrifices & Overhaul
To make sure I am making healthy progress to my design, I had to do an in-depth analysis and get my hands dirty in doing a complete rework of the design to find the issues in my current screens.
Main Concerns:
-
I had too many screens for the user to sign in. From this I realized that I needed to consolidate them into an easy to use experience
-
The color combination of the design was not harmonious and difficult to look at
-
By using UX best practices, I also made sure to remove some icons that could be confusing for the user
Setback
Rushing through the wireframing phase led to a disorganized and unfocused design.
Realizing this setback, I undertook a complete overhaul, emphasizing the importance of a thoughtful and deliberate approach in crafting a user-centric experience.
Back to the drawing board
iterating the design
Sign Up/Log In
Before
The previous signing in screens had too many buttons to complete a singular action. To fix this I consolidated it to a streamlined flow.
Changed Made
Instead of having 2 separate screens for log in/sign up, I created a slider to toggle between logging in & signing up, creating a seamless interaction between the two.
After
Onboarding
Changed Made
Informational support text for game genres added to help users learn about the games they are interested in, helping the algorithm personalize the users experience
Before
I divided the onboarding into clear steps, each focusing on a specific aspect of the app's functionality and setting up the user's profile. This allowed users to absorb information gradually.
After
Parties & Voice Chat Function
After
Parties are the main server function where players can join to find other players.
The initial LoFi screens did not have a pages tab, which highlighted to need for one. I also wanted to make sure that the design is fulfilling the user needed for healthy and non-toxic gaming environments.
Changed Made
To target the user need of decreased toxicity and focused gaming sessions, a lock feature is added. The lock features allows users to lock their voice chat so their session is undisturbed and notify other members to not disturb their session.
Before
Crisis
During a turning point in my design, I realized that I had addressed the issue of visual design, but I needed to target more of the app functionality and features. This compelled a deep reevaluation of my design, prompting strategic adjustments to better address these user needs.
This crisis, though challenging, became a pivotal turning point, propelling me to hyper-focus on the user and fortify the foundations of the project, ensuring it not only meets but exceeds the expectations of the user needs.