The Challenge
Marcus needed a landing page for his new online course. A developer quoted him $3,000 and 2 weeks. He decided to try AI instead.
The Process
Step 1: Copywriting (30 min)
Prompt: "You are a conversion-focused copywriter. Write landing page copy for [course name]. Include: hero headline, subheadline, 3 benefit sections, social proof section, FAQ section, and CTA."
Result: 800 words of structured copy, ready to paste.
Step 2: HTML/CSS (45 min)
Prompt: "Convert this copy into a responsive HTML landing page. Use Tailwind CSS. Make it mobile-first. Include smooth scrolling, a sticky CTA button, and proper SEO meta tags."
Result: Clean, deployable HTML file.
Step 3: Refinement (30 min)
Iterated on specific sections: "Make the hero section more compelling. Add a gradient background. Make the CTA button bigger and change the color to orange."
Step 4: Polish (15 min)
"Add Google Analytics tracking code. Add a favicon. Make the page load under 2 seconds."
The Result
- Time: 2 hours total
- Cost: $0 (Claude free tier)
- Quality: Passed review by a professional designer who estimated it looked like a $2,000 job
- Conversion: 12% sign-up rate in the first week (industry average: 4-8%)
What Worked Well
- Claude's long context handled the full page at once
- Iterative refinement was faster than manual editing
- The AI suggested improvements Marcus hadn't considered (sticky CTA, mobile-first)
What Didn't Work
- First draft images were generic — Marcus replaced with his own photos
- The FAQ answers were too long — needed manual trimming
- Font choices were safe but boring — Marcus swapped to a more distinctive pair
Key Takeaway
AI won't replace a senior developer for complex projects. But for a functional, good-looking landing page? It's genuinely viable today.
Try It
Browse our coding prompts for similar HTML/CSS generation prompts.