ux-design

Guides section-by-section authoring of UX specs, HUD designs, and interaction pattern libraries for game screens.

Updated Aug 2, 2026
One-click install
npx skills add https://github.com/claretagrapelike32/codex-ai-game-studio --skill ux-design-claretagrapelike32
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: ux-design
Source: https://github.com/claretagrapelike32/codex-ai-game-studio/tree/main/plugins/ai-game-studio/skills/ux-design
Command: npx skills add https://github.com/claretagrapelike32/codex-ai-game-studio --skill ux-design-claretagrapelike32

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Designing game screens, flows, and HUDs without a structured process leads to inconsistent specs, missed accessibility requirements, and navigation mismatches across screens. This Skill walks you through each section of a UX specification interactively, grounding every decision in your game concept, player journey, and GDD requirements. ## Core Features & Use Cases - Three Authoring Modes: Create a per-screen UX spec (design/ux/[screen].md), a HUD design document, or an interaction pattern library, each with its own structured template. - Context-Aware Design: Automatically reads your game concept, player journey map, GDD UI requirements, art bible, accessibility requirements, and input/platform configuration before asking any design questions. - Approval-Gated Workflow: Every section follows a Context → Questions → Options → Decision → Draft → Approval → Write cycle, with incremental file writes that survive session interruptions and a retrofit mode that fills only incomplete sections of existing specs. - Use Case: You need to spec your game's inventory screen. The Skill reads your GDD and player journey, proposes layout zones and an ASCII wireframe, maps every interaction to gamepad and keyboard inputs, defines empty/error/loading states, and produces testable acceptance criteria ready for QA. ## Quick Start Use the ux-design skill to create a UX spec for my game's main menu screen, reading the existing game concept and player journey first.

Frequently Asked Questions about ux-design

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I write a UX spec for a game screen?

Invoke the skill with the screen name as an argument, such as `main-menu` or `inventory`. It reads your game concept, player journey, and GDD UI requirements first, then walks you through each spec section with questions, options, and approval gates before writing to `design/ux/[screen].md`.

How do I design a game HUD step by step?

Pass `hud` as the argument to enter HUD design mode. The skill starts with your HUD philosophy, builds a full information inventory from all GDD UI Requirements, categorizes items as Must Show, Contextual, On Demand, or Hidden, and only then designs layout zones and elements.

What happens if the UX spec file already exists?

The skill enters retrofit mode: it reads the existing file, reports which sections are complete, empty, or placeholder, and only works on incomplete sections. Existing approved content is never overwritten; placeholders are filled in place.

Does the UX spec workflow support gamepad and touch input?

Yes. The skill reads input methods, gamepad support, and touch support from `.ai-game-studio/project.json` and maps every interaction to the configured inputs. If unconfigured, it asks once per session and reuses the answer throughout.

What if my project has no player journey map yet?

The skill notes the gap, warns that design decisions will assume player context, and adds an open question to the spec pointing to the player journey template. It continues authoring rather than blocking on the missing artifact.

Can I resume an interrupted UX design session?

Yes. Session state is tracked in `production/session-state/active.md` and each approved section is written incrementally. On resume, the skill reads the state file and the spec, then continues from the next incomplete section.