Luismi Design
--:-- · MAD
← Work / 05 / 06 Game UX study / FFXIV Online · fictional rework

A better default HUD

A heuristic teardown of Final Fantasy XIV's information-dense HUD — and a calmer, more efficient layout.

Role
Solo UX/UI designer
Type
Fictional · self-initiated
Year
2022
Methods
Benchmark · Heuristics · Redesign
Focus
Hotbar overload, quest legibility, class swapping
Improving FFXIV's HUD — original work
01 — The problem

Too much HUD, too little signal.

ProblemOut of combat

FFXIV's HUD is famously dense. Twelve hotbars. Six log windows. Every element movable. In combat it's a marvel of optimisation — until you need to actually change something mid-fight.

Original HUD — annotated
  • 01HUD elements — 14 visible · zero priority
  • 02Hotbars — up to 12, fully customisable
  • 03Quest log — anywhere the player drops it
  • 04Class swap — buried in main menu
02 — Why it mattered

Every glyph competes for attention.

StakesPlayer + craft

For the player: hotbar management, class swapping and quest tracking aren't quality-of-life edge cases — they're the decisions that shape every encounter, and the stock UI makes each one harder than it needs to be. For the craft: a HUD is a competition for attention, and a default that doesn't prioritise isn't neutral — it's a tax on every player who never opens the settings menu.

03 — What I owned

Teardown to redesign, solo.

ScopeSolo · self-initiated

Solo UX/UI designer, self-initiated: ran the heuristic teardown of FFXIV's own HUD, benchmarked seven competing MMOs for patterns, and designed the full redesign — hotbars, quest tracking and class-swap access.

04 — The key decision

Trade customisation for legibility.

Decision12 hotbars → 3 rows

The new HUD trades twelve customisable hotbars for three immutable skill rows hot-swapped with CTRL+1/2/3 — the sharpest, most debatable call on the page. The cost: less customisation. The gain: a screen a new player can read in three seconds.

05 — The solution

A calmer screen.

SolutionBefore · after

The quest list permanently lives at the top-right. A class-swap shortcut appears, finally, on screen. Three immutable rows replace twelve customisable hotbars.

Redesign overview
Before — original HUD
Before — original HUD14 elements · scattered hierarchy
After — redesigned HUD
After — redesigned HUD8 elements · clear top-right and bottom-row hierarchy
AQuest log anywhereQuest & duty list — pinned top-right
BClass swap buried in menuOn-screen shortcut · CTRL+Tab
C12 customisable hotbars3 immutable skill rows · CTRL+1/2/3
DParameter bars scatteredSingle panel · bottom-left
EMini-map driftsAnchored bottom-right
06 — Validation

Seven MMOs, five patterns.

ValidationMulti-title benchmark

No player testing here — the validation method was comparative: I tore down the out-of-combat HUDs of seven MMOs — Guild Wars 2, FFXV, WoW, Diablo III, The Elder Scrolls Online, Lost Ark, and FFXIV itself — looking for repeated patterns that solved the legibility problem. Every redesign decision traces back to one of these.

Benchmark — slide 1
Benchmark — slide 2
Benchmark — slide 3
  • 01Show the quest list at the top-right. Players use peripheral vision to retrieve mission info; a fixed anchor wins over a flexible position.
  • 02Add a class-swap shortcut on screen. Surface the most strategic interaction — hiding it in a menu hides the gameplay.
  • 03Cluster quests & duties together. Reduce the cost of deciding "what to do next" — proximity is the cheapest pattern there is.
  • 04Keep keyboard shortcuts visible. Discoverability for the swap mechanic; one keystroke beats a menu dive.
  • 05Replace hotbars with immutable rows. Three rows, hot-swapped with CTRL+1/2/3. Less customisation, more focus.
07 — Outcome

Fewer elements, clearer hierarchy.

OutcomeBefore → after
HUD elements
14 → 8
Visible elements, on-screen count
Hierarchy
Clear
Top-right and bottom-row anchoring, from scattered
08 — What I learned

What I took with me.

Reflection

Game UX taught me to read every pixel. Every glyph on a HUD is competing for attention, and the designer's job is to spend that attention deliberately — same instinct I bring to the chat surface inside Concierge today.

Letting power-users customise everything is generous. Pretending the default doesn't matter is a design choice that quietly costs you everyone else.

© 2026 — Luis Miguel Bello García Senior Product Designer, AI contact@luismi.design
Next — 06 / 06 Escuela Mente Cíclica design + build