This is the real prompt sequence and the real input files behind the walkthrough — one page of messy notes, three source documents, and seven prompts, in the order they were actually used. Copy the structure, swap in your own project.
Before you write a single prompt, write three files. This is the part most people skip — and the part that did the most work. Below is the actual messy-notes file from the video, so you can see how rough "rough" is allowed to be.
Audience, rough section ideas, a few phrases you like, and a list of things you refuse to ship. Bullet points are fine. Typos are fine. This is the actual file used:
AI creators roundtable landing page community for people making things with AI but don't want generic AI slop creators / designers / artists / entrepreneurs / indie builders probably Discord people share: prompts that actually worked real workflows projects in progress wins + failures tool/news updates but only useful stuff feedback maybe weekly roundtable? feeling should be smart but welcoming, creative, not corporate not another guru community honest about what AI is good and bad at need: hero why join what happens inside who it's for maybe principles? faq join buttons main idea: use AI to build something real without losing your creative voice avoid purple gradients, robot pictures, glowing brains, endless cards would like some editorial/magazine personality CTA: Join the Roundtable questions people might have: is it free? yes during founding period is this just for experts? no what tools? all tools, not tied to one company is work shared publicly? only if member chooses could mention: practical not hype show your work give useful feedback disclose AI use honestly Need a good headline. Don't say unlock, unleash, revolutionize, supercharge, or 10x.
One page: purpose, audience, positioning, brand promise, personality, voice, and visual direction. This is what stops the model from defaulting to a generic SaaS look. The actual brief named specific things to avoid — purple AI gradients, glowing orbs, robots, generic stock imagery — and specific things to aim for — editorial rather than conventional, one energetic accent color, visible human texture like annotations and marginal notes.
Every claim the site is allowed to make, written out in advance — and a section explicitly banning invented testimonials, member counts, partner logos, and guarantees. This is the single highest-leverage file in the whole process: it's the reason nothing on the finished site is fabricated. The real file included:
Prohibited claims — do not invent: - Member totals - Testimonials - Partner logos - Scheduled weekly events - Guaranteed response times - Income or productivity outcomes - Privacy or security guarantees
Prompts 1 through 3 always run, in order. Prompts 4 and 5 are conditional — use them only if the real problem they describe actually shows up in your build. Don't force a revision that isn't needed. Prompts 6 and 7 always run, at the end.
Points the model at your three files and asks for a plan — goal, section order, visual concept, type/color/motion systems, responsive strategy, accessibility approach. No code yet.
Read these files before doing anything else: - 01-project-input/01-messy-notes.txt - 01-project-input/02-brand-brief.md - 01-project-input/03-approved-content.md We are creating a polished, responsive landing page for the AI Creators Roundtable. The audience is creators, designers, artists, entrepreneurs, and indie builders who want to use AI without losing their creative voice. Requirements: - Create a strong hero with one clear primary action. - Include the value of joining, what members discuss, who it is for, community principles, an FAQ, and a final call to action. - Make the design creative, intelligent, warm, and trustworthy. - Use an editorial visual direction rather than a generic SaaS template. - Avoid purple AI gradients, glowing orbs, robots, generic stock imagery, excessive glassmorphism, and repetitive card grids. - Give major sections distinct compositions while preserving one coherent design system. - Use only information supported by the supplied files. - Do not fabricate testimonials, statistics, partner logos, events, or guarantees. - Make the page responsive and accessible. - Respect reduced-motion preferences. - Build the website only inside the demo-site folder. Do not write code yet. First provide: 1. A one-sentence communication goal 2. The proposed page narrative and section order 3. The visual concept 4. The typography, color, spacing, and motion systems 5. The responsive strategy 6. Accessibility considerations 7. Any assumptions or risks Wait for my approval before creating or changing files.
Swap the file names, the community/product description, and the requirements list for your own project.
The first proposal is usually competent and safe. This prompt is what turned "safe SaaS template" into "The Broadsheet" — an editorial identity with its own visual language.
The structure is useful, but push the creative direction further away from a conventional SaaS landing page. Make it feel like an independent editorial workshop for creative people: - Use confident editorial typography and expressive whitespace. - Introduce restrained workshop details such as annotations, rules, marginal notes, or underlines. - Give each major section a distinct visual composition. - Keep the page cohesive through typography, color, spacing, and repeated small motifs. - Let the work and principles feel human; do not make the interface look like a software dashboard. - Avoid placing every idea in a rounded card. - Keep the primary call to action visually unmistakable. Revise the proposed direction only. Do not write code yet. Explain what changed, then wait for approval.
Approval isn't just "go" — it's a real implementation brief: stack, verified CTA destination, README, responsive/accessibility requirements, and an explicit self-report at the end.
The direction is approved. Build the complete website inside the demo-site folder. Implementation requirements: - Choose the simplest suitable stack that runs locally and is easy to inspect. - Use semantic HTML and accessible interaction patterns. - Use real copy grounded in the supplied source files. - Make all primary CTA links use this verified placeholder destination: https://your-project-name.pages.dev/ - Include a useful README inside demo-site with exact local run instructions. - Ensure the design works at desktop, tablet, and mobile widths. - Include clear keyboard focus states. - Respect prefers-reduced-motion. - Do not use remote assets that require an account, API key, or paid service. - Do not create fake testimonials, logos, member counts, or event schedules. After building: 1. Run the appropriate local validation or build checks. 2. Summarize the files created. 3. State what you verified. 4. State anything that still needs human review. Proceed with the build now.
Replace the placeholder URL with whatever your actual deploy target will be — pick it deliberately, see the deploy note below.
Use only if the first version leans on repeated card grids or reads like a template. Don't force this if the first build already varies its composition section to section.
The page is functional, but its visual rhythm is too repetitive and product-template-like. Revise the composition while preserving the strongest parts of the existing design: - Reduce repeated card grids. - Give major sections distinct layouts and pacing. - Strengthen the editorial workshop character. - Create a clearer visual journey from invitation, to value, to principles, to action. - Make the people and creative practice feel more important than the technology. - Preserve responsive behavior, accessibility, and the existing content constraints. Before editing, briefly identify the repetitive patterns you intend to change. Then implement the revision and summarize the result.
Use if the copy sounds vague, hyped, or corporate. This is the pass that catches quietly-dropped brand language and residual marketing-speak.
Audit every headline, paragraph, label, and call to action against the supplied source files. Revise the copy so it is: - Specific and concise - Conversational but intelligent - Focused on creators and real work - Honest about what the community currently offers - Free from generic AI marketing language Remove words and phrases such as unlock, unleash, revolutionize, supercharge, game-changing, 10x, cutting-edge, and limitless unless they appear in a necessary quoted context. Do not invent facts, testimonials, statistics, events, privacy guarantees, or outcomes. Preserve the approved meaning and report the most important copy changes after editing.
This is the pass that catches the one-pixel tap-target and the two-line text wrap — the stuff you'd never notice without measuring.
Audit the completed website at approximately 1440px, 1024px, 768px, 390px, and 320px viewport widths. Inspect and fix: - Horizontal overflow - Awkward text wrapping - Crowded or inconsistent spacing - Navigation behavior - Tap-target sizing - Text readability - Color contrast - Heading hierarchy - Landmark and semantic structure - Keyboard navigation and visible focus - Link and button labeling - Images or decorative graphics that need alt-text decisions - Motion when prefers-reduced-motion is enabled Do not flatten the design into a generic layout merely to make it responsive. Preserve its visual character. Run any available build or validation checks after editing. Summarize the issues found, changes made, and anything that still requires manual browser verification.
A dedicated honesty pass, separate from the copy audit — fact-checking against your source files, not just proofreading tone.
Perform a final quality review without redesigning the page. Verify: 1. Every factual claim is supported by the files in 01-project-input. 2. No fake testimonials, statistics, logos, partners, events, or guarantees appear. 3. Every primary CTA uses the approved destination. 4. There are no broken internal links or obvious console/build errors. 5. The page has one clear primary action. 6. Desktop and mobile layouts remain coherent. 7. Keyboard focus is visible and reduced-motion preferences are respected. 8. The demo-site README has accurate run instructions. Fix only clear defects. Then provide a short final report divided into Verified, Fixed, and Needs Human Review.
Four things made this work, in order of leverage.
Real source material and hard guardrails beat every clever prompt. It's the reason nothing on the finished site is invented.
Steering a plan is cheap. Steering finished code is not. The second prompt in this sequence exists entirely for this reason.
Copy against sources, a separate fact-check pass, five real screen widths — then verify the last mile yourself. An agent's report is a checklist for your own eyes, not a replacement for them.
Know exactly which project name and destination you're deploying to before you say "deploy this." Ambiguity here is where real mistakes happen.
Take one idea you've been sitting on, write one honest page of notes and one list of claims you're allowed to make, and run this same sequence. Then tell me what the AI got wrong — that's where the real skill lives.