Skip to main content
skill Claude Code CX Codex Cursor GitHub Copilot

threejs-game-director — Claude Code skill: what it does

A director skill for Three.js browser games: it runs the work from a playable loop to graphics, UI and browser checks by handing phases to sibling skills.

Install into Claude Code · Skills CLI (Vercel) All methods and platforms ↓
npx skills add majidmanzarpour/threejs-game-skills --skill threejs-game-director -a claude-code
Open on GitHub

What threejs-game-director does

The skill sets the frame for the whole job: a playable loop first, then the graphics and interface depth the request actually asked for, then browser evidence that it runs. It draws almost nothing itself. Work is routed to eight sibling threejs-* skills covering gameplay, graphics, UI, debugging, QA and release, plus generators for 3D models, images and audio. For a full game it tells the agent to read the five production skills before writing code.

Inside are a phase routing table, a lead-plus-two-workers setup with separate file ownership, and artifacts/game-progress.md so work resumes after a pause. Premium work is scored on a 10-category scorecard: no category below 2, average at least 2.3, read from the inspector's measurements instead of the agent's own opinion.

When external asset generation is in scope, bash <director-skill-dir>/scripts/probe_asset_credentials.sh runs first. It sources the shell profile the agent process usually does not inherit and prints KEY=SET|MISSING for all three providers. No keys means no generated hero or audio, so run the probe before planning the art.

What it helps with

  • build a Three.js arcade game up to a playable build
  • push an existing scene to premium quality against the scorecard
  • split a large job across gameplay, graphics and UI without file conflicts
  • resume a build after a pause without losing decisions or open defects
  • confirm in a browser that the game boots and get a defect list

Example prompts for the agent

  • Build a small Three.js arcade game: loop, menu, game-over screen, keyboard controls
  • Take this game to premium: run the graphics scorecard and fix everything below 2
  • Build the project and check it in the browser, then show me screenshots of the scene

How to install threejs-game-director

1Skills CLI (Vercel)

npx skills add majidmanzarpour/threejs-game-skills --skill threejs-game-director -a claude-code

2Manually: put the files in place

~/.claude/skills/threejs-game-director/SKILL.md

Copy the whole skill folder; for one project use .claude/skills/threejs-game-director/

From the same set4

The whole set →

Similar

unity-build-pipeline gamedev-skills Configures and scripts Unity 6.3 LTS builds via BuildPipeline, build profiles, and CI headless runs. Helps tune stripping and pick Mono or IL2CPP. Claude Code CX Codex Cursor +1 5,300installs unity-navmesh gamedev-skills Coding-agent skill for Unity pathfinding: bake a NavMesh over level geometry and drive NPCs with NavMeshAgent. Useful when an enemy should chase the player instead of idling. Claude Code CX Codex Cursor +1 5,200installs unity-tilemap-2d gamedev-skills Builds and scripts 2D tilemaps in Unity 6.3 LTS using Grid components, Tile Palette, and runtime C# methods. Useful when laying out levels, setting up colliders, or generating procedural rooms. Claude Code CX Codex Cursor +1 5,200installs unreal-cpp-gameplay gamedev-skills Teaches the agent to write UE5 gameplay C++: reflection macros, Gameplay Framework class roles, and module dependencies in *.Build.cs. Claude Code CX Codex Cursor +1 5,000installs unreal-niagara gamedev-skills Walks the agent through Niagara in Unreal Engine 5: system and emitter assets, module stacks in the spawn/update stages, effects spawned from Blueprint or C++. Claude Code CX Codex Cursor +1 4,900installs unreal-enhanced-input gamedev-skills Configures Unreal Engine 5 Enhanced Input assets, C++ bindings, and triggers. Useful when wiring movement, look, and jump controls or fixing input loss on clients. Claude Code CX Codex Cursor +1 4,900installs orbit-card heygen-com Adds a 10-second 1920×1080 HyperFrames motion block where a single feature card orbits a dot sphere using exported Blender camera paths. Claude Code CX Codex Cursor +1 9,800installs sdf earthtojake This skill authors and validates SDFormat files for models and worlds, then helps prepare them for simulator handoff. Claude Code CX Codex Cursor +1 10,500installs

Questions about threejs-game-director

How do I install threejs-game-director in Claude Code?

Run npx skills add majidmanzarpour/threejs-game-skills --skill threejs-game-director -a claude-code. The skill file lands at ~/.claude/skills/threejs-game-director/SKILL.md.

What does threejs-game-director do?

It is the entrypoint for building, upgrading and shipping Three.js games. It owns the end result — playable loop, then graphics and UI, then browser verification — and routes individual phases to eight sibling threejs-* skills.

What is needed for asset generation?

Credentials for the external providers. scripts/probe_asset_credentials.sh sources the shell profile and prints KEY=SET|MISSING for all three providers, which tells you whether generated characters and audio are on the table.

Source text

SKILL.md · MIT
---
name: threejs-game-director
description: "Entrypoint for building, upgrading, and finishing Three.js browser games. Routes work across the sibling threejs-* skills for gameplay, graphics, UI, 3D/image/audio asset generation, debugging, and release. Use for any request to build, upgrade, polish, or ship a Three.js game as a whole, at any scope from a small arcade prototype to a premium release."
---

# Three.js Game Director

Own the end-to-end game outcome: a playable loop first, then the visual and interface depth the request actually asked for, then browser evidence that it works.

## Scope

The user's own words set the bar. "Make a small arcade game" is not a request for the full premium pipeline — build the good version of what was asked and stop. "Premium", "AAA", "polished", "high-fidelity", "showcase", "release-ready", or "less basic" *is* that request, and at that bar a first playable slice is not done. "Less basic" specifically means the current visual level was rejected; treat it as the premium bar.

The user's scope, art style, constraints, and prior decisions override skill defaults. A narrow edit to a premium game remains a narrow edit. Make routine implementation calls yourself and complete authorized work before seeking a decision that only affects a later step. Ask only when a missing choice materially changes the requested result; continue independent work meanwhile. Until the requested bar is met, don't end a turn with a summary that announces the next step, an offer to continue, or a list of decisions that don't block the work; take the next step instead. End the turn when the work is done, or when only the user can unblock it.

## Working style

Say in one sentence what you're about to do before your first tool call. While working, give a short update when you finish a phase, find something important, or change direction. Lead the final response with the outcome.

The lead owns shared interfaces, integration, and the final verification pass. Use available delegation tools for independent work that saves time or improves quality: asset generation alongside gameplay, or isolated UI work after the intent/state interface is defined. Normally use a lead plus up to two workers. Give each worker a task, separate file ownership, input/output contract, and acceptance criteria. Keep the immediate blocking integration work with the lead.

For substantial gameplay, graphics, or animation changes, one focused independent review can catch missed defects. Supply raw captures/code and the relevant rubric; ask for concrete defects rather than endorsement of the lead's score. Resolve findings without recursive review cycles. When delegation tools are absent, work directly.

Report what you ran and what you saw. If you couldn't run something, say that instead.

## Sibling skills

Use the actual loaded skill directory as `<director-skill-dir>`. Resolve siblings through `../<skill>/SKILL.md` there. If absent, use the runner's discovered skill path, then a matching repo `skills/` directory or the active runner's install location (`~/.agents/skills` for Codex, `~/.claude/skills` for Claude Code, legacy `~/.codex/skills` last). Resolve references relative to the selected skill; avoid mixing installed versions.

| Phase | Skill |
| --- | --- |
| Design brief, core loop, levels, entities, input, camera, physics, feel | `threejs-gameplay-systems` |
| Models, materials, shaders, VFX, lighting, render budget, scorecard | `threejs-aaa-graphics-builder` |
| HUD, menus, overlays, responsive and touch UI | `threejs-game-ui-designer` |
| Blank canvas, render/runtime bugs, mobile input, profiling | `threejs-debug-profiler` |
| Browser QA, screenshots, canvas pixels, bot playtest, production build | `threejs-qa-release` |
| Characters, vehicles, weapons, buildings, rigs, animation | `threejs-3d-generator` |
| Concepts, textures, skies, logos, icons, GUI art, image-to-3D inputs | `threejs-image-generator` |
| SFX, music, ambience, UI sounds, announcer and dialogue | `threejs-audio-generator` |

For complete games and broad upgrades, read all five production skills before implementing, plus generators whose trigger surfaces exist. Read each phase's required references at phase entry. For narrow edits, load the affected specialists and references, preserving unrelated systems. Record actual loaded resources when reporting skill use; a phase label is not a skill invocation.

## Continuity and early quality

Start broad builds with the gameplay design brief, core-loop contract, and level plan. Define art direction, camera scale, and hero/readability targets early. Launch useful asset jobs while implementing the loop, then assess a representative playable scene with the real assets before multiplying levels, waves, or enemy variants. Inspect concepts and generated model previews before their dependent generation or rigging stages.

For substantial tasks maintain `artifacts/game-progress.md`: current intent and constraints, decisions, completed work, pending jobs with task IDs/checkpoint paths, remaining defects, and next actions. Re-read it after an interruption. A correction updates affected work; a status question does not replace the build objective. Preserve completed assets and mark obsolete pending outputs instead of accidentally spending again.

Use available background tool sessions or submit/status/download commands to keep independent work moving.

## The bar for premium work

Every visible surface that exists in the design is authored, not just the hero: player, obstacles and enemies, interactables, ground and world kit, HUD and menu states, lighting and materials, feel, and target-device performance. Unrefined primitives, empty arenas, box skylines, generic stat-card HUDs, and glow-or-fog-only detail are prototype placeholders unless the user explicitly chose that style. Interpret the scorecard through the genre rather than adding unrelated content.

Score the result with the 10-category scorecard in `threejs-aaa-graphics-builder/references/visual-scorecard.md`, using its anchors and the inspector's measured metrics rather than a personal rubric. Premium means no category below 2 and an average of at least 2.3.

## Asset sourcing

```bash
bash <director-skill-dir>/scripts/probe_asset_credentials.sh
```

When external generation is in scope, run it before assuming anything about keys. It sources the user's shell profile, which the agent process usually does not inherit, and prints `KEY=SET|MISSING` for all three providers. Explicitly procedural or no-external-service work does not need a credential probe.

With keys set, premium hero surfaces get generated assets: player, boss, creature, vehicle, ship, weapon, signature building. Respect an explicit procedural-only style or external-generation restriction. Procedural kits handle repeated props, decals, collision proxies, and instanced volume. Premium active gameplay includes event-driven audio.

Read `references/asset-recovery.md` when sourcing external assets or recovering a job; it classifies each failure and says when a local fallback is allowed. Continue independent work meanwhile.

## Verification ownership

The lead consolidates specialist results into one check set appropriate to the change. Full games need production build, real-input progression and retry, target-viewport captures, renderer diagnostics, and the premium scorecard when requested. Small edits need affected behavior/layout checks. Repeat checks only after relevant changes, failures, or unresolved concerns. For animated work include motion captures covering locomotion, transitions, and contact timing, not only stills.

## Getting started and checking output

```bash
python3 <threejs-gameplay-systems-skill-dir>/scripts/create_threejs_game.py ./my-game
node <threejs-qa-release-skill-dir>/scripts/inspect-threejs-canvas.mjs --manifest artifacts/evidence.json --url http://127.0.0.1:5188
python3 <director-skill-dir>/scripts/check_evidence.py ./my-game --manifest artifacts/evidence.json
```

Generated games carry their own `npm run inspect:canvas` and `npm run verify:visual`. Before capturing, read `references/evidence-manifest.md` and declare the expected viewport/state pairs for this pass. The checker verifies only that set and its run ID. Its result establishes artifact coverage, not aesthetic quality or gameplay correctness. When maintaining the pack itself, use `references/workflow-evaluations.md` for behavioral comparisons.

## Final response

Lead with what was built, whether it works, the local URL and controls, and remaining limitations. For substantial builds put the design artifacts, asset task IDs/paths, captures and motion evidence, renderer/physics metrics, tests, and scorecard in `artifacts/final-evidence.md` and link it. For narrow edits report only affected behavior and checks. Describe what ran and was observed; do not substitute a completion claim for missing evidence.

© majidmanzarpour · MIT · majidmanzarpour/threejs-game-skills

See also

Project sponsors

Companies that keep this analytics open
Gold sponsor

Impressions, clicks and code copies — open statistics. We keep the numbers public for the same reason NeBlask itself is public. Become a sponsor