🎵 SongSense
AI-powered music analysis with spectrograms, lyrics transcription, and intelligent reviews.
Features
- Upload or paste links — YouTube, SoundCloud, Spotify, Dropbox, or local files
- Interactive visualizer — Play a game while your music is being analyzed
- AI-powered reviews — Production analysis + lyric breakdown powered by Claude
- Spectral analysis — Visual spectrograms showing frequency content
- Beautiful UI — Dark mode, glassmorphism, smooth animations
Tech Stack
- Frontend: Next.js 15, React, TypeScript, Tailwind CSS, Framer Motion
- Backend: Next.js API routes, Node.js
- Processing: ffmpeg, yt-dlp, OpenAI Whisper, songsee, Claude API
- Deployment: Railway (recommended) or any Node.js host
Local Development
npm install
npm run dev
Environment Variables
Required:
OPENAI_API_KEY— For Whisper transcriptionANTHROPIC_API_KEY— For AI review generation
Deploy to Railway
- Push to GitHub
- Connect Railway to your repo
- Add environment variables in Railway dashboard
- Railway will auto-detect Next.js and deploy
System dependencies (ffmpeg, yt-dlp) are handled via nixpacks.toml.
Note: songsee must be installed manually or via a build script (not in nixpkgs).
Architecture
src/
├── app/ # Next.js pages and API routes
│ ├── page.tsx # Landing page
│ ├── analyze/[jobId]/ # Game/visualizer page
│ ├── review/[jobId]/ # Review results page
│ └── api/ # Backend endpoints
├── components/ # React components
│ ├── game/ # Audio visualizer
│ ├── review/ # Review display components
│ ├── upload/ # File/URL input
│ └── ui/ # Reusable UI components
└── lib/ # Backend logic
├── processing/ # Audio processing pipeline
├── store.ts # In-memory job store
└── types.ts # Shared TypeScript types
How It Works
- User uploads audio or pastes URL
- Backend downloads and converts to MP3
- Whisper API transcribes lyrics
- songsee generates spectrograms
- Claude analyzes spectrograms + lyrics
- User gets beautiful review with ratings
Built by agent teams in ~20 minutes. Reviewed and deployed by Buba 🤖