STEP 01
Client Info
Basic company information.
HVAC
Roofing
Remodeling
Plumbing
Solar
Electrical
Landscaping
Painting
Other
STEP 02
Brand
Colors, fonts, and feel. Hex codes and Google Font names.
Premium / clean
Blue-collar / tough
Modern / tech
Warm / friendly
Design direction โ optional, skip if you're short on time
These help Claude make better design choices. None are required.
Light
Dark
Mixed
Rounded & soft
Sharp & structured
Spacious
Dense
Full-bleed
Contained
Bold
Subtle
Minimal
Loud
This is a mood reference, NOT a template. Claude picks up on the vibe โ color usage, layout density, typography energy โ without copying the design. Crop to the hero + one section for best results.
Inspiration screenshot
Full-page screenshot of their current homepage
SVG preferred, high-res PNG accepted
STEP 03
CTA & Form
What the page is asking visitors to do, and how the form works.
Built-in form on page
Typeform embed (separate page)
Redirect to external URL
Claude Code builds the form directly into the landing page. CTA scrolls down to the form section.
Name
Phone
Email
Service needed
ZIP code
Address
Message
Preferred date
Thank you message
Redirect to URL
STEP 04
Social Proof
Numbers and stats that go in the hero and trust bar.
STEP 05
Page Copy
Upload your copy doc. Sections should be labeled (Hero Headline, Trust Bar, How It Works, etc.)
Drop your copy doc here โ .md, .docx, .txt, or .pdf
Sections your copy doc should include:
Pencil Banner Offer ยท Hero Headline ยท Hero Subhead ยท Hero Value Props ยท
Special Offer (headline + description) ยท Trust Bar Stats ยท
Work Showcase Captions (if applicable) ยท Why Us (benefits + comparison) ยท
Testimonials (if static) ยท How It Works (3 steps) ยท Services List ยท
Service Area Cities ยท FAQ (5+) ยท Final CTA ยท Footer Info
STEP 06
Photos & Assets
Upload the hero image, then add everything else with a short label so Claude knows what it is.
Main image โ jobsite, finished project, team, storefront (min 1200px wide)
All other photos
Upload as many as you want. Give each one a short label so Claude knows what it is and where to use it. Examples: "owner headshot," "finished roof project," "before kitchen," "after kitchen," "team photo," "truck with wrap."
Drop all badge/certification logos here
STEP 07
Embeds & Tracking
Review display, embed codes, and tracking IDs.
Static testimonials (from copy)
Review widget embed
Testimonials will be pulled from your copy doc and displayed as styled cards. Make sure your copy includes reviewer names, quotes, and any context (service type, location).
Other embeds
Any additional embed codes that aren't the review widget.
Google Tag Manager
Paste both GTM snippets below. GA4, Meta Pixel, and all other tags are managed inside GTM โ no need to add them separately.
STEP 08
Review & Generate
Confirm everything looks right, then download your project folder.