sloemo01/diorama

これは何？

主な機能

• 01シーンの境界に合わせた固定の斜め視点カメラ。オービット操作用コントロールはありません。
• 0264色のパレットへの色数制限、規則的なディザリング、インク風の輪郭線を固定のポストプロセスパスで適用。
• 03任意のフレームを固定して比較できる決定論的なシーン。
• 04カメラ、ライティング、リグ、乗り物、水、戦闘、エフェクト用のコピーして使えるモジュール。
• 05固定フレーム、動きの連続画像、エンティティごとのフレーム判定に対応するPlaywrightベースのQAスクリプト。

ユースケース

• Three.jsで小さなアニメーション付きピクセルアートのジオラマやゲームアートのシーンを制作する。
• 回帰チェックのためにフレーム単位で比較できる決定論的なレンダリングを作成する。
• AIコーディングエージェントに、3Dシーン制作の調査から実装までの体系的なワークフローを実行させる。

クイックスタート

1. 1

   リポジトリをクローンする

   git clone https://github.com/sloemo01/diorama.git "<target>"
2. 2

   ビルドする前に、プレイブック全文である SKILL.md を読む

3. 3

   必要なモジュールを templates/ からプロジェクトにコピーする

使う前に知っておきたいこと

• !QA スクリプトの実行には、three、esbuild、playwright-core をインストールした Node が必要です。
• !このインストール手順は、シェルコマンドを実行できる AI エージェント向けです。

トピック

よくある質問

diorama とは？

固定カメラ、パレットへの色数制限、ディザリング、決定論的なフレームQAを備えた、小さなピクセルアートのジオラマ制作向けプレイブックとThree.jsコードキット。 Dioramaは、Three.jsで小さな舞台仕立てのピクセルアートシーンを作るためのプレイブック兼コピーして使えるコードキットです。ここでいうジオラマは、台座の上に作られた小さなシーンを、固定した斜め視点のカメラで撮影し、64色のパレット、規則的なディザリング、インク風の輪郭線、おもちゃのようなスケールのアニメーション付きフィギュアで表現したものです。リポジトリの中心となるのは、調査を起点とする制作ワークフロー、ビジュアルとアニメーションの基準、パイプライン、QAプロセスを網羅した単一の自己完結型ファイル、SKILL.mdです。

diorama は無料で使えますか？ライセンスは？

diorama は MIT ライセンスのオープンソースです。商用製品で使う前にライセンス条件を確認してください。

diorama は今もメンテナンスされていますか？

活発にメンテナンス中。diorama の最終コミットは 2026年11月7日 です。

diorama は何に使えますか？

Three.jsで小さなアニメーション付きピクセルアートのジオラマやゲームアートのシーンを制作する。 回帰チェックのためにフレーム単位で比較できる決定論的なレンダリングを作成する。 AIコーディングエージェントに、3Dシーン制作の調査から実装までの体系的なワークフローを実行させる。

diorama のインストール方法は？

リポジトリをクローンする: git clone https://github.com/sloemo01/diorama.git "<target>" ビルドする前に、プレイブック全文である SKILL.md を読む 必要なモジュールを templates/ からプロジェクトにコピーする

diorama はどこで入手できますか？

ソースコードとインストール手順は GitHub にあります：https://github.com/sloemo01/diorama