# Diegetic UI (ダイエジェティックUI)

> A name for the corner of game interface design where an element belongs both to the fiction and to the three dimensional world. A 2009 master's thesis at Chalmers University of Technology, written with EA DICE, mapped game UI on those two axes and reserved the word for that corner. Health glowing on the hero's own suit is the type case.

- IndexStyle No.533 — https://indexstyle.org/styles/diegetic-ui
- Kind: Technique · Family: UI Expression · Era: 2009–
- Mood: Play, Technology, Exhilaration
- Color cues: #6EC6E0 / #E8A33D / #111417 (cues taken from reference works, not a fixed palette)

## Defining characteristics

- Health or ammunition shown on the protagonist's own equipment instead of in a corner of the screen
- A map the character holds up and reads while still walking, rather than a paused overlay
- Panels of information projected into the air that tilt with the camera because they occupy the space
- Directions given by the color of a signpost standing in the world itself

## Best used for

- Moving health and ammunition out of the corners of a first person game and into the world itself
- Placing information in VR or in a vehicle as an object in space rather than a layer stuck to the view

## Composition recipe

- Typography & lettering: Treat every character as printed or projected onto something in the world, so it skews with the camera. Some angles will be unreadable, so carry the same meaning in shape and color too.
- Layout & structure: Leave the four corners of the screen empty. Distribute information across the body, the held device, and the environment, and keep those roles fixed.
- Material & texture: Use only materials the fiction can account for, such as a lit tube or a projected plane. The style collapses when the material stops being explainable, so settle the world first.

## What to avoid

Building an object into the world and then printing controller button names on it mixes fiction with rules, and that is exactly where the thesis's own focus group reported the illusion breaking.

## Application checklist

Before calling a piece an application of this style, check it against the defining characteristics:

- [ ] Health or ammunition shown on the protagonist's own equipment instead of in a corner of the screen
- [ ] A map the character holds up and reads while still walking, rather than a paused overlay
- [ ] Panels of information projected into the air that tilt with the camera because they occupy the space
- [ ] Directions given by the color of a signpost standing in the world itself
- [ ] At least one reference work below has been studied directly
- [ ] The caution above ("What to avoid") has been addressed

## Related styles

- **Skeuomorphism (スキューモーフィズム)** — Borrows cues from real materials and tools to make unknown interactions understandable. It names the principle, so Aqua and Brushed Metal are what the principle looked like when one company shipped it. → https://indexstyle.org/styles/skeuomorphism
- **Cyberpunk (サイバーパンク)** — Advanced technology and ruined daily life share the same frame, so the future arrives as promise and as threat. → https://indexstyle.org/styles/cyberpunk

## Further study

- チャルマースの論文にある、虚構と空間の2軸で描いた設計空間の図
- meta-perception や signifier といった中間の区分の定義
- 手に持つ地図や世界の中の標識で誘導するゲームの実例

## Reference works

- Three One Zero《ADR1FT》2014年 — Wikimedia Commons / CC BY-SA 3.0 — https://commons.wikimedia.org/wiki/File:ADR1FT%20gameplay%20screenshot.png

## Source of record

- Chalmers University of Technology — Erik Fagerholt & Magnus Lorentzon, Beyond the HUD: User Interfaces for Increased Player Immersion in FPS Games (2009) — https://odr.chalmers.se/items/d5fe6889-4cc6-49c2-ba56-0d759e2f37eb

## Machine surfaces

- JSON: https://indexstyle.org/api/styles/diegetic-ui
- Image-generation prompt (legally clean): https://indexstyle.org/styles/diegetic-ui/prompt.txt
- MCP: https://indexstyle.org/mcp (tools: search_styles, get_style, compose_styles; prompts: image-prompt, apply-style)