✈️ Era - Imagine. Plan. Book. The New Era of Travel.

BUSINESS SLIDES: https://www.figma.com/deck/ahRW0W2blmPLX9nrNoJNCj/Untitled?node-id=15-123&viewport=-1049%2C-26%2C0.46&t=QIvitOdGNNKuyhig-1&scaling=min-zoom&content-scaling=fixed&page-id=0%3A1

🌟 Inspiration

The idea for Era came from our own experience planning a last-minute trip to CalHacks — right in the middle of exam season.
Between juggling deadlines, booking flights, finding hotels, and coordinating plans, we realized how chaotic trip planning really is.

We thought: What if planning a trip could feel as easy as chatting with a friend?

That’s how Era was born — a single AI-powered platform that helps users imagine, plan, and book their journeys in minutes, not hours.


💡 What It Does

Era is an AI-powered travel planner that helps users imagine, plan, and book trips in seconds.
Instead of juggling 5–8 different tools for flights, stays, maps, and itineraries, users simply chat with Era’s built-in AI travel agent to generate a complete, personalized itinerary.

Its block-based visual interface lets travelers see their trips spatially on a live map — creating an interactive, intuitive way to design travel experiences.


🧱 How We Built It

  • Frontend: Built with React, Vite, TypeScript, HTML, and CSS to create a fast, modular, and visually intuitive UI.
  • Real-time Data: Integrated 'SerpAPI' to fetch live travel information, including nearby attractions, restaurants, and hotel listings.
  • Backend: Powered by Express.js for efficient API routing and data handling.
  • AI Integration: Leveraged the OpenAI GPT-4 API to generate personalized travel recommendations, itineraries, and conversational responses.
  • Maps & Visualization: Integrated the Google Maps API to display dynamic routes, destinations, and geospatial data in real time.
  • Deployment: Hosted on Vercel for rapid iteration and continuous deployment during the hackathon.
  • Core Language: Written primarily in JavaScript and TypeScript, ensuring strong type safety and cross-platform performance.

🧩 Challenges We Ran Into

  • Integrating AI outputs with structured map data — GPT responses had to be parsed and formatted to align with coordinate logic.
  • Time pressure — building a functional, user-friendly system within \( t = 36 \text{ hours} \) while debugging API calls and CORS issues.
  • Maintaining context — ensuring the AI could remember previous messages and dynamically adjust itineraries.
  • Team synchronization — managing multiple Git branches and merging code efficiently under hackathon constraints.

🏆 Accomplishments We’re Proud Of

  • Built a working AI-powered travel planner from concept to prototype in under 36 hours.
  • Created a real-time visual planning experience, where users can literally watch their trips unfold on a map.
  • Successfully integrated GPT-4, Express, and Google Maps API into a cohesive system.
  • Turned a chaotic personal experience (planning for CalHacks mid-exam season!) into an elegant, usable product.

🧠 What We Learned

We deepened our understanding of prompt engineering, context management, and geospatial API design.
We also learned how to optimize frontend-backend communication to handle asynchronous API responses and ensure smooth rendering.

Most importantly, we discovered how AI can enhance—not replace—human creativity, turning inspiration into automation.


🚀 What’s Next for Era

  • ✈️ Integrate flight and hotel booking APIs.
  • 🧭 Enhance personalization using travel history and preference learning.
  • 📱 Launch a mobile version for on-the-go planning.
  • 👥 Expand AI capabilities to handle group trips, budget optimization, and real-time travel updates.

Our ultimate goal:

Make Era the go-to AI travel planner — where spontaneous ideas instantly become curated adventures.


(Built with ❤️ at CalHacks.)

Built With

Share this project:

Updates