Inspiration

Group trip planning usually dies in a group chat. Someone asks "Where should we eat in Kyoto?" and the thread fills with opinions, links, and screenshots no one can find again. We wanted planning to feel like a conversation, not a spreadsheet — so friends could chat naturally while an assistant quietly turned decisions into a shared itinerary everyone could see on a map.

That idea became Plan.it: collaborative travel planning where chat, maps, and itineraries stay in sync.


Alt text

What it does

Plan.it is a real-time group travel planner with:

  • AI-assisted group chat — GPT-4.1 listens to the conversation and suggests destinations, answers questions, and updates the shared plan
  • Grounded place recommendations — the AI never invents venue names; it triggers Google Places searches and returns real results with addresses, categories, and websites
  • Live interactive map — Leaflet map syncs with chat and itinerary; tap a place to fly to it
  • Smart itinerary builder — destinations auto-collect into a shared list, exportable to PDF
  • AR Explorer Mode — open any itinerary stop in WebXR and see a directional sign toward the destination
  • Invite-link collaboration — share a session URL; anyone can join the same Firebase-backed planning room

How we built it

Stack: Next.js 15, React 19, TypeScript, Tailwind CSS, Firebase Realtime Database, OpenAI GPT-4.1, Google Places API (New), Leaflet, Three.js/WebXR, and Novus/Pendo analytics.

Architecture in three layers:

  1. Collaboration — Firebase Realtime DB syncs messages and itineraries across browsers. Sessions are link-based (?id=<sessionId>).
  2. Intelligence — GPT acts as an orchestrator with a strict JSON contract: reply, search, or update itinerary. Temperature is kept low for predictable outputs.
  3. Grounding — Google Places Text Search runs server-side with a 20 km location bias:

Analytics with Novus & Pendo

Alt text

Plan.it is instrumented with Novus — a product analytics platform built on the Pendo Web SDK. Novus connects to the codebase to understand product structure and helps surface how users move through planning flows and how the AI assistant performs in real sessions.

How we integrated it

The Pendo agent script loads globally in src/app/layout.tsx. On app mount, PendoInitializer calls pendo.initialize() with a stable per-device visitor ID from getOrCreateDeviceUUID(). When a user enters their username on the splash screen, pendo.identify() re-binds the same device ID so sessions stay linked across visits.

Alt text

Alt text

Challenges we ran into

  • Hallucinated places — early prototypes named restaurants and landmarks that sounded real but did not exist. We fixed this by forbidding the model from naming venues and routing all recommendations through Google Places.
  • Multi-user AI triggering — with several people in one session, we had to decide which client invokes GPT. Only the author of the latest message triggers the assistant (with debounce) to avoid duplicate bot replies.
  • WebXR constraints — AR needs HTTPS, GPS, and WebXR support. Local testing required a TLS dev script; unsupported browsers need graceful fallbacks.
  • AR without geo-anchors — true world-locked placement needs ARCore/ARKit geo APIs. We approximated with bearing math and a fixed 50 m offset — good for orientation, not survey-grade navigation.

Accomplishments that we're proud of

  • Grounded AI pattern — separating intent (GPT) from facts (Google Places) made the assistant trustworthy enough to drive real product flows
  • End-to-end collaborative loop — chat → AI suggestion → place card → map pin → itinerary → PDF export → AR exploration, all in one session
  • Real-time multi-user sync — Firebase keeps messages and itineraries live across browsers with invite-link onboarding
  • Agent analytics — full conversation turns instrumented with Novus/Pendo, including when google_places ran as a tool

What's next for Plan.it

  • Smarter multi-user AI — refine triggering so high-activity groups get reliable responses without duplicate or missed invocations
  • Firebase App Check — wire up the reCAPTCHA integration already documented in the README
  • Richer itinerary editing — drag-and-drop reordering, day-by-day scheduling, and notes per stop
  • Improved AR — environment-aware placement and better fallbacks for non-WebXR devices
  • User feedback on failures — surface Places API and chat errors in the UI instead of failing silently

Plan.it turns messy group travel chats into smart, organized itineraries.

Built With

  • firebase
  • leafletjs
  • nextjs
  • novus
  • openai
  • places
Share this project:

Updates