TasteSphere

Inspiration

In today's digital age, we're constantly overwhelmed with content choices across multiple platforms. We wanted to create a solution that could understand unique preferences and recommend content that truly resonates with users. TasteSphere was born from the need to cut through the noise and deliver personalized recommendations using the power of AI.

What it does

TasteSphere is an AI-powered recommendation engine that understands natural language preferences and suggests personalized content across movies, books, music, and more. It analyzes user input using Google's Gemini AI, extracts key entities and preferences, and fetches relevant recommendations through the Qloo API.

How we built it

• Frontend: React 19 with Vite for a blazing fast development experience
• Styling: Tailwind CSS 4 for responsive, utility-first styling
• Animations: Framer Motion for smooth, engaging UI transitions
• AI Integration: Google's Gemini AI for natural language understanding
• APIs: Qloo's cultural recommendation API for personalized suggestions
• State Management: React Context API for efficient state management

Challenges we ran into

1. AI Response Parsing: Gemini's responses required robust handling of various formats and edge cases
2. API Rate Limiting: Implementing proper error handling and fallback mechanisms
3. Responsive Design: Ensuring seamless experience across all device sizes
4. Performance Optimization: Managing API calls and state updates efficiently

Accomplishments that we're proud of

• Created an intuitive chat interface that understands natural language
• Successfully integrated multiple AI and recommendation APIs
• Built a responsive, accessible web application with dark/light mode support
• Implemented a robust error handling system with graceful fallbacks
• Achieved smooth animations and transitions for better UX

What we learned

• Advanced state management with React Context
• AI integration and natural language processing
• Responsive design principles and best practices
• API rate limiting and error handling strategies
• Performance optimization techniques for React applications

What's next for TasteSphere

• [ ] User accounts for saving preferences and history
• [ ] Expanded content categories and sources
• [ ] Social sharing and collaborative filtering
• [ ] Browser extension for content discovery
• [ ] Enhanced AI personalization through machine learning
• [ ] Mobile app development for iOS and Android

Built With

• and
• framer-motion
• github
• google-gemini-ai
• hosted
• qloo-api
• react
• react-router-v6
• tailwind-css-4
• vite