zexuanw958-svg/travel-plan-viz

여행 계획 시각화

하나의 여행을 단일 HTML 페이지로 만들어 냅니다: 대화형 지도, 일별 타임라인, 출발 전 예약 알림. 기계적 로직은 자체 엔진(assets/map.js, assets/reminders.js)에 맡기고, 미적 처리는 디자인 단계(frontend-design / huashu-design, 또는 내장 가이드라인)에 위임합니다.

1단계: 모드 판단

• 사용자가 목적지 + 일수만 제공 (예: "홍콩 4박 5일") → 모드 A (처음부터 계획).
• 사용자가 일정을 이미 제공 (텍스트 또는 기존 HTML 파일) → 모드 B (기존 계획 파싱).

모드 A: 처음부터 계획

1. references/research-guide.md를 읽고 인터넷을 통해 목적지를 조사합니다.
2. 대화에서 상세한 일일 계획 (오전/오후/저녁, 관광지, 교통, 숙소)을 마크다운으로 제안합니다.
3. 사용자가 명확히 확인할 때까지 대화를 반복합니다.
4. "조사 보완 + 생성" 단계로 넘어갑니다.

모드 B: 기존 계획 있음

1. 사용자가 제공한 일정을 파싱합니다 (기존 HTML인 경우 구조화된 데이터를 추출).
2. 가볍게 제안 (Agent 부가가치, 강요하지 않음): 사용자의 계획을 "일정 완성" 관점(사전 준비 사항/날씨 대비, 사전 예약 항목, 지점 간 교통, 속도와 여유, 현지 맛집, 구역별 숙소 적절성 등)에서 빠르게 점검하고, 대화에서 구체적이고 선택적인 최적화 제안 3~4개를 제시합니다. 원칙:
   • 실제로 존재하는 공백만 지적합니다. 계획이 이미 완벽하면 "꽤 완벽합니다"라고 말하고, 억지로 채우거나 설교하지 않으며, 사용자 일정을 재구성하지 않습니다.
   • 한 문장으로 문제를 지적하고 한 문장으로 방향을 제시하는 것으로 충분하고 간결하게 합니다. 제안은 기본적으로 구두로 제공하여 HTML 결과물을 깔끔하게 유지합니다 (사용자가 제안을 페이지에 포함하고 싶을 때 추가).
   • 이는 "순수 프롬프트 → HTML"과의 차별점입니다 — Agent의 판단력을 활용하되 적절히 사용합니다.
3. "조사 보완 + 생성" 단계로 넘어갑니다 (생성은 제안에 의해 차단되지 않으며, 사용자가 어떤 제안을 채택할지 결정합니다).

조사 보완 + 생성

1. references/research-guide.md에 따라 인터넷을 통해 보완합니다: 좌표, 실제 이미지 URL, 평점, 리뷰, 영업 시간/휴무일, 입장료 참고 가격, 사전 예약 항목 및 leadDays; 사전 준비 사항 (날씨/태풍/복장/결제/앱/예매 시기), 지점 간 교통 (수단/요금/소요 시간), 시즌 한정 활동, 각 끼니의 추천 요리 + 참고 가격; 항공편은 선택 가능한 3~5개 편 제공, 호텔은 구역+가격대별로 추천, 면책 조항과 전체 팁을 준비합니다. 일정은 날씨/계절 논리를 반영합니다 (야외 활동은 시원한 시간대에 배치). 실시간 요금은 조회하지 않습니다.
2. assets/page-contract.md에 정의된 trip 데이터 구조로 구성합니다.
3. 디자인 단계를 활용하여 스타일링된 HTML을 생성합니다: 우선 전문 디자인 스킬인 frontend-design 또는 huashu-design을 호출합니다 (둘 중 하나라도 설치되어 있으면 사용). 둘 다 없을 경우 references/design-guidelines.md의 내장 미적 기준에 따라 직접 생성합니다. 어떤 방식을 사용하든 assets/page-contract.md의 블록과 제약 사항을 엄격히 준수합니다:
   • assets/map.js, assets/reminders.js 내용을 HTML에 인라인으로 포함시킵니다 (단일 파일 보장).
   • 페이지 상단 목록은 computeReminders + renderChecklistHTML을 사용합니다.
   • 사전 준비 사항 블록을 표시합니다. 항공편 영역에는 선택 가능한 편을 표시하고 (이미 예약된 편은 강조), 호텔 영역은 구역+가격대별로 표시하며, 근처에 면책 조항을 눈에 띄게 표시합니다.
   • 타임라인 카드에는 영업 시간/입장료 참고 가격/교통/시즌 활동 등 선택적 필드를 표시합니다. 일일 식사 (추천 요리 + 가격), 당일 및 전체 팁, 하루에 대한 두 가지 옵션 (있는 경우)을 표시합니다.
   • 지도는 initTravelMap을 사용하고 Leaflet CDN의 CSS/JS를 로드합니다.
   • 타임라인에서 needsBooking 항목에 reminderBadgeHTML(leadDays)를 삽입합니다.
   • 각 여행마다 다른 색상을 사용합니다.
4. <여행명>-여행-계획.html로 작업 디렉토리에 저장합니다.
5. 사용자에게 알립니다: 이후 이 HTML 파일을 다시 제공하고 "3일차의 X를 4일차로 옮겨줘"라고 말하면 원래 구조에서 수정됩니다.

하지 않는 일

실시간 항공권 가격/항공권 요금, 예약 대행, 다국어 UI, 백엔드. 전 과정 정적 단일 파일.