Claude Code = $10,000 Beautiful Slides
Jack demonstrates a GitHub-based system using Claude Code to generate professional slide decks from any website URL by codifying 20 universal design principles. The system uses Firecrawl to extract brand DNA from websites and can integrate AI-generated images via APIs like Krea.ai. The result is polished, brand-consistent HTML presentations created in minutes with minimal input.
Summary
The video presents a workflow for generating high-quality slide decks programmatically using Claude Code, underpinned by 20 codified universal design principles. Jack argues that most AI-generated design looks generic ('AI slop') because users don't give the model a structured rule set to follow — essentially getting garbage out because they put garbage in.
The 20 design principles Jack references are research-backed and cover concepts like: one idea per slide, 3-second glanceability, maximum 7 elements per slide (ideally 3-5), 40% white space minimum, a 5% safe zone from edges (borrowed from TV production), the golden ratio (1.618) for sizing, four type sizes maximum per slide, 28pt minimum body text, 60-character line length cap, 60-30-10 color ratios, one accent color per design, 8px grid alignment, proximity-based grouping, and data-ink ratio principles (no 3D, no decorative gradients).
The practical workflow involves: cloning a GitHub repo ('Power Design,' forked from 'Vault Design'), inputting a target website URL, using Firecrawl to extract brand assets (colors, logos, typography, visual style), and then prompting Claude to generate HTML slide decks following the design rules. Jack demonstrates this with ClickUp and Stripe, showing that Claude reproduces brand-specific details like gradient text effects and logo placement in a single generation pass.
For enhanced visual impact, Jack shows how to integrate AI image generation by passing a Krea.ai API key to Claude, specifying a visual style (e.g., a Pinterest illustration style), and having Claude generate and embed contextually appropriate images directly into slides. The final step involves deploying the HTML deck publicly via GitHub and Vercel CLI, making it shareable as a hosted web page.
Key Insights
- Jack argues that AI design fails not because of model capability but because users provide no design rule infrastructure — the model is treated like a '500 IQ intern' without a brief, producing generic defaults instead of principled output.
- Jack claims that codifying design into 20 measurable, checkable rules (e.g., golden ratio, 40% whitespace, 60-30-10 color split) gives Claude a 'rule book' it can execute against, producing results indistinguishable from human professional design.
- Jack demonstrates that Firecrawl can extract a full brand spec from any website URL — including SVG logos, color palettes, and visual screenshots — in seconds, enabling Claude to generate brand-accurate slides without manual asset collection.
- Jack shows that by uploading a reference image from Pinterest or Midjourney alongside a Krea.ai API key, Claude will both generate on-style images and integrate them into slides, replicating the reference aesthetic without explicit style prompting.
- Jack asserts that the 5% edge rule — no critical content within 5% of any slide border — originates from TV production standards and is one of the key principles that makes AI-generated slides feel professionally crafted rather than algorithmically placed.
Topics
Transcript
[0:00] Club Code is the world's number one design agent, but 99% of people get AI slop because they make one mistake. And in this video, I'll show you my new system that lets you build beautiful slides and designs worth thousands in minutes using 20 universal design principles in any style that you want to so easily, even if you've only ever used PowerPoint before. And this is brand new. And if you don't know who I am, my name is Jack. I built and saw my last tech startup with a gazillion customers. [0:31] Now I'm building my own AI business and I just share here the stuff that works. So if you haven't already, grab that coffee…
Full transcript available for MurmurCast members
Sign Up to AccessMore from Jack Roberts
100 hours of Hermes Agent lessons in 23 minutes
Jack walks through advanced features of Hermes Agent, an AI personal assistant, covering memory systems, background tasks, scheduled cron jobs, model switching, and integration with tools like Obsidian, GitHub, and various AI models. The video aims to help users unlock capabilities beyond basic chatbot usage. Key themes include connecting external memory systems, delegating tasks to specialized AI models, and building a persistent, context-aware personal assistant.
The most valuable thing I got from working at McDonald's
The speaker reflects on their first job at McDonald's at age 17, earning £5 an hour. The most valuable takeaway was the realization that they never wanted to work such a job again, reinforced by calculating how long it would take to earn a million pounds at that wage.
Claude Code Memory System = CHEAT CODE
Jack Roberts presents a three-tier Claude memory system designed to give AI tools persistent context across all platforms and sessions. The system consists of short-term identity memory, mid-term project memory via structured folders and claude.md files, and long-term memory using either Obsidian or Pinecone for archiving conversations and expert knowledge. The goal is to eliminate the 'amnesia' problem where AI loses context between chats.
ChatGPT ads aren't actually a bad thing. Here's when I want them.
The speaker argues that ads in ChatGPT are not inherently bad, particularly when users are actively seeking product recommendations. They distinguish this as 'pull advertising,' where the user initiates the request and ChatGPT synthesizes results based on provided context.
AI won't kill agencies.
The speaker argues that AI will not kill agencies because there has always been a gap between possessing knowledge and executing it. People have historically paid others to perform tasks they could learn but choose not to, and this dynamic will continue regardless of the technology involved.