In this episode of The CD Show, Aleks and Darko dive into live prototyping with AI and React Flow. Instead of traditional wireframing, they let an AI assistant build a functional workflow canvas from scratch. They walk through setup, debug UI issues, explore node design, and shape an interactive canvas that could one day power real CD pipelines. It's part build log, part wild ride — and surprisingly productive!
Timestamps ⏰
00:00 - Kickoff: AI-powered prototyping experiment
01:30 - React Flow vs D3: Choosing a visualization framework
04:10 - Starting with a blank project for better AI results
07:40 - Prompting AI to scaffold a basic canvas
10:30 - First results: Workflow boxes appear
13:00 - Strategy: incremental vs holistic node design
16:00 - Attempting screenshot-based UI matching
19:00 - Learning React Flow’s node/component model
24:30 - Designing custom nodes with metadata
27:45 - Commit early, commit often: Git integration habits
30:00 - Prioritizing CD-related node information
34:00 - Sidebar interaction ideas & documentation dig
37:00 - Visual tweaks: colors, handles, and layout
40:00 - Fixing edge rendering issues after node customization
44:30 - Emojis, flags & playful UI touches
48:00 - Introducing external Git repo nodes
52:00 - Discussing message/event info for Git integrations
57:00 - Adding additional flows to the canvas
01:03:00 - Final thoughts: sidebar development and next steps
01:10:00 - Reflecting on the progress + closing the episode