編集できる範囲を指定する
どのオブジェクトを分離し、命名し、編集可能にしておくか指定しましょう。見た目が立派でも、中身が外殻だけでは使えない場合があります。
「北京・天壇祈年殿 TypeScript + Three.js WebGLプロジェクト」は、Three.js, TypeScriptをテーマにGPT-6 Astraで制作した3D作例です。実際の仕上がりを確認し、自分のプロジェクトに合わせてプロンプトを調整できます。
同じキャラクターを、二つの実際の制作方法で比較しています。結果は課題によって異なります。
TypeScript + Three.js で、完全に動作する北京・天壇祈年殿のWebGLプロジェクトを作成してください。建築物のジオメトリ、テクスチャ、アニメーションはすべて実行時にコードでプロシージャル生成し、.glb、.gltf、.obj、.fbx などの外部モデルは読み込まないでください。 建築の再現: サイズと高さの異なる3層の青い瑠璃瓦の円形屋根、金色の宝頂、赤い円柱、円形の殿堂本体、青・緑・金色の彩色、斗拱、扉や窓を再現してください。 屋根には曲線の輪郭、回転体、またはカスタムジオメトリを使用し、伸びやかでわずかに反り上がった軒先を表現してください。単純な円錐で代用してはいけません。 白い漢白玉による3層の円形基壇を作り、中央の石段、欄干、柱を配置してください。全体のプロポーションを整え、各層を明確に表現します。 瓦のテクスチャと装飾はプロシージャルに生成し、繰り返し使用する部材には InstancedMesh を優先してください。 シーンとインタラクション: 北京の青空、広場の地面、少量の植栽を用意してください。DirectionalLight と AmbientLight/HemisphereLight を組み合わせ、シャドウ、アンビエントオクルージョン、適度なシネマティックトーンマッピングを有効にします。 OrbitControls による回転とズームに対応し、オン/オフを切り替えられるゆっくりとした自動周回表示も実装してください。 ボタンで「分解/再組立」を切り替えられるようにします。屋根、柱、斗拱、壁、扉や窓、欄干、基壇を階層に沿って滑らかに展開し、その後、正確に元の位置へ戻してください。アニメーションはコードで制御し、時間差のあるリズムを付け、瞬間移動のような動きは避けます。 完全なプロジェクトと起動手順をそのまま納品してください。ページはウィンドウサイズに応じてレスポンシブに対応し、高品質なビジュアルと滑らかな操作感を備えるものとします。インスタンシング、適切なジオメトリのディテール、レンダリング最適化によって、一般的なデスクトップブラウザでも性能を確保してください。コードは明確にモジュール化し、拡張しやすくします。ビルドと主要機能を検証し、未検証の項目があれば正直に記載してください。
プロンプトのポイント
GPT-6 Astra, Three.js, TypeScript を題材にした GPT-6 Astra の 3D 作例「北京・天壇祈年殿 TypeScript + Three.js WebGLプロジェクト」を見てみましょう。作者の原文プロンプトか、公開情報を基にした制作指示かは、出典の区分で確認できます。
中心となる完成形を保ち、カメラ、操作、照明、成功時にできることを指定しましょう。見た目の細部を足す前に、まず動作を確認します。
どのオブジェクトを分離し、命名し、編集可能にしておくか指定しましょう。見た目が立派でも、中身が外殻だけでは使えない場合があります。
シーンを実行して目に見える不具合を確認し、フレームレート、操作、配置の具体的な基準を満たすまで繰り返すよう求めましょう。
大きな世界は地区、アセンブリ、節目に分け、各部分を確認してから範囲を広げましょう。
プロンプトでゲームやシーンを作ったら、そこに登場するキャラクターや小物も磨きましょう。Tripo で精細なアセットを作ってシンプルな仮モデルを差し替えると、世界がより生き生きとします。
作者が公開した作品紹介を基に、再利用できる制作指示としてまとめています。非公開のプロンプトをそのまま再現したものではありません。
生成した怪獣モデルと効果音を使い、怪獣作品に着想を得た Three.js ゲームを作成してください。巨大な戦闘が分かりやすく、怪獣の大きさが伝わる環境を構築してください。
リギング前に、Tripoキャラクターの表情差分をBlenderで用意してください。メッシュの位置をそろえ、使用していない差分は頭の内側に縮小して格納し、表情を段階的に切り替えてください。滑らかなブレンドやVRMへの対応をうたわないでください。