インタラクティブなボクセル騎士と焚き火のシーン

あなたはシニア・クリエイティブWebGL／Three.jsデベロッパーです。Three.js + WebGLを使用し、完全にスタンドアロンな単一のHTMLファイル（index.html）だけで構成された、完成度が高く実運用可能なインタラクティブ3Dシーンを構築してください。 ### 1. ビジュアルテーマとアートディレクション - 雰囲気：深い夜の森、暖かく輝く焚き火、キャンプ地で休む孤独で疲れた騎士（『DARK SOULS』の篝火／往年のレトロRPGの美学）。 - 美術スタイル：3Dピクセルアート／ボクセル／ローポリ。 - シェーディングとポストプロセス：Three.jsのポストプロセス（RenderPixelatedPass、または低解像度のピクセル化・ディザリング効果に相当するもの）を組み込み、本格的な16bit／32bitレトロ調のルックを実現してください。 ### 2. シーンのジオメトリとアセット（100%プロシージャル。外部の.gltf／.objファイルは使用しない） すべてのアセットは、Three.jsのジオメトリプリミティブ（BoxGeometry、CylinderGeometryなど）と基本マテリアルを使ってプロシージャルに構築し、CORSの問題なくローカルでファイルを実行できるようにしてください。 1. 森の環境： - 地面：プロシージャルに配置したボクセル状の石、キノコ、ローポリの草木を備えた、暗くスタイライズされた地形。 - 木々：空き地を囲み、奥行きと隔絶感を演出するプロシージャルな松／トウヒ、またはブロック状の樹冠を持つ木々。 - 空とライティング：ちらつくボクセルの星が浮かぶ深い真夜中の空と、柔らかな影を落とす寒色系の月明かりのDirectionalLight。 - 奥行き：暗い大気色のTHREE.FogExp2で地平線をなじませる。 2. 焚き火： - 燻る薪とプロシージャルな残り火を囲む石の円。 - 炎のシステム：上昇するアニメーション付きのピクセル化パーティクル（Pointsまたは脈動するボクセルメッシュ）。 - ダイナミックライティング：Math.sin、ノイズ、疑似乱数による変化などを使い、連続的で自然なちらつきを表現する暖色のオレンジ〜赤のPointLight。 3. 騎士： - 頭部、胴体、上腕／前腕、脚、マント、剣をグループ化した階層型シーングラフを、ボクセル化したプリミティブで構築する。 - ビジュアルのディテール：スリット入りのヘルメット、胸当て、ポールドロン、ガントレット、鞘／剣。 - 関節（肩、肘、股関節、膝）のピボットポイントを正しく配置し、プロシージャルな回転アニメーションを滑らかに動かせるようにする。 ### 3. 騎士のインタラクティブ・ステートマシン 選択可能な以下の状態について、レンダーループ内で線形補間（lerp）または三角関数のカーブを使い、滑らかなプロシージャルアニメーションを実装してください。 - 焚き火のそばに座る（デフォルトのアイドル）：あぐらまたはしゃがんだ姿勢で座り、控えめな呼吸のサイクルを繰り返し、炎の近くで手を温める。 - 薪をくべる：騎士が立ち上がって薪を取り、焚き火に投げ入れる。炎が目に見えて大きく燃え上がり、一時的に光の半径が広がり、火の粉がまとまって放出される。 - 剣の稽古：立ち上がって剣を抜き、3段構成の攻撃／受け流しをきれいに繰り出し、戦闘時の構えに戻る。 - 遠くを見つめる：空き地の端まで歩き、剣を地面に突き立て、マントを揺らしながら暗闇の向こうを見つめる。 - 眠る：焚き火のそばの寝袋に横たわり、ヘルメットからアニメーション付きの「Z z z」ピクセルパーティクルが浮かび上がる。 - 肉を焼く：食材を刺した棒を炎の上にかざし、控えめなプロシージャルの煙／蒸気パーティクルを発生させる。 ### 4. カメラシステム カメラの位置とターゲットを補間（lerp）して滑らかに切り替わる、プリセットカメラを用意してください。 - 居心地のよいクローズアップ：騎士と焚き火の明かりに焦点を合わせたミディアムショット。 - アイソメトリックRPG：空き地を高い位置から45度で見下ろす、クラシックな戦術視点。 - シネマティック・グラウンド：星空と松の樹冠を背景に、騎士を見上げるローアングルのドラマチックなショット。 - フリーオービット：標準のOrbitControlsにシームレスに切り替え、自由にインタラクティブな निरी視を行えるようにする。 ### 5. UIとオーディオ - UIスタイル：半透明の暗いフレーム、ピクセル化された枠線、埋め込みGoogle Font（例：「Press Start 2P」）を使った、レトロな8bit／16bit RPGのHUDレイアウト。 - 下部パネル：騎士の各ステートを起動するインタラクティブなアクションボタン。 - 右上パネル：カメラアングルを切り替えるボタン。 - 薪カウンター：追加した薪の本数と現在の火の勢いを追跡する。 - サウンド（Web Audio API）：プロシージャルに合成した薪の爆ぜる音と、夜のそよ風／コオロギの環境音。ミュート／ミュート解除の切り替えボタンも用意する。 ### 6. 技術仕様 - 単一の自己完結型index.htmlファイル。 - CDN（https://t.co/W8o3SZwkCjまたはunpkg）経由で読み込むES Modulesを使用する。 - モジュール化され、コメントが充実したコード構成（initScene、buildEnvironment、buildKnight、buildCampfire、setupUI、setupAudio、animate）。 - ウィンドウのリサイズハンドラーを完全にレスポンシブ対応させ、カメラのアスペクト比とピクセル化パスの解像度を更新する。