The AI Web
Page brief logo

Skills

Page brief

Turn a rough page idea into a brief you can hand to a builder, or to Claude: who it is for, what sections it needs, and what each one has to say.

updated 10 Aug·Claude Code skill, one file, no dependencies

What you copy

Three ways to install it, the one that needs no terminal first. The file itself is folded underneath, if you would rather read it before you take it.

Paste this into Claude Code. It fetches the file and puts it in .claude/skills/page-brief for you. Then type /page-brief.

Install the Claude Code skill from https://www.theaiweb.co/skills/page-brief/SKILL.md. Fetch that URL and save its contents unchanged as .claude/skills/page-brief/SKILL.md in this project, creating the folder if it does not exist. Then confirm it is ready to use as /page-brief.

1---
2name: page-brief
3description: Turn a rough page idea into a build-ready brief - audience, the
4 problem they arrive with, sections, copy candidates and the components that
5 do not exist yet. Use when someone asks for a new landing, product or pricing
6 page and the goal, audience or sections are still vague.
7argument-hint: [the page idea, in a sentence]
8---
9
10# Page brief
11
12A brief is what stops a page being designed twice. This turns a rough idea into
13something a builder, or Claude, can act on without coming back.
14
15## 1. Find what the project already knows
16
17Before asking anyone anything, read what is here. Look for an ICP or audience
18file, customer problem notes, research, past briefs, analytics or search data,
19and the existing pages. Every answer you find is a question you do not have to
20ask.
21
22Say what you found and what it told you. A brief built on a file nobody
23remembers writing is still better than a brief built on a guess.
24
25## 2. Ask for the rest, in one go
26
27Ask three or four questions together, not one at a time, and only for what you
28could not find above.
29
30- **Who is this page for?** A segment, a role, a moment - not "customers".
31- **What problem are they arriving with?** In their words if you have them:
32 sales calls, support tickets, reviews, search queries. This is the answer the
33 whole brief rests on.
34- **What should happen next?** One action. If there are two, say which one
35 loses.
36- **What can I read?** Files, links, docs, a competitor page they like, an old
37 draft, the deck this came from. Ask for the messy version, not a summary.
38
39If the answers come back thin, do not write around the gap. Name the part of
40the brief that is a guess and ask for that one thing again.
41
42## 3. Read the site before deciding anything
43
44Read the existing pages for voice, section rhythm and the component set already
45in use. A brief that invents a layout the site cannot build is a brief that
46turns into a redesign.
47
48## 4. Write the brief
49
501. Name the page's single job in one sentence. If it has two jobs, split it
51 into two pages and say so.
522. State the reader's problem and what they believe before they land.
533. Draft the section list. For each one: the reader's question, the answer, the
54 proof, the next action.
554. Write the headline three ways - plain, specific, and short - and pick one.
56 Say why.
575. List every component the page needs that does not exist yet.
586. Note what you could not answer, and who can.
59
60## Rules
61
62Output the brief as markdown. No lorem, use real copy candidates.
63Never invent numbers, metrics, customer names or quotes. If a proof point is
64missing, write [PROOF NEEDED] and keep going.

Free to use in your own work, paid work included, no attribution required. Not for repackaging into a product you sell. Full terms.

Recent links about Page brief

All links
Taggedclaude codeplanningcopy

More in skills

Back to every skills entry.