Design Handoff · Mark Squire Roof Restorations

For: designer / OD agent / build operator
Read top-to-bottom before designing. Every section labeled with provenance:
- ✓ verified:* — from customer's site or trusted API · do not paraphrase
- 🤖 ai-completed:* — LLM-generated from real signals · may polish · keep facts
- ⚠ niche-typical:* — fallback default · should be replaced if real data available later
- ⚡ mixed:* — partially verified + partially AI-completed
>
Generated: 2026-05-17T02:48:22.311Z · slug: mark-squire-roof-restorations
Provenance summary: 21 fields · ✓ 0 verified · 🤖 3 ai · ⚠ 0 niche-fallback · ⚡ 0 mixed

1. Business · LOCKED facts (verbatim · never paraphrase)

FieldValueSource
Business nameMark Squire Roof Restorations✓ gbp
Phone0400 058 842✓ gbp
Phone tel: linktel:0400058842✓ gbp
Email(none)✓ gbp
Address4 Eureka Terrace, Ballarat East VIC 3350, Australia✓ gbp
CityBallarat✓ gbp
StateVIC✓ gbp
Nicheroofer✓ gbp
Rating5★ (3 reviews)✓ gbp
Google Mapshttps://maps.google.com/?cid=590050035974156618✓ gbp
Rule: every field above must appear in the final website verbatim. No paraphrasing of business name. No formatting changes to phone. Address as one string.

2. Existing visual identity (brand kit)

Skill used: logo-design (new logo) · no website existed for this business — designed fresh logo from intake brief

primary logo

Variants (all in design/brand/):

Color tokens 🤖 logo-design-skill

TokenHex
brand_primary#1F232B
brand_secondary#3A5A6B
brand_accent#C68C3F
surface#FFFFFF
surface_muted#FAF6EE
text#1F232B
text_muted#5A5C61
border#E4DFD2
Typography

Brand personality: honest regional trade, owner-operator, restoration-specialist, workmanlike, heritage-credible (not luxury)

Avoid: No corporate-trade gradient/icon-pack cliché. No badges with 'EST. YEAR' unless the year is verified. No condensed italic display fonts. No luxury jewellery palette (no rich purples / golds beyond a quiet ochre).

Full visual style contract (click to expand)

Mark Squire Roof Restorations Website Visual Style Contract

Boundary

This contract defines brand direction and visual guardrails. It does not design the final UI, page structure, component layouts, breakpoints, or frontend implementation.

Brand Reading

Read the logo first: weight, typography, geometry, color, and personality should drive the website's visual system.

Overall Style Direction

Style: clean local business

The website should feel honest regional trade, owner-operator, restoration-specialist, workmanlike, heritage-credible (not luxury).

Avoid: No corporate-trade gradient/icon-pack cliché. No badges with 'EST. YEAR' unless the year is verified. No condensed italic display fonts. No luxury jewellery palette (no rich purples / golds beyond a quiet ochre).

Color Boundaries

```css :root { --brand-primary: #1F232B; --brand-secondary: #3A5A6B; --brand-accent: #C68C3F; --surface: #FFFFFF; --surface-muted: #FAF6EE; --surface-dark: #111111; --text: #1F232B; --text-muted: #5A5C61; --border: #E4DFD2; } ```

Color rules:

Logo Usage Boundaries

Typography

Layout Density

Density: medium/service-focused

Keep pages scannable, practical, and aligned with the brand's level of polish.

Shape Language

Use shapes, radius, borders, and line weights that match the logo geometry.

Header System

Protect logo visibility and avoid typography/color choices that compete with it. Do not prescribe exact header layout here.

Local business contact rule: Desktop header should expose phone or primary contact action. Mobile header should prioritize call, quote, or menu based on conversion need.

Footer System

Footer should preserve the logo as the primary brand object, with readable links and restrained CTA/contact treatment.

Buttons And CTA

Primary CTA: solid brand-primary #1F232B, white text, 3px corner radius (slightly softer than VIP's sharp corners — owner-friendly feel). Secondary: outlined steel-blue border. Hover: 10% darker.

Cards And Forms

Soft corners (4px). 1px #E4DFD2 border (warm beige border, not cold gray — matches cream surface). Drop shadow optional and very subtle.

Imagery Direction

Real Ballarat-area before/after restoration photography. Owner-on-site shots. Avoid stock crew handshakes; show actual work and the owner where appropriate.

Icon Style

Slab-aligned line icons, 1.5–2px stroke, with optional rounded terminals (softer than VIP's). Restoration cues: ridge cap, paint roller, gutter, tile/metal sample, ladder.

Section Backgrounds

Alternate white #FFFFFF and warm cream #FAF6EE — that cream signals regional / honest / non-corporate. One hero section per page with overlay imagery.

Motion And Interaction

Use subtle, purposeful interactions. Avoid animations that fight the brand tone or delay conversion actions.

Responsive Behavior

Define when full logo switches to mark-only, and protect logo visibility in mobile header/footer.

Do / Don't

Do:

Do not:

Website Agent Prompt

```text Use the supplied Mark Squire MS monogram with its steel-blue ridge-cap apex in the M's valley exactly as drawn — that ridge-cap is the brand's signature element. Brand reads as regional owner-operator, restoration-focused, slab-serif credible (think trade heritage, not luxury). Use #1F232B as primary, #3A5A6B as secondary (corrugated steel blue-gray — accent for ridge cap and supporting elements), and warm cream #FAF6EE as surface-muted alternative. Slab serif headings; sans body. Maintain owner-personal voice; no corporate-trade clichés. ```

3. Real content (Phase B extraction)

3a. Services (B1)

Roof Restoration [?]

Roof Repair [?]

Gutter Replacement [?]

Gutter Guard [?]

Metal Roofing [?]

3b. About narrative (B2)

About Mark Squire Roof Restorations

Mark Squire Roof Restorations 是 Ballarat 的本地 roofer。 Google 评分: 5★ · 3 条评论。

备注

MVP 阶段 · 这段为 niche typical + 硬数据综合 · LLM 综合升级见 V3-HANDOFF-STRUCTURE Phase B (Cascade A 调用)。

3c. Hero copy (B3) — 3 candidates

Candidate 1 · [service-led] 🤖 claude:claude-sonnet-4-5

Candidate 2 · [urgency-led]RECOMMENDED 🤖 claude:claude-sonnet-4-5

Candidate 3 · [trust-led] 🤖 claude:claude-sonnet-4-5

3d. FAQ (niche-typical · 4-6 questions)

A: Free quote · pricing depends on damage extent · we provide written estimates within 24 hours. A: Yes · we hold a current Queensland Building and Construction Commission license · public record at ABR. A: Yes · no obligation site visit · written quote within 24 hours. A: Typically 2-5 days depending on roof size and weather · we keep you updated throughout. A: All workmanship guaranteed · Colorbond materials carry manufacturer warranties up to 36 years. A: Yes · we work directly with insurance companies for storm/hail damage claims.

4. Site architecture (B4 + B6)

14 pages · 5 service · 4 area Source: ? · long-tail coverage: ?

SlugTypePurposeH1Bound imagesSource
/homehero + 3 services + reviews + trust + map + CTA[?]
/roof-restorationservice[?]
/roof-repairservice[?]
/gutter-replacementservice[?]
/gutter-guardservice[?]
/metal-roofingservice[?]
/roofer-ballaratarea[?]
/roofer-ballarat-cbdarea[?]
/roofer-ballarat-northsidearea[?]
/roofer-ballarat-southsidearea[?]
/aboutaboutcompany story + ABN + license · trust 集中[?]
/reviewsreviews3 reviews aggregator[?]
/contactcontactform + tel + map[?]

5. Image assets (B5 vision classify + B6 page bindings)

⚠️ No customer images available · build will use template stock or generated SVG/AI.

7. Boundaries — what you CANNOT do

商家硬数据 (verbatim · 一字不改 · Mark Squire Roof Restorations)

不许做的

详见 docs/v4/DATA-PRESERVATION-CONTRACT.md

10. Market context (Phase E1 · Tinyfish search · external mentions)

Read this before designing copy · understand competitive positioning + how the business shows up across the AU web.

External mentions (AU-filtered) ✓ tinyfish:search

#TitleDomainSnippet
1[Mark Squire Roof Restorations - Yellow Pages](https://www.yellowpages.com.au/ballarat-east-vic/bpp/mark-squire-roof-restorations-580292534)www.yellowpages.com.au
2[MARK SQUIRE ROOF RESTORATIONS in 4 Eureka ... - Localsearch](https://www.localsearch.com.au/profile/mark-squire-roof-restorations/ballarat-vic-3353/MPp0)www.localsearch.com.au
3[Mark Squire Roof Restorations - Roofers in Ballarat East, 33](https://servicetasker.com.au/business/mark-squire-roof-restorations)servicetasker.com.au
4[30 Best Local Roof Cleaning in Ballarat Central, VIC 3350 \](https://www.whereis.com/ballarat-central-vic-3350/roof-cleaning)www.whereis.com
5[Ballarat Roof Restoration \Repair, Repointing, Gutters, Pa](https://localroofrestoration.com.au/services/ballarat-vic-3350/)localroofrestoration.com.au

12. Per-page section-by-section design (Phase E3 · LLM-designed)

13 pages · 86 total sections · generated via locked combo per lab run.

Page · / 🤖 claude:claude-sonnet-4-5

Section 1 · hero — Ballarat Roof Restorations That Last

Section 2 · services_grid — What We Do

Section 3 · trust_signals — Why Ballarat Calls Mark Squire

Section 4 · reviews — What Ballarat Homeowners Say

Section 5 · map — Servicing Ballarat & Surrounds

Section 6 · about — Mark Squire · Ballarat Roofer

Section 7 · cta_banner — Roof Needs Work? Let's Sort It.

Page · /roof-restoration 🤖 claude:claude-sonnet-4-5

Section 1 · hero — Roof Restoration That Lasts

Section 2 · process — What Full Restoration Includes

Section 3 · content_block — When to Restore vs Replace

Section 4 · content_block — Why Ballarat Roofs Need Restoration

Section 5 · content_block — Materials We Use

Section 6 · credentials — 20+ Years in Ballarat

Section 7 · cta_block — Get a Free Roof Inspection

Page · /roof-repair 🤖 claude:claude-sonnet-4-5

Section 1 · hero — Roof Repairs That Stop Leaks for Good

Section 2 · service-list — Roof Problems We Fix

Section 3 · process-steps — How We Work

Section 4 · credibility — Why Ballarat Homeowners Call Us

Section 5 · urgency-trigger — When to Get Your Roof Checked

Section 6 · location — Servicing Ballarat & Surrounds

Section 7 · cta-block — Get a Free Roof Repair Quote

Page · /gutter-replacement 🤖 claude:claude-sonnet-4-5

Section 1 · hero — New Gutters That Actually Work

Section 2 · problem — When Gutters Need Replacing (Not Just Patching)

Section 3 · options — Colorbond or Zincalume—Both Last 20+ Years

Section 4 · process — How We Replace Your Gutters

Section 5 · credentials — Why Ballarat Homeowners Call Mark Squire

Section 6 · location — Serving Ballarat and Surrounds

Section 7 · cta — Get a Gutter Replacement Quote

Page · /gutter-guard 🤖 claude:claude-sonnet-4-5

Section 1 · hero — Gutter Guard Installation in Ballarat

Section 2 · problem-solution — Why Ballarat Homes Need Gutter Guard

Section 3 · service-details — What We Install

Section 4 · process — How It Works

Section 5 · trust — Ballarat Roofer Since 2008

Section 6 · related-services — Other Gutter Services

Section 7 · cta — Get a Gutter Guard Quote

Page · /metal-roofing 🤖 claude:claude-sonnet-4-5

Section 1 · hero — Metal Roofing Installation in Ballarat

Section 2 · service_details — What We Install

Section 3 · process — How a Metal Roof Install Works

Section 4 · project_types — Residential and Commercial Projects

Section 5 · education — Why Choose Metal Roofing

Section 6 · trust — 25+ Years Installing Roofs in Ballarat

Section 7 · cta — Get a Metal Roofing Quote

Page · /roofer-ballarat 🤖 claude:claude-sonnet-4-5

Section 1 · hero — Ballarat Roofer – Repairs, Restorations & Metal Roofing

Section 2 · services_list — Roofing Services in Ballarat

Section 3 · text_block — Why Choose a Local Ballarat Roofer

Section 4 · text_block — Service Area

Section 5 · process_steps — How We Work

Section 6 · text_block — Materials We Use

Section 7 · cta_block — Need a Roofer in Ballarat?

Page · /roofer-ballarat-cbd 🤖 claude:claude-sonnet-4-5

Section 1 · hero — Roofer Serving Ballarat CBD

Section 2 · location_specific — CBD & Central Ballarat Coverage

Section 3 · service_grid — What We Do in the CBD

Section 4 · trust_block — Why Call a Local CBD Roofer

Section 5 · how_it_works — How It Works

Section 6 · contact_cta — Get a Quote Today

Page · /roofer-ballarat-northside 🤖 claude:claude-sonnet-4-5

Section 1 · hero — Ballarat Northside Roof Restoration & Repairs

Section 2 · content — Northside Suburbs We Service

Section 3 · services_list — What We Do

Section 4 · content — How a Job Runs

Section 5 · content — Why Ballarat Roofs Need Attention

Section 6 · contact — Get a Quote

Page · /roofer-ballarat-southside 🤖 claude:claude-sonnet-4-5

Section 1 · hero — Roofer Serving Ballarat Southside

Section 2 · services_grid — Roofing Services for Ballarat Southside

Section 3 · text_block — Southside Coverage

Section 4 · process_steps — How We Work

Section 5 · trust_signals — 20+ Years in Ballarat

Section 6 · cta_block — Need a Roofer in Ballarat Southside?

Page · /about 🤖 claude:claude-sonnet-4-5

Section 1 · hero — Ballarat Roof Restoration—Done Right, No Shortcuts

Section 2 · content_block — How We Started

Section 3 · credentials_grid — Licensed, Insured, and Accountable

Section 4 · services_list — What We Do

Section 5 · content_block — Why Ballarat Homeowners Choose Us

Section 6 · cta_banner — Get an Honest Quote—No Obligation

Page · /reviews 🤖 claude:claude-sonnet-4-5

Section 1 · hero — What Ballarat Homeowners Say

Section 2 · reviews_showcase — Recent Jobs & Customer Feedback

Section 3 · credentials — Licensed, Insured, Local

Section 4 · services_list — What We Do

Section 5 · how_it_works — How It Works

Section 6 · location — Serving Greater Ballarat

Section 7 · cta_block — Need a Roof Looked At?

Page · /contact 🤖 claude:claude-sonnet-4-5

Section 1 · hero — Get a Quote or Ask About Your Roof

Section 2 · form — Send a Message

Section 3 · contact-info — Prefer to Call?

Section 4 · map — We Cover Ballarat

Section 5 · services-list — What We Do

Section 6 · trust-signal — What Happens Next

13. Header + Nav design (Phase E4) 🤖 claude:claude-sonnet-4-5

Nav items:

LabelSlugType
Servicesnulldropdown
Areasnulldropdown
Reviews/reviewslink
About/aboutlink
Contact/contactlink
Fixes: no-above-fold-cta, hidden-phone, low-mobile-conversion

_Rationale: Phone always visible desktop+mobile. Brass CTA matches brand. Bottom-fixed mobile bar solves scroll-away phone problem._

14. Footer design (Phase E5) 🤖 claude:claude-haiku-4-5

Columns:

_Services_

_Service Areas_

_Contact_

Contact block: phone-tel=true · address=true · map=true · email=false · social=

Trust strip: ★★★★★ 5.0 Rating · 20+ Years Local Experience · Licensed & Insured · Same-Day Quotes Available

Legal: © 2025 Mark Squire Roof Restorations. All rights reserved. · Privacy Policy · Terms of Service

_Rationale: Contact prominence (phone as tel link) solves the immediate customer need: call for a quote. Service columns organize expertise into scannable groups (by service type + by location), reducing cognitive load. Trust strip (5★ + licensed + local experience + speed) validates credibility before the legal footer. Dark background with copper/rust accent on contact CTA creates visual hierarchy without clutter. Mobile-first stacking ensures phone is always accessible on thumb-scroll._

15. CTA system (Phase E6) 🤖 claude:claude-sonnet-4-5

PRIMARY · Call 0400 058 842

SECONDARY · Get a free quote

TERTIARY · View our work

A/B copy variants:

_Rationale: Phone-first for highest intent in local roofing trade. Ballarat market (regional VIC) expects direct contact. 5-star rating with low review count (3) means trust must be earned quickly through direct conversation. No existing website means unfamiliar digital presence—phone reduces friction. Orange accent (#E67E22) from design style provides warmth and urgency against navy anchor color (#34495E). Secondary quote CTA captures medium-intent users who want to compare. Tertiary work gallery builds credibility before contact._

8. Build instructions (designer / OD agent / operator)

1. LOCKED facts: every value in §1 must appear verbatim somewhere on the new site. 2. Brand kit: use logo + colors + fonts from §2. Do not invent palette. Do not invert V/R color in logo mark. 3. Real services: use §3a verbatim where ✓ verified:scraped · may polish where 🤖 ai-completed · must caveat or replace where ⚠ niche-typical. 4. About narrative: use §3b as-is (preserves verified facts). Don't rewrite paragraphs marked verified:scraped. 5. Hero: pick recommended candidate from §3c or another with stated rationale. 6. Pages: build the 13 pages from §4 in order. Use real long-tail slugs (verified:scraped:sitemap) — don't change to compass directions. 7. Images: use customer's own from §5 buckets per page-binding. Only fall back to template stock when no real image fits. 8. Audit fix-through: each issue in §6 must visibly improve in the corresponding target page (§6a). 9. Provenance: do NOT show provenance labels on customer-facing site. They're internal only.

9. Provenance summary

Total tracked fields: 21

Phase B run (2026-05-17T01:03:02.536Z): ```json { "B1": { "ok": false, "reason": "no pages and no homepage md" }, "B2": { "ok": false, "reason": "no scraped content available" }, "B5": { "ok": false, "reason": "no manifest" }, "B3": { "ok": true, "count": 3, "latency_ms": 14054 }, "B6": { "ok": false, "reason": "missing prerequisites" } } ```

--- _Generated by core/handoff/build-design-handoff-doc.js · per SOP-3 §3.2_ _Re-generate after re-running pl:enrich-handoff -- --slug mark-squire-roof-restorations_