Frame from Real-time coastal shallows in Three.js
PromptFull
こんにちは☺
以下の制作依頼をお願い!君の全力で最高のものを作ってほしいな。
2026年度AAA級相当になったかどうかは、サブエージェント複数にも判断してもらって。

----------------
# 制作依頼:2026年AAA志向のリアルタイム海岸・遊泳可能な浅瀬

これは、アイデア提案、制作計画、サンプル画像だけを求める依頼ではありません。

Three.js / WebGLを用いて、透明度の高い浅瀬と穏やかな砂浜を持つ、
高品質なリアルタイム海岸シミュレーションを実際に制作してください。

外洋だけを表示する作品ではなく、以下を一体化した海岸環境を作ってください。

- 沖合の海
- 浅瀬
- 海底の砂地
- 砕ける波
- 波打ち際
- 波の遡上と引き波
- 濡れた砂浜
- 砂丘または海岸植生
- 水上・水面・水中を連続移動できる景観

目標品質は以下です。

- WebGL技術デモとしてAAAショーケース級
- 通常のインタラクティブ表示としてAA上位以上
- 静止画だけでなく、波打ち際の動きを動画で見ても自然
- 穏やかで、実際に泳げそうに見える砂浜
- 水面、海底、砕波、泡、濡れた砂が同じ海況に基づいて連動する
- 上空、水面、浜辺、水中のいずれから見ても破綻しない

「遊泳可能」とは、穏やかな波、緩やかな海底勾配、砂地、良好な視認性を持つ
海水浴向けの環境として視覚的に成立することを意味します。

これは現実の海岸の安全性を判定または保証するものではありません。
UIや説明文でも、実在する海岸の安全認証であるかのような表現を使用しないでください。

ユーザーへの細かな途中確認は不要です。
必要な試作、比較、修正、回帰確認、検証、梱包を自律的に行い、
完成した成果物まで一度の依頼で仕上げてください。

利用可能なら `threejs-scene-builder` を使用してください。

---

# 1. 海岸全体のデザイン

デフォルト景観は、実在地を直接再現しない架空の温暖な砂浜としてください。

基本構成:

- 緩やかに湾曲する広い砂浜
- 青緑色から沖の深い青へ自然に変化する海
- 透明度の高い浅瀬
- 急激に深くならない砂質海底
- 穏やかな小〜中程度の岸寄せ波
- 海岸の両端に、境界を自然に隠す低い岬または岩場
- 砂浜の後方に低い砂丘と海岸植生
- 視界を遮らない程度の雲
- 晴天の午後からゴールデンアワーにかけての光

泳ぐ場所の中心部には、以下を配置しないでください。

- 急な崖
- 大量の岩
- 鋭利に見える障害物
- 船舶航路
- 強い離岸流を示す深い水路
- 暴風・高波
- 大量の漂流物
- 不自然に急な海底落差

海底は均一な平面にせず、自然な砂州や浅い起伏を加えてください。
ただし、遊泳区域に見える中央部へ深い溝や急斜面を作らないでください。

特定の実在海岸名、企業名、施設名、ロゴ、商標は使用しないでください。
人工物を置く場合は、無地でオリジナルのデザインとしてください。

人物は必須ではありません。
人物の品質が環境品質を下げる場合は配置せず、景観と水の品質を優先してください。

---

# 2. 地形・海底・水面の共有設計

砂浜、海底、水面、波打ち際を別々の無関係なモデルとして作らないでください。

以下は同じワールド座標、縮尺、海岸線データ、深度データを参照してください。

- 地形形状
- 水深
- 波の浅水変形
- 砕波位置
- 波打ち際
- 泡の発生
- 水の透明度
- 海底コースティクス
- 砂の濡れ
- 遡上と引き波

海底地形から実際の水深を計算し、
その水深を波、色、屈折、砕波、泡、濡れ表現へ使用してください。

砂浜の推奨構成:

- 遊泳区域は緩やかな勾配
- 海岸線は直線ではなく、自然な湾曲と小さな不規則性を持つ
- 浅瀬は十分な幅を確保
- 水深は沖へ向かって自然に増加
- 海底には細かな砂紋と穏やかな砂州を持たせる
- 深い場所ほど砂紋の視認性を減衰させる
- 海岸の端部や有限メッシュ境界をカメラから見せない

水面と地形の交差部で、以下を発生させないでください。

- 水面と砂の間の隙間
- 黒い線
- Z-fighting
- 点滅
- 水面が砂の下へ不自然に潜る現象
- 乾いた砂の上まで海が矩形状に広がる現象
- 海岸線とは無関係な直線的境界
- カメラ角度で移動する偽の波打ち際

---

# 3. 沖合から浅瀬への波の変化

沖合と波打ち際で、同じ波をそのまま平行移動させないでください。

沖合の波には、必要に応じて以下を組み合わせてください。

- Gerstner波
- 方向性海洋スペクトル
- 事前生成IFFT
- 複数スケールの法線・勾配場
- 時間的に連続する微細波

ただし、本作の中心は外洋スペクトルの複雑さではなく、
沖合の波が浅瀬へ入り、変形し、砕け、浜へ遡上する一連の連続性です。

水深に応じて、少なくとも以下を表現してください。

- 波速の低下
- 波長の短縮
- 波向の屈折
- 海底等深線に沿った波峰方向の変化
- 浅水化による波高の増加
- 波峰の非対称化
- 波頭の前傾
- 深さ制限による砕波
- 砕波後のエネルギー減衰

必要に応じて、局所水深と波高の比から砕波候補を判定してください。
例えば深さ制限砕波の目安を利用できますが、
固定値を形式的に適用するのではなく、見た目と安定性も確認してください。

以下の状態を避けてください。

- 全波峰が海岸線へ同時に到達する
- 海岸線と完全に平行な白い帯が周期的に出る
- 沖合と浅瀬で波速が同じ
- 深さと無関係な場所で突然砕ける
- 波が砂浜を貫通する
- 砕波が毎回まったく同じ形になる
- 波が巻かず、透明な壁として立ち上がる
- 波頭だけが板状ポリゴンとして分離する
- 海面全体が同じ方向へ滑る

波の大きさは、通常の遊泳向け海岸として穏やかな状態を標準にしてください。
荒天や危険な高波をデフォルトにしないでください。

---

# 4. 砕波・波打ち際・遡上・引き波

海岸品質の中心要素として、以下を連続的に実装してください。

1. 浅瀬で波が立ち上がる
2. 波頭が前傾する
3. 波頭に白波が発生する
4. 波が砕ける
5. 泡を伴う水塊が浜へ進む
6. 薄い水膜として砂浜へ遡上する
7. 遡上速度が低下する
8. 水が沖へ引く
9. 泡や水筋の一部が砂上に残る
10. 砂が時間をかけて乾く

砕波には、形状、透明度、泡、飛沫を組み合わせてください。
半透明の板や固定画像だけで表現しないでください。

遡上域では、水深が薄くなるにつれて水膜の厚さと透明度を変化させてください。
浜の上に常に一定幅の水色帯を貼り付ける表現は禁止します。

引き波には、必要に応じて以下を表現してください。

- 海へ戻る細い水筋
- 砂の微細な凹凸に沿う流れ
- 筋状に残る泡
- 水膜の薄化
- 濡れた砂への移行

泡は波の現在位置だけでなく、履歴を持たせてください。

- 発生
- 移流
- 拡散
- 変形
- 分裂
- 減衰
- 砂上への短時間の残留
- 引き波による沖方向への伸長

以下を避けてください。

- 海岸線全体を覆う均一な白帯
- 泡の矩形境界
- 規則的な蜂の巣模様
- 波と無関係に漂う泡
- 砂へ貼り付いた静止テクスチャ
- 毎回同じ場所へ出る泡
- 波より先に浜へ到達する泡
- 水が引いても永遠に残る泡
- 最大設定で浜全体が真っ白になる状態

---

# 5. 乾いた砂・濡れた砂・乾燥過程

砂浜は単色の平面にしないでください。

複数スケールで以下を表現してください。

- 大域的な色むら
- 微細な砂粒感
- 風による緩やかな砂紋
- 波打ち際の流れによる細かな筋
- 小さな凹凸
- 非反復的な粗さ変化
- 乾いた砂と濡れた砂の差
- 水中の砂と陸上の砂の連続性

濡れた砂では、乾いた砂と比較して以下を変化させてください。

- 色をわずかに暗くする
- 彩度を適度に上げる
- 粗さを下げる
- 太陽と空の反射を増やす
- 微細法線を少し弱める
- 水膜が残る場所だけ反射を強める

濡れ領域は波の最大到達履歴に基づいて更新してください。
現在の水面位置だけから瞬間的に切り替えないでください。

乾燥は時間をかけて進行させ、
境界が一本の硬い線にならないよう空間的に変化させてください。

避けること:

- 鏡のような砂浜
- 濡れた部分が黒い塗料に見える状態
- 乾湿境界の直線
- 海と無関係に点滅する反射
- 全砂浜へ同じ法線模様を繰り返すこと
- 砂粒を巨大な石のように見せること

---

# 6. 水の材質と浅瀬の透明感

水面には以下を統合してください。

- Fresnel反射
- 空と雲の反射
- 屈折
- 水深に応じた透過
- 波長別のRGB吸収
- 体積散乱
- 太陽の反射光路
- 微細波によるハイライト
- 距離に応じた粗さ
- 水平線の安定化
- 遠距離エイリアシングの抑制
- トーンマッピング
- 露出制御

浅瀬では海底が見え、沖へ向かうほど自然に見えにくくしてください。
単純な水深色グラデーションだけで済ませず、
実際の水中光路と濁度を考慮してください。

浅瀬の色は、鮮やかにしすぎて人工プールのようにしないでください。
海底の明るい砂、水深、空の反射、吸収、散乱の組み合わせとして見せてください。

コースティクスは、波面の形状、太陽方向、海底位置に連動させてください。
固定テクスチャを一定速度で平行移動させるだけの方式は避けてください。

次の破綻を防いでください。

- 海底に貼り付いた発光模様
- 浅瀬全体の均一な水色
- 水深と無関係な透明度
- 水際だけ水が発光する状態
- 水中の砂が陸上と別素材に見える状態
- 空の反射が海底表示を完全に覆う状態
- 視線角度によって海底が突然消える状態

SSRは形式的に追加しないでください。
海岸の岬、岩、施設などに対して明確な効果があり、
画面端の欠落や時間的不安定性より利点が大きい場合だけ採用してください。

採用しない場合は、全天球反射、環境反射、局所的な補助反射を優先してください。

---

# 7. 海岸植生・岩・小物

砂浜の後方には、必要に応じて以下を配置してください。

- 海岸草
- 低い灌木
- 小規模な砂丘
- 流木
- 小石
- 貝殻
- 海藻の小片
- 遠景の岬
- 少量の自然な漂着物

配置は、完全なランダム散布にしないでください。

- 植生は高潮線より陸側
- 海藻や漂着物は過去の波の到達線付近
- 貝殻や小石は局所的な集まりを持つ
- 岩場は遊泳区域の中心から外す
- 水中の小石は深度と流れに応じて量を変える

同じモデルの向きと大きさを変えただけの明白な反復を避けてください。

小物の品質が水、砂、波より低い場合は、
無理に数を増やさず、少数に抑えてください。

既存アセットを使用する場合は、利用条件を確認し、
ライセンスと出典をREADMEへ記録してください。

---

# 8. 水中視点と水面横断

水中専用カメラだけでなく、
浜辺から浅瀬へ入り、水面を横切って泳げる連続的な視点を実装してください。

最低限、以下を成立させてください。

- 足元だけが水に入る状態
- 腰程度の浅瀬
- 水面すれすれ
- カメラが波で部分的に水没する状態
- 完全な水中
- 水中から沖を見る状態
- 水中から浜を見る状態
- 水中から水面裏側を見上げる状態

水面通過時には、以下を滑らかに変化させてください。

- 屈折
- 反射
- 色収差または波長別吸収
- 水中フォグ
- 音を実装する場合のフィルタ
- 水滴または濡れ表現
- カメラの浮力感
- 操作速度
- 上下方向の減衰

画面全体を一瞬で青く切り替えるだけの処理は禁止します。

水中では以下を表現してください。

- 水面裏側の波形
- 屈折
- 臨界角を越えた全反射
- 波長別吸収
- 微細な浮遊粒子
- 海底の砂紋
- 波面に連動したコースティクス
- 浅瀬らしい明るさ
- 沖方向の適度な青緑の減衰
- 砕波下の泡と気泡
- 波打ち際で巻き上がる少量の砂

水中をプールのようにしないでください。

避けること:

- タイル状の海底
- 固定されたコースティクス
- 均一な青フィルター
- 水面裏側の消失
- 水面通過時の黒画面
- 水面境界の激しい点滅
- 水上と水中で異なる波形
- カメラが海底へ潜り込むこと
- 泡が水中で板状に見えること
- 砂煙が常に画面を覆うこと

---

# 9. カメラと景観構図

最低でも、次のプリセット視点を用意してください。

1. Hero Beach
   浜辺から海岸線と浅瀬を斜めに見る代表構図

2. Shoreline
   波打ち際の遡上、泡、濡れた砂が読める低い構図

3. Swimmer
   水面から目線だけを出した遊泳者相当の構図

4. Aerial
   上空から砂浜、浅瀬、砂州、水深変化を見る構図

5. Underwater Shore
   浅瀬の水中から浜方向を見る構図

6. Underwater Sea
   水中から沖と水面裏側を見る構図

7. Breaker Close-up
   砕波、飛沫、泡を近距離で確認する構図

8. Offshore Return
   沖側から浜と岬を振り返る構図

9. Wet Sand Close-up
   水膜、引き波、泡残留、乾湿変化を見る構図

10. Golden Hour
    低い太陽と濡れた砂、水面反射を確認する構図

カメラプリセットは、見栄えだけでなく検証にも使用してください。

有限水面の端、地形の端、背景との継ぎ目、
LOD境界、植生の突然の消失が見える構図を採用しないでください。

探索モードを実装する場合は、以下を備えてください。

- マウス・キーボード操作
- タッチ操作
- 歩行と遊泳の自動切り替え
- 地形との衝突
- 海底への潜り込み防止
- カメラの急激なロール防止
- 水中での適度な慣性
- リセットまたは脱出操作

---

# 10. 空・大気・光

標準の時間帯は、晴天の遅い午後としてください。

重視する要素:

- 明るく開放的な空
- 青緑色の浅瀬
- 沖へ向かう深い青
- 暖色の太陽光
- 濡れた砂の反射
- 雲の柔らかな影
- 海と空の自然な水平線
- 遠景の岬に対する大気遠近
- 白波のディテールを失わない露出
- 水中の自然な明るさ

黒つぶれや白飛びで質感を隠さないでください。

可能であれば以下の時刻プリセットを用意してください。

- Clear Day
- Late Afternoon
- Golden Hour
- Soft Overcast

荒天や夜景は必須ではありません。
まず、泳げそうに見える穏やかな昼間の海岸を完成させてください。

---

# 11. UIと操作

控えめで高品質なUIを実装してください。

必要な項目:

- 視点01〜10
- 探索モード
- 海況
- 波高
- 波向
- 砕波強度
- Shore Foam
- Foam Persistence
- Swash
- Wet Sand
- Tide
- Water Clarity
- Turbidity
- Caustics
- Exposure
- 太陽高度または時刻
- 品質設定
- 一時停止
- 時間速度
- 設定リセット

デフォルト値は、穏やかな遊泳向け海岸として視覚的に成立する値にしてください。

「景観だけ表示」機能を実装してください。

景観だけ表示時:

- キャンバス以外のUIを完全に隠す
- 透明な当たり判定を残さない
- マウスカーソルを必要に応じて隠す
- `Esc`で復旧
- モバイルでは3本指タップ等でも復旧
- 復旧後は、隠す前のパネル状態、フォーカス、スクロール位置を戻す

390×844程度のモバイル画面でも、
タイトル、設定パネル、視点ボタン、操作ボタンを重ねないでください。

タッチ領域は十分な間隔と大きさを持たせてください。

AboutまたはDisclaimer欄を設ける場合は、以下の趣旨を記載してください。

- 本作品は視覚シミュレーションである
- 現実の海岸や海況の安全性を保証しない
- 遊泳判断には現地の天候、警報、監視員、管理者の案内を確認する必要がある

---

# 12. パフォーマンス

最高品質だけでなく、実際に操作可能な速度を維持してください。

デスクトップ向けには、必要に応じて以下を使用してください。

- 高密度水面
- 適応的LOD
- カメラ距離による分割調整
- 高解像度泡・濡れ履歴
- 複数スケールの波
- 高品質な影
- 高品質コースティクス
- 高解像度地形材質

モバイル向けには、自動的に以下を調整してください。

- 水面分割数
- 地形LOD
- 波成分数
- 泡履歴解像度
- 濡れ履歴解像度
- 粒子数
- 影品質
- コースティクス品質
- ポストエフェクト
- 描画解像度

ただし、モバイルでも以下は維持してください。

- 浅水化
- 砕波
- 波打ち際
- 濡れた砂
- 水中視点
- 水面横断
- UI
- 景観だけ表示
- 外部通信なしでの起動

単に解像度を下げて黒い海や平面水面にすることは禁止します。

代表的な実行環境でFPSを実測してください。
実GPUで測定できない場合は、その制約を明記し、
測定できていない性能を推測で保証しないでください。

---

# 13. 配布条件

最終成果物は、通常のブラウザからダブルクリックで起動できるようにしてください。

必須条件:

- ダブルクリック用の単一HTML
- `file://`で起動可能
- ローカルサーバー不要
- ブラウザのセキュリティ設定緩和不要
- CDNを含む外部通信不要
- JavaScript、シェーダー、画像、環境マップ等を内包
- パスに空白や日本語があっても起動
- ブラウザコンソールの警告・エラーを可能な限り0にする
- デスクトップとモバイルへ対応
- 起動失敗時に無限ローディングさせない
- 読み込み状況または明確なエラー表示を備える

編集可能なソース版も別途同梱してください。

外部アセットを使用した場合も、
配布版は外部通信なしで動作するよう内包してください。

ライセンス条件上、内包できないアセットは使用しないでください。

---

# 14. 技術監査

以下を確認してください。

- JavaScript例外
- console error
- console warning
- shader compile / link error
- WebGL error
- NaN / Infinity
- context loss
- 外部通信
- 読み込み失敗
- テクスチャ欠落
- 黒画面
- 初期化停止
- メモリ上の明白な異常
- 水中移行時のエラー
- 品質切り替え時のリソースリーク
- リサイズ時の描画破綻

少なくとも以下の時刻を確認してください。

- 0秒
- 5秒
- 20秒
- 60秒
- ループ境界直前
- ループ境界直後

確認事項:

- 初期化直後の波の跳ね
- 波の位相飛び
- 泡の全面化
- 濡れ領域の永久拡大
- ループ境界の段差
- 周期的な白帯
- 飛沫の点滅
- 水中粒子の突然の再配置
- 海岸線全体の同期移動
- 時間経過によるFPS低下

---

# 15. 海岸固有の視覚監査

少なくとも以下を目視してください。

- 沖合
- 浅瀬
- 砂州
- 砕波直前
- 砕波中
- 砕波直後
- 波の遡上
- 最大遡上位置
- 引き波
- 泡残留
- 乾湿境界
- 濡れた砂の反射
- 水面すれすれ
- 水面横断
- 浅い水中
- 砕波下の水中
- 沖向き水中
- 浜向き水中
- 上空
- 遠景の水平線
- 岬との境界
- 最大泡設定
- 最大潮位
- 最小潮位
- モバイル

特に以下の不具合を探してください。

- 岸と平行な周期的白線
- 泡の矩形境界
- 砂浜へ食い込む水面
- 海面下に残る乾いた砂
- 水がない場所のコースティクス
- 波より先行する泡
- 引き波と逆方向へ動く水筋
- 水面と水中で異なる波形
- 水深と一致しない色
- 濡れた砂の反射の点滅
- カメラ角度で移動する海岸線
- 海岸の有限メッシュ端
- 同じ小物の明白な繰り返し
- 水面通過時の黒画面
- 泳いでいる最中のカメラ振動

---

# 16. 最大値・極端条件の監査

以下を最大または最小へ変更しても破綻しないことを確認してください。

- Wave Height
- Breaker Strength
- Shore Foam
- Foam Persistence
- Swash
- Wet Sand
- Tide
- Water Clarity
- Turbidity
- Caustics
- Exposure
- 時間速度

次の状態を許可しないでください。

- 浜全体の白膜化
- 泡で海色が消える
- 水が砂丘まで上昇する
- 海底が完全に消える
- 水が透明なガラスに見える
- 水が蛍光色になる
- 濡れた砂が鏡になる
- コースティクスが白飛びする
- 飛沫で画面が覆われる
- NaN
- 長時間残る異常な残像
- カメラが地形外へ落下する

極端な設定をUIで許可する必要がない場合は、
視覚的・数値的に安全な範囲へクランプしてください。

---

# 17. モーション比較

静止画だけで完成判定しないでください。

同一カメラ、同一解像度、同一品質設定で連続フレームを取得し、
少なくとも以下を評価してください。

- 沖の波が一方向へ滑って見えないか
- 波が浅瀬で自然に遅くなるか
- 波向が海底地形に沿って変化するか
- 砕波位置が水深と連動するか
- 砕波後にエネルギーが減衰するか
- 泡が波と一緒に移動するか
- 遡上と引き波が区別できるか
- 濡れた領域が時間履歴を持つか
- ループ境界で波打ち際が飛ばないか
- 水中コースティクスが表面波と連動するか

低解像度proxyで候補を選別しても構いませんが、
採用判断は最終品質と同等の条件でも確認してください。

数値上の改善があっても、
単に動きを遅くした、ぼかした、ディテールを消しただけなら不採用としてください。

---

# 18. 品質判断の原則

名称や実装方式だけで品質を判断しないでください。

以下のような判断は禁止します。

- FFTを使ったから高品質
- 浅水式を使ったから自然
- 砕波判定があるから波打ち際も自然
- PBRだから砂がリアル
- コースティクスがあるから水中が合格
- シェーダーがコンパイルできたから完成
- 静止画がきれいだから動画も合格
- 高負荷だから高品質
- 機能が実装されているから視覚的にも十分
- 「遊泳可能」と書いたから安全そうに見える

海岸では、次の連続性を最優先してください。

沖合の波
→ 浅水化
→ 波向の屈折
→ 波高の増加
→ 砕波
→ 泡
→ 遡上
→ 引き波
→ 濡れた砂
→ 乾燥

どこか一つだけ高品質でも、全体が連動していなければ完成扱いにしないでください。

試作結果が悪ければ、採用予定だった方式でも戻してください。
不採用案、一時画像、古い版、失敗テクスチャを最終納品物へ混ぜないでください。

---

# 19. 納品物

以下を完成状態で納品してください。

1. ダブルクリック用の単一HTML
2. 完全な配布ZIP
3. 編集可能なソース
4. 地形・海底生成スクリプト
5. 波・泡・濡れ履歴に関する生成スクリプト
6. HTMLビルドスクリプト
7. 自動検証スクリプト
8. Hero画像
9. 波打ち際画像
10. 砕波近接画像
11. 濡れた砂画像
12. 空撮画像
13. 水面すれすれ画像
14. 水中画像
15. 水面横断前後の画像
16. デスクトップUI検証画像
17. モバイルUI検証画像
18. 波打ち際のモーション確認用MP4またはGIF
19. 水面横断の確認用MP4またはGIF
20. 検証結果JSON
21. README
22. 使用技術と設計判断の説明
23. 第三者ライセンス一覧
24. 全ファイルのSHA-256一覧

READMEには以下を明記してください。

- 実際に採用した沖合の波方式
- 浅水化と波向屈折の方式
- 砕波判定の方式
- 遡上・引き波の方式
- 泡履歴の方式
- 濡れた砂と乾燥の方式
- 水中表現の方式
- runtime処理と事前生成処理の区別
- デスクトップとモバイルの品質差
- SSRを採用または不採用にした理由
- 外部通信なしでの起動条件
- 実測パフォーマンス
- 既知の限界
- 「遊泳可能」は視覚的な設計であり、安全保証ではないこと

ZIPにはトップフォルダを1つだけ含め、
二重フォルダ構造にしないでください。

一時ファイル、キャッシュ、失敗案、旧版は含めないでください。

ZIP作成後に必ず以下を実施してください。

- ZIP破損検査
- 別の空白入りパスへ展開
- 展開後の全ファイルのハッシュ照合
- 展開されたHTMLそのものを`file://`で起動
- Hero、波打ち際、水中、水面横断を再検証
- 景観だけ表示と復旧を再検証
- 圧縮前後の代表画像が一致することを確認

ユーザーへ渡す最終成果物は、
一時作業領域だけでなく、失われにくい保存先にも保存してください。

---

# 20. 完了条件

以下をすべて満たすまで作業を終了しないでください。

- 穏やかで、泳げそうに見える砂浜として成立する
- 沖から岸まで水深が自然に変化する
- 波が浅瀬で減速・屈折・増高する
- 砕波位置が海底水深と整合する
- 波頭、泡、飛沫が分離せず連動する
- 遡上と引き波が自然に見える
- 泡が履歴、移流、拡散、減衰を持つ
- 濡れた砂が波の到達履歴と連動する
- 乾いた砂、濡れた砂、水中の砂が連続する
- 浅瀬で海底が自然に透ける
- コースティクスが水面波と連動する
- 水中が単なる青フィルターに見えない
- 水上から水中へ連続的に移動できる
- 水面横断時に黒画面や大きなポップがない
- 海岸線に黒線、隙間、点滅、Z-fightingがない
- 岸と平行な規則的白帯が目立たない
- 最大泡でも浜全体が白くならない
- デスクトップとモバイルでUIが成立する
- 単一HTMLが外部通信なしの`file://`で起動する
- ZIPを展開した実物でも正常動作する
- console、shader、WebGL、NaN、context lossの重大エラーが0
- 最終成果物、検証資料、再現スクリプトが揃っている

完成報告では誇張せず、以下を明記してください。

- 実際に実装できた内容
- 見送った機能と理由
- 物理ベース部分と視覚近似部分の区別
- モーション検証結果
- 水面横断と水中の検証結果
- 最大値監査の結果
- デスクトップ/モバイルの品質差
- 起動条件
- ZIPのSHA-256
- 既知の限界

Make it yours. Swap "透明度の高い浅瀬と穏やかな砂浜" (clear shallows and a calm sandy beach) for another landscape, and keep the panel of subagents that judges the result.

Make it hereFree runs soon

Real-time coastal shallows in Three.js

A real-time beach in the browser: clear shallows over rippled sand, fish and seagrass underwater, chalk cliffs, a sunset view and droplets on the lens. Claude Code with Claude Opus 5.5 built it in Three.js from a long Japanese prompt and many feedback rounds.

How it was made

The first run used Ultracode; later runs used Max effort with Max subagents. The creator added about four AI-generated beach clips as reference footage and a one-GPU-process rule mid-run (neither is in the prompt), then polished the waves with short comments. Subagents act as an "AAA panel" that scores the build.

Claude Code · Claude Opus 5.5 · Three.js

Source and credit

X · Sep 28, 2026 · 1.8k likes · 220k views · 34 comments

Made with AI, according to the source

Published instructions: GitHub file linked from the creator's how-to post

How it was made

Prompt file

Look notesby Reference

A bright, realistic coastal scene in the browser that moves between turquoise shallows, the underwater sand floor and a chalk-cliff shoreline, framed by a slim dark interface.

Color
Turquoise and teal water, pale sand with bright caustic patterns, white chalk cliffs, blue sky with cumulus clouds, and a warm gold sunset view.
Type
Small uppercase "COASTAL SHALLOWS" at the top left, and tiny Japanese labels on a translucent bottom bar of numbered camera views and settings buttons.
Framing
16:10 views, often split by the waterline, with the horizon low or the camera just under the surface; cliffs sit at the right edge and the interface bars run along the top right and bottom.
Structure
Surface view toward the cliffs, underwater sand ripples, the beach edge, more underwater views, fish over seagrass, open water toward the far shore, and the cliffs again.

Remakes

Nobody has shared a remake of this one yet. Made your own version? Send it for review and credit.

More like this

Game

Rubber bands bursting a 3D watermelon

Sonnet 5.5 · Three.js

Game

Real-time ocean at sunset and in a storm

Opus 5.5

Game

Gummy Grove

Scrolltide

Game

A computer built from 277k NAND gates

Opus 5.5

Game

Pixel ecosystem in a glass orb

Max Bittker

Game

Gummy octopus you can grab and stretch

Opus 5.5 · WebGPU

Game

Fireflies in a luminous field

Nicky Case

Game

Ink-like particle flow field

amandaghassaei

Game

Striped vortex flow

amandaghassaei

Game

Modular cliff landscape builder

Oskar Stålberg

Game

Jelly watermelon slice you can cut

Opus 5.5 · WebGPU

Game

Call of Duty-style FPS on a market street

Claude Code · Three.js

Game

Prehistoric island in an ocean cutaway

Opus 5 · Three.js

Game

Cartoon kart racer for split-screen TV

Partial prompt · Claude Code · Three.js

Game

Pelican riding a bike along the coast

Partial prompt · Claude Code · Three.js

Game

Brutalist city builder in raw concrete

Fable 5.1 · Three.js

Game

Flooded cyberpunk district as a diorama

Prompt described · Claude.ai · Three.js

Game

Voxel Japanese garden with a pagoda

Space Bunny Alpha · Three.js

Game

Fluffy village with seasonal modes

Opus 5.5 · Three.js

Game

Poling a riverboat up a Japanese valley

Partial prompt · Opus 5.5 · Three.js

Game

Drowned cathedral courtyard at night

Codex · Three.js

Game

Kaiju battle in a storm-hit city

GPT-6 Astra · Three.js

Game

Game Boy Advance you can play in 3D

Codex · Three.js

Game

Hole that swallows a low-poly city

Codex · Three.js

Game

Pac-Man from one prompt, 36 ways

Claude Code · Plain JavaScript

Game

Snowbound pixel platformer

Maddy Thorson / Noel Berry

Game

Dragonsweeper’s monster-filled grid

Daniel Benmergui

Game

Lantern-lit floating fantasy village

Mike Fernandez

Game

Low-poly elevated track racing

Kodub

Game

Short trip

Alexander Perrin