Viberoute

VibeRoute reads your vibe from photos, grounds it to real places, and builds a timed route you can actually follow

Comment

VibeRoute

Inspiration

We wanted to make navigation feel less like following a static route and more like experiencing a live guided story. Most route planners are good at directions, but they do not make the journey feel immersive. VibeRoute was inspired by the idea of combining route planning, visual storytelling, and live AI commentary so the map itself becomes part of the experience.

What it does

VibeRoute is an AI-powered, map-first route planning and touring app. It helps users generate routes, visualize stops and points of interest on a live map, and experience the journey through streaming audio commentary and destination imagery.

  • Interactive Mapping: Plots route anchors and stops, surfaces points of interest (POIs) along the way, and switches visuals as the user moves through the route.
  • Guided Tour Mode: Streams live audio commentary using Gemini Live, making the experience feel like a personal travel narrator.
  • GPS Simulation: Includes a GPS simulation slider for demos, allowing movement to be tested and showcased without requiring real device location.

How we built it

We built VibeRoute with a split architecture to handle real-time requirements, heavily relying on our sponsor technologies to bring the prototype to life:

  • Google Cloud: We integrated Gemini models via Google Cloud to power the core route commentary and utilized Gemini Live for low-latency, streaming audio narration.
  • RailtownAI: We leveraged RailtownAI for agent orchestration, managing the complex logic of planning the day, executing tool calls, and maintaining the agent's state.
  • Augment Code: We used Augment Code throughout our development process to accelerate writing, debugging, and refactoring our full-stack codebase.
  • Frontend: Next.js and React power the chat interface, map experience, guided tour UI, and live audio playback.
  • Backend: FastAPI handles the planning logic, geocoding, weather lookups, and route generation.
  • Mapping Engine: MapLibre with raster basemaps and custom overlays for plotted route points, stops, and animated navigation markers.
  • Data Synchronization: Added shared schemas between the frontend and backend to keep planner responses, map state, and commentary payloads perfectly consistent across the stack.

Challenges we ran into

  • Live Audio Continuity: One of the biggest challenges was making live audio feel continuous. Early on, the stream would restart or get interrupted whenever the map state changed or the demo GPS slider moved. We had to redesign the flow so the live session stayed open while the UI updated independently.
  • Asynchronous UX: Balancing real-time map feedback with incomplete planning data. The system needed to show "thinking" and plot something meaningful before a full route was perfectly ready.
  • Deployment Hurdles: We had to debug and resolve tile provider auth failures, reverse proxy upload limits, and keeping live server behavior stable while merging active feature work.

Accomplishments that we're proud of

  • Building a Cinematic Experience: We are proud that VibeRoute goes beyond basic route planning and creates a live guided-tour experience. The combination of route visualization, POI imagery, streaming voice commentary, and demo GPS movement makes the app feel highly interactive.
  • End-to-End Execution: We successfully deployed a full working version end-to-end, including frontend, backend, live audio, and production hosting. The Tour mode and image-driven storytelling create a strong prototype that already feels distinct from a standard map product.

What we learned

  • State Continuity is Critical: Real-time AI experiences depend heavily on state continuity. It is not enough to generate good content; the system has to preserve session state, audio playback, and map updates without breaking user immersion.
  • Separation of Concerns: We learned the importance of separating feature work cleanly across files and layers. Keeping navigation, commentary, audio, and map rendering isolated made it much easier to iterate quickly, merge changes safely, and debug live production behavior.

What's next for VibeRoute

  • Real GPS Integration: Replace the demo GPS slider with real device GPS tracking so the tour reacts to actual physical movement.
  • Enhanced Discovery: Improve POI discovery, pull richer image sets automatically, and make commentary more adaptive based on where the user is and what they are immediately approaching.
  • Personalized Companionship: Make VibeRoute more personalized by learning user preferences over time, supporting multiple tour styles, and expanding from route planning into a full AI travel companion that can guide, explain, and adapt in real time.

Built With

Share this project:

Updates