Agent skill

Threejs Gameplay Systems

by valkor-ai in valkor-ai/loom

Build and iterate playable Three.js game systems: starter scaffold, architecture, design briefs, core loops, level and encounter design, entities, input, camera, collision and physics, scoring…

Apache-2.0Auto-check passedGame Development

Install Threejs Gameplay Systems

skills CLI
$ npx skills add valkor-ai/loom --skill threejs-gameplay-systems -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install valkor-ai/loom threejs-gameplay-systems --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/valkor-ai/loom.git skills-src && mkdir -p .claude/skills && cp -r skills-src/plugins/shared/loom/skills/threejs/threejs-gameplay-systems .claude/skills/threejs-gameplay-systems && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
threejs-gameplay-systems
GitHub stars
1.2k
Used in
1 other repo
Token cost
~1.4k tokens
SKILL.md length
668 words
Files
39 (incl. scripts, references, assets)
Skills in repo
17
Repo updated
First seen
Licence
Apache-2.0

At a glance

Build and iterate playable Three.js game systems: starter scaffold, architecture, design briefs, core loops, level and encounter design, entities, input, camera, collision and physics, scoring…

  • Works in 6 steps: Inspect existing structure, scripts,… → Keep small ownership boundaries: core,… → Implement in playable increments —… → …
  • First playable slices
  • SKILL.md covers References, Start here, Design first and Build, plus 3 more sections
  • Runs TypeScript and JavaScript scripts from its folder; calls python3

What it does

Threejs Gameplay Systems is an agent skill from valkor-ai/loom. Build and iterate playable Three.js game systems: starter scaffold, architecture, design briefs, core loops, level and encounter design, entities, input, camera, collision and physics, scoring, objectives, and game feel. Use for first playable slices, new Vite/TypeScript/Three.js setups, level/arena/track/wave/hole/puzzle design, combat encounters, difficulty tuning, and juice.

Its SKILL.md is about 1.4k tokens, which your agent loads only when the skill is triggered. The skill folder holds 45 other files, including scripts, reference files and assets (for example `agents/openai.yaml`, `assets/threejs-vite-game/package-lock.json` and `assets/threejs-vite-game/package.json`).

It sits in Game Development, covering 3D graphics and WebGL and Game design. It works with Three.js, Vite and TypeScript. The repository describes itself as: Loop engineering for agentic software delivery. The licence is Apache-2.0.

When your agent uses it

  • First playable slices
  • New Vite/TypeScript/Three.js setups
  • Level/arena/track/wave/hole/puzzle design
  • Combat encounters

Example prompts

  • “/threejs-gameplay-systems”

Requirements

  • Python 3
  • Node.js

Workflow steps

6 steps, taken from the first numbered list in SKILL.md.

  1. Inspect existing structure, scripts, dependencies, loop, input, camera, entities, state, UI, diagnostics.
  2. Keep small ownership boundaries: core, game, entities, systems, assets, ui, tests.
  3. Implement in playable increments — input, state, entity, collision, feedback, HUD and audio hooks, diagnostics — so something is playable…
  4. Tune feel: movement, acceleration, camera follow and FOV, hitstop, impact feedback, cooldowns, difficulty, restart.
  5. Keep hot paths allocation-light and update order explicit.
  6. Route all gameplay randomness through the scaffold's seeded RNG so the deterministic test hooks keep working.

What it can do on your machine

Read from SKILL.md and the folder at commit a30a7e6. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    Ships 1 file in scripts/ (TypeScript and JavaScript, from the files we listed), which the agent can run.

    Shell commands in SKILL.md call:

    • python3

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Threejs Gameplay Systems loads about 1.4k tokens when it runs, and up to ~6.7k if it reads all its reference files. Until then it costs about 101 tokens; SKILL.md has 668 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~101
When it runs · the whole SKILL.md, loaded when a task matches
~1.4k
With references · SKILL.md plus every file in references/, read only if the agent opens them
~6.7k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); the scripts in this folder are not scanned.

SKILL.md

The full file from valkor-ai/loom at commit a30a7e6, republished under its Apache-2.0 licence (© valkor-ai). 668 words, ~1,351 tokens.

Download SKILL.mdSave it as .claude/skills/threejs-gameplay-systems/SKILL.md (or your agent's skills folder). This skill also uses 38 other files; get the full folder from GitHub.
name
threejs-gameplay-systems
description
Build and iterate playable Three.js game systems: starter scaffold, architecture, design briefs, core loops, level and encounter design, entities, input, camera, collision and physics, scoring, objectives, and game feel. Use for first playable slices, new Vite/TypeScript/Three.js setups, level/arena/track/wave/hole/puzzle design, combat encounters, difficulty tuning, and juice.

Three.js Gameplay Systems

Create or evolve a playable browser game loop with clear ownership, responsive controls, deterministic update order, and a space that shapes player decisions.

Resolve <this-skill-dir> and local references from the actual loaded skill file; resolve sibling skills beside it before using runner-discovered alternatives.

References

FileRead it when
references/game-feel.mdtuning feel, juice, impact, hitstop, screenshake, or claiming polished gameplay
references/genre-design.mddesigning levels, arenas, tracks, waves, holes, puzzles, encounters, or difficulty curves
references/physics-engine-selection.mdadding or changing physics, collision-heavy gameplay, vehicles, rolling balls, character controllers, sensors, moving platforms

Start here

bash
python3 <this-skill-dir>/scripts/create_threejs_game.py ./my-game

Copies assets/threejs-vite-game/, rewrites the project name, and gives the game its own visual test and canvas inspector. --force overwrites an existing directory.

Design first

For broad game creation or a substantial design change, write three short artifacts or update the existing ones. A narrow mechanic fix uses the existing design and preserves unrelated systems:

Design brief. Player promise (the fantasy in one sentence) · target feeling · primary verb · secondary verbs · what the player repeats every 5–30 seconds · what changes across 1–5 minutes · how they lose, learn, and restart · what is rewarded and what creates risk · what a better player does differently · how the next decision is communicated · non-goals for this slice.

Core loop contract. Player does [verb] to achieve [objective] while [pressure] creates risk; success gives [reward], failure causes [cost/retry]. Then prove each clause in code: the verb is mapped to real input, the objective is visible in world or HUD, pressure exists inside the first playable minute, reward changes state rather than only visuals, failure teaches what happened, and restart is fast enough to invite another attempt.

Level or encounter plan. Spatial format · what the camera can and cannot see · player start, first decision, first threat, first reward · landmarks · how challenge escalates every 20–60 seconds or per wave/hole/lap · recovery beats · how hazards are telegraphed · which pieces are modular or parameterized.

"Explore a cool scene" is not a design brief. A brief needs decisions, pressure, feedback, and consequence.

Show full SKILL.md (340 more words)Show less

Build

  1. Inspect existing structure, scripts, dependencies, loop, input, camera, entities, state, UI, diagnostics.
  2. Keep small ownership boundaries: core, game, entities, systems, assets, ui, tests.
  3. Implement in playable increments — input, state, entity, collision, feedback, HUD and audio hooks, diagnostics — so something is playable at every step. Establish one representative encounter at the intended camera scale with the actual hero and feedback before expanding content. Enemy, reward, and prop variety should serve the genre's decisions, not a universal asset quota.
  4. Tune feel: movement, acceleration, camera follow and FOV, hitstop, impact feedback, cooldowns, difficulty, restart.
  5. Keep hot paths allocation-light and update order explicit.
  6. Route all gameplay randomness through the scaffold's seeded RNG so the deterministic test hooks keep working.

For coordinated work, define input intents, entity/asset interfaces, and events before delegating independent modules. Report changed behavior and local checks to the lead, who owns the consolidated browser pass. When a user changes requirements, update the existing brief and pending tasks instead of restarting completed work.

Gameplay code emits audio events; threejs-audio-generator produces the actual assets and the runtime audio matrix.

Stack

TypeScript, Vite, Three.js modules, three/addons/... for official controls, loaders, and post-processing. lil-gui for live-tuned constants. Web Audio for runtime playback. Physics engine choice, timestep, and collider strategy follow references/physics-engine-selection.md — Rapier by default when the game needs real simulation.

What goes wrong

A static demo instead of a playable loop · mechanics bolted onto a scene that was built first · a core loop described but never proven through real input, pressure, reward, and fail/retry · a track or arena that decorates rather than shapes decisions · a mechanic that compiles but no input can trigger · camera and controls that lag or hide the next decision · state changes that never reach UI, audio, or VFX · abstractions built before any mechanic needed them.

Report

Behavior and controls, the three design artifacts for broad builds, architecture choices and tuned values, changed files, and what you saw when you played it. Note the physics engine, timestep, and collider strategy when physics is in scope.

© valkor-ai, Apache-2.0. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

SKILL.md and 38 other files (scripts, references, assets) in plugins/shared/loom/skills/threejs/threejs-gameplay-systems of valkor-ai/loom.

  • SKILL.md
  • agents/openai.yaml
  • assets/threejs-vite-game/.gitignore
  • assets/threejs-vite-game/index.html
  • assets/threejs-vite-game/package-lock.json
  • assets/threejs-vite-game/package.json
  • assets/threejs-vite-game/playwright.config.ts
  • assets/threejs-vite-game/scripts/inspect-threejs-canvas.mjs
  • assets/threejs-vite-game/src/core/InputController.ts
  • assets/threejs-vite-game/src/core/Loop.ts
  • assets/threejs-vite-game/src/core/Renderer.ts
  • assets/threejs-vite-game/src/entities/Pickup.ts
  • assets/threejs-vite-game/src/entities/Player.ts
  • assets/threejs-vite-game/src/game
  • … and 25 more

Open the folder on GitHubat commit a30a7e6

Used in 1 other repository

We found 1 copy of this SKILL.md (exact, near-identical or edited) in other folders, from 1 other GitHub owner. This page covers the copy in valkor-ai/loom, which our catalogue first saw on October 7, 2026.

Compare with similar skills

Threejs Gameplay Systems next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Threejs Gameplay Systems compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Threejs Gameplay Systems this skillvalkor-ai/loom1.2k1 repos~1.4kAutomated safety check: PassApache-2.0
Threejs Gameplay Systemscorosolto/client257—~1.5kAutomated safety check: PassAGPL-3.0
Image to Three.js Modelimg2threejs/img2threejs18k1 repos~8.2kAutomated safety check: PassApache-2.0
New ExperimentTresjs/tres3.8k—~782Automated safety check: PassMIT
Telluxcyanfish-x/tellux207—~884Automated safety check: PassMIT
Vitexecpmndrs/viverse132—~2.5kAutomated safety check: PassCustom licence

Similar skills

  • Threejs Gameplay Systems

    corosolto/client

    Build and iterate playable Three.js game systems. An agent skill from corosolto/client.

    257 GitHub stars~1.5k tokensUpdated today
    Game DevelopmentAuto-check passed
  • Image to Three.js Model

    img2threejs/img2threejs

    Rebuilds the object in a reference image as a procedural, animation-ready Three.js model written entirely in code, using staged sculpting with quality checks.

    18k GitHub starsUsed in 1 repo~8.2k tokens
    Game DevelopmentAuto-check passed
  • New Experiment

    Tresjs/tres

    Create a new experiment in TresJS Lab with all necessary files

    3.8k GitHub stars~782 tokensUpdated today
    Game DevelopmentAuto-check passed
  • Tellux

    cyanfish-x/tellux

    How to write application code with Tellux (0.3 API shape). An agent skill from cyanfish-x/tellux.

    207 GitHub stars~884 tokensUpdated 19 days ago
    Game DevelopmentAuto-check passed
  • Vitexec

    pmndrs/viverse

    A skill your agent uses when an AI agent needs to inspect, verify, debug, or profile a live Vite app by running temporary snippets inside the browser page and reading browser logs or captured…

    132 GitHub stars~2.5k tokensUpdated 8 days ago
    Game DevelopmentAuto-check passed
  • Deploy

    cyanfish-x/tellux

    Deploy tellux examples/docs sites via project scripts — one local command (pnpm run deploy) rclone-syncs to the self-hosted site then Wrangler Direct Uploads to Cloudflare Pages.

    207 GitHub stars~1.1k tokensUpdated 19 days ago
    Game DevelopmentAuto-check: notes

More from valkor-ai/loom

All 17 skills in this repo
  • Threejs 3D Generator

    valkor-ai/loom

    Generate, texture, rig, animate, stylize, convert, and download 3D assets for Three.js games via the Tripo API.

    1.2k GitHub starsUsed in 1 repo~2.6k tokens
    Auto-check passed
  • Generate and edit 2D image assets for Three.js games with Google's Gemini image API: concept sheets, image-to-3D inputs, texture and material references, sky and background plates, decals, logos…

    1.2k GitHub starsUsed in 1 repo~1.4k tokens
    Auto-check passed
  • Threejs Game Director

    valkor-ai/loom

    Entrypoint for building, upgrading, and finishing Three.js browser games.

    1.2k GitHub stars~2.3k tokensUpdated 3 days ago
    Auto-check passed
  • Generate, convert, clean, and integrate audio for Three.js browser games with ElevenLabs: sound effects, looping ambience, UI sounds, impact/weapon/vehicle audio, creature and boss stingers…

    1.2k GitHub starsUsed in 1 repo~1.3k tokens
    Auto-check passed
  • Threejs QA Release

    valkor-ai/loom

    Verify and release Three.js browser games: playtest QA, automated bot playtests, mobile and responsive checks, production builds, static-hosting base paths, debug gating, bundle review, screenshots…

    1.2k GitHub starsUsed in 1 repo~1.3k tokens
    Auto-check passed
  • Upgrade Three.js games from prototype visuals to premium browser graphics: art-direction critique, procedural model building, material and texture libraries, world prop kits, shaders, VFX, lighting…

    1.2k GitHub starsUsed in 1 repo~1.2k tokens
    Auto-check passed

Questions about Threejs Gameplay Systems

What does Threejs Gameplay Systems do?

Build and iterate playable Three.js game systems: starter scaffold, architecture, design briefs, core loops, level and encounter design, entities, input, camera, collision and physics, scoring…. Threejs Gameplay Systems is an agent skill from valkor-ai/loom.js game systems: starter scaffold, architecture, design briefs, core loops, level and encounter design, entities, input, camera, collision and physics, scoring, objectives, and game feel.

When should I use Threejs Gameplay Systems?

Threejs Gameplay Systems fits situations like: first playable slices; new Vite/TypeScript/Three.js setups; level/arena/track/wave/hole/puzzle design; combat encounters.

How do I install Threejs Gameplay Systems in Claude Code?

Run `npx skills add valkor-ai/loom --skill threejs-gameplay-systems -a claude-code`. Or copy the skill folder (plugins/shared/loom/skills/threejs/threejs-gameplay-systems in valkor-ai/loom) into .claude/skills/threejs-gameplay-systems in your project. Claude Code loads it when a task matches its description.

How do I install Threejs Gameplay Systems in Codex?

Run `npx skills add valkor-ai/loom --skill threejs-gameplay-systems -a codex`. Or copy the skill folder (plugins/shared/loom/skills/threejs/threejs-gameplay-systems in valkor-ai/loom) into .agents/skills/threejs-gameplay-systems in your project. Codex loads it when a task matches its description.

Can I use Threejs Gameplay Systems in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add valkor-ai/loom --skill threejs-gameplay-systems -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/threejs-gameplay-systems, .gemini/skills/threejs-gameplay-systems, .github/skills/threejs-gameplay-systems and .opencode/skills/threejs-gameplay-systems in your project.

What does Threejs Gameplay Systems need to run?

Going by SKILL.md and its folder, Threejs Gameplay Systems needs TypeScript and JavaScript for the scripts in its folder and the command-line tools its instructions call (python3). Our summary lists: Python 3; Node.js.

Does Threejs Gameplay Systems access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is Threejs Gameplay Systems safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. The check reads SKILL.md only: the scripts in the folder are not scanned, so read them before running anything.

What licence does Threejs Gameplay Systems use?

Threejs Gameplay Systems is published under the Apache-2.0 licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Threejs Gameplay Systems use?

About 1.4k tokens (SKILL.md is roughly 5.4k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 5.4k tokens, read only when the agent opens those files.

What are the alternatives to Threejs Gameplay Systems?

Skills that share tags, products or a category with Threejs Gameplay Systems: Threejs Gameplay Systems (corosolto/client, 257 stars), Image to Three.js Model (img2threejs/img2threejs, 18k stars), New Experiment (Tresjs/tres, 3.8k stars) and Tellux (cyanfish-x/tellux, 207 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Threejs Gameplay Systems?

valkor-ai (a GitHub organization) maintains it in valkor-ai/loom, which has 1,221 GitHub stars. The repository holds 17 skills in this directory. The repository was last updated on October 6, 2026.

Source: valkor-ai/loom on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.