旅行計画のビジュアライズ
旅行をシングルファイルHTMLに:インタラクティブマップ、日別タイムライン、出発前の予約リマインダー。機械的な処理は内蔵エンジン(assets/map.js、assets/reminders.js)に任せ、美的処理はデザインステップ(frontend-design / huashu-design、または内蔵ガイドラインでフォールバック)に委ねます。
ステップ1:モードの判断
- ユーザーが目的地+日数のみを指定した場合(例:「香港4泊3日」)→ モードA(ゼロからの計画)。
- ユーザーが既に旅程を提供した場合(テキストまたは旧HTMLファイル)→ モードB(既存計画の解析)。
モードA:ゼロからの計画
references/research-guide.mdを読み、Web検索で目的地を調査します。- 会話内でマークダウン形式の詳細な日別計画(朝/昼/晩、観光スポット、交通、宿泊)を提案します。
- ユーザーが明確に確認するまで、やり取りを繰り返します。
- 「調査補完+生成」に進みます。
モードB:既存計画
- ユーザーから提供された旅程を解析します(旧HTMLの場合は構造化データを抽出)。
- 簡潔な提案(エージェントの付加価値。押し付け厳禁):ユーザーの計画を「旅程の充実」の観点(出発前の注意事項/天候対策、事前予約項目、ポイント間交通、ペース配分、現地の必食料理、エリア別宿泊の妥当性など)で素早くチェックし、会話内で最大3~4個の具体的で任意の最適化提案を行います。原則:
- 実際に存在するギャップのみを指摘。計画がすでに十分なら「十分に整っています」と伝え、無理に提案しない、説教しない、ユーザーに代わって旅程を組み直さない。
- 問題点を一文で示し+方向性を一文で示す。簡潔に。提案は基本的に口頭で行い、HTMLの完成品をクリーンに保ちます(ユーザーが提案もページに含めたい場合のみ追加)。
- これが「単なるプロンプトからHTMLへの変換」との差別化ポイント——エージェントの判断力を活かしつつ、適度に留めます。
- 「調査補完+生成」に進みます(生成は提案にブロックされません;採用するかはユーザーが決定)。
調査補完+生成
references/research-guide.mdに従いWeb検索で補完:座標、実際の画像URL、評価、口コミ、営業時間/定休日、チケット参考価格、事前予約が必要な項目とleadDays、出発前注意事項(天気/台風/服装/支払い/アプリ/予約タイミング)、ポイント間交通(手段/料金/所要時間)、期間限定アクティビティ、各食事の必注料理+参考価格;フライトは選択肢を3~5便提示、ホテルはエリア別+価格帯で推薦し、免責事項と旅程全体のアドバイスも準備。スケジュールは天気/季節のロジックを反映(屋外は涼しい時間帯に配置)。リアルタイムの運賃は調査しません。assets/page-contract.mdで定義されたtripデータ構造にまとめます。- デザインステップでスタイル化されたHTMLを生成:優先的に専門デザインスキル——
frontend-designまたはhuashu-design(花叔Design)を呼び出します(いずれかがインストールされていればそれを使用)。両方ない場合は、references/design-guidelines.mdの内蔵美学基準に従って自分で生成します。どちらの場合もassets/page-contract.mdのブロックと制約を厳守します:assets/map.js、assets/reminders.jsの内容をHTMLにインライン化(シングルファイルを保証)。- ページ上部のチェックリストは
computeReminders+renderChecklistHTMLを使用。 - 出発前注意事項ブロックを表示。フライトエリアでは選択肢の便を表示(予約済みはハイライト)。ホテルエリアではエリア別+価格帯で表示し、近くに免責事項を目立つように表示。
- タイムラインカードには営業時間/チケット参考価格/交通/期間限定アクティビティなどのオプションフィールドを表示。各日の食事(必注料理+価格)、当日と全体のアドバイス、1日の代替案(ある場合)も表示。
- マップには
initTravelMapを使用し、Leaflet CDNのCSS/JSを導入。 - タイムライン上で
needsBookingな項目にはreminderBadgeHTML(leadDays)を挿入。 - 旅行ごとに異なる配色を適用。
<旅程名>-旅行計画.htmlとして作業ディレクトリに保存します。- ユーザーに伝えます:後でこのHTMLファイルを再度渡し、「3日目のXを4日目に移動して」と言えば、元の構造上で修正できること。
やらないこと
リアルタイム運賃/航空券価格、予約代行、多言語UI、バックエンド。完全に静的なシングルファイルです。