Embedded Files
Gameplay flow redesign using wireframes, grey-boxing, and user testing.
Project Overview
Project Overview
🗓️ 6 weeks, finished Nov 2024
🛠️Figma, FigJam
👤 Solo project, exercise
🧰 User-testing, motion
A Focus on User Flow
A Focus on User Flow
This project focused on analyzing where new players were getting stuck and confused in the first few games played. Because Phasmophobia already has a strong design direction, I focused on improving structural concerns, while leaving the core design intact.
Highlights
Highlights
regular user testing helped push design constantly
wire-frames and greyboxing let me focus on flow over pixel-pushing
gave a chance to work on a game I cared about
Lowlights
Lowlights
complexity in advanced prototyping consumed large amounts of time (especially Figma Variables)
Phasmophobia Case Study
Phasmophobia Case Study
But First, What is Phasmophobia?
But First, What is Phasmophobia?
For context, Phasmophobia is a unique co-operative ghost-hunting video game
single or multi-player
PC & Console
combines standard computer play with virtual reality support
made by a small indie team
Real World Style
Real World Style
Diegetic (real-world design) style makes it hard to implement conventional UI, as things need to feel like they could exist in a ghost-hunter cabin.
For example, missions chosen appear on an in-game bulletin board (meaning something like a floating display would stand out)
An Refined Design Language
An Refined Design Language
The game is quite pretty, and is in a late stage of development. This often makes it harder to see structural problems if you're not specifically looking for them.
A Problem of Flow
A Problem of Flow
The core game can be a pain to understand, with the shop and inventory system being especially opaque for beginners (even after completing the tutorial).
These sort of loop issues can be common for Indie Developers, who have less budget for play testing
For context, lets look at the current game play loop below.
Reviews
Reviews
I looked at Reddit and Steam to see what people were frustrated by.
While people were generally positive, there was a lot of frustration over the shop/inventory system, as well as the on-boarding process.
Interviews
Interviews
To further understand the scope of the issue, I conducted interviews with existing and players to see how they felt about the gam
3 casual players who play every few months
interviews 10-20 minutes in length
Insights:
Insights:
They generally appreciated playing with friends
Most of the fun was from discovery and learning through mistakes. All found the inventory confusing initially, though they got used to it eventually.
Two learnt the game by playing with friends, while one learnt exclusively through tutorials
Intended Loop (What the devs planned)
Intended Loop (What the devs planned)
Join: Gather your friends, choose your mission
Buy: Buy useful equipment
Equip: Equip useful equipment
Hunt: Enter a spooky location, hunt & identify a ghost/creature
Debrief: Return & be rewarded, prepare to upgrade equipment
Experienced Loop (What newcomer’s experience)
Experienced Loop (What newcomer’s experience)
In a lot of cases, this nice game loop unfortunately turns out a lot like this instead:
You join your friends as expected
Buy some random equipment you don't understand, lose track of it
Unintentionally skip equiping things
Start the hunt without the right equipment, walk around confused in the dark. Inevitably, die
Finish the round confused about what happened, run out of money to progress
So clearly, this game loop doesn't always work, especially for new players.
Three Existing Redesigns
Three Existing Redesigns
It seems the developers are aware of the difficulty players are having with the shop/inventory system, and they have continued to iterate on it.
Over time these systems have gotten more complex. The shop and inventory have continued to remain separate, but their visual design has gotten more similar.
Three Existing Redesigns
Three Existing Redesigns
With more context and understanding, a few key insights emerge.
New players find it difficult to understand what they are buying and why
The current loadout system seems unintuitive and finicky.
New players often start missions without necessary items due to confusion.
Critically, the main reason for why system even exists in the first place seems to be missing for a large number of new players.
Moving Forward
Moving Forward
Now that I understand where players are getting lost, I focused on some key objectives and goals for the user flows.
Features for Testing:
Allow purchasing items and consumables for general inventory
Enable sorting and choosing items for an expedition
Use money to add stakes to using items or leaving them in the expedition site
I asked “How can I best keep true to these goals, while simplifying and streamlining the process?”
Building a Prototype
Building a Prototype
I started by simplifying and streamlining the game's design to its bare essentials. For this project I constrained myself to work only with wireframes and greyboxing. This let me focus on the flow of the design, without getting caught up in the existing aesthetic too much. That being said, I did design things to intentionally work within both the VR and 2D constraints once implemented.
initial design testing in Figma
Using Figma Variables
Using Figma Variables
To make things feel more realistic, I connected buying/selling items into Figma's variable system. This allowed a realistic simulation of item costs, quantities used, and other interactive elements.
This quickly got pretty complicated, due to interconnecting variables. Ultimately, this took a lot of time, but the end result was quite satisfying and felt like a real system.
Three Improvements
Three Improvements
- Simplify the Flow
Merged inventory and shop screens to reduce confusion. This reduced the need to jump back and forth between multiple screens
I also moved upgrade into item information area, locking it behind the level cap.
Why it Matters:
Having a single place for common functions makes it much simpler for beginners to get familiar with systems right away.
During testing, users did not get confused about inventory vs shop, which was a common issue previously.
2. Provide Context
2. Provide Context
A new, persistent level card provides context that hints* at what equipment might be needed based on the mission. This minimizes down to the bottom of the screen when in play, and works like a physical mission card.
*these hints are initially minimal to encourage player exploration, but would fill in as player’s discovered moreWhy it Matters:
Context on why each mission is important helps ground the choices players are making. It also focuses all players around a shared goal of the mission and its specific parameters.
3. Expand Debriefing
3. Expand Debriefing
I added a more comprehensive breakdown of items used, lost, and rewards gained.
What it does:
Gives more information on the post-mission screen,
provides clarity on which items are used or lost during a mission
shows a breakdown of team vs individual rewards & losses
Why it matters:
This overview allows players to see what they lost and why, showing the monetary cost of each item that they left on a mission.
Because each item does cost players time and money to acquire, giving context into how and why something was lost adds weight.
Was it worth it?
Was it worth it?
Putting this design back in front of players seemed to be a great success. I conducted in-person tests, where users were required to play through a mock-mission, buying items as they went.
Of the three players tested, all three had a strong understanding of what items they bought, which ones were used during the test, and where they could go from there.
General feedback was that the new core loop seemed solid. The inventory was also "substantially less confusing" now, and items "felt more impactful".
Next Steps
Next Steps
While I had limited time for this exercise, my next steps would be to push the multiple-mission idea further. This would allow a better understanding of what player's inventories look like after multiple missions, as well as to see just how useful the mission card is in practice.
Thanks for reading!
Check out another project?
Page updated
Google Sites
Report abuse