TravelSnap

Smart travel planning with AI: Get custom itineraries, real pricing, and beautiful postcards

Comment

TravelSnap: AI-Powered Travel Planning Made Simple

Inspiration

The idea for TravelSnap came from a simple frustration: planning a trip shouldn't take longer than the trip itself.

We've all been there - spending hours researching destinations, comparing flight prices, finding hotels, creating day-by-day itineraries, and trying to stay within budget. What if AI could do all of this in seconds, giving you a detailed, personalized travel plan that actually fits your budget and interests?

That's when TravelSnap was born - an AI travel assistant that transforms your travel dreams into actionable, budget-conscious itineraries with beautiful seasonal postcards to share your excitement.

What It Does

TravelSnap is an intelligent travel planning platform that:

  • Generates detailed multi-day itineraries using Google's Gemini 2.5 Flash AI
  • Provides realistic cost breakdowns for flights, hotels, activities, food, and transportation
  • Personalizes recommendations based on your interests (culture, food, adventure, etc.)
  • Creates beautiful seasonal postcards with AI-generated imagery and custom themes
  • Exports professional PDF itineraries for easy sharing and offline access
  • Optimizes for your budget with smart recommendations and money-saving tips

How We Built It

Tech Stack

Frontend:

  • React 18 with Material-UI for a modern, responsive interface
  • Custom design system with seasonal themes (Halloween, Christmas, Summer, Spring)
  • Framer Motion for smooth animations and transitions
  • HTML2Canvas for postcard generation and downloads

Backend:

  • Flask (Python) REST API
  • Google Gemini 2.5 Flash for AI-powered itinerary generation
  • Replicate API for AI image generation
  • ReportLab for PDF generation
  • In-memory caching for performance optimization

Key Features:

  • Real-time AI generation with streaming responses
  • Smart caching system (reduces repeat requests from ~20s to <0.5s)
  • Responsive design that works on mobile, tablet, and desktop
  • Accessibility-first approach with WCAG compliance

Architecture

The application follows a clean separation of concerns: Frontend (React) ←→ REST API (Flask) ←→ AI Services (Gemini, Replicate) ↓ Caching Layer (In-Memory)

Performance optimization was crucial. We implemented:

  • Token reduction: Optimized prompts to reduce AI processing time by ~47%
  • Caching strategy: Cache key = destination_days_budget_interests
  • Fast fallback data: Pre-calculated estimates for common destinations
  • Lazy loading: Components load on-demand to improve initial page load

The caching effectiveness can be expressed as:

$$\text{Cache Hit Rate} = \frac{\text{Cached Requests}}{\text{Total Requests}} \times 100\%$$

With our implementation, we achieved a ~60% cache hit rate for popular destinations.

📚 What We Learned

Technical Learnings

  1. AI Prompt Engineering is an Art: We learned that prompt structure dramatically affects response quality and speed. Our final prompt is 70% shorter than our initial version but produces better results.

  2. JSON Parsing from AI is Tricky: AI models don't always return perfectly formatted JSON. We implemented robust error handling and JSON repair logic to handle edge cases.

  3. Performance Matters: Initial load time of 38 seconds was unacceptable. Through optimization (caching, token reduction, faster models), we reduced it to 18-20 seconds for first requests and <0.5s for cached requests.

  4. User Experience > Features: We initially built a 3D weather card feature using Hugging Face's API, but when it didn't meet quality standards, we removed it entirely. Sometimes less is more.

  5. Accessibility is Non-Negotiable: Building with WCAG compliance from the start is easier than retrofitting it later. We implemented proper ARIA labels, keyboard navigation, and color contrast throughout.

Design Learnings

  • Seasonal themes create emotional connection: Users love the Halloween and Christmas themes
  • Visual feedback is crucial: Loading states, progress indicators, and animations make wait times feel shorter
  • Mobile-first design: 60% of our test users accessed the app on mobile devices

Challenges We Overcame

Challenge 1: AI Response Time

Problem: Gemini API took 38 seconds to generate itineraries Solution:

  • Implemented in-memory caching with 1-hour expiry
  • Reduced prompt token count by 40%
  • Limited max output tokens to 4096
  • Result: 47% faster for first requests, 99% faster for cached requests

Challenge 2: Hugging Face API Deprecation

Problem: Mid-development, Hugging Face deprecated their free inference API Solution:

  • Evaluated alternatives (Replicate, Stability AI)
  • Decided to remove the 3D weather card feature entirely
  • Focused on core value proposition (itinerary planning)
  • Lesson: Build features that don't depend on free-tier APIs for production

Challenge 3: JSON Parsing Reliability

Problem: AI-generated JSON had inconsistent formatting, causing parse errors Solution:

# Robust JSON extraction with fallback
try:
    itinerary_data = json.loads(json_response)
except json.JSONDecodeError as e:
    # Clean and retry
    json_response = json_response.replace('\n', ' ').replace('\\', '\\\\')
    itinerary_data = json.loads(json_response)
Challenge 4: Budget Optimization Algorithm
Problem: Ensuring itineraries stay within user budget while maximizing experience Solution: Implemented a cost allocation strategy:

Activity Budget=Total Budget−(Flights+Hotels+Food+Transport+Buffer)

Where buffer is typically 10% of total budget for emergencies.

🚀 What's Next
We have exciting plans for TravelSnap:

Real-time Flight & Hotel Integration: Connect to live APIs for actual pricing
Collaborative Planning: Share itineraries with travel companions and edit together
Booking Integration: One-click booking for flights, hotels, and activities
Mobile App: Native iOS and Android apps with offline access
AI Travel Assistant Chat: Ask questions about your destination in real-time
Multi-destination Trips: Plan complex trips with multiple cities
Travel Community: Share itineraries, tips, and photos with other travelers
 Key Takeaways
Building TravelSnap taught us that:

AI is a tool, not magic: It requires careful prompt engineering and error handling
Performance optimization is iterative: Start with working code, then optimize bottlenecks
User feedback is invaluable: Features we thought were cool (3D weather cards) weren't as important as core functionality
Simplicity wins: A fast, reliable itinerary generator beats a slow, feature-rich one
Acknowledgments
Built with:

Google Gemini 2.5 Flash for AI generation
Replicate for image generation
Material-UI for beautiful components
The amazing open-source community
Try TravelSnap today and turn your travel dreams into reality! ✈️🌍

Built With

Share this project:

Updates