This project aims to reiterate ROTMG's UI/UX to better support evolving veteran player techniques, while also lowering the skill floor for new players.
Further, I was personally looking to develop my ability to translate Figma designs into Unity prototypes that could facilitate basic interactions.
Unity
Figma
Adobe Illustrator
Redesigning the in-game HUD, Character Selection, and Character Creation (PC)
Michael Malatesta
Realm of the ... Who?
Genre-Defined
Realm of the Mad God is a unique combo of existing genres that creates an original experience.
By comparing against genre-defining titles, we can better understand ROTMG & its innovations or divergence from familiar gameplay conventions later on.
Popularized by titles like Cuphead, the "bullet-hell" genre challenges players to dodge increasingly complex projectile patterns as difficulty ramps up.
Popularized by titles like Slay the Spire, "rogue-likes," have players experience a cycle of dying and starting over, with each attempt intended to teach them more about the game's challenges.
Popularized by titles like World of Warcraft, MMORPGs allow players can interact with thousands of others in real time, blending role-playing elements with large-scale multiplayer experiences.
Welcome to the Realm
Explore a top-down world filled with enemies firing complex projectile patterns, requiring sharp reflexes and strategic item management.
Players team up to tackle bosses and dungeons, while managing gear, consumables, and hopefully, loot.
Demanding full attention, even a split-second lapse can result in death; losing your character and everything they held. Time to start over!
The Windows of Opportunity
Swap to the Top
Experienced players meet increasing difficulty by honing the "Swapping" technique.
This technique sees players quickly swap between different gear and consumables to maximize stats and items for any scenario.
Native key binds have always supported Swapping, but players have honed the technique as ROTMG introduces expanded bag space and new items.
Experienced players meet increasing difficulty by honing the "Swapping" technique.
This technique sees players quickly swap between different gear and consumables to maximize stats and items for any scenario.
Native key binds have always supported Swapping, but players have honed the technique as ROTMG introduces expanded bag space and new items.
The Best Ability System, BAR one
The Swapping technique is similar to using abilities on an Action Bar in typical MMORPG games.
These titles almost unanimously rely on this action-bar system, anchored to the bottom of the players screen.
A successful exception is the MMORPG Old School Runescape (OSRS), which draws similarities to ROTMG's UI.
Expired Inspiration
OSRS pioneered the side panel layout 6+ years before ROTMG's release
However, newer versions of Runescape deviate from the opaque UI panel.
This suggests OSRS might also deviate, if not restricted to the unchanging nature of the "Old School" servers...
Expired Inspiration
OSRS pioneered the side panel layout 6+ years before ROTMG's release
However, newer versions of Runescape deviate from the opaque UI panel.
This suggests OSRS might also deviate, if not restricted to the unchanging nature of the "Old School" servers...
A successful exception is the MMORPG Old School Runescape (OSRS), which draws similarities to ROTMG's UI (Large panel docked to the right used for clicking on gear and consumables).
A UI That Makes You-Die
"I just got impaled by [an enemy] while ... thinking [it's] safe ... because I looked at [my] potion inventory and dragged [healing items]."
"I want to look at the game ... I don't want to look at my inventory"
"I am very mad at how I died ... I was running away looking at my HP"
8 in 10 players said they intentionally carry more than 1 item for Swapping
7 in 10 players admitted that they have died while looking at their UI
4 in 10 players said that they never use the 1-8 inventory keybinds
Research Insights
Players do believe Swapping is an essential game mechanic, and are willing to risk carrying extra items in combat to increase their combat effectiveness
However, just as many players have died while trying the technique themselves, or even just managing their basic UI, such as health and consumables.
Despite carrying Swaps, a significant portion of players do not use the full range of Swapping key binds; and instead opt to swap by manually clicking & dragging. Some players express only being able to reach key binds 1-4 for use.
How Might We enhance players' situational awareness while also enabling quick access to inventories, better supporting rapid decision-making during high-stakes gameplay, and lowering the skill floor for new players?
A New Realm of Design
Implementing a Traditional Action Bar
A Traditional MMORPG Action-Bar makes swaps and key binds more accessible to both new and experienced players.
ALL bags are now always visible, allowing players to track ALL held items, rotating each bag into the action-bar position when prompted.
Ability to Re-bind Inventory slots 1-8, allowing players to set more comfortable and in-reach key binds
A Less Distracting Loot System
Loot Window now appears just above the action-bar, only displaying slots for the amount of items that have dropped.
Will always shows an extra empty slot, maintaining player's ability to drop items into specific loot-bags.
Allows players to easily manage and store loot from their peripheral vision
Swapping Account Frame to Character Frame
Account and Guild name are redundant to the player and do not warrant constant screen space, so they have been replaced by character and progress relevant info.
Icon and Star-Rank remain because they are dynamic, and change with player progress (using skins or cosmetics, earning fame).
The Fame Bar now more appropriately sits alongside the players star rank; as these are directly correlated (When the player earns fame, their star rank increases).
