theatre-js
✓モーション デザイン、タイムライン アニメーション、ビジュアル アニメーション エディターの実装、Three.js/R3F シーンのアニメーション化、キーフレーム アニメーションの作成、または Theatre.js、@theatre/core、@theatre/studio、@theatre/r3f、劇場の使用、または Web 用のアニメーション ツールの構築時に使用します。
SKILL.md
Motion design editor and animation library for the web. Provides a visual timeline editor (Studio) with programmatic control.
| Project | Container for all animation data; maps to exported JSON state | | Sheet | A scene or component; contains objects and one sequence | | Object | Animatable entity with typed props | | Sequence | Timeline with keyframes; controls playback | | Props | Typed values (number, compound, rgba, etc.) |
| references/01-core.md | Project setup, sheets, objects, sequences, playback control | | references/02-prop-types.md | Defining props, custom types, compound props, constraints | | references/03-studio.md | Studio UI, keyboard shortcuts, extensions, panels | | references/04-react-integration.md | useVal, usePrism, @theatre/react hooks |
モーション デザイン、タイムライン アニメーション、ビジュアル アニメーション エディターの実装、Three.js/R3F シーンのアニメーション化、キーフレーム アニメーションの作成、または Theatre.js、@theatre/core、@theatre/studio、@theatre/r3f、劇場の使用、または Web 用のアニメーション ツールの構築時に使用します。 ソース: noklip-io/agent-skills。
引用可能な情報
AI/検索での引用用の安定したフィールドとコマンド。
- インストールコマンド
npx skills add https://github.com/noklip-io/agent-skills --skill theatre-js- カテゴリ
- </>開発ツール
- 認証済み
- ✓
- 初回登録
- 2026-02-01
- 更新日
- 2026-02-18
クイックアンサー
theatre-js とは？
モーション デザイン、タイムライン アニメーション、ビジュアル アニメーション エディターの実装、Three.js/R3F シーンのアニメーション化、キーフレーム アニメーションの作成、または Theatre.js、@theatre/core、@theatre/studio、@theatre/r3f、劇場の使用、または Web 用のアニメーション ツールの構築時に使用します。 ソース: noklip-io/agent-skills。
theatre-js のインストール方法は？
ターミナルまたはコマンドラインツール（Terminal、iTerm、Windows Terminal など）を開きます このコマンドをコピーして実行します: npx skills add https://github.com/noklip-io/agent-skills --skill theatre-js インストール後、スキルは自動的に AI コーディング環境に設定され、Claude Code や Cursor で使用できるようになります
ソースリポジトリはどこですか？
https://github.com/noklip-io/agent-skills
詳細
- カテゴリ
- </>開発ツール
- ソース
- skills.sh
- 初回登録
- 2026-02-01