※本記事にはアフィリエイトリンクが含まれています。
そもそも「プロシージャル生成」とは？
プロシージャル生成とは、決められたルールやアルゴリズムに従ってコンピューターが自動的にモデルや模様を作り出す技術です。木や草、岩などの自然物を1本ずつ手作業で作る代わりに、パラメーターを調整するだけで様々な見た目のオブジェクトを量産できるのが特徴で、ゲームの背景やステージ制作にもよく使われています。
ニュース概要
2026年7月10日、80.Levelは3Dアーティストの「Chiro Visuals」氏がブラウザ上でそのまま動くオープンソースの蔦（つた）とイチジクの木のジェネレーターを公開したと報じました。JavaScriptの3Dライブラリ「Three.js」を使って作られており、ブラウザ上で動くツールです。公開リポジトリには依存パッケージを導入してローカル起動する方法が記載されています。枝や葉、蔓の1本1本がその場でリアルタイムに生成されます（出典：80.Level）。
主な新機能・変更点
- 組み込みモデルや対応するGLBモデルの表面にパスを描くと、その経路に沿って蔦が伸びていく
- モデル・成長・葉・形状・見た目・風・成長アニメーションなど、細かくパラメーターを調整可能
- 反復感の少ない、自然でオーガニックな見た目を実現
- GitHubでソースコードが公開されており、誰でも無料で試せる
- リポジトリでは季節による色の変化や花・実、苔の表現などが今後のアイデアとして挙げられている
💡 Three.js
ブラウザ上で3Dグラフィックスを描画するためのJavaScriptライブラリです。専用のゲームエンジンをインストールしなくても、Webページ上でリアルタイムな3D表現ができるため、Web系のゲームやツール制作でよく使われています。
💡 プロシージャル生成
あらかじめ用意したルールやアルゴリズムに従って、自動的にコンテンツを作り出す仕組みのことです。今回はシード値や設定に基づき、蔦の枝ぶりを生成します。設定を変えれば異なる形を試せます。
このニュースから考えられること
✅ 環境アセットを1つずつ手作業で作る手間を減らせる
✅ ブラウザ上で動く。公開デモや対応環境は作者の案内で確認する
⚠️ 現時点ではWeb上のデモ・GitHub公開が中心のため、実際のゲームへ組み込むには自分の使っているエンジン向けに調整する作業が必要になりそう
学ぶならこの講座
※本リンクはアフィリエイトリンクです。
まとめ
- 3DアーティストのChiro Visuals氏がブラウザで動く蔦・イチジクの木ジェネレーターを公開した
- Three.jsを使い、モデルの表面に描いた経路に沿って設定に応じた蔦を生成する仕組み
- GitHubでMITライセンスのソースコードを公開している
