# 6. Building a Page: The 8-Step Brief

This is the core of HypaSites. You answer an 8-step brief about your offer, audience, and design preferences, and the AI generates a complete landing page from scratch.

The brief takes about 5–10 minutes the first time. Once you know it, you can blast through it in two or three minutes.

## How to start

1. Go to **Dashboard → Projects** and open the project you want the page to live in.
2. Click **New Page** on the project's page list.

(You can also click **New Page** in the sidebar from anywhere; you'll be asked to pick a project first.)

The 8-step form opens. There's a progress bar at the top showing all eight steps. You can navigate forward and back with the **Next** and **Back** buttons.

Most fields are optional. Only **Page Name**, **Business Type**, **Page Goal**, and **Offer Description** are strictly required. The more you fill in, the more tailored the result.

## Step 1 — Page Basics

This is the foundation. The AI uses these answers to decide the page structure, copy length, and conversion strategy.

* **Page Name** (required) — Your internal name for the page (e.g. "SaaS Launch Pro"). Not shown to visitors.
* **Business Type** (required) — Pick one:
  * Physical Product (e-commerce, DTC)
  * Digital Product (courses, templates, downloads)
  * SaaS / Software
  * Service / Agency / Consulting
  * Coaching / Mentoring / Training
  * Affiliate / Referral
  * Event / Webinar / Conference
  * Nonprofit / Cause
  * Local Business (brick and mortar)
  * Other
* **Page Goal** (required) — What's the page for?
  * Lead Generation (collect emails)
  * Direct Sales (buy now)
  * Webinar / Event Registration
  * Book a Call / Demo
  * Waitlist Signup
  * Free Download / Lead Magnet
* **Offer Description** (required) — A few sentences on what you're selling, who it's for, and what the customer gets. This is the most important field in the entire brief.
* **Business Document URL** (optional) — A public link to a more detailed document (PDF, TXT, or DOCX). The AI will pull from this to round out the offer details.

## Step 2 — Audience

Tell the AI who's reading the page. Better targeting means tighter copy.

* **Traffic Sources** (multi-select) — Where the visitors are coming from. Options include Facebook Ads, Google Ads, Instagram, TikTok, YouTube, LinkedIn, Pinterest, Snapchat, X, SEO, Email, SMS, Podcast, Webinar, Affiliate, Print, Direct. Pick everything that applies.
* **Audience Age Groups** (multi-select) — 18–24, 25–34, 35–44, 45–54, 55–64, 65+.
* **Audience Lifestyle / Interests** (multi-select) — Entrepreneurs, Small Business Owners, Professionals, Corporate / B2B, Students, Parents, Retirees, Health & Fitness, Homeowners, Tradespeople, Tech-savvy, Creative, Luxury Buyers, Budget-minded, Eco-conscious, Pet Owners, Foodies, Travellers, Gamers, Beauty & Wellness.
* **Core Desire** — What does the audience want most? One sentence. (e.g. "Land their first 10 clients without cold-calling.")
* **Primary Objection** — The #1 reason a visitor would *not* buy. (e.g. "I've tried online courses before and they didn't work.")
* **Limiting Belief** — A false belief holding them back. (e.g. "I need a big audience before I can charge for this.")

## Step 3 — Offer Details

The specifics of what's on sale.

* **Offer Name** — The product/service brand name. (e.g. "The Growth Blueprint".)
* **Offer Inclusions** — What's in the offer. Add items one at a time.
* **Has Priced Product?** — Tick this if you're showing a price on the page.
* **Price** — The price as you want it displayed (e.g. "$497", "$97/mo").
* **Price Type** — One-time, monthly, per-person, etc.
* **Transformation** — The before-and-after the buyer experiences. (e.g. "From overwhelmed by admin to running on autopilot in 30 days.")
* **Is Physical Product?** — Tick this if you ship something physical. If yes, you'll see four extra fields:
  * **Shipping Info** — Where you ship, lead times.
  * **Dimensions** — Size / weight / packaging.
  * **Materials** — What it's made from.
  * **Variants** — Sizes, colours, or other choice options.

## Step 4 — Social Proof

Trust signals make pages convert. Skip this section if you don't have proof yet — the AI will adjust accordingly.

* **Has Testimonials?** — Tick if you have testimonials to include.
* **Testimonials** — For each testimonial, fill in:
  * **Name** — Who said it
  * **Quote** — What they said
  * **Title** (optional) — Their role or context
  * **Image URL** (optional) — A headshot URL
  * Use the **Add testimonial** and **Remove** buttons to manage the list.
* **Has Guarantee?** — Tick if you offer a money-back or satisfaction guarantee.
* **Guarantee Text** — Describe the guarantee. (e.g. "30-day money-back, no questions asked.")

## Step 5 — CTA & Conversion

Tell the AI what action you want visitors to take.

* **Primary CTA Action** — What clicking the button does. Examples: "Buy now", "Book a call", "Start free trial", "Download guide".
* **Primary CTA Text** — The label on the button. Defaults to "Get Started".
* **Secondary CTA Action** (optional) — A lighter alternative for visitors not ready to commit (e.g. "Watch demo video").
* **Secondary CTA Text** — Label for the secondary button.
* **Form Fields** (multi-select) — What you collect on form submit. Common picks: email, name, phone.
* **Post-actions** (multi-select) — What happens after submit:
  * Send email
  * Redirect to a thank-you page
  * Add to your list
* **Post-action Redirect URL** — Where to send the visitor after submit (if redirect is selected).
* **Calendar Link** — A booking-tool URL (e.g. Calendly, Cal.com). The AI will embed it.
* **Calendar Embed Type** — Which booking tool you use, so the AI generates the right embed code.
* **Has Urgency?** — Tick if you want a deadline / scarcity element.
* **Urgency** — Describe the urgency. (e.g. "Only 50 seats", "Doors close Friday at midnight.")

## Step 6 — Copy & Voice

Shape the writing.

* **Copy Tone** (multi-select tags) — How the page should sound. Pick 2–3 from: professional, playful, urgent, friendly, formal, casual, authoritative, warm, witty, premium.
* **Custom Phrases** — Words or phrases you want included verbatim. One per line.
* **Avoid Phrases** — Words or phrases the AI must not use.
* **Custom Headline** (optional) — A headline you've already written and want to use exactly.
* **Verbatim Copy** (optional) — A block of pre-written copy you want preserved word-for-word in the page.

If your project has a brand kit attached, voice tags and include/avoid phrases from the kit are merged with whatever you specify here.

## Step 7 — Visuals & Media

Control the look and image content.

* **Visual Vibe** — Free text describing the aesthetic. (e.g. "minimalist with bold typography", "luxurious dark theme", "vibrant and energetic".)
* **Colour Override?** — Tick to override the brand kit colours for this page only.
* **Override Primary Colour** — Hex code (e.g. `#FF4D1A`).
* **Override Accent Colour** — Hex code.
* **Labelled Images** — Specific images with labels. Each row: an image URL and a label (e.g. "Product photo", "Founder photo"). The AI uses these in specific places on the page.
* **Inspiration Images** — Images that guide the style/aesthetic. Each row: URL + a short description of why it's an inspiration.
* **Video URL** — A YouTube, Vimeo, or direct video URL to embed.
* **Reference URLs** — A list of competitor or inspiration page URLs. Free-text, one per line.
* **Embed Codes** — Custom HTML embeds (e.g. third-party widgets, chatbots). Each row: the embed code, where it should go on the page, and a label.

## Step 8 — Technical & SEO

Final technical settings.

* **Domain Type** — Pick **HypaSites subdomain** (default) or **Custom domain** (only available if your project has a verified custom domain).
* **URL Path** — The slug part of the URL (e.g. `pricing`, `start`). Leave blank for auto-generated.
* **Meta Title** — Page title for search engines and the browser tab (50–60 characters).
* **Meta Description** — Search-result snippet (150–160 characters).
* **Meta Keywords** — Optional comma-separated keywords.
* **SEO Density** — How aggressively to optimise for keywords: conservative, balanced (default), or aggressive.
* **OG Image URL** — The image shown when the page is shared on social media.
* **Canonical URL** — If this page is a copy or syndication of another, the canonical original URL.
* **No-index** — Tick to tell search engines not to index this page (useful for ad-only landing pages).
* **Structured Data** — Tick to add JSON-LD structured data (default on). Helps rich search results.
* **Tracking Pixel** — A pixel ID for ad-platform tracking (e.g. Facebook Pixel ID).
* **Has Tracking** — Tick to inject the tracking pixel.
* **Cookie Banner** — Tick to add a GDPR/CCPA-compliant cookie consent banner.
* **Custom Scripts** — Any extra `<script>` tags you want in the page head.
* **Is A/B Test?** — Tick if this page is a variant of another page (for tracking and reporting purposes).
* **Page Speed Priority** — How aggressively to optimise for speed: conservative (heavier visuals), balanced (default), aggressive (minimal weight).

## Submitting the brief

At the end of Step 8 you'll see a **Generate Page** button.

If you have more than one site remaining on your quota — or you're on Scale Without Limits — you'll also see a **Generate as a batch** section above the button with a **Variants** number input. This lets you generate up to **100 different versions** of the page from the same brief in a single batch. The AI is told to make each version structurally distinct — different layout, palette, typography, and copy angle. Useful for A/B testing or picking the best version after the fact.

When the variants count is greater than 1, the submit button changes to **Generate X variants**. Click it to submit.

## What happens next

You're redirected to a generating screen showing a spinner and the page name. The AI takes roughly 1–3 minutes per page for a single generation. Bulk generations run in parallel — 10 pages typically takes the same time as one.

The screen auto-refreshes every couple of seconds. When generation is done, you're redirected to the page preview (Chapter 7).

If you want to leave and come back, you can — generations run in the background. Your pages list will show "Generating…" status until they're done.

## Generation costs

On **Build**, **Standard**, or **Scale**, generation cost is included — there's no extra charge per page, just the site quota.

On **Scale Without Limits**, every generation bills to your connected Anthropic API key (roughly $0.30 USD per page, depending on output length).

## Common questions

**Can I skip steps?** You can leave any field blank except the four required ones in Step 1. You don't have to advance through steps you don't care about — just leave them empty.

**What if the page comes out wrong?** Edit it (Chapter 7) or regenerate it. Both are unlimited on every plan.

**Can I save a draft?** Yes — once you submit, a page record exists. If generation fails, the draft sticks around and you can resubmit from the page detail screen.

**Can I copy a brief from one page to another?** Not directly yet. Best workflow today: regenerate from an existing page, then edit the brief in-place.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://hypasites.gitbook.io/hypasites-docs/user-guide/06-building-a-page.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.