Dive Club 🤿 with Ridd
Episode: Best AI Coding Tools for Designers
Date: January 28, 2026
Episode Overview
In this episode, Ridd explores the evolving landscape of AI coding tools tailored for designers. Drawing on his extensive hands-on experience, he breaks down his personal frameworks, shares practical workflows, and explains which tools excel in different design and coding scenarios. The conversation provides listeners with actionable advice, real-world examples, and insights into how AI is reshaping the designer's toolkit.
Key Discussion Points & Insights
1. Ridd’s Mental Model for Choosing Tools
[00:00–03:01]
-
Ridd introduces a quadrant-based mental model to clarify when and why to use specific AI tools.
- X-axis: Size/complexity of the task (from quick bug fix to ambitious new ideas).
- Y-axis: How much material already exists (blank slate vs. iterating on shipped features).
-
Pushes back against the “canvas is dead, everything has to exist in code” narrative, emphasizing the ongoing importance of unstructured ideation.
“A lot of times it's very unshaped. We have no idea what problem we're even solving... I love making a mess on a canvas.”
—Ridd ([00:37])
2. AI Prototyping Tools for Early-Stage, Small-Scale Work
[03:02–10:54]
-
Figma Make:
-
Ideal when UI already exists. Quickly scaffolds interactions.
-
Example: Created a spinning progress component, used the Make URL directly for handoff.
“Since I already had the component outlined in Figma, it was really easy... just port this over to Make, nail down exactly how I want the interaction to feel.”
—Ridd ([02:16])
-
-
Lovable:
-
Best when starting with little/no UI and for multi-step prototyping.
-
Example: Built a “Vibe slider” as a rough proof of concept for an animation handoff.
“I did some exploring with Lovable and eventually landed on this general interaction after about 30 minutes. And I had none of this UI up front.”
—Ridd ([04:20]) -
Great for testing Lottie/Rive/Jitter animations and rapid iteration.
-
Caution: Don’t get trapped simulating production detail outside your design system.
“The trap... is trying to rebuild production inside of an AI prototyping tool that doesn’t sit on top of your production code base.”
—Ridd ([09:02])
-
-
Desen:
-
New favorite—offers speed and import of real design system/code base.
-
Useful for those who can't easily pull down production code.
“It’s a really great way to spin up a prototype that uses all of my styles and components pretty quickly.”
—Ridd ([10:34])
-
3. AI Coding in Production: Claude Code, Conductor, and Workflow Evolution
[10:55–27:29]
-
Claude 4.5 and Conductor:
-
Major shift: AI can now push directly to production-level code for fast iteration.
-
Ridd moved from Warp + GitHub Desktop, to Claude’s Mac app, and finally to Conductor—which enables parallel workstreams and smooth flow state.
“The tool that has pretty much consumed the majority of my AI coding as of late is Conductor. It’s an easy way to run multiple Claude codes in parallel.”
—Ridd ([13:51]) -
Dictating prompts out loud for speed, often batching several fixes simultaneously.
“I pretty much dictate all of my prompts. It’s so much faster and it’s a little bit rambly, but it just works.”
—Ridd ([17:00]) -
Conductor’s code review agent provides a crucial extra safety net—excellent for non-senior engineers.
“When I’m starting to get into waters that maybe I don’t have as firm of an understanding for, this is that extra boost of confidence...”
—Ridd ([20:38])
-
-
Example Workflow:
-
Outlines using Conductor to resolve Linear issues, test UX (e.g. autofocus on input fields), and batch PR creation.
-
Describes the joy of rapid iteration, the ability to hand off and multi-task, and even those small errors (“pixels vs characters!”).
“[Laughs] Okay, embarrassing, but this kind of stuff happens all the time.”
—Ridd ([19:54])
-
4. Strategic, Large-Scale Projects & CTO-AI Collaboration
[27:30–35:04]
-
For big, ambiguous projects with some code foundation (e.g. building a personal productivity OS), Ridd leverages Claude Code Mac app as a “CTO” to help evaluate plans and write prompts for Conductor.
-
Heavy use of long-form, contextual chat to break projects into strategic phases.
-
Delegates execution to AI agents, then checks output with CT-like accuracy.
“I’m just building up this understanding so that Claude can effectively function as my CTO...”
—Ridd ([30:11]) -
Repeats this process even for complex product work for Inflight.
"This way I'm kind of double and triple checking my work with AI."
—Ridd ([34:07])
5. Adaptability & Personalization of Toolkits
[35:05–36:00]
-
Emphasizes this is his personal practice, encouraging listeners to adapt based on their roles, team, and company stage.
“Everybody’s going to be a little bit different based off where you’re at in your career... at the rate things are changing with AI.”
—Ridd ([35:25])
6. Ridd’s Favorite Product Stack
[36:01–36:40]
- Quick rundown of essentials:
-
Framer (websites)
-
Genway (research)
-
Granola (crit notes)
-
Jitter (animation)
-
Lovable (prototyping in code)
-
Mobin (inspiration)
-
Paper (creative design)
-
Raycast (shortcuts)
“By far the number one way to support the show is to check them out.”
—Ridd ([36:36])
-
Memorable Quotes
- “A lot of times it’s very unshaped. We have no idea what problem we’re even solving... I love making a mess on a canvas.”
—Ridd ([00:37]) - “The trap that you fall into is trying to rebuild production inside of an AI prototyping tool...”
—Ridd ([09:02]) - “It’s so freaking easy.”
—Ridd referring to contemporary AI coding in Conductor ([15:26]) - “I pretty much dictate all of my prompts. It’s so much faster and it’s a little bit rambly, but it just works.”
—Ridd ([17:00]) - “Claude can effectively function as my CTO and help me create some of these initial project docs.”
—Ridd ([30:11]) - “Everybody’s going to be a little bit different... at the rate things are changing with AI.”
—Ridd ([35:25])
Episode Timeline
| Timestamp | Segment | |-------------|----------------------------------------------------------------| | 00:00–03:01 | The quadrant mental model for using AI coding tools | | 03:02–10:54 | Canvas vs code, and best prototyping tools (Figma Make, Lovable, Desen) | | 10:55–27:29 | Claude Code, Conductor, spoken prompts, and rapid bug-fixing | | 27:30–35:04 | Big projects: Using AI as a CTO, strategic AI work planning | | 35:05–36:00 | Adapting tools to career and company context | | 36:01–36:40 | Ridd’s favorite products (rapid-fire stack rundown) |
Practical Takeaways
- Match the tool to the stage and scale of your design problem.
- Prototyping tools (Lovable, Figma Make, Desen) excel at focused, early-stage work.
- AI code generation and workflow orchestration (Conductor, Claude Code) now enable designers to ship to production with far greater speed and confidence.
- Designers can—and should—build toolkits and processes that play to their context and strengths.
- Leverage AI as both assistant and strategic partner, especially for complex, multi-phase projects.
For More
- All episodes, takeaways, and resources at Dive.club
