In-Level Loadout
Deathloop - Case Study
November 2024 (2 days)
Personal Project
User Research
Wireframing
Figma
Background:
This project was done as part of a UX test. Apart from the test itself, I felt that this was a challenge for me to understand how to approach Game UX and design thinking as a whole.
Definitions:
Deathloop
A first-person shooter video game developed by Arkane Lyon and published by Bethesda Softworks, released in 2021. The gameplay is focused on a time-loop, where players must strategize to eliminate targets within a repeating day.
Loadout
Player equipped weapons, power-infused trinkets, and slab abilities, to take into stages of the game.
Trinkets
Equippable items that grant buffs and effects that increase a player’s attributes or improve weapons.
Slabs
Special powers that grant unique abilities, like teleportation or invisibility.
Infuse Gear
Game mechanic that allows players select gear to keep for next time-loop by consuming a certain amount of residuum.
Residuum
Resource used to keep infused weapons and abilities after the time loop resets, obtained by harvesting from game stage or sacrificing gear.
Problem:
Based on the flow of the game, players are only able to equip and check what weapons and trinkets they currently have before entering a stage.
The moment you select and enter a stage, there is no way to go back to the previous screen to check again, unless quitting the current stage. This makes it difficult to know what strategy a player should employ in the current stage based on what special buffs they have.
The platform I will focus Deathloop on is on the PS5.
On menu screens, it has a cursor like PC, which is navigated using the L stick on the controller.
Current UI
Stage Overview (In-Game)
HUD with player name and status, menu tabs, Residuum amount
Stage location information
Stage objectives
- HUD with player name and status, menu tabs, Residuum amount
- Stage location information
- Objectives
Stage Overview (Map Select)
Loadout button that opens Loadout Screen (shown below)
Note: (△) button on PS5
- Loadout button that opens Loadout Screen (shown below)
Note: (△) button on PS5
Loadout Screen
Infuse gear button with Residuum amount
Character Trinket Info
(Top to Bottom) Guns (3 Equippable Slots), Machete (Fixed Item)
(Top Left to Bottom) Slab abilities (2 Equippable Slots), Character Special Ability (Fixed), Grenade and Hacking Device (Fixed Items)
HUD with player name and status, menu tabs, Residuum amount
- Infuse gear button with Residuum amount
- Character Trinket Info
- (Top to Bottom) Guns (3 Equippable Slots), Machete (Fixed Item)
- (Top to Bottom) Slab abilities (2 Equippable Slots), Character Special Ability (Fixed), Grenade and Hacking Device (Fixed Items)
Loadout Screen - Item on Hover
Item information pop-up on hover
-
Item information pop-up on hover
Ideation:
Stage Overview (In-Game)
Design Decision 1: Consistent Button
As both screens share similar information, adding a loadout button to the in-game stage overview menu would ensure consistency with the overview in map select screen.
Loadout View
Exploration: Consistent View
As the actual loadout screen has the player character in the background filling space, having the character in the center again for this designed loadout view would maintain consistency.
Because players would not be able to infuse gear while in the game stage, the button in this loadout view is removed.
Exploration: Information View
Removing the character space will allow for a broader view of the equipment, and more surface area to quickly hover on to open descriptions of items.
Weapons and Slab abilities would be displayed in their boxes like how they are displayed in the equipment screen.
Design Decision 2: Information View
I decided to go with the second version as it did not require the character to be in the background, and covered more screen area for displaying information clearer.
Character Trinkets
Exploration 2: Character Trinket Info
Rather than displaying the diamond view and having to hover over, immediately showing the trinket’s name and description would allow players to quickly recall what trinkets are equipped.
Exploration 2: Character Trinket Diamond
Character trinkets (highlighted diamond) are displayed minimally on the loadout screen. Keeping the diamond shape in the loadout design will keep it consistent to other screens.
Design Decision 3: Character Trinket Info
The design that displayed character trinket information was better suit, especially for players who want to quickly recall what trinkets they equipped by immediately showing the trinket name and description.
Wireframes:
Based on the decided designs, I converted them into wireframes.
Stage Overview (In-Game)
Loadout button added:
Slide with center bar to view between redesigned and current screens
Loadout Screen
Slide with center bar to view between redesigned screen and information
- Maintain HUD (Player name and status, menu tabs, Residuum amount)
- Character Trinkets Information
- Weapons Display
- Slab / Abilities Display
- Fixed Items
- Back navigation: goes to stage overview again, help window opens pop up
Loadout Screen (Examples of Items on Hover)
Prototype Flow
Summary + Reflection:
Adding an additional screen definitely enhances the player experience, especially for strategizing their playthrough for a selected stage.
Just having a quick view to check what is equipped does not take away from the gameplay as a whole, and instead prioritizes player needs.
~~~
I finished the game previously a while ago, only after playing it again I realized what felt could definitely be improved on.
While playing, I could see how the designers put a lot of care into the stylistic choices, but if a player has a bad experience it dampens their outlook on the game as a whole.
Doing a check online, even other players were asking around if it was possible to check a loadout while in a stage. If small features like this loadout checker, existed in game, would have definitely improved the player experience!