Step-by-step custom web app build from @jeongyoon.design

The creator introduces a custom web app they built for burning digital CDs, explaining their motivation to make playlist sharing more special than a standard link. They walk through the development process, showcasing the retro UI design and animations, before discussing the technical challenges of integrating the Spotify API and their pivot to the iTunes API. The video concludes by demonstrating the final shareable link feature and ending with a humorous anecdote about a user.

Creator: @jeongyoon.design on Instagram

Video format

Talking Head Edit

Video outline

  1. Hook with final result
  2. Show the building process
  3. Reveal a major roadblock
  4. Demonstrate final user features
  5. End with humorous CTA

Hook overview

Present the final, polished creation immediately alongside the emotional or practical motivation for building it, establishing immediate value and curiosity.

Title hook

This is how I build a website

Verbal hook

This is how I build a website that better you burn a CD.

Visual hook

Direct talking-head shot of the creator that immediately cuts to a nostalgic, retro-style screen recording of a 2000s installation wizard and digital CD player.

Hook strategies

  1. curiosity-open-loops
  2. transformation-payoff

Payoff

Conclude with a humorous, exaggerated, or highly desirable hypothetical outcome of using the product, which acts as a disguised, engaging Call to Action.

Narrative framework

The Transparent Creator Journey

Narrative framework logic

Hook the viewer with an impressive final product and a relatable motivation, then take them on a fast-paced, authentic journey of its creation—highlighting obsessive details, inevitable roadblocks, and ending with a highly shareable use-case.

Narrative framework breakdown

  • frameworkName: The Transparent Creator Journey
  • frameworkType: Standard Narrative
  • coreLogic: Hook the viewer with an impressive final product and a relatable motivation, then take them on a fast-paced, authentic journey of its creation—highlighting obsessive details, inevitable roadblocks, and ending with a highly shareable use-case.
  • confidence: 95
  • pendingStatus: created

Topics: Tech, Web Design, App, Software Culture

Concepts: Breakdown, Process

Formats: Talking Head Edit

Elements: Screen Recording, B-Roll Cutaway, Text Overlay

Account types: Personal Brand

Transcript excerpt

This is how I build a website that better you burn a CD. Here's the thing, sending a playlist should feel a little more special than a Spotify rank, so I made it myself. First, watch the YouTube videos of people burning CDs. I built it like a two thousand's installation wizard. Tier retro buttons and fake progress bar. Next, I built a CD player, lead opens, lead closes, and disc spins. I spent way too much time on this animation better like totally worth it. Then I tier to connect Spotify API, finally got it worse, and found out only five people can use it unless I register as a business. So I cried four or five seconds and pivoted to iTunes API instead. The trade off? Only thirty seconds per song, and that decision really really really hurt. So I made it easy. Copy the whole playlist, open each song in Spotify or Apple Music with one tap. Last thing I added was a shareable link. Every CD gets its own preview image. You send it to someone and they open it. Someone told me they sent it to their crush and they're dating now. Sorry it's a lie, but let me know if you did. Bye.

1,129,949 views