Skip to content

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

83 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

The Party

Live demo → · built by dsshji

Your Spotify taste, thrown as a party. Your top artists show up as 3D characters on a stage, size each other up based on how their genres and vibes clash or click, react to your top tracks as they play, and roast the room with dialogues written on the fly by an LLM. It opens, peaks, the lights come down, it ends.

⚠️ Requires a Spotify Premium account and desktop Chrome (heavy 3D scene, not mobile-optimized). In Russia, use a VPN to reach Spotify. The backend sleeps on Render's free tier, so the first login after a quiet spell can take ~30s to wake up.

The Party

▶ Watch the full demo (Google Drive) — friends' playthroughs coming soon


What it does

  1. Log in with Spotify → the app pulls your top 5 artists and top 5 tracks from the last 6 months
  2. The guests are read → each artist is classified by genre, subgenre, and vibe tags, then paired off into allies, opposites, and outliers based on how those actually relate
  3. The party runs in phases:
    • Arrival: artists walk on and react to whoever's already there (warm to allies, awkward to opposites)
    • Tracks play: your top songs come on over real Spotify playback; the room reacts to each one
    • Dominant artist: the most popular gets called out
    • Closing: a final toast, then someone undercuts it, and the lights fade

All the dialogue is generated per-moment from the actual relationships, so no two parties are the same. As the taste changes over time, the party guests and tracklist would change too


How it's built

Frontend: React + Vite, React Three Fiber / drei for the 3D scene, React Router for the flow. Characters are a rigged chibi base with each artist's photo textured onto the face & body; relationship-driven reaction animations (ally / opposite / author / neutral) per phase. Volumetric spotlights dim the stage and follow whoever's speaking. Layered audio: an intro one-shot, a looping ambient bed, and the live Spotify track

Backend: Node + Express handling Spotify OAuth (JWT sessions with token refresh), stat/relationship processing, and the dialogue generation. Deployed on Render; frontend on Vercel

Data + AI: Spotify Web API for artists/tracks and the Web Playback SDK for in-browser music. Classification and dialogue run through Groq on two models: gpt-oss-120b for genre/vibe tagging and the relationship graph, gpt-oss-20b for the per-moment dialogue, where latency matters more than nuance. The relationship graph (allies/opposites/outliers) is computed from the classified tags, then fed back into the dialogue prompts so the writing is grounded in the specific room


Running locally

# backend
cd server && npm install
# add .env: CLIENT_ID, CLIENT_SECRET, GROQ_API_KEY, JWT_SECRET, REDIRECT_URI, FRONTEND_URI
npm run dev

# frontend
cd client && npm install
# add .env: VITE_API_URL=http://127.0.0.1:8000
npm run dev

You'll need a Spotify app (Client ID/Secret, redirect URI http://127.0.0.1:8000/callback) and a Groq API key. Spotify Development Mode caps access to allowlisted users, so only accounts you add in the dashboard can log in.


Notes from building it

This started as a "roast my music taste" idea and was shaped by:

  • Spotify changed the API mid-build Audio features, genres, and popularity were all deprecated or removed for new apps in late 2025 / early 2026: which killed the original plan of mapping audio stats to party behavior. The fix I came up with was to use the LLM classify and tag artists and tracks by genre, subgenre, and the vibe. The whole relationship system is built on this, so it turned out more expressive than it would be with plain genre tags
  • The whole thing is a state machine Phases, per-character arrival/settle tracking, spotlight targeting, dialogue gating all wired up on one shared set of state for the visuals, the audio, and the reactions
  • First time with most of this stack React, R3F, OAuth, Blender-to-glTF: a lot of it was learned on the way. The reaction animations and curtain work (not included in the final version) were the hardest

Credits

Asset Source
Animations Mixamo
Chibi base model mazko: CC-BY
Disco ball pan.stasian: CC-BY
Confetti local.yany: CC-BY
Button uiverse.io / dexter-st
Heading font Super Shiny
Background music Suno AI: 1, 2
Fanfare / drumroll / talking SFX freesound_community via Pixabay

About

Your Spotify taste thrown as a party: top artists as 3D characters who roast each other via LLM-written dialogue

Topics

Resources

Stars

3 stars

Watchers

0 watching

Forks

Contributors

Languages