はじめに
Modoki は、ビジュアルエディタを備えた AI ネイティブな 2D/3D ゲームエンジンです。ゲームは エンティティ・コンポーネント・システム(ECS)のワールドとして構築します。データを保持する トレイト を備えたエンティティを、システム が駆動する仕組みです。そして、まったく同じ TypeScript コードを iOS・Android・Web へそのまま出荷できます。
このページでは、インストールからゲームの起動までを一通り解説します。
エディタをインストールする
Modoki は macOS および Windows 向けのデスクトップエディタとして提供されています。 ダウンロードページ から最新ビルドを入手して起動すると、前回開いていた プロジェクトが再度開きます。新規プロジェクトを始めたい場合は File → New Project から 作成できます。
早期アクセス
macOS 版は Apple による署名と公証(notarization)が済んでいるため、通常どおり起動できます。 一方 Windows 版はまだコード署名されていないため、初回起動時に SmartScreen が警告を表示する ことがあります(More info → Run anyway をクリックしてください)。
Windows:プロジェクトは Dev Drive に置きましょう
Windows の既定のファイルシステムである NTFS 上では、Node と npm の動作が体感でも分かるほど遅く なります。エディタはインストールやビルドで NTFS を頻繁に利用するため、この影響は無視できません。 Windows で開発する場合は、プロジェクトを Windows 11 の Dev Drive に置くことを おすすめします。これは開発ワークロード向けに最適化された ReFS ベースのボリュームで、 npm install やビルドの各ステップを劇的に高速化します。効果を最大化するには、npm キャッシュ も Dev Drive 上へ移動してください(npm config set cache E:\packages\npm。ドライブレターは 環境に合わせて調整します)。パッケージキャッシュの移動については Microsoft のガイドが詳しく 説明しています。
最初のプロジェクト
File → New Project を実行すると、完成済みですぐに動く hello-world ゲームが生成されます。 スプライト 1 つと簡単な UI だけの、最小構成のプロジェクトです。すべてのプロジェクトは完全に 自己完結しており、独自のシーン・設定・アセットを持ち、(モバイル向けにビルドする際は)独自の ネイティブ iOS/Android フォルダも備えます。
プロジェクトを開くと、ドッキング可能なパネル群からなるエディタのシェルが表示されます。
- ヒエラルキーとインスペクター — シーン内のエンティティと、そのトレイト
- SceneView — トランスフォームギズモを備えたオーサリング用ビューポート
- アセット — モデル・テクスチャ・マテリアル・プレハブ
- Game — 3 つのレンダリングレイヤー(3D・2D・UI)をすべて実行するライブプレビュー
3 つのレンダリングレイヤー
1 つのシーンで 3 つのレイヤーを同時に合成でき、それぞれが Renderable.layer によって 駆動されます。
| レイヤー | レンダラー | 用途 |
|---|---|---|
3d | Three.js / WebGPU | モデル、カメラ、ライト、環境 |
2d | PixiJS v8 | スプライト、パーティクル、高スループットな 2D |
ui | React DOM | HUD、メニュー、ECS 駆動の flexbox レイアウト |
オーサリングし、そして検証する
Modoki は手作業だけでなく、AIエージェントによる操作も前提に設計されています。ゲームロジックは 注入可能なクロック、シード付きRNG、そしてティック単位でタイムスタンプが付く イベントジャーナル の上で動作します。そのため AIエージェントは、スクリーンショットではなく データによって、ロジックを ヘッドレスかつ決定論的に 検証できます。
出荷する
準備が整ったら、Build メニュー で 1 つの TypeScript コードベースを次の形式にコンパイルできます。
- Web — どこにでもホストできる静的バンドル
- iOS / Android — あなた自身のチームで署名する、ネイティブの Capacitor アプリ
- Playable ad(プレイアブル広告) — 広告ネットワーク向けの、自己完結した単一の
index.html
次に読むべきページ
エディタの各パートを順番に見ていきましょう。
- ヒエラルキーとインスペクター — エンティティ、トレイト、そして ECS モデル
- SceneView とギズモ — オーサリング用ビューポート
- アセットとインポート — アセットパイプラインと GUID 参照
- アニメーションとカーブエディタ — 任意のトレイトフィールドをキーフレーム化する
- パーティクルエディタ — ライブプレビューを見ながらエフェクトを作成する
- ビルドとデプロイ — Web・iOS・Android へ出荷する