Gamemates App.
New era gaming social platform.
Project in 2024
My Role
UI/UX Design
User Research
Modelings
Wireframing
Journey Mapping
Contextual Inquiry
User Environment Design
collaborators
Co-founder of Winky Technology LLC.
UI Designer
UX Designers
Front-end Developers
tools
Figma
Miro
Zoom
Canvas
SurveyMonkey
Overview
In a digital age where connectivity is key, the GameMates App emerges as a revolutionary platform designed to unite gamers across North America. With its innovative features, users can team up, chat, and hire pros.
I've been working on designing this app till 2024 as the UX designer, and eventually, it launches successfully on the App Store. I also made an introductory video for this app. In this case study, I will focus on how I leveraged contextual inquiry research to solve usability issues on this project in this case study.
Problem
As the GameMates app transitioned into its online testing phase, the platform was not meeting its key performance indicators - a lower-than-expected user retention rate and disappointing order completion volumes. This situation indicated that while the app succeeded in attracting initial interest, it struggled to maintain engagement and convert this into active, recurring interactions.
My mission was clear: to enhance the GameMates user experience by identifying and solving the core challenges users faced, thereby improving satisfaction and retention rates.
Discover problems.
Contextual Inquiry
We recruited five participants who matched our target user personas, giving priority to diversity in age, gender, profession, gaming preferences, and gaming platforms to ensure that the testing process collected more diverse feedback and perspectives.
Before conducting the formal interviews, I prepared a complete Contextual Inquiry Research Protocol, including the consent form, role assignments, interview script, and question outlines.
During every interview session, I fully engaged in observation, carefully recording the user’s feelings and responses throughout the usage process. I documented everything through video and written notes to provide authentic and valuable firsthand data for subsequent analysis.
Contextual inquiry is a user research method that involves conducting in-depth observations and interviews with a small number of users to help researchers fully understand their behaviors and real workflows. This method emphasizes interacting with users in real environments to capture their natural operating habits and decision-making patterns, yielding deeper insights compared to traditional questionnaires or interviews.
Analysis Process
Affinity Diagram & Modeling
To explore the findings the UX team obtained through contextual inquiry, I gathered the entire team for a meeting and built an affinity diagram. This step helped us visualize the relationships among different insights and identify key UX areas that required attention.
After completing the affinity diagram, we also developed several models, including the “User Day Model,” the “Sequence Model,” and the “Decision Point Model,” to further analyze and understand users’ specific contexts, behaviors, and decisions.
Findings & Possible solutions
-
Users encountered difficulties recognizing icons, such as the filter icon and the “LFG” (Looking for Group) icon.
-
We could add text labels next to the LFG icon and redesign the filter icon.
-
-
The recharge entry was hard to find.
-
We could ensure that the main menu icons were visible on all pages to provide consistent entry points and added a “Wallet” icon as a direct shortcut.
-
-
The order flow lacked key steps, such as consent to cancel or refund, which caused user hesitation.
-
We could build storyboards to reorganize and refine the entire user flow.
-
-
Users could not understand the difference between “LFG” and the “Hire a Game Companion” section.
-
We could add more explanations within the information architecture and interface.
-
Rethinking the Design
After narrowing down the scope of the research questions, I needed to find inspiration for the prototyping stage. In our UX team, each member drew a hand-sketched vision map to express the innovative ideas formed during user research. We then held a collaborative workshop to merge the best elements into a unified concept and used this collective concept to create a wireframe.
However, as I observed during the interpretation stage, the missing steps within the ordering process were causing users to feel lost and frustrated. To resolve this issue, we designed storyboards that covered all key activities in the new ordering flow. These scenarios included the companion receiving the order request, the user initiating an order request, the user browsing and searching for game companions, and the user initiating a cancellation request.
Redesigned Prototypes.
Amazing outcome!
Seamless Hiring Experience
To address issues found in user feedback and missing steps identified in model analysis, I redesigned the entire order process. From browsing Gamemate cards to chatting and agreeing to purchase terms, the interfaces and interactions are now more intuitive and streamlined. The addition of an agreement step reduces risks and enhances trust, making interactions smoother.
Clearer Searching // Filter Flow
Recognizing the complexity of our previous design, I reintroduced gamemate filters and streamlined the service search flow. By categorizing functional areas, we've made it quicker for users to filter options. It becomes a cleaner and more straightforward interface.
Enhanced Order Cancellation Flow
I streamlined the order history and cancellation process, eliminating the confusing judgment icon and adding a help center. This page addresses user needs, including cancellations, refunds, and reporting issues, improving support and community standards. The final enhancements include an order progress bar and terms agreement link which ensures a more intuitive and supportive user experience.
Hire a Gamemate Feature
To accommodate first-time users' limited familiarity with 'gamemate', I introduced a 'learn more' interaction and a pop-up window, explaining the page's purpose. A clear header was also added for clarity.
*Design Decisions:
In creating the vision picture, we debated the page design. Some designers considered adding a description under the title versus a 'learn more' button. Finally, the latter was chosen to avoid redundancy for returning users and to adhere to UX design's minimalism principle. The pop-up provides ample space for a detailed explanation and serves a dual purpose by offering a pathway to apply to be a gamemate
Expanded Navigation
Users reported they could not understand the icons of the expanded navigation bar. So I added texts with icons to clarify the functionalities.
Prototype Testing.
I conducted an A/B test with 12 participants to check my redesigned prototype's effectiveness and guide icon selection.
Remarkable Improvement in User Engagement
I tested the new post feature on "Looking for Group" with two groups. The success rate dramatically improved from 0% to 100%, demonstrating our effective redesign and optimized user interface for seamless interactions within the app.
Filter Flow Enhancement
Our latest task involved applying a filter to locate an English-speaking gamemate. The effectiveness of our newly refined filter flow was confirmed, with the success rate soaring from 16.67% to a perfect 100%. This demonstrates our commitment to enhancing user experience and functionality within the app.
Enhanced Design for Order History Access
I investigated whether our new design enhanced the way users access their order history. The success rate improved dramatically from 66.7% to 100%, and the average time to complete this task was significantly reduced from 38.5 seconds to just 15 seconds, demonstrating the effectiveness of our design enhancements.
My Learnings
I discovered how critical teamwork and effective collaboration are when working within a cross-functional team. It ensures alignment and leverages diverse perspectives to achieve project goals. Through this experience, I developed skills in building and refining various models tailored to solve complex problems, breaking down challenges into manageable solutions. This process not only enhanced my problem-solving abilities but also deepened my understanding of adapting strategies to meet dynamic project requirements.
