作者: kevin
ライブで試す このプロジェクトについて
アーカイブは、アレクサンドラトリバネアゲハからホメルスアゲハまで、絶滅危惧チョウ6種を収録。それぞれにドラッグで回転できる3D標本と、保護状況（IUCN / CITES）・分布・生息地・主な脅威をわかりやすくまとめた解説が付き、名前や保護レベルで検索・絞り込みできます。
サイトはTripo APIに直結しています。各種に調整済みのモデリングプロンプトが付属し、ワンクリックでコピーできるほか、その場でテキストから3D生成タスクを実行して完了まで見届けることも可能。参考画像とモデルファイルもダウンロードでき、「標本を見る」が「標本を作る」に変わります。
体験ポイント
- 絶滅危惧チョウ6種の標本をドラッグで回転させ、翅の細部をあらゆる角度から観察できる
- 名前や保護状況（IUCN / CITES）で種を検索・絞り込みできる
- すべての種に調整済みのモデリングプロンプトが付属し、ワンクリックでコピーできる
- Tripo APIに直結。その場でテキストから3D生成タスクを実行し、完了までポーリングして、参考画像とモデルをダウンロードできる
技術解説
Tripo API 連携 · テキストから 3D のタスクパイプライン
Tripo との連携は独立したサービスファイル 1 つに収まっていて、流れはたった 3 ステップ。まず Bearer キーで認証し、次に種のプロンプトを添えてテキストから 3D のタスクを作成（texture と pbr をオン、テクスチャ品質は standard）、最後に 4 秒ごとにタスクの状態を確認 — 生成が終わればモデルのダウンロード直リンクが手に入り、失敗・キャンセル・タイムアウトもきちんと処理されます。
この数十行は、そのまま使える連携テンプレートです：認証、タスク作成、ポーリング、結果取得。自分のプロジェクトにコピーして API キーを差し替えれば、それだけで動きます。
プロンプトエンジニアリング · 種ごとのレシピ
6 種それぞれに、何度も練り直したモデリングプロンプトが付いています。レシピは 3 パートに分けられます：まず形態をはっきり伝える（オスの背面ビュー、翅脈の走り、腹部の配色）、次に望まない効果を除外する（マット仕上げで — メタリックや虹色の反射はなし）、最後に出力条件を指定する（薄い翅、クリーンなトポロジー、PBR テクスチャ）。どのプロンプトもサイト上でワンクリックコピー — このアーカイブから持ち帰る価値がいちばんあるのは、実はこの「ソースコード」たちです。
標本ビューア · プロシージャル形状 + 複数フォーマット出力
ページ上でドラッグして遊べるチョウは、Three.js でプロシージャルに組み立てた軽量な形状（ひと組の翅、標準マテリアル、半球ライト）で、外部アセットなしで動きます。もっと精細なものが欲しければ、各種に Tripo 生成の PBR FBX と基本 OBJ ファイルがダウンロード用に用意され、プレビュー画像も Tripo のレンダリングそのまま — オンラインで触るのとアセットを持ち帰るのが、互いに邪魔をしません。
アーカイブ · データ駆動の React
種のアーカイブにある保全状況（IUCN / CITES）、分布、生息地、脅威はすべてデータ駆動で描画され、検索もフィルタリングもフロントエンドだけで完結します。バックエンドは不要。スタックは React 19 と Vite 8 だけで、ビルド結果は純粋な静的ファイル — 静的ホスティングに置けばそれで公開完了です。
