Watch on YouTube: https://www.youtube.com/watch?v=mImbbszCjCI
Channel: Nate Herk | AI Automation
Introduction: AI Websites That Actually Convert
Nate Herk of AI Automation reviewed 10,000 AI-built websites to find out which design and copy patterns make them effective enough to sell to local businesses for around $1,000. The core finding is that conversion does not come from flashy AI effects or generic templates. It comes from a small set of repeatable choices around messaging, color, layout depth, motion, and interactive value. For freelancers and agencies offering website builds, these patterns offer a practical checklist before handing a site to a client.
When the right visitor lands on your first screen, it should feel like they’re looking in a mirror.
What the Analysis Covered
Herk’s study looked at AI-generated websites across industries and identified five recurring patterns in the ones that performed well. He frames the opportunity around a $1,000 website price point—sites that are affordable for small businesses but profitable enough to build efficiently with AI-assisted workflows. The patterns are not theoretical; they are backed by examples and case studies from brands and agencies.
Pattern One: The Mirror Test
The first screen of a website must pass the “mirror test.” In practical terms, the hero section needs to answer three questions immediately: who the site is for, what the visitor gets, and what to do next. Herk recommends drafting this copy in Claude before opening a design tool, so the messaging is settled before layout decisions are made.
Pattern Two: The Highlighter Rule and 60-30-10 Color
Color should direct attention, not decorate. Herk advises following the 60-30-10 rule: 60 percent dominant color, 30 percent secondary, and 10 percent accent. The accent color—the “highlighter”—should appear only on buttons and links. If every line is highlighted, nothing is highlighted. Coolors is suggested for building palettes that fit this structure.
Pattern Three: Front, Middle, Back
Flat boxes make AI sites look cheap. To create depth, Herk recommends layering each screen into back, middle, and front elements: a background layer, a content layer, and a CTA layer. A soft shadow on the primary CTA button is one small detail that helps the button separate from the page and feel clickable.
Pattern Four: Motion With a Job
Scroll animation should not be decorative. Every animation must earn its spot by doing one job. Herk suggests limiting motion to one moving element per screen and ensuring headlines are readable immediately on load, without waiting for an animation to finish. Sites should also respect reduced-motion settings so visitors with motion sensitivity are not excluded. The underlying point is that business clients do not want a movie; they want more customers.
Pattern Five: Offer a Free Sample
People value things more when they help make them. Herk recommends adding a quiz, price estimator, or calculator that lets visitors experience a result before contacting the business. The tool should be based on the top question customers ask before buying. Outgrow is cited as one platform for building these calculators, and Claude can be used to build and embed the tool on the site.
Case Studies and Numbers
The notes reference several real-world results that illustrate why these patterns matter:
- Truckers Report: improved 79.3 percent from a 12.1 percent baseline.
- City Click: 90 percent increase in pricing-page click-throughs.
- Campaign Monitor: 31.4 percent more signups from a one-word headline change.
- Doc Braces: approximately 45 percent conversion using a calculator built with Outgrow.
These examples span different industries and tactics, but they share a theme: small, intentional changes to messaging or interactivity produced measurable shifts in clicks, signups, and conversions.
Tools and Workflow
- Claude: for drafting homepage copy and building value-add tools before design.
- Coolors: for generating 60-30-10 color palettes.
- Scrollcraft: for scroll-driven animations that follow the one-moving-element rule.
- Outgrow: for calculators and interactive tools.
Apple AirPods Pro, Wise, Zillow, Sherwin-Williams, and Amazon are mentioned as reference examples for layout, motion, and utility, though the notes do not break down specific metrics for each.
Caveats and Hype Check
The video promotes the idea that AI websites can be sold to businesses for $1,000 and references a free Scrollcraft skill plus other website-building content. However, it does not provide viewer income proof or verified student results beyond the agency case studies listed above. The $1,000 price point should be treated as a positioning example, not a guaranteed rate. Results will depend on the niche, the quality of the copy, and whether the free sample tool genuinely solves a visitor’s question.
Concrete Next Actions
- Write homepage copy that answers who the site is for, what the visitor gets, and the next step; run it through Claude before designing.
- Choose a 60-30-10 palette on Coolors and restrict the accent color to buttons and links only.
- Rebuild the hero section with back, middle, and front layers, and add a soft shadow to the primary CTA button.
- Limit scroll animations to one moving element per screen and confirm headlines are readable on load.
- Add a free sample tool—quiz, price estimator, or calculator—based on the top pre-purchase question customers ask.
- Ask Claude to build and embed that value-add tool on the site.
Taken together, these five patterns give AI-built websites a structure that looks intentional rather than generated. The opportunity is not in using AI to build pages faster, but in using AI to apply proven conversion principles consistently across every client site.