Three.jsで作るマルチプレイ対応の帆船航海ワールド

Claude Fable 5.1がThree.jsでローポリの共有海を生成。島や海域を巡って帆船を操り、コンパスとHUDも表示される。

Claude Code + Three.js(コードのみ)Wandy 2
実際のモデル · 360°どちらも同じ写真から作成:左は Claude Code(Opus 5.5)が Three.js のコードでモデリングした、手を加えていない1回分の実行結果。右は Wandy 2。

精細な3Dモデルを作ろう

コードだけでは単純な形しか作れません。Wandy 2なら写真1枚から、同じシーンで使えるテクスチャ付き3Dモデルを作れます。

Wandy3Dによる制作ブリーフ

作者がプロンプトを公開していないため、この作品を再現する方法を私たちがまとめました。

Build a multiplayer sailing game as a Three.js web app. The player steers a wooden pirate ship with striped sails across a large low-poly ocean with rolling dark-blue waves, foam trails behind the hull and a bright sky with chunky white floating rocks. Scatter islands, named regions and other players' ships, each with a floating name label. Use a chase camera that can also swing close to the deck, a compass in a corner, and a small HUD showing speed, region, camera mode and crew count. Change the sky and water tint by region, including a dark starry area. Add a server using WebSockets so several players see each other's ships move in real time. Keep the art simple: flat-shaded geometry, soft fog and a limited palette. Done when two browser tabs can sail the same sea, the ship rides the waves, and the HUD and compass update as you travel.

このプロンプトの使い方

  1. Claude Fable 5.1を使うコーディングエージェントにビルド指示を貼り、Three.jsクライアントとWebSocketサーバーを依頼します。

  2. 船や海域、配色、波の強さを自分の世界観に合わせて変更しましょう。宇宙船やカヤックもOKです。

  3. タブを2つ開いてマルチプレイを確認し、操縦感やカメラ、海域演出を調整します。

元の投稿作者の方ですか? このページの修正・削除をご依頼ください