xr843/insect-world

何を解決するか

Insect World は、14 種の昆虫目を横断する 63 種の昆虫を対象としたインタラクティブな 3D エンサイクロペディアです。静止画像や事前作成された 3D モデルではなく、視覚的でインタラクティブな体験を通じて、昆虫の解剖学、ライフサイクル、生態的役割を学ぶ方法を提供します。

動作方法

従来の 3D ギャラリーとは異なり、このプロジェクトはブラウザ上で TypeScript によってリアルタイムに生成される パラメータ化されたジオメトリ を使用しています。外部モデルファイル（GLB/OBJ）は一切使用していません。代わりに、コードが各昆虫の構造パラメータ（頭部、胸部、腹部、脚、翼）を定義し、実行時にジオメトリを構築します。

主な技術的特徴：

• 手続き型テクスチャ生成：CanvasTexture を使用して、微細な表面のディテール（穴、溝、複眼のパターン）を生成。
• 動的アニメーション：トンボの反相翼拍動や、バタフライの連続的な「羽化」アニメーションなど、生物学的に根拠のある動きを実装。
• ライフサイクルモデリング：特定の種について、卵、幼虫、さなぎ、成虫のモデルを生成し、完全変態と不完全変態の違いを示します。
• インタラクティブツール：内部構造を観察できる「矢状面クリッピングツール」、外骨格の透過度を調整する「レイヤリングツール」、特定の解剖学的ポイントにカメラを移動させる「ガイド付きツアー」を含む。

対象読者

視覚的に魅力的な方法で昆虫の形態学や生物学を探索したい好奇心旺盛な読者や学生、また手続き型 3D 生成やインタラクティブ教育ツールに興味を持つ開発者向けに設計されています。

ハイライト

• アセット依存なし：すべての 63 種がコードからレンダリングされるため、拡張性が高く、軽量です。
• ライフサイクルの可視化：8 種の昆虫について、卵、幼虫、さなぎ、成虫の合計 22 段階のモデルを生成。特にさなぎや幼虫の詳細なモデルを含む。
• 生物学的に根拠のある動き：スクリーン表示のために翼拍動周波数を圧縮していますが、種間の相対的な順序は維持されています。
• 包括的なテスト：幾何学的整合性、対称性、中国語版と英語版のデータ整合性を確認するため、4,000 以上のテストを実施。
• 二つのテーマ：「標本テーブル」のライトモードと、「博物館の夜」のダークモードを備え、虹彩翼や発光のための特別な照明を提供。