Inspiration

The inspiration for EventMagic stemmed from the common frustration of manually adding events to calendars. I've envisioned a tool that could bridge the gap between natural human language and structured calendar data, leveraging the power of AI to make event creation seamless and intuitive. I wanted to simplify event management, not just for individual users but also for sharing curated collections of events.

What it does

EventMagic is an AI-powered application that transforms natural language descriptions into perfectly structured calendar events. Users can simply type or paste event details, and our AI extracts key information like title, date, time, location, description, and category.

Key features include:

AI-Powered Extraction: Utilizes AI to parse unstructured text and identify event details.

Review & Polish: Provides a dedicated interface to review, edit, and refine extracted event data before saving.

Personal Dashboard: A centralized hub to manage all created events.

Shareable Event Pages: Users can create custom, themed web pages to showcase collections of events, perfect for sharing schedules, itineraries, or public events. These pages are highly customizable with different layouts and color themes.

Calendar Integration: Seamlessly add events to Google Calendar or download them as .ics files for other calendar applications.

User Authentication: Securely manage events and event pages with user accounts powered by Supabase.

How we built it

EventMagic is built as a modern web application using a robust and scalable tech stack:

Frontend: Developed with React and Vite for a fast and responsive user experience.

Styling: Tailwind CSS is used for utility-first styling, ensuring a clean and customizable design.

Icons: Lucide React provides a comprehensive set of beautiful and consistent icons.

AI Integration: We integrated OpenAI via their API for the core natural language processing and event extraction capabilities.

Backend & Database: Supabase serves as our backend, providing a PostgreSQL database for storing events and event pages, along with robust user authentication.

Rich Text Editor: Tiptap is integrated for rich text input, allowing users to add detailed descriptions with formatting.

Calendar Logic: Custom JavaScript functions handle the generation of .ics files and the construction of Google Calendar URLs for direct integration.

Challenges we ran into

Developing EventMagic presented several interesting challenges:

AI Prompt Engineering: Fine-tuning the AI prompt to consistently extract accurate and complete event data from highly varied natural language inputs, including handling multiple events in a single prompt.

Date and Time Parsing: Accurately interpreting diverse date and time expressions (e.g., "tomorrow," "next Tuesday," "noon") and converting them into a standardized format for calendar integration.

Rich Text Handling: Ensuring the rich text editor's content was correctly captured, stored, and displayed while also being stripped of HTML for AI processing and calendar descriptions.

UI/UX Design: Crafting a visually appealing and intuitive user interface that avoids a "cookie-cutter" feel, especially for the customizable event pages, while maintaining consistency across the application.

Google Calendar Integration: Implementing the correct URL parameters for seamless "Add to Google Calendar" functionality, which required careful attention to date and time formatting.

What's next for EventMagic

EventMagic has a clear roadmap for future development:

Advanced AI Features:

  • Support for recurring events (e.g., "every Monday").
  • AI-powered suggestions for event descriptions and categories based on user input patterns.
  • Integration with other popular calendar services like Outlook and Apple Calendar.

Collaboration & Social Features:

  • Allowing multiple users to contribute to and manage shared event pages.
  • Implementing event invitations and RSVP tracking.

Enhanced Customization:

  • Expanding the library of event page themes and layout options.
  • Enabling custom domains for event pages.

Built With

  • bolt
  • openai
  • react
  • supabase
  • tailwind
  • tiptap
  • vite
Share this project:

Updates