Prototype: Assist female gamers search for fellow players to create new bonds and enhance their video gaming experience.
Role: UX Designer - Including product design, research, product development and build brand identity
Timeline: Jan 2022 - Apr 2022
Tools: Figma & InVision
Platform: iOS & Desktop
Ongoing Harassment in Video Games with Female Gamers
As the industry is already male dominated, females have struggled finding balance when it comes to playing video games. Female gamers encounter continuously encounter harassments while playing games and have no outlet of support
Their experiences are entrenched in traversing stereotypes and gender discrimination in order to achieve positive outcomes within the video game field, which causes women to feel discouraged and unsupported.
As mentioned, the video gaming industry has always been male dominated, and therefore businesses and marketers see this as an opportunity to market to mainly males.
Thus, there are no benefits to cater the female market in the video gaming industry to help support this demographic as they are portrayed so poorly within the industry.
Problem Space
I began my secondary research regarding a typical experience for an average female gamer and concluded with supporting statistics that showcase large percentages of various harassments female gamers face
Secondary Research
How can we support female gamers?
I formulated a How Might We according to the problem space to first drive the direction of creating a solution:
How might we help female gamers feel respected and supported with their gender within the gaming community to create better and positive experiences?
Primary Research
Prior to conducting my user interviews, I have thought of some personal assumptions according to the secondary research. Throughout my user interviews, I will conclude if these assumptions are true or false.
These assumptions include:
There is a lack of safe space for female gamers to openly play video games without encountering harassment and gender discrimination
Female gamers cannot achieve the same level of skill or higher as male gamers
Female gamers are given easier and supportive roles in order to play at the same environment as males
As a female gamer, success is measured and recognizable only through the satisfaction of appealing to male audience and gamers’
The video game industry is dominated by males
What about Playlab?
User interviews
Based on the secondary research, I chose the direction of creating a digital solution that includes features chat room gaming lobbies, specific skill training and mentorship programs from successful and popular streamers, along with professional Esports female players to support members
To extend my research, I conducted 6 female gamers ages 21-30 through an online video call who are experienced and inexperienced (with at least 3 weeks of gaming experience) in the online video gaming scene to get a better sense of their gaming experience.
Interview Results
“There is no winning with them so I want to get to a point where their complaints don’t bother me because I know my skill.”" - Crystal (29)
“I will mute their comments or voice chat if it gets overwhelming. If it gets to the point where it's harassments, I will try my best to not talk back to them and just report them after.”- Cassandra (25)
“I think competitive Esports leagues for females are more uncommon and do not have as much exposure as the typical Esports game showcased and streamed on twitch or any streaming platform.” - Christina (26)
After conducting user interviews, I organized common pain points, motivations and behaviours in order to synthesize themes and patterns through their experience of online gaming
With the collected data from our secondary research and interview insights, we can now formulate themes:
Sexism
Sexism is a huge issue within the video gaming industry as it’s predominated by males and caters towards them as a business market
Lack of Communities
There aren’t enough exposure of communities and social platforms that allow female gamers to meet and connect with one another
Less opportunities for female gamers to showcase their stories, skills and build a platform
Gender Discrimination
There are assumptions that females are incapable of keeping up with males when playing video games and are swayed towards that require less skill in order to partake in a video game
Primary Theme & Insights
After conducting user interviews, I analyzed and organized pain points, motivations and behaviours. I concluded with the primary theme focus for the direction of the digital solution, which is community growth amongst female gamers
By establishing a safe space for female gamers, the positive outcomes vary:
Fellow female gamers want to empower other women to encourage one another for positive mindsets
A community can help females connect and form new relationships enticing comfort of playing together in a male dominated industry
A variety of advices and input from fellow female gamers as well as implementing different programs within the community can help female gamers that want to improve their skills
Defining Constraints
In order to design a solution to alleviate the target demographic, I had to consider realistic situations that can potentially occur when designing a digital solution.
Some constraints include:
Sexism and gender discrimination is overall a difficult subject to drive change in a male dominated industry due to ongoing history and experiences from video game players
Businesses will always take advantage of the larger target market, thus it challenges the inequality of sexualizing female gamers and characters within the industry as long as it is benefiting the business
A digital solution can be created for female players, but it will not stop males from creating fake user accounts pretending to be female to enter the community and cause issues
User Journey and Persona - Meet Alyssa!
After synthesizing interview findings and themes, I crafted a persona and experience map to define potential ideations and design solutions
I created my persona based off user interview findings to formulate her story, her personality and experiences
Alyssa’s Experience Journey as a female gamer on an average day
This experience map showcases the persona’s pain points which allow us to better understand the user's experience in order drive a direction into designing possible design solutions
User Stories
Based off my persona’s needs, I created users stories in order to understand product functionalities from a user’s point of view. This will help determine which functions are prioritized to meet the user’s needs within my digital solution
Primary Epic: Connecting Female Gamers
Throughout the user stories, I found that the major epic would be connecting and interacting with fellow female gamers within the community, whether it is playing games with them, meeting and developing new relationships or attending all around community events of the users’ interest
Task Flow
After identifying my primary epic, I formulated the primary task flow considering how the user would interact with the product to complete certain tasks
The task flow created for this app includes the user having the option to log in through other social platforms, but ultimately choosing Twitch to sign in would be ideal because it allows the app to incorporate the users’ gaming data since Twitch has many games that allow it to connect with their account.
The user is presented with onboarding questions so the app can implement the users’ interest to formulate a proper homepage that would appeal to the users’ taste of games.
Based off the experience map, I connected the user’s objective of searching for a game lobby of her game of choice.
This is the first task flow I designed
Time to Ideate!
Inspiration and Sketching
After determining the main task flow, I sketched and designed low-fidelity wireframes screens based off inspirations from browsing through different gaming UI designs and Twitch.
Sign in/Sign up Page - Also allow users to sign in through other social media accounts
Home Page Layout
Onboarding Question - Template 1
Onboarding Question - Template 2
Transferring sketches to Low Fidelity Wireframes
User Testing
In order to develop the best user experience, I conducted user testing with my mid-fidelity wireframe and prototype
I conducted two rounds of 5 user testings while instructing each user to complete 7 tasks. The purpose was to see how users naturally use the product and gain feed back in order to implement improvements according to their experience. I used the insights and formulated a design prioritization matrix to determine the highest impact on usability while considering the time constraint of changes
Modifications
Login Screen
I added an authorization screen for users to log in through other social media platforms. The authorization screen allows the users to understand that their account information will be implemented through other social media platforms into this app
Revise Restriction Statement
I designed a screen layover that tells the user that they are unable to join a lobby due to their rank differences. During the user test, 50% users indicated that they felt discouraged that they were unable to join a higher rank lobby. However, the remaining 50% also understood their place within the rank and did not mind the statement restriction
Create a larger “Ready Up” Button
Users were confused with the ‘check mark’ that I created to be a button to read up when players are ready to play.
I then created a button so it is more evident that the button is used to indicate that they are ready to play, rather than a symbol.
Invite Feature (Removed)
I really wanted to incorporate an invite feature where the app would send an invite on behalf of the video game, however it seemed very far fetched as well as unrealistic for developers to code that into the system. Instead, I opted out the lobby room to become a chat room system, where fellow female gamers are still using the app to connect with other female gamers to play the game, but with the chat room, users can easily exchange information that way.
Revised Task Flow
With those implemented usability changes, I decided to revise my task flow
The new task flow show the changes as during the user testing, some have indicated the purpose of the invite feature as well as the ready up feature. In order to make the app more
With the new task flow and applying the new modifications, I concluded my mid-fidelity prototype by changing the final two screens within my task flow which were the filtered lobbies and the lobby chat room. I kept the sign in screen, onboarding questions as well as the home page screen
Branding
After developing my final prototype, I began to create my brand identity for my digital solution. I thought out out of some adjectives that would describe the feel and look of the app as the following:
Chill
Cyberpunk
Togetherness
Motivational
Cool
Sociable
Empowering
Metaverse
The images and colours I chosen for my moodboard represents the primary colours, typefaces and tones to reflect my brand’s personality. The chosen font style is a typeface that is commonly used for computer screens as it is simple, clean and easy on the eyes
Moodboard
Wordmark
During the low fidelity stage, I developed a wordmark for the app. I trialed through other options and decided to change my wordmark to PlayLab as it seems more suitable as it provokes more fun, easy going and exploratory with diverse gaming options
High Fidelity Prototype
After determining my brand’s identity, I was able to implement these UI elements into the final design to create the high fidelity prototype. I also fixed the scaling and layouts by using proper grid measurements and spacing blocks (8 pixels)
4 columns
Frame: Iphone 11 Pro / X
Colum Width: Auto
Gutter Width: 16px
Margin Width: 24px
Marketing Website
In order to further market Playlab, I explored options that would reach the target demographic to gain market exposure. Considering that the target users are tech savvy and that there are many PC computer games, a marketing site is crucial for Playlab as it will showcase more information regarding the app itself and its features.
I incorporated Discord as a multi-cross platform for users to have easy access to communicate with one another, also to receive event up dates and overall bond with the community with lifestyle posts, photos, video game topics
The user can now look for community events through the app and use Discord as a form to receive further information from other users as well ask questions for upcoming future events
Tarot Card of Tech
Tarot Cards of Tech is something fun and engaging to help UX designers expand on ideas and brainstorm solutions regarding their project. This activity was helpful as it opens up many thought processes and allows the designer to think about potential situations that can affect the product.
I chose this tarot card as my product is based on an online community for female gamers. One constraint I thought about was the idea of somebody portraying themselves as a female and entering the safe established community and emitting toxic behaviour within the community.
If someone dangerous enters the community, it can put female gamers in an uncomfortable position within chat rooms and even community events. The target would be females as this app is designed for female gamers. There and endless possibilities with potential harassments could happen when placed within the wrong hands. Harassment can be lead to an extreme especially since it’s behind a screen
Future Improvements
With more time and space, I definitely plan on improving the app to deliver a better experience for users such as:
Further user testings and exploration of other functionalities and design of the app
Implement authentication feature to provide a secure safe space for female gamers and users to use the app
Key Learnings
Creating Playlab has definitely taught me many aspects to consider as a UX/UI Designer. The whole process itself from researching, user testing and designing made me realize that as a UX/UI designer, you will be required to bounce back and forth in order to provide the best user experience as there are multiple changes required to produce a well designed product.
Some key take away during this experience were:
Focus on your user. They are the main reason of designing UX and it is process digging and forming a solution while it is was to just assume what is needed. A lot of research is required to further understand what a user would want and need to alleviate their problem.
User testing early on is super productive and helpful as it gives more time as the designer to prioritize changes to form a better user experience for the app. From my experience, i felt that I was too lenient with scheduling user testings and it was off their schedule which caused my time management to be tighter to implement changes
Always consider the How Might We and problem space a the back of your head. For me, I was easily drawn to other ideas to incorporate in the app which caused me to re-evaluate my design decisions and made it difficult to connect my design with the problem space