threejs-builder
Creates simple Three.js web apps with scene setup, lighting, geometries, materials, animations, and responsive rendering. Use for: "Create a threejs scene/app/showcase" or when user wants 3D web content. Supports ES modules, modern Three.js r150+ APIs.
Оригинален текст · няма потвърден превод на българскиПърво прочетете инструкцията.
Файлът се зарежда от посочения източник само по ваше действие. Можете да го прочетете тук, да го копирате или да го запазите като .md.
GitHub хранилище- Звезди на репото
- 428
- Лиценз
- Не е посочен. Проверете в репозитория.
- Последна проверка на записа
- Няма посочена дата
Добавете в своя инструмент.
Командата отваря избора на skills от репозитория. Прочетете файла и условията на автора преди изпълнение.
npx skills add aiskillstore/marketplaceСтраницата копира текст. Не инсталира и не изпълнява нищо на устройството ви.
Откъс от SKILL.md
Началото на файла на автора, без превод.
Three.js Builder
A focused skill for creating simple, performant Three.js web applications using modern ES module patterns.
Philosophy: The Scene Graph Mental Model
Three.js is built on the scene graph—a hierarchical tree of objects where parent transformations affect children. Understanding this mental model is key to effective 3D web development.
Before creating a Three.js app, ask:
- What is the core visual element? (geometry, shape, model)
- What interaction does the user need? (none, orbit controls, custom input)
- What performance constraints exist? (mobile, desktop, WebGL capabilities)
- What animation brings it to life? (rotation, movement, transitions)
Core principles:
- Scene Graph First: Everything added to
scenerenders. UseGroupfor hierarchical transforms. - Primitives as Building Blocks: Built-in geometries (Box, Sphere, Torus) cover 80% of simple use cases.
- Animation as Transformation: Change position/rotation/scale over time using
requestAnimationFrameorrenderer.setAnimationLoop. - Performance Through Simplicity: Fewer objects, fewer draw calls, reusable geometries/materials.