Inventory UI

Prototype

A technical proof-of-concept of a world-space grid-based inventory, inspired by Resident Evil 4. 🎒

I built this proof-of-concept to experiment with World Space interfaces. The idea was to make inventory management feel more physical and grouned. The grid-based layout lets players rotate and arrange items spatially.

Navigation & Moving Items

Examining an Item

Tecnical Challenge: Separation of Concerns

The core technical challenge was ensuring clean architecture between the game data and the UI.
I implemented a strict separation:
- Inventory (Game Logic): Handles the inventory data, such as Item definitions, quantity, etc. This represents the gameplay data, UI logic should not interfere with this.
- InventoryUI (View): Handles the interface, it's the center of the ui logic, individual elements subscribe to events triggered by this.
To bridge these two without tight coupling, I utilized a Dictionary that pairs the data object with the visual object.
This ensures the UI is strictly reactive—it never calculates game logic, it only visualizes the state of the data.

Lessons Learned

1. Balancing Fantasy with Readability
World-space UI is excellent for enhancing player fantasy and immersion, but it introduces challenges when it comes to readability. It's important to be mindfull that world-space UI might make information harder to parse than a traditional 2D menu. Good world-space and especially diegetic UI, enhances the fantasy but also makes information EASIER to parse. Placing it closer to the topic, like ammo on gun model.

2. Decoupled UI is Robust UI
Working on this reinforced that UI code should be completely decoupled from game systems. The inventory logic should function perfectly even if the UI creates no visuals at all. By making the UI purely reactive, it becomes much easier to make changes, disable or replace them if needed.

Next Project: Skill Tree →