mcpField
T
threejs-ecs-ts

threejs-ecs-ts

github.com/podoDevelopment29160 installsUpdated 1d ago
Repository

About threejs-ecs-ts

A skill for TypeScript 3D scene development that combines Three.js rendering with ECS architecture patterns. It is intended for complex interactive scenes with many independent objects.

Key features

  1. 01Combines Three.js with ECS architecture
  2. 02Separates data and logic with components
  3. 03Targets complex interactive 3D scenes
  4. 04Uses TypeScript to manage scenes

Use cases

  1. 01Build 3D game scenes with many characters
  2. 02Organize objects and behaviors in simulations
  3. 03Manage independent objects in interactive installations
  4. 04Structure complex scenes with ECS

Install

Copy the command and run it in a terminal.

$npx skills add https://github.com/podo/design-agent-skills --skill threejs-ecs-ts

After installing, type/threejs-ecs-tsin Claude Code to confirm it loaded.

Bundled filesstub.yaml

Details

From the project README

threejs-ecs-ts

Catalogue stub — full package: Nice-Wolf-Studio/claude-skills-threejs-ecs-ts

Decision tree

  1. Is the package already installed? Check: ~/.design-agent-skills/skills/threejs-ecs-ts/SKILL.md exists.

    • Yes → invoke threejs-ecs-ts and proceed
    • No → go to step 2

  2. Do you have shell access?

    • Yes → run the install command below, then invoke the skill
    • No → show the install command; in Claude Code, send it as a chat message starting with ! — add -g for global install or omit for project-only

Install command

npx skills add Nice-Wolf-Studio/claude-skills-threejs-ecs-ts

Invoke after install

  • Skill name: threejs-ecs-ts
  • Trigger phrases: "Three.js ECS", "entity component", "3D game architecture"

What it does

Combines Three.js rendering with Entity Component System (ECS) architecture patterns in TypeScript, providing a structured approach to managing complex interactive 3D scenes. ECS separates data (components) from logic (systems) and entities (IDs), enabling scalable scenes with many independent objects such as game characters, simulations, or interactive installations. Ideal when scene complexity exceeds what simple object hierarchies can manage cleanly.

When NOT to use

  • Simple Three.js scenes without architectural complexity — use cloudai-threejs instead
  • WebGPU-specific rendering features — use webgpu-claude-skill instead
  • Architecture/BIM 3D workflows — use threejs-claude-skill-package instead

Comments

Markdown supported