Back to Work

For Annapurna Interactive & Beethoven & Dinosaur

Mixtape

A custom web experience for the launch of Mixtape, a soundtrack-driven coming-of-age adventure and one of the highest-rated games of 2026. Built to bring back the ritual of making mixtapes: finding songs, shaping a mood, designing the J-card, and sharing something that feels personal.

Make Your Own Mixtape homepage with layered game-inspired artwork and cassette tape interface

Overview

Mixtape is a companion web experience for the game Mixtape by Beethoven & Dinosaur, published by Annapurna Interactive. Released in May 2026, the narrative adventure became one of the highest-rated games of the year on OpenCritic and Metacritic. The idea started with one simple feeling: making a mixtape used to mean something. It was slow, intentional, tactile, and a little bit rebellious.

ASDF designed and built an interactive mixtape maker that lets fans search for songs, build Side A and Side B, customize a cassette J-card, and publish a shareable tape. The result is part product, part promo site, part nostalgic toy, and part tiny emotional time machine.

Goals

  • Create a launch-ready experience that felt native to the world of the game
  • Make the act of building a mixtape feel tactile, personal, and fun
  • Support real music discovery without turning the interface into a generic playlist builder
  • Generate beautiful share assets that helped the project travel socially
  • Build a stable foundation that could handle real launch traffic

What We Did

  • Designed and built the full mixtape creation flow from search to final published tape
  • Created a two-sided tape builder with track timing, ordering, and editing tools
  • Built a J-card customization system with themes, stickers, doodles, titles, and layered artwork
  • Developed shareable tape pages with custom open graph and social image generation
  • Integrated authentication, permanent tape storage, and a public tape rack for browsing created mixtapes
  • Optimized the experience across desktop and mobile while keeping the interface playful and expressive
Mixtape builder interface showing Side A and Side B track lists with cassette-inspired controlsMixtape J-card customization interface with stickers, doodles, themes, and artwork controls

Tech Stack

Frontend

Next.js, React, TypeScript, Tailwind CSS

Backend

Supabase auth, database, and storage

Hosting

Vercel, Fly.io

Systems

Custom media search, rendering, and share-image pipeline

Behind the Build

The most important challenge was making the experience feel like a mixtape, not a software form. Every interaction had to balance utility with mood: fast enough to be useful, weird enough to be memorable, and polished enough to represent a beloved game studio and publisher.

The visual system was built from layered assets, textures, masks, stickers, and cassette-era interface details. Under the hood, the app connects music discovery, user accounts, publishing, and automated social graphics into one smooth flow, so the final tape feels like a real artifact instead of a database record.

Quick Stats

📼

90-day concept-to-launch build

🎧

45,000+ searches after launch

📝

2,000+ mixtapes created early on

🚀

Launched alongside the game release

What We Learned

Nostalgia works best when it is treated with respect. The site could not just look retro. It needed to recreate the feeling of choosing, arranging, decorating, and giving someone a piece of your taste. That emotional logic shaped the product just as much as the visual design.

Results Recap

  • A polished interactive launch experience for a major indie game release
  • A custom mixtape builder with music discovery, styling, publishing, and sharing
  • A social-ready artifact system that turns each tape into something people want to post
  • A strong proof point for ASDF as a studio that can design and ship emotional, technically complex product experiences

Visual Language

The design pulls from cassette packaging, bedroom stereos, stickered notebooks, zines, and the slightly chaotic beauty of making something by hand. The goal was not clean nostalgia. It was lived-in nostalgia, the kind with fingerprints on it.

Generated Mixtape social share image featuring a custom J-card and cassette-inspired artwork

Let's build something better.

ASDF.design is a modern web development studio based in Duluth, Minnesota. Crafting custom websites using React, Next.js, Supabase, Shopify, and Webflow, for businesses, creators, and organizations that want something better.