Interactive piano lesson from a YouTube tutorial

Macaly's AI agent watched a 22-minute beginner piano lesson, extracted every teaching concept, and turned it into a step-by-step interactive course with animated piano keyboards, finger position diagrams, note sequence visualizations, and a practice checklist that saves your progress. Three prompts, one published lesson.

Try Macaly

Overall stats

Prompts: 3
Time: ~ 17 min

1. Analyze the video and build the lesson

One prompt with a YouTube link. I watched the full 22-minute lesson, identified 10 teaching concepts, extracted the instructor's exact wording, and built a complete interactive website — animated SVG keyboards, finger position labels, note sequences, song structure breakdown, and a practice checklist with persistent progress.

Build a beginner piano lesson website based on this YouTube video. Extract the key concepts, break them into numbered steps with visuals. It should feel like an interactive lesson, not a transcript. Include a progress checklist for learners to track their practice. https://www.youtube.com/watch?v=4SXQ_wlbWog

Winner winner chicken dinner

Get started - free

What the agent did

22-minute lesson analyzed in full

I processed the entire YouTube tutorial from start to finish — every teaching concept, every trick, every pattern, every piece of advice. All extracted and organized into 10 structured lesson steps before a single line of design work began.

Interactive SVG piano keyboards

Custom-built two-octave keyboards rendered as SVGs with highlighted keys, finger position labels (L5, R1, R3), left/right hand zone indicators, and gradient-styled active keys. Each pattern gets its own keyboard showing exactly which keys to press.

Note sequence visualizations

Color-coded flow diagrams showing the exact order of notes in each pattern. Left-hand notes in gold, right-hand notes in amber, connected by directional arrows. You see the pattern before you play it.

10 structured lesson steps

From "The 7 Notes" to "The Biggest Beginner Mistake." Each step has a numbered card with the instructor's own words, a subtitle, optional tip callout, and the right visual — keyboard diagram, note sequence, or both. Not a transcript. A lesson.

Practice checklist with saved progress

11 skill checkboxes that persist across sessions. A progress ring shows completion percentage, a sticky header bar tracks items checked, and a celebration state triggers when all skills are marked complete. Come back tomorrow — your progress is still there.

Dark cinematic practice room aesthetic

Not a template. Fraunces for display headings, Lexend for body text, warm gold accents on deep brown backgrounds. Subtle grain texture, soft glowing highlights, muted borders. Feels like sitting down at a piano in a dimly lit studio, not reading a blog post. Because obviously.

Instructor's exact language preserved

I re-watched the video and pulled Zach Evans' actual phrasing. "The piano looks like it has a bajillion notes." "It looks like a dog with two ears and a snout. Dog, D." "Mash down the pedal with your foot." The lesson reads like him teaching, not an AI paraphrasing.

Full song sequence breakdown

A dedicated card showing the complete song structure: Pattern 1 (x4), Pattern 2 (x4), Pattern 1 (x4), Pattern 4 (x4). Each pattern displayed with its note sequence, finger name, and repeat count. The whole song at a glance. I already took care of it.

Fully responsive

Desktop, tablet, phone. Piano keyboards scale cleanly, note sequences wrap gracefully, checklist items stay tappable. Same lesson quality at every breakpoint.

Interactive piano lesson from a YouTube tutorial

Overall stats

1. Analyze the video and build the lesson

Winner winner chicken dinner

Interactive piano lesson from a YouTube tutorial

Overall stats

1. Analyze the video and build the lesson

Winner winner chicken dinner

2. Polish the design

3. Match the instructor's exact words

What the agent did

22-minute lesson analyzed in full

Interactive SVG piano keyboards

Note sequence visualizations

10 structured lesson steps

Practice checklist with saved progress

Dark cinematic practice room aesthetic

Instructor's exact language preserved

Full song sequence breakdown

Fully responsive