Studio

A podcast analytics interface with a beat-synchronised turntable, episode exploration, audience charts and an earnings console.

• Best forDevelopers building podcast and audio-creator analytics interfaces.

• Overview

  Explore the animated turntable, sample listening metrics and top episodes; player controls also change the visual motion.

• Episodes

  Filter and select fictional episodes to update the simulated player, spectral landscape and retention curve.

• Audience

  Switch between a globe and flat map, highlight sample cities or listening apps and inspect demographic charts.

• Earnings

  Toggle revenue channels with console controls, inspect sample payouts and mark local ad-read checklist items.

• Beat-synchronised visuals

  The turntable, waveforms, equalizer and console meters follow a shared simulated beat. A canvas projection draws the deck and record, while play and pause controls change the visual motion.

• Simulated player controls

  Select episodes, seek, change speed or use skip controls to explore the player interface. The selected episode also updates the displayed waveform, spectral landscape and retention curve; audio tracks are not included.

• Audience and earnings tools

  Switch between globe and flat map, highlight sample cities or apps and inspect demographic charts. Console controls toggle displayed revenue channels, with filters for fictional payouts and local ad-read checklist items.

• Episode exploration

  Episode filters, sorting and listening-period controls update the sample analytics. Loading an episode keeps the player selection and linked visuals consistent across the Overview and Episodes views.

• Editable data and motion

  Episode, audience and revenue examples are defined in the data module, while tempo and theme tokens have separate controls in code. Reduced-motion preferences stop pulses and show static turntable and waveform visuals.

Responsive layouts, keyboard-accessible navigation and reduced-motion support.

The player and audio-reactive visuals use a simulated signal; audio tracks are not included. Listeners, revenue and activity are fictional, with no streaming-platform or payout connection.

• IncludedFictional demonstration data and local interactions, ready to edit. The included README identifies the data files and model.
• Not includedBackend, database, authentication, payments or AI services. Features that look connected are simulated; connect your own services when you adapt the code.

• Complete Next.js project
• 4 animated views
• Source files and project assets
• README with setup and customization
• LICENSE.md

Stack and requirements

• StackNext.js 16, React 19, TypeScript, Tailwind CSS v4, Framer Motion, Lucide icons
• FontsHanken Grotesk, Unbounded
• RequiresNode.js 20.9 or later, npm, and working knowledge of React and Next.js

Run it locally

Extract the ZIP, open a terminal in the project folder, then run:

npm install
npm run dev

Open localhost:3000. The README covers the data, colors, fonts and animations.

• Price$9 USD, one-time payment. No subscription or renewal.
• TaxesApplicable VAT and sales tax are included in the price. The total is shown before you pay.
• LicenseUnlimited personal and client projects. No resale or redistribution of the source. Read the license
• DeliveryAfter payment, Polar emails your receipt and a download link for the ZIP.
• RefundsIf the files don’t install or run as described and can’t be fixed within 7 days, you get a full refund. Refund policy
• Supporthello@buildindex.dev for the template as delivered.

Secure checkout by Polar. More answers in the questions.