Video Wall Builder ~ Claude Fable 5

The idea was simple:

Build a Video Wall Builder that lets you drag-and-drop multiple videos into customizable layouts (2×2, 3×3, 4×4, etc.), play them independently, and even expand a single video inside the app without taking over the entire monitor.

Before writing a single line of code, I spent time with ChatGPT refining the idea into a detailed mvp_prd.md, followed by a plan.md and an architecture.md. That upfront planning gave the AI a clear roadmap instead of just a vague prompt.

Then I handed everything to Claude Fable 5 (High)..

It one-shotted the project to about 75% of the way there. 🤯

The result was a working Electron + React desktop app featuring:

✅ Support for Video, URL, OBS & Camera

✅ Dynamic 1×1, 2×2, 2×3, 3×3, 4×4 & custom XxX layouts

✅ Drag-and-drop video loading

✅ Independent playback controls for every tile

✅ Container-scoped full-screen (expand a tile without taking over the monitor)

✅ Windowed, maximized, and borderless modes

✅ A polished UI that already feels like a real desktop application

I didn't stop after the initial build. I continued refining the architecture, playback engine strategy, workspaces, scenes, custom layouts, plugin-oriented design, and long-term roadmap. Each iteration made the next coding session even more effective.

One thing that really surprised me was how far I was able to push Claude Fable 5 (High) on the $20/month Claude Pro plan.

Although the project spanned three 5-hour usage windows because of the Pro plan's session limits, the actual development only took about 4 hours and 7 minutes of active coding time. The first usage window was exhausted in 1 hour 21 minutes, the second in 54 minutes, and the third in 1 hour 52 minutes. We completed the project in just two conversation contexts, staying well under Claude's available context window.

By the end of those sessions, the app had grown from an idea into a polished MVP with dynamic layouts, drag-and-drop media loading, workspaces, scenes, source management, persistent settings, an FFmpeg-backed playback strategy, Windows packaging, and a documented long-term architecture.

The biggest lesson for me wasn't just how good the AI was, it was how much planning mattered. The combination of a solid product vision, well-defined documentation (mvp_prd.md, plan.md, and architecture.md), session management, and iterative collaboration produced dramatically better results than simply asking an LLM to "build an app."

That's becoming my favorite AI workflow:

Ideate → Plan → Architect → Build → Refine → Repeat.

Each stage gives the next AI session better context, better direction, and ultimately better code.

How much planning do you do before asking an LLM to build something? Or do you jump straight into coding?

0 comments

Video Wall Builder ~ Claude Fable 5