Rumbleverse
(Under Construction)
Rumbleverse is an online multiplayer battle royal game. The uniqueness of the game is it focuses on hand to hand combat with a comical twist.
I was brought onto the project during the production phase which posed interesting challenges since systems and features were already in place. I worked on designing and redesigning various features in the front end UI along with in-game and HUD work.
Following the game's release, our plan was to continuously iterate and implement UX and UI improvements that were initially left out. However, six months into the release, the publishing company had to make cutbacks, and Rumbleverse became a casualty of those financial constraints.
Project Overview:
My Role
Senior UX Designer
Team
Size varied between
50-75
Duration
2 Years
Process:
Accomplishments
We successfully employed UX design methods and user research to improve the usability and user experience of the game.
This project marked a pivotal moment in demonstrating the tangible value of UX, contributing to the elevation of the company's UX Maturity.
Various UX processes were strategically implemented to foster improved communication and collaboration within the UX/UI team for this specific project, as well as across all ongoing company projects.
Challenges
The principal challenge was the absence of UX process within the development pipeline This resulted in areas that were lacking structure. Here are a few of the high level friction points.
First, it was challenging to get User Test on the road map, conducted at a regular frequency and the results actioned.
Additionally, the absence of a structured feedback loop between UX, art and implementation resulted in a backlog of UX and UI technical debt.
Feature: Locker Room
Discover/Define
Research
Competitive Analysis
Stakeholder Interviews
Player Data/Expectations
Use Cases
Flow Diagram
Ideate
Sketches
Lo-Fi Wireframes
Brainstorming
Lo-Fi Prototypes
User Testing
Design
Hi-Fi Wireframes
Hi-Fi Prototypes
Supporting Documentation
User Testing
Develop
Collaborate
Evaluate
Document
Launch
User Testing
Player Feedback
Iterate
The Problem
The first design pass on the locker room failed due to constraints imposed upon the UI Tech Designer assigned to work on it. The constraints strongly restricted the ability to solve for player expectations and inevitably this approach failed. After the feature was put into playtests it quickly became evident that it was not lining up with player expectations. A few of the friction points that surfaced were that it was: too cumbersome, not intuitive, required too many clicks, task completion was lengthy, and it had navigation friction.
The New Direction
The stakeholders from the UX/UI team and MTX collaborated and came up with a new approach. The goal here was to solve for the friction points while letting UX drive the design. This involved giving the UX designer the agency to solve the main asks.
The goal now was to provide quick access to all aspects of the feature (minimal clicks), and to make it easy and quick to find and equip new items.
Ideate & Design: Workflows
After we had the design of the dashboard in place, we started to brainstorm and iterate on the locker room workflows.
At various stages, usability tests were conducted to validate assumptions.
User Testing
Usability studies were conducted on the final design direction. Changes were made based upon player feedback, time and technical constraints.
Key findings:
• Players wanted access to the store from here.
• We needed clear communication on how the emote assignments worked.
Design
Once the final designs were completed and approved, documentation was prepared and shared with the team.
Information on UX expectations and recommendations were included along with a prototype.
User Testing
During the UX review of the implemented feature a possible friction point surfaced. This was then sent to UR to validate the hypothesis. The results confirmed there was a friction point and surfaced two more.
Key finding:
1. Users are at high risk of losing outfits when moving between main locker room and presets menu because saving is unclear.
2. On keyboard and mouse (KB+M), participants expected to be able to click to select presets and perform actions.
3. It wasn't clear nor expected that presets were limited to 3.
Develop
After the feature was implemented UX conducted an audit of the feature. Any concerns were noted and prioritized for triage and tasking.
A few high priority issues were:
• Missing Save Option - Missing this option in pop up: "Stay and Continue Editing"
• Button prompts - Standardized and consistent use of KBM prompts needs to be defined. (For example: The KBM prompts should be Q & E. Delete should be Delete key.)
• Sorting icons are not clear. They should be redesigned and tested.
• Display the max number of preset slots to communicate the limited amount to players.
After release, player feedback was continuously gathered and triaged to iterate and improve the player experience.
Release
After release, player feedback was continuously gathered and triaged allowing us to iterate on and improve the player experience.
The Uniqueness
The application of the locker room in Rumbleverse is different from most other F2P Battle Royal games. Assets can be mixed and matched requiring a more complex customization feature.
Discovery & Define
The process started with stakeholder interviews, data on friction points from players and the team, review of the current implementation and a competitive analysis of games with a similar feature.
We learned that Fighting games approached character selection differently than other games and that approach was not going to work for us.
We learned that most F2P games lacked the extensive customization options that Rumbleverse was providing, so we looked at types of games with character customization.
The Accomplishments
The new version of the locker room was a success. The ability for UX to drive the design allowed for a solution that solved all the pain points for the company and the players. We created a navigation path through the feature that was simplified. Players could now access all the top level options (new accessories, costumes, bodies, emotes, and outfits) from the dashboard. It was only one click to get back to the dashboard from the subpage after selecting an option. Players found it easier to use and more intuitive. It was quicker and easier to equip new items, to edit their character, and to navigate through the feature. MTX and the company were happy since this alleviated concerns regarding monetization (players can easily find and equip purchased items).
The Task
Redesigned the locker room feature to line up with business and player expectations.
Lessons Learned
The key lesson learned from a business and project perspective was the need to transition the design direction from game designers to UX designers.
The UX/UI team observed that conducting usability studies played a crucial role in guiding the final design direction.
The UX team discovered the importance of substantiating design decisions with factual data to gain approval, regardless of the company's level of UX maturity.
Ideate & Design: Dashboard
For the dashboard, two main design directions surfaced after brainstorming, sketching, and ideating. Both solved for the goals with reduced clicks and quick and easy access to view and equip new items.
These designs also removed the confusing navigation by reducing the levels of screens the player had to navigate through to perform actions.
To line up with player mental models, we conducted A/B testing which provided valuable insights on each option.
A/B Testing: Dashboard
Wireframes were created, and the two options were tested for easy of use and intuitiveness. We choose to move forward with the design that was preferred by the majority and was easier and more cost effective to implement in our tight schedule.
Key Finding (Prototype 1): When using the extended top navigation, the movement felt backwards to some when the bar was expanded.
Key Finding (Prototype 2): Clear visual
communication would be needed to indicate the active widget (top or bottom).
