Inspiration

Every streaming service recommends movies, but taste is broader than a single domain. We believe true cultural discovery connects the dots between films, music, and books — just like real people do when they share their favorites. Inspired by our love for cross-cultural connections and the promise of AI, we set out to build a universal recommender: like a film, and get music and book recs that match your vibe.

What we built

Culture Explorer is a cross-domain recommendation platform powered by Qloo Taste AI.

Users like movies, and our app instantly recommends not only similar films, but also matching books and music — creating a personalized cultural journey.

The core engine builds a taste profile from user interactions and leverages it to recommend across domains.

The UI is fast, interactive, and fun: explore, compare, and get AI explanations on why things match your taste.

Everything runs on Next.js, React, Tailwind, and Framer Motion for beautiful UX. The backend fetches real-time data from Qloo APIs or uses local samples if the API key is missing.

How we built it

Frontend: Next.js 14 (App Router), React 18, TypeScript, Tailwind CSS, Framer Motion.

Backend: Node.js (API routes in Next), Qloo Taste AI API for cross-domain data (movies, music, books).

Recommendation logic: Custom taste profiling (user likes) + scoring and ranking using our own math/logic.

Deployment: Vercel + GitHub.

Extras: Smart local fallback for offline/demo usage; AI-powered explanations with LLM.

Challenges we faced Sparse data: Building strong recommendations from only a few likes, especially in new domains.

Data harmonization: Mapping Qloo API entities (tags/genres) to a unified profile, and handling partial/missing metadata.

Cross-domain scoring: Designing a scoring model that feels intuitive across movies, music, and books — requiring both math and intuition!

API reliability: Handling API rate limits and missing keys gracefully, with seamless local fallback.

User onboarding: Making the UI frictionless so users see value right after their first interaction.

What we learned

True cross-domain recommendations need careful taste modeling — movie and music tags don't always align!

UI matters: a playful, transparent experience boosts user trust in AI suggestions.

The Qloo API is powerful but requires normalization for a seamless user experience.

The power of rapid prototyping with Next.js & React for fullstack AI apps.

What’s next

Deeper integration with Qloo (personalized taste graph, more domains: restaurants, travel, etc.)

Collaborative filtering (taste similarity with friends & community)

More advanced AI explanations (showing why things match)

Mobile-first experience & PWA

Built With

  • framer-motion
  • javascript
  • next.js-14
  • node.js-(next.js-api-routes)
  • qloo-taste-ai
  • react-18
  • tailwind-css
  • typescript
Share this project:

Updates