The UX Design Process: Empathize
The problem:
The gaming scoreboard application lacks features that are important to the user and will stand out from the competition.
The goal:
Design a new way for VS to create a sense of community, increase interaction with other users, and engage with more of the site.
User Research
Summary
I conducted interviews and created empathy maps to understand the users I was designing for and their needs. A primary user group identified through research is gamers who participate in live-streamed gaming content.
This user group confirmed initial assumptions about VS's users. However, research also revealed that high-score achievements are a goal of some users, but issued challenges piqued users' interests for many reasons. Those reasons would include game replayability, the interaction that gives a feeling of community, and a sense of achievement even if the individual's game wasn't the new record-setting score.
Pain points
Community
Many busy gamers don’t have the opportunity to play with friends often.
Static Standings
Many max scores are already listed in the games' records, causing replayability to fall due to existing records that users can't beat.
Single Player Content
Many games are single-player without any multiplayer, cooperative, or even scoring to complete with friends.
Persona : Sachi
Sachi is a variety Twitch Streamer who needs to engage with her followers because it strengthens a sense of community with them all.
Goals:
- Secure way to record her gaming achievements
- Fan interaction through competitive gaming
- Increase her community by engaging her followers and welcoming new ones through events
Frustrations:
- “No real place to showcase my gaming achievements”
- “On a male dominated platform, female streamers’ achievements should be celebrated too”
Sachi is a current college student and part-time Twitch streamer. She streams competitive League of Legends tournaments, cosplay, and Live Action Role Playing content. Sachi wants to attract more people to her community. She streams with her sister, who is color blind, and wants to include anyone in her diverse community that has disabilities as well.
Persona: Darren
Darren is a full-time student and gamer who needs a way to compete with his friends because they're as busy as he is.
Goals:
- A site for issuing a challenge to friends and a way to track the results
- An option to play whenever and report results back to the group
- Leaderboards for friend groups as well as a global arena
Frustrations:
- “All my friends are involved in different activities and we can’t all get together at the same time to game anymore. It's frustrating we have a hard time getting together like we used to and game for hours.”
- “Just because you say you out played me, doesn’t mean anything if there’s no record”
Darren is a full-time high school student and gamer. He spends his extra time with friends playing games in the arcade. Due to extracurricular activities and studying, they all have different schedules and can’t always play together. Darren wants everyone to feel like they won’t miss out on the fun and still compete in their competitions. He believes games are more fun with more players and better challenges!
The UX Design Process: Define
Competitve Audit:
VS started as a web app where gamers could upload their achievements. After conducting a competitive audit, I decided that a community-building feature would set it apart from the competition. Allowing users to challenge other users would be a great way to build a community and increase engagement. Although many games have a competitive aspect, there is no one-size-fits-all solution, and the design would have to consider that.
Level Up!
There are certain features we wanted to prioitize for the app. We needed to make sure the new user experience would meet the needs of all gamers.
Competitive AuditMust Haves:
- Simple to follow user flow
- Flexible options for challenges
- A way to see ongoing and completed challenges
- Ways to share challenges outside of the app
- Address accessibility across the entire user flow
User Flow: Challenge!
Finding ways for users to create new challenges for old games and create replayability and a sense of community was our top goal for the app. I designed a user flow that has multiple entry points and is easy to understand. Since all games are different and there is no one-size-fits-all solution, there needs to be some flexibility in the customization of the challenge options. Users also wanted a way to preview their challenges before submission.
The UX Design Process: Ideate, Prototype, and Testing
The Process:
I started with rapid iterating on the design with paper wireframes and mockups. I then built digital wireframes using Figma and the best design elements from the paper concept sketches.
First Iteration
I translated the best elements from the rapid paper iterations to digital wireframes, and I created a rough low fidelity prototype for the first round of usability testing. This minimal prototype helped reveal flaws in the initial design and missing elements from the user flow.
First round findings:
- Initial design lacked a page dedicated to show challenges
- Users wanted more diversity in achievements and games
- Account page needed redesign
Second round findings:
- Users want to access challenges easily
- Users needed confirmation pages for submitted options
High Fidelity Mockups and Prototype
I addressed the issues brought to light from the first round of testing and put together mockups and a high-fidelity prototype. The user flow is more intuitive, and the design is more accessible. There are multiple ways to access challenges, and the user can review the challenges before submission. I redesigned the account page to make accessing and updating information easier. The challenge information was formerly on the account page; moving the challenges to a separate page creates less visual clutter and a more intuitive user flow.
The Result
Hi-Fi Prototype
