歩いてジャンプできるローポリのヤギの島をThree.jsで作る

Fable 5.1がThree.jsで小さな島とヤギを制作。ヤギは歩き、岩や丸太、石壁を跳び越えたり登ったりする。動物の動きが見どころ。

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 small interactive 3D island toy in a single self-contained HTML file using Three.js. The island is low-poly: a grassy hill with swaying grass blades, stylized pine trees, bushes, boulders, a fallen log, a low stone wall and a sandy shore surrounded by calm water under a pale sky. Place a controllable pet goat on the island. The goat walks with WASD, can sprint with Shift, jumps with Space, and climbs or hops up onto rocks, walls and other obstacles instead of clipping through them, with simple leg animation. Add an orbiting third-person camera that follows the goat, with drag to orbit and mouse wheel to zoom, and a small on-screen hint line listing the controls. Use soft daylight, gentle shadows and a muted green, grey and blue palette. Done means the goat moves smoothly around the whole island, reacts to terrain height and obstacles, and the scene runs at a steady frame rate in a desktop browser.

このプロンプトの使い方

  1. ビルドブリーフをClaude Fable 5.1を使うClaude Codeなどのエージェントに貼り、Three.jsの単一HTMLを依頼する。

  2. ヤギを別のペットに替え、島の小物や配色、時間帯を好みに合わせて変更する。

  3. HTMLを開きWASDで移動、Spaceでジャンプ。障害物の追加や登り動作の改善を頼んで調整する。

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