3DPrompt.
GitHub
ライブラリに戻る
GPT-6 Astra参考用の制作指示

シティ・パルス

2025年1月のニューヨーク市におけるイエロータクシーの動きをインタラクティブに読み解く3Dモビリティアトラス。3Dマップ、時間帯ごとの動きの再生、ゾーンの詳細表示、平日・週末の平均との比較に対応します。

作者 Seoyeon Jun 📊元の出典を見る
シティ・パルス

この作例について

作者が公開したプロジェクトをもとにした制作の出発点です。元のプロンプトをそのまま転載したものではなく、結果は異なります。

作者のメモ

2025年1月のニューヨーク市におけるタクシーの動きを読み解く、インタラクティブな3Dモビリティアトラスを構築します。NYC TLCのイエロータクシー記録、Taxi Zones、マンハッタンの建物フットプリントを使い、3Dマップ、アニメーション表示する乗車フロー、押し出しで表現する乗車ボリューム、日別・時間帯別の再生コントロール、ゾーン単位の比較インサイトを備えた、1ページ構成のThree.jsビジュアライゼーションを作成してください。

Three.jsニューヨーク市タクシーデータモビリティアトラス3Dマップデータビジュアライゼーションインタラクティブな可視化

プロンプト

# 「City Pulse」を構築:ニューヨーク市のタクシー活動(2025年1月)を読み解くインタラクティブな3Dモビリティアトラス ## 目的 ニューヨークが1か月を通してどのように動くのかを示す、1ページ構成の英語ウェブビジュアライゼーションを作成します: 31日、24時間、263のタクシーゾーン。見る人が街の日々のリズムを観察し、 任意の日を典型的な平日または週末と比較し、どのゾーンも詳しく調べられるようにします。 これは記述的な分析ツールであり、リアルタイム情報やGPSデータを扱うプロダクトではありません。すべてのビジュアルで、1つのマークが何を表すのかを明示してください。 ## データ 公開データソース: - NYC TLC Trip Record Data、Yellow Taxi、2025年1月(Parquet) - NYC TLC Taxi Zones(263ゾーン、形状データ+行政区の対応表) - NYC Open Dataの建物フットプリント(視覚的なコンテキストとしてマンハッタンのみ) 前処理(Python+DuckDBまたはpandas)を行い、小容量の静的JSONファイルを出力します: - 無効な乗車データを除外:2025年1月以外の乗車、所要時間が0以下または3時間超の乗車、未知のゾーン(264/265)。 - 日別・ゾーン別・時間帯別に、乗車件数と乗車時間の中央値を集計。 - 日別・時間帯別に、出発ゾーン→到着ゾーンの上位ペア(集約した移動フローを、時間帯ごとに上位N件)を集計。 - ゾーン・時間帯ごとの比較用平均値:平日平均(23日)と週末平均(8日)。日単位の平均を使用し、祝日は平日のグループに含める。 - 月全体で固定したスケール:ゾーン・時間帯別の乗車件数の最大値を使い、日によって高さの比較基準が変わらないようにする。 - ゾーンのメタデータ:ID、名称、行政区、重心、ラベルのアンカー。ゾーン形状を簡略化。 ファイル:month.json(1日の集計、スケール、上位ゾーン)、weekday.json、weekend.json、days/2025-01-DD.json、zones geojson。 当日のデータは遅延読み込みし、初回描画を高速に保つ。 ## 技術スタック - 自己完結型のHTMLファイル1つ(または小規模なViteアプリ)。Three.js 0.160(importmap経由のESモジュール)、OrbitControls、EffectComposer+bloomを使用。 - D3はスケール、フォーマット、簡易的なSVGチャートにのみ使用。 - フレームワークは不要。実行時の外部API呼び出しは禁止し、すべて静的JSONから読み込む。 ## レイアウト(デスクトップ1920×1080で、スクロールなしに1画面へ収める) 1. ヘッダー:「CITY PULSE / MOBILITY ATLAS」、「Recorded replay」ステータス、「Data & methods」リンク。 2. ステータス行:「A city, in motion.」+3つのKPI:市全体の乗車件数(選択中の時間帯)、比較平均との差、乗車時間の中央値。 3. 月間ストリップ:31日分のボタンをミニバーで表示(バーの高さ=1日の乗車件数、週末には印を付ける)、前日・翌日ボタン、日付選択、「Compare with」選択(平日平均・23日/週末平均・8日)。 4. ストーリーバー:「Every movement leaves a pattern.」と4つのチャプター(01 Watch、02 Unfold、03 Compare、04 Share)、および「Start the story」。 5. ビュータブ:01 Connections、02 Volume city、03 Unfold 24h、04 Ghost city、「Share finding」、「Create briefing」。 6. ワークスペース:3Dマップステージ(左)+Location Insightインスペクター(右、約330px、内部スクロール)。 7. タイムライン:Play day、速度(0.25×~4×)、選択日の24時間棒グラフと平均を重ねた時間帯スクラバー。 マップステージの高さはビューポートに合わせて調整し(約470px~約780pxの範囲でclamp)、ズーム率100%でタイムラインを含むコンソール全体が表示されるようにする。 ## 3Dシーン - 暗いグラウンド、細いラインで描くゾーンのアウトライン、現実のコンテキストとして薄く表示するマンハッタンの建物フットプリント。 - カメラ:パースペクティブ、オービット+ズーム、再センタリングボタン。ビューを切り替えてもユーザーのカメラ位置を維持する。ただし「Unfold 24h」では、マトリクス全体が収まるように必ずフレームを調整する。 - ゾーンにホバーすると、名称と乗車件数を含むツールチップを表示。ゾーンをクリックすると選択状態にし、インスペクターとフローを更新する。 ビュー(切り替え時はすべてアニメーションさせ、急な切り替えを避ける): - 01 Connections:ゾーン間の集約された乗車を、光るアークと動く光のパーティクルで表示。パーティクル密度は乗車件数に比例させる。注目するフローにラベルを付ける(「FROM / Midtown Center → TO / Upper East Side North, 71 trips / 18:00」)。キャプション:「記録されたゾーン間の乗車 · 模式的な動き。GPSではありません。」 - 02 Volume city:各ゾーンを押し出して表示。高さ=月間固定スケール上の乗車件数。選択したゾーンを強調表示。

このプロンプトの使い方

01

適したツールを開く

普段使っているコーディングアシスタントや 3D ツールを開きましょう。まずは作例に記載されたモデルを試し、リンク先のプロジェクトで設定手順を確認してください。

02

変更する点を一つ選ぶ

主題、画風、舞台を変えてみましょう。カメラと操作を明確にし、まず小さな作品を作ってから、一つずつ細部を整えます。

03

シーンに独自の素材を加える

オリジナルのキャラクターや小物が必要なら、短い物体の説明や参考画像から 3D モデルを作り、プロジェクトに取り込みましょう。

プレビューの権利は各作者に帰属します。コードや素材を再利用する前に、元の出典とプロジェクトのライセンスを確認してください。