← Resources

Templates

Website creative brief template

The website creative brief template - copy-paste-ready structure for web design and redesign projects, plus three worked examples across landing page, marketing site, and ecommerce.

Updated

The template

The structure to copy and adapt

  • Project codename + scopeRequired
    Internal codename + scope type. 'OR-2026-WEB-REBRAND - full marketing site redesign, 14 pages'. Scope type sets expectations for both effort and design freedom.
  • Business objective + primary KPIRequired
    One outcome + one metric + measurement window. 'Increase demo-booking conversion from 1.2% to 2.5% over 90 days post-launch.' Vague objectives produce design-by-committee.
  • Primary audience + jobs-to-be-doneRequired
    Who shows up and what they're trying to accomplish in one sentence. 'VPs of RevOps evaluating whether we can replace 3 tools they currently use.' JTBD shapes information hierarchy.
  • Page map (hierarchical)Required
    Every page in scope. Mark net-new vs migrating vs deprecating. Mark which pages get custom design vs template-based.
  • Primary CTA per page typeRequired
    One primary CTA per page. Home → demo. Pricing → trial. Case study → demo. Pages with 3 competing CTAs convert worse than pages with 1.
  • Content inventory matrixRequired
    What exists, what needs writing, what needs migrating, what needs net-new media. Content gaps drive timeline more than design.
  • Brand & visual constraintsRequired
    Brand guidelines reference (palette, type, photography), accessibility level (WCAG 2.2 AA preferred), performance targets (LCP, CLS), responsive breakpoints (360px - 1920px).
  • Do-nots (5-7 explicit)Required
    Web-specific exclusions. 'No carousels on home. No modal popups on first visit. No stock illustration. No autoplay video with sound. No accordion FAQs without anchor links.'
  • Tech & integration constraints
    CMS, framework, hosting, analytics, CRM, marketing automation, chat. Constraints designers and devs need up front, not in week 3.

Filled-in examples

See the template in use

Full B2B SaaS marketing site redesign · B2B SaaS

  • Project codename + scopeOR-2026-WEB-REBRAND. Full marketing site redesign, 14 pages. Product app and customer dashboard out of scope.
  • Business objectiveIncrease demo-booking conversion from 1.2% to 2.5% over 90 days post-launch. Reposition perception from 'forecasting tool' to 'RevOps platform' - measured via brand survey delta at 6 months.
  • Primary audience + JTBDVPs of RevOps at $5M-50M ARR SaaS evaluating consolidation. JTBD: 'Help me understand if you can actually replace the 3 tools I'm using now without a 6-month implementation.'
  • Page mapHome (net new, custom). Product > Platform (net new, custom), Forecasting (migrating, refresh), Integrations (net new, custom), Workflows (net new, template). Pricing (refresh, custom). Customers > Case studies (migrating, template), Logo wall (net new, custom). Resources > Blog (migrating, template), Guides (net new, template). Company (refresh, template).
  • Primary CTAHome → 'Book a demo'. Product pages → 'See it in your stack'. Pricing → 'Start free trial' + 'Talk to sales'. Customers → 'Read case study' → 'Book a demo'. Resources → email gate on guides only.
  • Content inventoryNet new copy: home, all product pages, integrations matrix, 6 case studies. Migrating: 30 blog posts, 8 case studies. Net new photography: product screenshots (blocked on app v3). Existing: brand photography assets (1,200 in library).
  • Brand & visual constraintsPer Orbital brand v2. WCAG 2.2 AA. LCP under 2.0s on 4G, CLS under 0.1. Responsive 360px-1920px. Browsers: Chrome, Safari, Firefox, Edge (last 2 versions).
  • Do-notsNo carousels on home. No modal popups on first visit. No stock illustration. No 'reimagine the way you...' opener. No 'industry-leading' boilerplate. No accordion FAQs without anchor links. No autoplay video with sound.

Shuttergen

Web briefs stay human - ad briefs are Shuttergen's job.

Page maps, primary CTA tradeoffs, content inventory - all better done by humans who know the product. Shuttergen doesn't generate web briefs. For the paid social and search briefs that drive traffic to your new site, it's the right tool.

Generate paid traffic briefs freeTry the live builder →

How to use this template

Copy the structure; write content fresh per project. The nine required fields above transfer across web projects; the content inside each field has to be re-derived per project. A landing page brief and a marketing site redesign brief use the same structure but produce very different content.

Fill in order: scope → objective → audience → page map → CTA → content inventory → constraints → do-nots → tech. The order matters. Scope defines what fields apply (a landing page brief skips most of the page map field). Objective constrains audience focus. Audience constrains page map structure. Page map drives content inventory.

Lock the brief before design starts. Briefs that change during wireframes produce designs that hedge between two directions. If the page map is wrong, fix the brief first; don't try to redesign in week 4.

Web briefs stay human - ad briefs are Shuttergen's job. Page maps, primary CTA tradeoffs, content inventory - all better done by humans who know the product. Shuttergen doesn't generate web briefs. For the paid social and search briefs that drive traffic to your new site, it's the right tool.

Generate paid traffic briefs free

Page map - the field that shapes scope

List every page hierarchically. Don't list only top-level nav; list every page that will exist post-launch. Mark net-new vs migrating vs deprecating. The page map drives scope conversations with stakeholders before design starts, not after.

Mark custom-designed vs template-based pages. A 14-page site might have 3 custom designs (home, product overview, pricing) and 11 template-based pages (case studies, blog posts, team bios). Brief the template count up front so the design team scopes accordingly.

Deprecating pages need a redirect plan. Pages that go away need 301 redirects to preserve SEO equity. Brief this up front; redirect surprises lose 6-figure ranking value.

Content inventory - the field that drives timeline

Most website projects slip on content, not design. Designers can produce wireframes in week 2; copy that hasn't been written yet blocks the project at week 6. Brief the content inventory up front so writing and shooting tracks run in parallel with design.

Net-new content needs an owner and a date. Don't write 'TBD' for any net-new content piece. Name the person responsible and the target date. Without ownership, content slips by default.

Photography and video are the longest-lead content items. Net-new product photography typically takes 3-6 weeks (concept, shoot day, post). Net-new ambassador video takes 6-10 weeks (casting, contracts, shoot, post). Brief these as critical-path items, not assumed deliverables.

Internal: website creative brief, graphic design creative brief, creative brief template.

FAQ

Frequently asked

Can I download this website creative brief template?
Yes - hit 'Download .md' on the template card above. Markdown format imports cleanly into Notion, Google Docs, Word, or any text editor. Customize the page map, primary CTAs, and do-nots per project.
Is this website brief template free?
Yes - free, copy-paste-ready, no email gate. Use it for client work, in-house projects, or anything else without restriction.
How is this different from a generic creative brief template?
Four added required fields: page map (hierarchical), primary CTA per page type, content inventory matrix, and brand + visual + accessibility + performance constraints. Generic creative briefs define what the asset says; website briefs also define what pages exist and how they're built.
Do I need this template for a single landing page?
Yes - the structure scales down well. A landing page brief uses the same fields but the page map shrinks to a section list and the content inventory shrinks proportionally. The Aurora landing page example above is the right size for single-page briefs.
How long should a website creative brief be?
2-3 pages for landing pages or partial refreshes. 3-5 pages for full redesigns because of the page map and content inventory. Anything longer signals you're writing the project plan, not the brief.
Should the website brief specify the CMS?
Yes - the tech & integration constraints field covers CMS, framework, hosting, analytics, CRM, and chat. Designers and devs need to know up front whether they're working in Webflow, Sanity + Next.js, WordPress, Shopify, or a custom stack.
What's the most expensive field to get wrong?
Content inventory. Designers can ship a 14-page site in 6 weeks if copy and photography are ready. The same project takes 16 weeks if content has to be created in parallel with design. Brief the content inventory honestly; don't underestimate what's net-new.

Related

Keep reading

Resource

Website creative brief

Primer on what website briefs include.

Resource

Graphic design creative brief template

Design-focused template.

Resource

Creative brief template

The general template.

Resource

Branding creative brief

Brand-equity brief that feeds web work.

Research

Creative Brief Builder

The Shuttergen brief workflow.

Web briefs stay human - ad briefs are Shuttergen's job.

Page maps, primary CTA tradeoffs, content inventory - all better done by humans who know the product. Shuttergen doesn't generate web briefs. For the paid social and search briefs that drive traffic to your new site, it's the right tool.

Generate paid traffic briefs freeTry the live builder →