HIGH LEVEL TIMELINE
MAKE OF THE TEAM
SOFTWARE'S USED
2 Weeks
​
Paurush Rathi - UX Designer
Daksh Mewati - UX Designer
Figma, Figjam, Photoshop, Illustrator
Overview
This was a Freelance UX Research project which I did for MPL Originals. Project Octane is a real-time car racing game that offers various modes for players to compete with their friends or participate in tournaments, such as solo, duo, squad, and clan modes. Additionally, players can showcase their car collection and skills while also having the option to join a gang once they have completed the basic tutorial and have a good understanding of the game mechanics.
The Problem
Mobile gaming is a highly competitive and rapidly evolving industry, most mobile games are providing an overwhelming amount of information to players, which can lead to confusion and a lack of understanding. At the same time, there is a lack of strategic information about the opposing team, leaving players at a disadvantage during gameplay. In addition, most games fail to cater to the different motivations of both casual and professional players, leading to a subpar experience. These issues can result in frustration and disengagement among players, ultimately leading to a negative impact on the overall user experience.
The Solution
Project Octane has successfully addressed the common problems faced by mobile gamers. To do this, we created lo-fi digital wireframes that aimed to address issues such as information overload, a lack of strategic information, and catering to the different motivations of casual and professional players using various gamification techniques. By designing wireframes that catered to these issues, we aimed to provide a seamless and engaging user experience for players. Although the game was still in the development phase, our wireframes helped inform the game's eventual user interface design and provided guidance on how to create a more user-friendly and intuitive gaming experience. Overall, our work on the project aimed to help Project Octane stand out in the highly competitive mobile gaming market and provide a unique and enjoyable experience for its players.
MY ROLE
- UX Researcher
​
-
Stakeholder Interview
-
Market Research
-
User Research
-
Wireframing
-
Design Feedback​
If you think good design is expensive, you should look at the cost of bad design.
Design Process
We utilized the Double Diamond approach for this project, which involved two main phases. In the first phase, we conducted thorough research by speaking with stakeholders and users, as well as analyzing our competitors. In the second phase, we focused on ideation and design by sketching out ideas and obtaining feedback.
-
Stakeholder Interview
-
Competitive Analysis
-
User interview
-
Affinity Diag.
-
User Persona
-
Empathy Map
-
HMW Statement
-
Card sorting
-
Inf. Architecture
-
User Flow
-
Wireframes
-
Final Solution
-
Design Feedback
DISCOVER
(UNDERSTANDING THE USER & MARKET)
To commence the project, I conducted a stakeholder interview and carefully reviewed the project brief. By doing so, I was able to gain a deep understanding of the client's needs, preferences, and objectives, and got the following set of Business requirements/Constraints which allowed me to develop a design strategy that aligned with their vision.
User Profile
The players can showcase their proudest achievements here, and see their career statistics which will be visible for other players as well.
Achievements
Ability to choose which achievements go on display else default logic by hardest to earn achievement to easiest alternatively by recency
Car Wise Stats
Car wise statistics should be provided to users and competitors to figure out strategy and assess strengths and weaknesses.
Race History
To allow people to analyse their performance and see if they are improving, show off and get connected with other players and report cheaters.
Competitive Analysis
Following the initial project review, I conducted extensive market research, analyzing a range of competitors, including direct and indirect competitors such as car racing and battle royale games. By studying their information architecture, I was able to identify gaps and opportunities in the market.
User Interview
Next, I conducted a user interview with both casual and Power users to gain a better understanding of the goals, needs, frustrations, and motivations of them.
To gain meaningful insights from the user interview responses, I used the affinity mapping technique to group similar responses together. This enabled me to identify patterns and themes
INSIGHTS
Both casual and the pro users don’t like too much information on screen
Pro users interact with user profiles in 3 different ways based on their motivation:
-
They see their own profile only when they unlock new badges or achievements. They also showcase it on their profile
-
They view their friends profile to compare their stats and maintain a healthy competition
-
They would not like to see the detailed information of random people unless they want to trade something with them
Casual users interact with user profiles in two ways based their motivations:
-
They’re not really interested in their own profile and just vitis it if they want to share their username or change their profile picture.
-
They want to see the detailed car wise stats of their friends and random people, to see their cars or to learn from them and strategize
Casual users are just interested in the immediate game stats that come after every game. They would not deliberately see their match history
​
​
​
​
​
​
​
Pro users like to see their match history after every other game to analyse their skills and have fun/serious discussions with their friends
Max users liked multiplayer gaming because of its socialising feature.
​
​
​
​
​
​
​
​
​
​
​
​
​
​
DEFINE
(SCOPE DOWN THE FOCUS)
Using these insights, we created detailed user personas and empathy maps, which helped us to gain a deeper understanding of the target audience by highlighting their goals, needs, motivations, and pain points.
USER PERSONAS
Problem Framing
To further guide the design process, we used the insights gained from the empathy maps, personas, and initial research to formulate HMW (How Might We) statements. These statements served as a valuable reference throughout the design process.
-
How might we help Cindy to socialize with her friends while playing online?
-
How might we help Paul to start another game with the same team without him going to the lobby?
-
How might we show relevant strategic information before starting a match to help them create a strategy?
-
How might we help Cindy to join a game in the simplest way possible?
-
How might we bring coherency to the design while showing necessary information throughout the app?
DEVELOP
(GENERATING SOLUTIONS)
Having gained a comprehensive understanding of both the client's needs and the end-users preferences, it was time to commence the design process by developing potential solutions to the problems identified through research. In this phase, I created user flows, developed Information Architecture, and made paper wireframes and lo-fi designs.
INFORMATION ARCHITECTURE
I used a digital card sorting technique for creating Information Architecture.
USER FLOW
-
Legend
Start/End
Screen
Action
-
Starting a Match
Open App
Loading Screen
Login Screen
Daily Rewards /Contests
Match Starts
Select game mode, map/track
Home Screen
-
After game ends
Leaderboard (Gp)
game results (in rest)
Next
Loading Screen
Match Summary (individual)
(xp earned, badges, achievements unlocked, top 3 accolades)
Game Ends
Exit
TIME TO START DESIGNING
Once we were satisfied with our User Flow and Information Architecture, it was now the time to sketch wireframes on paper. We made lots of sketches for each screen.
P&P Wireframes
We created multiple wireframes and analyzed various design choices, such as displaying cars for aesthetics and creating a coherent design with a suitable radar chart. Our goal was to ensure that the design was easily understandable for both professional and casual users, while considering their respective needs.
Since this was a UX Research project, we did not make the Hi-fi prototypes or the UI for this app.
DELIVER
(SOLUTIONS THAT WORK & RECIEVE FEEDBACK)
Final Designs
After iterating a lot on the paper wireframes next, we started creating Lo-fi digital wireframes for every screen. Because of the space constraint, I am showing a few screens here.
1
USER PROFILE
The players can showcase their career statistics which will be visible for other players as well.
2
CAR STATS
The players can showoff their car collection and access stats to make strategies.
3
HISTORY
Users can analyze their performance, connect with other users or report cheaters.
4
ACHIEVEMENTS
Users can showoff their acchievements and accolades here.
5
INVENTORY
Users can trade their assets from here.
6
MATCHMAKING
Users can access leaderboard or compare their strengths and weakness with their competitiors to make strategies.
Design Feedback
Finally, we conducted a Design Feedback on Figjam with both the Product manager and the lead design team. The feedback we received was incredibly valuable, providing us with a fresh perspective on the designs. We carefully considered all the suggestions, making necessary changes where appropriate. However, for some of the suggestions, we respectfully defended our design choices with research and explanations. Overall, the Design Review was a collaborative and constructive process, allowing us to refine the designs and ensure they met the needs of all stakeholders.
Screenshots
TITLE OF THE CALLOUT BLOCK
LESSONS LEARNED
This project was both challenging and enjoyable. Collaborating with a senior designer provided valuable insights into meeting tight deadlines and managing project constraints that tremendously helped me to grow as a designer. I gained firsthand experience that cannot be obtained in a traditional classroom setting. Some of the key learnings were -
-
Effective communication with stakeholders is crucial for successful design projects. Setting clear goals and establishing transparent communication channels, promotes collaboration, encourages feedback, and ultimately leads to successful outcomes.
-
As UX designers, it's important to seek out fresh perspectives from other team members. By actively listening and engaging with others, designers can gain valuable insights and ideas from unexpected sources. Keeping an open mind and a willingness to collaborate can lead to innovative and successful design solutions.
-
“People ignore design that ignores people.” - designing without a focus on the end user can lead to ineffective and irrelevant design solutions.