Three.js Game UI Designer
Build interface states that support play and feel native to the game.
Read By Need
- UI implementation and state patterns:
references/ui-patterns.md.
- Before claiming HUD, menu, responsive, or touch work complete:
references/quality-gates.md.
- Generated 3D menu objects or diegetic props:
../../references/mint-mcp-assets.md.
Use authored HTML/CSS/SVG/Canvas or user-provided assets for ordinary flat UI.
Use Mint MCP only when the live host exposes the required output. Never use
another generation provider.
Workflow
- Inspect desktop/mobile screenshots and inventory gameplay, pause, settings,
loading, fail/retry, win/milestone, and touch states.
- Prioritize survival/status, objective, feedback, then flavor.
- Replace utility cards with game-specific meters, clusters, badges, icons,
alerts, reticles, and modal states.
- Keep dimensions stable; account for text fit, safe areas, touch targets,
hover/pressed/focus/disabled states, and reduced motion.
- Drive UI from game state without duplicating simulation rules.
- Verify relevant states through real input at desktop and mobile sizes.
Final Response
Report states covered, UI intent, controls, screenshots, text-fit/overlap,
safe-area/touch-target evidence, and remaining risks.
1---2name: threejs-game-ui-designer3description: Design readable, responsive Three.js game HUDs, menus, overlays, touch controls, typography, safe areas, and game-state-driven interface feedback.4---56# Three.js Game UI Designer78Build interface states that support play and feel native to the game.910## Read By Need1112- UI implementation and state patterns: `references/ui-patterns.md`.13- Before claiming HUD, menu, responsive, or touch work complete:14 `references/quality-gates.md`.15- Generated 3D menu objects or diegetic props:16 `../../references/mint-mcp-assets.md`.1718Use authored HTML/CSS/SVG/Canvas or user-provided assets for ordinary flat UI.19Use Mint MCP only when the live host exposes the required output. Never use20another generation provider.2122## Workflow23241. Inspect desktop/mobile screenshots and inventory gameplay, pause, settings,25 loading, fail/retry, win/milestone, and touch states.262. Prioritize survival/status, objective, feedback, then flavor.273. Replace utility cards with game-specific meters, clusters, badges, icons,28 alerts, reticles, and modal states.294. Keep dimensions stable; account for text fit, safe areas, touch targets,30 hover/pressed/focus/disabled states, and reduced motion.315. Drive UI from game state without duplicating simulation rules.326. Verify relevant states through real input at desktop and mobile sizes.3334## Final Response3536Report states covered, UI intent, controls, screenshots, text-fit/overlap,37safe-area/touch-target evidence, and remaining risks.
mintdotgg