GPT-6 Astra作者:Amir

Three.jsで作るHyperloopポッドのシミュレーターと速度パネル

GPT-6 AstraがThree.jsでHyperloopのデモを制作。チューブ上を走るポッドと、速度表示や視点設定を備えた操作パネルが動きます。

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

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

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

Wandy3Dによる制作ブリーフ

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

Build an interactive Hyperloop demo web page with Three.js. Show a sleek capsule pod travelling along an elevated tube track on concrete pylons, in a pale, minimal studio setting with soft fog and a muted palette accented by a single red highlight. Place a large Hyperloop headline and short intro text on the left, and a side control panel on the right with a live speed readout in km/h and several dropdown options for the view and the pod configuration. Add a bottom bar with a pause button, a progress slider and a numeric value. The pod should accelerate smoothly while the readout climbs, and the camera should drift along the track so the scene feels cinematic. Deliver a single page that runs in the browser, with responsive layout and clean typography. Done when the pod animates continuously, the speed counter matches the motion, and the controls change what is displayed.

このプロンプトの使い方

  1. コーディングツールでGPT-6 Astraにビルドブリーフを渡し、Three.jsのページを依頼します。

  2. 乗り物のテーマ、配色、見出し、パネルの項目を自分の題材に差し替えます。

  3. 実行後、カメラ角度や加速カーブ、設定項目の追加などを依頼して調整します。

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