Design readable, responsive interfaces for Three.js games, including HUDs, menus, overlays, settings, and touch controls. Plan game states, connect UI to game state, and check text fit, safe areas, overlap, and interaction on target screen sizes.
Design premium Three.js game UI: HUDs, menus, overlays, pause/win/lose screens, settings, icon controls, touch UI, typography, responsive layout, safe areas, text fit, and UI/world cohesion.
Run score Not tested
See how to installReview the instructions the agent will receive before you install.
Make game UI intentional, readable, responsive, and specific to the genre.
Preserve the user's requested scope and style. For a narrow HUD fix, retain the existing design and check the changed state and target viewports. For a complete UI pass, use the full workflow below. Mobile input is required when mobile is a target, not because a desktop-only game has UI.
references/ui-patterns.md — hierarchy and required states, HUD zones, menus, touch controls, responsive constraints, style cohesion, and state wiring. Read it before designing HUDs, menus, overlays, touch controls, or responsive layout.
Load threejs-image-generator when logos, icons, GUI art, faction marks, menu backgrounds, or 2D HUD assets would raise the quality. threejs-3d-generator only for genuine 3D menu objects and diegetic props, not flat HUD elements.
A generic dashboard of stat cards · UI covering the player, threats, or the next decision · text that shifts and clips on mobile · decorative panels that reduce readability · touch controls that look right but emit no intents.
UI intent and states covered, files changed, target-viewport screenshots, text-fit and overlap findings, safe-area and touch-target evidence where applicable, and remaining risks. Feed these results into the lead's consolidated pass rather than rerunning unchanged game-wide checks.
No reviews yet. Tell others what you thought.
No login needed. Share how it worked for you, ask a question, or note where it did not run.
No comments yet. Be the first to write one.
Create 3D assets for Three.js games through the Tripo API, from text or image input. The workflow can add textures, rigs, and animations, convert formats, and prepare models such as characters, creatures, buildings, props, and terrain for game use.
Improve the visual quality of Three.js browser games by reviewing screenshots, shaping models and materials, and refining lighting, effects, and rendering. A 10-category scorecard helps track visual gaps while render budgets guide performance choices.
Create and process sound effects, music, ambience, and voice lines for Three.js browser games using ElevenLabs. The skill also prepares audio files and manifests, then connects playback through Web Audio for loading, looping, volume control, and pause or resume.
Find and fix problems in Three.js browser games, such as blank canvases, loading failures, animation, resizing, and mobile input. Measure rendering, memory, shader, network, and bundle costs to locate performance bottlenecks and compare results after changes.
Coordinate the work needed to build or improve a Three.js browser game, from gameplay and visuals to interface, assets, debugging, and release checks. It helps shape the work to the requested scope, whether that is a small arcade prototype or a polished release.
Design and build playable browser game systems with Three.js, from a starter project and core loop to controls, camera, collisions, levels, scoring, and difficulty. Work in playable increments, with clear design plans and feedback tuned around the decisions players make.