草木の3D素材を、
ブラウザで仕立てて持ち出す。
FABOTANIC（ファボタニック）は、木・草花・シダ・観葉植物・サボテンなど41系統の植物を、形と質感から組み立てる3D素材ジェネレーターです。できた植物は、ゲームやWebで使えるGLB、透過PNG、Three.js用のZIPで保存できます。無料・登録不要で、植物の生成と書き出しはブラウザの中で完結します。
書き出した植物で、背景を組む。
どの作例も、FABOTANICから保存したGLBを Three.js r185 のシーンに並べて撮影したものです。近くは細部のある近景モデル、遠くは軽い中景・遠景モデルというように、置く距離で用途を使い分けています。
画像をクリックすると、その場面の中に入って見回せます（ドラッグで向きを変え、WASD・矢印キー・ホイールで移動。スマホは画面のボタンで前後に進みます）。草花は風で揺れます（右上のボタンで止められます）。3Dで見る版は、ブラウザで動かせるように遠くの草花を中景・遠景モデルに置き換えて間引き、テクスチャを512pxに縮めています。読み込みは1場面あたり約4〜14MBです。
作例の地面・空・雲・山並み・水面・光・配置と、色の調整・風の揺れは、この紹介のために別に組んだものです。ツールが書き出すのは植物のモデルと付属のコードで、作例用の地形・空・水面は含みません。ただし野草フィールドでは、生成した地面を含めて保存できます。
できること
植物の種類を選び、数値とシードで形を仕立て、使う場面に合わせて書き出します。
41系統の草木
広葉樹・針葉樹・竹から、野草・野花・シダ・観葉植物・サボテンまで。同じ種類でもシードを変えれば別の個体になります。
通常とローポリ
細部まで表現する「通常」と、専用の面構成で作る「ローポリ」。作品の画風に合わせて選べます。
近景・中景・遠景
近景・中景・遠景で、用途に合ったモデルを選べます。遠景の表現は植物とスタイルによって異なり、一部の通常樹木では画像を使った軽量モデル、それ以外では簡略化した立体モデルなどを使います。
形と質感を調整
高さ、枝の始まる位置、葉の量、色や質感などを数値で調整できます。設定はJSONに保存して、あとから読み込み直せます。
樹木LODと大量配置
対象：通常スタイルの樹木9系統
広葉樹A〜E・花木A・針葉樹A〜Cは、近景・中景・遠景の3モデルを距離で切り替えるZIPで保存できます。この9系統の遠景は画像を使った軽量モデルで、数千本を並べるための配置用コードも付きます。
ブラウザの中で完結
生成・編集・保存はすべて手元のブラウザで行います。アカウント登録は不要で、入力した設定や作った素材をサーバーへ送ることはありません。
収録している植物
広葉樹A〜E、花木A・B、針葉樹A〜C、竹類A・B
野草パッチA〜C、細葉草本A・B、穂草A・B、枯れ草株、タンポポ型、オオバコ型、野花A〜C、三小葉草本A・B
シダA・B、観葉広葉植物A・B、観葉硬葉植物A
多肉A〜C、サボテンA・B、ヤシ型A・B、ソテツ型A
草・クローバー・広葉雑草が混ざる植生面（既定は3m四方）
書き出せる形式
| 形式 | 中身 | 向いている使い方 |
|---|---|---|
| GLB | 形状と質感（PBR）を1ファイルに。テクスチャは512px〜2K | Three.jsやglTF対応のソフトで、静止した植物として配置 |
| 透過PNG | 背景なしの画像（長辺1,600px） | 2Dの背景、資料、サムネイル |
| 生成設定JSON | 種類・設定値・シード | 同じ植物を作り直す、続きを編集する |
| Three.js ZIP | GLB、読み込み用コード（r185）、最小サンプル、AI向けガイド | 風で揺らしたいとき、AIに組み込みを任せたいとき |
| 樹木LOD ZIP | 近景・中景・遠景の3モデルと距離切替のコード | カメラが近づく木（対象は通常スタイルの樹木9系統） |
| LOD ZIP | 野草フィールドの近景・中景・遠景と配置情報 | 広い草地を距離に応じて軽くしたいとき |
付属のサンプルは、Three.js r185 をCDN（jsDelivr）から読み込みます。自分のサーバーから配信することもできます。
使い方
種類を選ぶ
左の一覧から植物を選びます。一覧の画像は実際の描画結果です。
仕立てる
高さや葉の量、色を調整。「形をシャッフル」で同じ設定のまま別の個体にできます。
用途とスタイルを決める
近景・中景・遠景と、通常・ローポリを選びます。
書き出す
右上の「書き出す」から形式を選んで保存します。保存すると利用条件の版とURLがファイルに記録されます。
AIに頼んで、ゲームへ組み込む。
「Three.js ZIP」には、AI向けの説明書 AI_README.md と、寸法・原点・対応機能をまとめた asset.json が入っています。Claude Code や Codex などのコーディングAIにZIPごと渡せば、植物の大きさや置き方を推測させずに組み込みを進められます。
ZIPで保存
使う植物だけを「Three.js ZIP」で保存します。種類ごとに別のZIPにします。
プロジェクトに置く
ZIPを展開して、植物ごとに別フォルダへ置きます（例：
assets/plants/<assetId>/）。AIに読ませる
まず
AI_README.mdとasset.jsonを読むように伝えます。範囲を指定する
何本・どこに・揺らすかどうかを伝え、足してほしくない機能も書いておきます。
assets/plants/ にある FABOTANIC の植物を、このゲームの背景に配置してください。 まず各フォルダの AI_README.md と asset.json を読み、単位・原点・対応機能を確認してください。 ・既存の scene・renderer・ゲームループ・Three.js はそのまま使う ・GLBを既存の読み込み処理で静止配置する（風・自動LOD・編集UIは付けない） ・木は川沿いに10本、草は手前に30株。重なりすぎないように ・追加・変更するファイルと、入れなかった機能を最後に一覧にする
- 基本は静止配置GLBを既存の読み込み処理に渡すのがいちばん軽く、依存も増えません。付属コードは、風や距離切替が必要なときだけ使います。
- 揺らすなら明示する付属の読み込み関数は、風に対応した素材では既定で風が有効になります。静止させたいときは
windEnabled: falseを指定するよう伝えてください。 - 林や山肌を埋めるなら遠景通常スタイルの樹木9系統を遠景で書き出したZIPには、区画ごとにまとめて描く配置用コード（
loadBackgroundForest）が付きます。数千本規模の背景に向いています。 - 別の日のZIPは別フォルダに同じ名前のファイルを上書きすると、以前の素材が壊れます。
assetIdごとのフォルダで管理するよう伝えておくと安全です。
利用条件の要点
ゲーム・映像・広告・Web・アプリ・受託制作などの作品に、商用でも組み込めます。加工も自由です。
作品内のクレジットは任意です。記載していただける場合は「植物素材：FABOTANIC（AMIX）」のようにどうぞ。
素材そのものを素材集・アセットパック・NFTなどとして配布・販売することはできません。無料配布も同じです。
ZIPに付く読み込み用コードは、対象ファイルに限りMITライセンスです。
詳しくはライセンスと利用条件（条件版 1.0.0）をご確認ください。要約より条件本文が優先します。
よくある質問
無料で使えますか？
無料です。アカウント登録も不要です。
作った植物を商用のゲームや映像に使えますか？
使えます。ゲーム・映像・広告・Web・受託制作などの作品に組み込めます。作品内のクレジットは任意です。素材そのものを素材集として配布・販売することはできません。
作ったデータはサーバーへ送信されますか？
入力した設定や作った素材は送信されません。生成・編集・保存はすべてブラウザの中で行います。なお、ページの閲覧状況はアクセス解析（Cloudflare Web Analytics）で計測しています。詳しくはツールプライバシーポリシーをご確認ください。
Three.js以外でも使えますか？
GLBはglTFの標準形式です。Blenderなど、glTFを読み込めるソフトで開けます。ゲームエンジンで使う場合は、各エンジンのglTF読み込みへの対応をご確認ください。風や自動LODの付属コードは Three.js r185 用です。
スマートフォンでも使えますか？
画面は対応していますが、植物の生成と書き出しには処理の余裕が必要です。PCでのご利用をおすすめします。