WanderGenius AI

Your Journey, Personalized. AI-powered travel planning that truly understands you.

WanderGenius AI Banner

Repository	Link
Frontend	github.com/Amaru333/gemini-hackathon-wandergenius-frontend
Backend	github.com/Amaru333/gemini-hackathon-wandergenius-backend

Inspiration

Travel planning is broken. We've all been there, drowning in browser tabs, scrolling through generic "Top 10 Places to Visit" lists, and spending hours trying to find destinations that actually match what we love. The problem? Traditional travel platforms treat everyone the same. They don't know that you're a photography enthusiast who loves hiking, or that you prefer boutique experiences over tourist traps.

We asked ourselves: What if AI could truly understand your travel personality and find destinations that feel like they were made for you?

That's when WanderGenius AI was born. We wanted to create a travel companion that learns your interests, hobbies, and travel style, then uses that understanding to recommend destinations and create itineraries that feel personal, not generic.

The inspiration also came from our own frustrating experiences planning group trips. Coordinating with friends, splitting budgets, and deciding on activities together was always chaotic. We envisioned a collaborative platform where travel groups could plan, vote, and experience adventures together seamlessly.

What it does

WanderGenius AI is an intelligent travel planning platform that personalizes every aspect of your journey:

Core Features

Personalized Destination Discovery

Create a travel profile with your interests, hobbies, and travel style
AI analyzes thousands of destinations and matches them to YOUR unique preferences
Get recommendations with explanations of why each destination fits you

Smart Trip Planning

Set your starting location, travel radius, duration, and transit preference
Interactive map with route overview and destination markers
Real-time weather data for each destination
Budget estimates and travel information

AI-Generated Itineraries

One-click detailed day-by-day itinerary generation
Morning, afternoon, and evening activities with specific times and locations
Insider tips for each day
Smart packing checklists tailored to your destination

Collaborative Trip Planning

Invite friends and family to collaborate on trips
Vote on activities together (upvote/downvote system)
Role-based permissions (owner, editor, viewer)
Real-time collaboration features

Budget Tracking

Set trip budgets and track expenses
Split costs among participants
Category-based expense tracking
Visual spending analytics with charts

Photo Journal

Capture and organize trip memories by day
Add captions and locations to photos
Share photo albums publicly or keep them private
Export and download your memories

Reviews & Gamification

Rate trips on budget value, location, and activities
Earn badges for milestones (First Trip, Jet Setter, World Traveler, etc.)
Climb the community leaderboard
Your reviews help personalize future suggestions

Offline Mode

Save trips for offline access
View itineraries without internet connection
Cached map tiles for navigation
Perfect for international travel

Social Sharing

Share trips publicly with unique links
Public profile pages showcasing your travels
Discover recommended trips from the community

How we built it

Architecture Overview

Architecture Diagram

WanderGenius AI is built as a modern full-stack application with a clear separation between the frontend and backend:

Frontend (React + TypeScript)

wandergenius-ai/
├── src/
│   ├── pages/           # Route-based page components
│   ├── components/      # Reusable UI components
│   ├── contexts/        # React Context for state management
│   ├── services/        # API client and offline storage
│   └── types.ts         # TypeScript type definitions

Key Technologies:

React 19 with TypeScript for type-safe UI development
Vite for lightning-fast development and builds
React Router for client-side navigation
Leaflet + React-Leaflet for interactive maps
Recharts for budget analytics visualizations
Lucide React for beautiful icons
Workbox + PWA for offline capabilities
IndexedDB (idb) for client-side data persistence

Backend (Node.js + Express)

backend/
├── src/
│   ├── index.js         # Express server entry
│   ├── routes/          # API route handlers
│   ├── middleware/      # Auth middleware
│   └── lib/             # Database client
├── prisma/
│   ├── schema.prisma    # Database schema
│   └── migrations/      # Database migrations

Key Technologies:

Express.js for RESTful API
Prisma ORM with PostgreSQL for data persistence
JWT (jsonwebtoken) for authentication
bcryptjs for password hashing
Google Gemini AI for intelligent recommendations and itinerary generation

AI Integration

The heart of WanderGenius is the Google Gemini AI integration with the Google Maps tools:

Destination Recommendations: We send user profiles (interests, hobbies, travel style) along with trip parameters to Gemini. The AI analyzes this context and generates personalized destination recommendations with explanations of why each fits the user.
Itinerary Generation: When a user selects a destination, Gemini creates a detailed day-by-day itinerary with:
- Time-specific activities
- Location information
- Insider tips
- Smart packing suggestions
Personalized Suggestions: The AI learns from user reviews to generate increasingly accurate trip suggestions over time.

Database Schema

Our PostgreSQL database (via Prisma) includes:

Users & Profiles: Authentication and travel preferences
Trips: AI-generated destination recommendations
PlannedTrips: Detailed itineraries with checklists
TripBudget & Expenses: Financial tracking with participant splits
TripCollaborator: Multi-user collaboration with invite system
ActivityVotes: Democratic activity voting
TripReviews: Multi-dimensional trip ratings
UserBadges: Gamification achievements
TripPhotos: Photo journal storage
PackingTemplates: Reusable packing lists

External APIs

Google Gemini AI: Destination recommendations and itinerary generation
Google Maps Geocoding API: Location search and coordinates
Google Places API: Destination photos
OpenWeatherMap API: Real-time weather data

Challenges we ran into

1. AI Response Parsing

Gemini's responses come in natural language format with markdown. Parsing this into structured data (destination cards, itinerary activities, etc.) required building robust regex-based parsers that handle various response formats and edge cases.

2. Real-time Collaboration

Implementing a collaborative voting system where multiple users can interact with the same trip required careful state management and optimistic UI updates to make the experience feel responsive.

3. Offline Functionality

Building true offline support was complex. We had to:

Implement service workers for caching
Store trip data in IndexedDB
Handle sync conflicts when coming back online
Cache map tiles for offline navigation

4. Map Performance

Displaying multiple destination markers with custom styling, route lines, and interactive features while maintaining smooth performance required optimization of the Leaflet integration.

5. Photo Storage

Handling photo uploads, compression, and storage within browser limitations (IndexedDB size limits) while maintaining quality for the photo journal feature.

6. Rate Limiting

Managing API rate limits for geocoding and photo fetching when loading multiple destinations required implementing delays and fallback strategies.

Accomplishments that we're proud of

Truly Personalized AI

Unlike generic travel apps, our AI actually understands user preferences and provides explanations for why each destination fits. The "Why This Fits You" section in each recommendation card is genuinely personalized.

Complete Travel Lifecycle

We built a platform that covers the entire travel journey:

Before: Destination discovery, itinerary planning, packing lists
During: Budget tracking, photo journal, offline access
After: Reviews, badges, sharing memories

Collaborative Features

The team collaboration system with invites, role-based permissions, and activity voting makes group travel planning actually enjoyable.

Beautiful, Modern UI

We're proud of the clean, intuitive interface that makes complex features feel simple and delightful to use.

Progressive Web App

Full PWA support means users can install WanderGenius on their devices and use it offline, critical for travelers in areas with limited connectivity.

Comprehensive Budget Tracking

The expense splitting system with visual analytics helps travelers stay on budget and fairly split costs.

What we learned

Technical Learnings

Gemini AI Integration: How to craft effective prompts that generate structured, useful responses
PWA Development: Service workers, caching strategies, and IndexedDB for offline-first applications
Prisma ORM: Complex relational data modeling with PostgreSQL
React 19: Latest React features and performance optimizations
Map Integration: Working with Leaflet for interactive, responsive maps

Product Learnings

User-Centric Design: Every feature should answer "why does the traveler need this?"
Simplicity is Hard: Making complex AI features feel simple and intuitive requires careful UX design
Offline Matters: Travelers often have poor connectivity — offline support isn't optional

Team Learnings

Rapid Prototyping: How to move fast while maintaining code quality
Feature Prioritization: Focusing on core value before adding nice-to-haves
Integration Testing: The importance of testing AI responses with various edge cases

What's next for WanderGenius AI

Short-term Roadmap

Multi-language Support: Translate the app and AI responses into multiple languages
Native Mobile Apps: iOS and Android apps using React Native
Push Notifications: Trip reminders, activity alerts, and travel tips
Flight & Hotel Integration: Direct booking capabilities within the app
Calendar Sync: Export itineraries to Google Calendar, Apple Calendar, etc.

Long-term Vision

AI Travel Assistant Chat: Conversational interface for trip planning and questions
Community Destinations: User-submitted destinations and experiences
Travel Analytics: Personal travel statistics and insights over time
Predictive Suggestions: Proactive trip recommendations based on patterns
Local Partner Network: Exclusive deals with hotels, tours, and experiences
Accessibility Features: Destinations and activities filtered for accessibility needs
Sustainable Travel: Eco-friendly destination recommendations and carbon footprint tracking

Tech Stack Summary

Layer	Technology
Frontend	React 19, TypeScript, Vite, Tailwind CSS
Maps	Leaflet, React-Leaflet
Charts	Recharts
PWA	Workbox, Service Workers
Offline Storage	IndexedDB (idb)
Backend	Node.js, Express.js
Database	PostgreSQL, Prisma ORM
Authentication	JWT, bcryptjs
AI	Google Gemini AI
APIs	Google Maps, Google Places, OpenWeatherMap
Deployment	Docker