WebsiteChatGPT

Full Website Design Brief

End-to-end homepage with hero, features, testimonials, pricing, and footer — annotated section by section.

#web #design #landing-page

Customise your prompt— optional, prompts work as-is

SAAS PRODUCT TYPE

TARGET AUDIENCE

Full Prompt

You are a senior web designer with 12 years of experience building conversion-optimised websites. Design a complete, production-ready website for a [SAAS PRODUCT TYPE] targeting [TARGET AUDIENCE].

Include the following sections in full detail:

1. HERO SECTION
• Bold, benefit-led headline (not a tagline — tell them what they get)
• Supporting subheading that handles the main objection
• Primary CTA button with exact label copy
• Product screenshot mockup description (what's shown on screen, device framing)
• Background treatment and visual hierarchy

2. SOCIAL PROOF BAR
• 5 recognisable logo placeholders with spacing and sizing rules
• Intro line above the bar (e.g. "Trusted by teams at...")

3. FEATURES SECTION (3-column)
• Icon style and size recommendation
• Feature title (max 4 words) + 2-line description for each of 6 features
• Section headline and subheading copy

4. TESTIMONIALS SECTION
• Carousel layout with avatar, full name, job title, company, and quote
• Quote length guidance (40–60 words each)
• Navigation dots/arrows design

5. PRICING TABLE (3 tiers)
• Tier names and recommended price anchoring strategy
• Feature comparison rows with check/cross icons
• Highlighted recommended plan treatment
• CTA button per plan

6. FOOTER
• Navigation link groups (4 columns)
• Newsletter signup with input and button
• Social media icons row
• Legal links and copyright line

DESIGN SPECIFICATIONS:
• Exact hex color palette (primary, secondary, accent, background, text)
• Google Font pairings (heading + body) with weights
• Spacing system (8px grid — list the scale: 8, 16, 24, 32, 48, 64, 96)
• Component hierarchy and z-index structure
• Responsive behaviour notes for mobile breakpoint