three.js Scene Setup

gamedev-skills/awesome-gamedev-agent-skills

Create a responsive 3D scene with module imports, a camera, WebGL renderer, animation loop, and OrbitControls.

Материал обновлён:

Открыть на GitHub
npx skills add gamedev-skills/awesome-gamedev-agent-skills
8 771Звёзды894ФоркиПоследний push репозитория

Об этом Skill

Create a responsive 3D scene with module imports, a camera, WebGL renderer, animation loop, and OrbitControls.

Почему мы его выбрали

Provides a focused workflow, implementation patterns, and common failure checks for three.js scene setup. Pair it with the detected engine and any related systems required by the task.

Для каких задач подходит

  • Use when your game task needs three.js scene setup.

What this skill helps you build

Create a responsive 3D scene with module imports, a camera, WebGL renderer, animation loop, and OrbitControls.

Original threejs-scene-setup instructions

Patterns in the upstream playbook

The entrypoint covers: HTML import map + module entry (no bundler); Scene + camera + renderer; The render loop (setAnimationLoop + Timer); Responsive resize; OrbitControls (orbit / pan / zoom).

Original threejs-scene-setup instructions

Use it in your project

  1. Inspect the existing project

    Describe the desired behavior and share the relevant project files, engine version, and current failure or target result.

  2. Apply the focused playbook

    Create a responsive 3D scene with module imports, a camera, WebGL renderer, animation loop, and OrbitControls.

  3. Verify in the matching runtime

    Run the project or workflow with its actual dependencies and check the changed behavior before accepting the result.

Original threejs-scene-setup instructionsEngine versions and upgrade policy

Shared collection installation

Install the complete upstream collection with its router and keep each skill’s bundled references, scripts, and assets. The dispatcher selects an engine and the smallest relevant task set; a member listing is a focused entry into that shared package.

КомандаДля чего полезна
npx skills add gamedev-skills/awesome-gamedev-agent-skillsKeep the router and supporting skill folders available together.

Upstream installation guide

Перед использованием

  • A browser project with the matching Phaser, PixiJS, or three.js dependency and a local HTTP server or existing build setup.

Поддерживаемые агенты

Claude CodeCodex CLICursorGitHub CopilotDeepSeek HarnessGemini CLIGrok BuildHermes AgentOpenCodePiKiroRovo DevQoderMistral VibeGoogle Antigravity

Источники и материалы

Ссылки на оригинальные материалы приведены ниже. Практические идеи предложены редакцией SkillHey.