PHASE V2 · VISUAL INTEGRATION PREVIEW
Current vs proposed, side by side.
Real full-page screenshots: today's production pages next to the V2 proposals, at desktop (1440px) and mobile (390px). Everything here is preview-only — the production pages are untouched, these pages are noindex and stay out of the sitemap.
Final design decision sheet →Homepage — “Built for your trade” section
The interactive trade switcher becomes a visual portfolio: three large, clearly different concept showcases, each with its own identity, followed by links to all seven trades.
Current — production
Proposed — V2 preview
What changes, exactly
- Headline: “Built for your trade.” → “Different businesses. Different ways to win customers.”
- Replaced the single switcher mock, trade pills and annotation labels with three large showcases — real desktop + mobile captures, industry name, its conversion strategy, a “Fictional website concept” label and an Explore-the-concept link.
- Copy trimmed: the four “What we run” card texts shortened (~30%); no change to the offer itself.
- Kept untouched: hero reel and tagline, how-it-works strip, price band with loyalty ladder, three FAQs, closing CTA.
- Kept: links to all seven trade categories in a single strip under the showcases.
Plumbing trade page hero
The dark gradient text-only hero becomes a split hero: brownstone/cream identity on the left, a large real capture of the BlueLine “Bold Emergency” prototype on the right.
Current — production
Proposed — V2 preview
What changes, exactly
- Hero: brownstone display headline on cream, Request a call + phone line, Massachusetts link — with the concept screenshot, a phone overlay and a copper “Concept · not a client” badge on the right.
- Copy consolidated: the three-paragraph “Google Ads” section and three-paragraph “Google Business Profile / LSA” section become one two-card block (“Ads and your Google profile”).
- Trimmed: “Sound familiar?” 4 → 3 items, search chips 7 → 5, “What we build” 6 → 4 items, season note removed, working-steps list becomes a compact 3-column row, FAQs 6 → 3.
- Kept: Request a call CTA, phone line, pricing block, FinalCta form, links to all trades.
HVAC trade page hero
Same split-hero pattern with the Meridian “Modern Comfort” prototype — the calm serif editorial design contrasts with BerAIdy's brownstone identity.
Current — production
Proposed — V2 preview
What changes, exactly
- Hero pairs the approved headline with the Meridian Comfort capture; sage/cream swatches identify the concept family.
- Same consolidation and trimming pattern as plumbing (ads/GBP → two cards, fewer chips and build items, 3 FAQs).
- Kept: commercial positioning, pricing block, forms, phone-first CTAs, all internal links.
Roofing trade page hero
Same split-hero pattern with the Summit & Slate “Premium Craftsmanship” prototype — the charcoal/copper gallery design signals high-ticket work.
Current — production
Proposed — V2 preview
What changes, exactly
- Hero pairs the approved headline with the Summit & Slate capture; charcoal/copper swatches identify the concept family.
- Same consolidation and trimming pattern as plumbing (ads/GBP → two cards, fewer chips and build items, 3 FAQs).
- Kept: commercial positioning, pricing block, forms, phone-first CTAs, all internal links.
Pest control trade page hero
Pairs the trade page with the “Clean & Reassuring” concept — Willow Shield's rounded, calm design contrasts with the urgency-led other concepts.
Current — production
Proposed — V2 preview
What changes, exactly
- Hero pairs the approved headline with the Willow Shield capture; spruce-teal/lemon swatches identify the concept family.
- Same consolidation and trimming pattern (ads/GBP → two cards, fewer chips and build items, 3 FAQs).
- Kept: commercial positioning, pricing block, forms, phone-first CTAs, all internal links.
Garage door trade page hero
Pairs the trade page with the “Architectural & Product-Led” concept — Northgate's showroom/spec-sheet design sells the door, not just the repair.
Current — production
Proposed — V2 preview
What changes, exactly
- Hero pairs the approved headline with the Northgate capture; graphite/amber swatches identify the concept family.
- Same consolidation and trimming pattern (ads/GBP → two cards, fewer chips and build items, 3 FAQs).
- Kept: commercial positioning, pricing block, forms, phone-first CTAs, all internal links.
Water damage trade page hero
Pairs the trade page with the “Emergency & Recovery” concept — DryLine's dark dispatch-console design with timestamps, unlike the friendly navy plumbing site.
Current — production
Proposed — V2 preview
What changes, exactly
- Hero pairs the approved headline with the DryLine capture; red/ink swatches identify the concept family.
- Same consolidation and trimming pattern (ads/GBP → two cards, fewer chips and build items, 3 FAQs).
- Kept: commercial positioning, pricing block, forms, phone-first CTAs, all internal links.
Electrical trade page hero
Pairs the trade page with the “Precision & Technology” concept — Edge & Volt's blueprint-grid design sells assessments for high-value electrical work.
Current — production
Proposed — V2 preview
What changes, exactly
- Hero pairs the approved headline with the Edge & Volt capture; cyan/midnight swatches identify the concept family.
- Same consolidation and trimming pattern (ads/GBP → two cards, fewer chips and build items, 3 FAQs).
- Kept: commercial positioning, pricing block, forms, phone-first CTAs, all internal links.
Seven concepts. Seven different layouts.
All seven fictional concepts at a glance — each with its own navigation pattern, hero composition, type pair and conversion journey. Open any concept to explore the full prototype.
BlueLine — Bold Emergency
Utility bar + white nav · full-bleed photo hero, huge condensed type · Barlow Condensed · services in a sharp bordered grid · call-first
Open the concept →
Meridian — Modern Comfort
Centered transparent nav · split hero with arched photo · Fraunces serif · membership plan cards · schedule-led
Open the concept →
Summit & Slate — Premium Craftsmanship
Minimal charcoal nav with outlined button · architectural gallery hero · Cormorant Garamond · asymmetric portfolio · estimate-led
Open the concept →
Willow Shield — Clean & Reassuring
Floating pill nav · centered home-first hero, rounded frames · Nunito Sans · rounded chip cards + 2-plan layout · inspection-booking
Open the concept →
Northgate — Architectural & Product-Led
Numbered mono spec-sheet nav · split product hero with blueprint callouts · Archivo + mono · collection cards with spec rows + opener table · quote-led
Open the concept →
DryLine — Emergency & Recovery
Dispatch status bar · dark console hero with mono first-hour log · Inter Tight + mono · damage cards + claim-documentation layout · call + callback
Open the concept →
Edge & Volt — Precision & Technology
Minimal mono nav with outline button · blueprint-grid hero with corner-bracketed photo · Space Grotesk + mono · breaker-module cards + circuit-line process · assessment-booking
Open the concept →Deliverables & assessment
Image assets inventory
Concept captures — our three V1 prototypes
- concepts-plumbing-hero-desktop2880×1800pxplumbing-hero-desktop-w1440.webp · plumbing-hero-desktop-w864.webp (49/25) KB
- concepts-plumbing-hero-mobile780×1688pxplumbing-hero-mobile-w390.webp · plumbing-hero-mobile-w240.webp (33/17) KB
- concepts-plumbing-full-desktop1440×2899pxplumbing-full-desktop-w1200.webp (102) KB
- concepts-plumbing-full-mobile390×4144pxplumbing-full-mobile-w390.webp (105) KB
- concepts-hvac-hero-desktop2880×1800pxhvac-hero-desktop-w1440.webp · hvac-hero-desktop-w864.webp (63/30) KB
- concepts-hvac-hero-mobile780×1688pxhvac-hero-mobile-w390.webp · hvac-hero-mobile-w240.webp (34/17) KB
- concepts-hvac-full-desktop1440×3713pxhvac-full-desktop-w1200.webp (160) KB
- concepts-hvac-full-mobile390×6094pxhvac-full-mobile-w390.webp (168) KB
- concepts-roofing-hero-desktop2880×1800pxroofing-hero-desktop-w1440.webp · roofing-hero-desktop-w864.webp (71/34) KB
- concepts-roofing-hero-mobile780×1688pxroofing-hero-mobile-w390.webp · roofing-hero-mobile-w240.webp (31/14) KB
- concepts-roofing-full-desktop1440×4692pxroofing-full-desktop-w1200.webp (250) KB
- concepts-roofing-full-mobile390×6798pxroofing-full-mobile-w390.webp (203) KB
- concepts-pest-hero-desktop2880×1800pxpest-hero-desktop-w1440.webp · pest-hero-desktop-w864.webp (53/25) KB
- concepts-pest-hero-mobile780×1688pxpest-hero-mobile-w390.webp · pest-hero-mobile-w240.webp (24/13) KB
- concepts-pest-full-desktop1440×3963pxpest-full-desktop-w1200.webp (140) KB
- concepts-pest-full-mobile459×5980pxpest-full-mobile-w390.webp (106) KB
- concepts-garage-hero-desktop2880×1800pxgarage-hero-desktop-w1440.webp · garage-hero-desktop-w864.webp (78/36) KB
- concepts-garage-hero-mobile780×1688pxgarage-hero-mobile-w390.webp · garage-hero-mobile-w240.webp (34/17) KB
- concepts-garage-full-desktop1440×3442pxgarage-full-desktop-w1200.webp (170) KB
- concepts-garage-full-mobile393×5712pxgarage-full-mobile-w390.webp (172) KB
- concepts-water-hero-desktop2880×1800pxwater-hero-desktop-w1440.webp · water-hero-desktop-w864.webp (41/21) KB
- concepts-water-hero-mobile780×1688pxwater-hero-mobile-w390.webp · water-hero-mobile-w240.webp (24/13) KB
- concepts-water-full-desktop1440×3159pxwater-full-desktop-w1200.webp (107) KB
- concepts-water-full-mobile390×5181pxwater-full-mobile-w390.webp (111) KB
- concepts-electrical-hero-desktop2880×1800pxelectrical-hero-desktop-w1440.webp · electrical-hero-desktop-w864.webp (47/23) KB
- concepts-electrical-hero-mobile780×1688pxelectrical-hero-mobile-w390.webp · electrical-hero-mobile-w240.webp (28/14) KB
- concepts-electrical-full-desktop1440×3310pxelectrical-full-desktop-w1200.webp (111) KB
- concepts-electrical-full-mobile430×5700pxelectrical-full-mobile-w390.webp (104) KB
Current production pages
- current-home-full-desktop1440×6227pxhome-full-desktop-w1200.webp (230) KB
- current-home-full-mobile390×9399pxhome-full-mobile-w390.webp (232) KB
- current-plumbing-full-desktop1440×7707pxplumbing-full-desktop-w1200.webp (307) KB
- current-plumbing-full-mobile390×11142pxplumbing-full-mobile-w390.webp (347) KB
- current-hvac-full-desktop1440×7587pxhvac-full-desktop-w1200.webp (287) KB
- current-hvac-full-mobile390×10767pxhvac-full-mobile-w390.webp (321) KB
- current-roofing-full-desktop1440×7420pxroofing-full-desktop-w1200.webp (268) KB
- current-roofing-full-mobile390×10293pxroofing-full-mobile-w390.webp (302) KB
- current-pest-full-desktop1440×7481pxpest-full-desktop-w1200.webp (274) KB
- current-pest-full-mobile390×10313pxpest-full-mobile-w390.webp (308) KB
- current-garage-full-desktop1440×8474pxgarage-full-desktop-w1200.webp (318) KB
- current-garage-full-mobile390×11821pxgarage-full-mobile-w390.webp (361) KB
- current-water-full-desktop1440×7542pxwater-full-desktop-w1200.webp (277) KB
- current-water-full-mobile390×10375pxwater-full-mobile-w390.webp (304) KB
- current-electrical-full-desktop1440×7427pxelectrical-full-desktop-w1200.webp (257) KB
- current-electrical-full-mobile390×10163pxelectrical-full-mobile-w390.webp (286) KB
Proposed V2 preview pages
- proposed-home-full-desktop1440×6306pxhome-full-desktop-w1200.webp (231) KB
- proposed-home-full-mobile390×9478pxhome-full-mobile-w390.webp (236) KB
- proposed-plumbing-full-desktop1440×6221pxplumbing-full-desktop-w1200.webp (220) KB
- proposed-plumbing-full-mobile390×8614pxplumbing-full-mobile-w390.webp (238) KB
- proposed-hvac-full-desktop1440×6196pxhvac-full-desktop-w1200.webp (211) KB
- proposed-hvac-full-mobile390×8443pxhvac-full-mobile-w390.webp (225) KB
- proposed-roofing-full-desktop1440×6168pxroofing-full-desktop-w1200.webp (204) KB
- proposed-roofing-full-mobile390×8326pxroofing-full-mobile-w390.webp (221) KB
- proposed-pest-full-desktop1440×6199pxpest-full-desktop-w1200.webp (204) KB
- proposed-pest-full-mobile390×8267pxpest-full-mobile-w390.webp (221) KB
- proposed-garage-full-desktop1440×6114pxgarage-full-desktop-w1200.webp (212) KB
- proposed-garage-full-mobile390×8406pxgarage-full-mobile-w390.webp (229) KB
- proposed-water-full-desktop1440×6228pxwater-full-desktop-w1200.webp (210) KB
- proposed-water-full-mobile390×8442pxwater-full-mobile-w390.webp (228) KB
- proposed-electrical-full-desktop1440×6141pxelectrical-full-desktop-w1200.webp (199) KB
- proposed-electrical-full-mobile390×8326pxelectrical-full-mobile-w390.webp (213) KB
Photography ownership & licensing
Every screenshot on the V2 pages is captured from our own V1 prototype pages (the /design concepts) — we own the screenshots; no external website captures are used.
Photography inside the concepts is hotlinked Unsplash imagery under the Unsplash License (free for commercial use, attribution not required), each photo used once, with no stock businesspeople and no fabricated results.
Misleading-claim guard: the homepage showcases carry “Fictional website concept”, the trade heroes a “Concept · not a client” badge, and every demo is labeled “a demonstration we built, not a client project”. Nothing claims real clients or real results.
Performance & accessibility assessment
Iframes removed: the eventual production homepage uses static WebP screenshots that link to the demo routes — three full websites are never loaded inside the homepage. Explore links open the real prototypes on their own routes.
Optimized media: concept hero captures ship as WebP with responsive widths (desktop 1440w + 864w, mobile 390w + 240w; typically 60–110 KB total per concept) and full-page comparison captures at 1200w/390w. width/height attributes prevent layout shift; below-fold images lazy-load with decoding=async.
Accessibility: meaningful alt text on every capture (the phone overlay is decorative and aria-hidden); the toggle uses aria-pressed with visible labels; brownstone/cream palette keeps body copy at ≥4.5:1 contrast; focus-visible ring and reduced-motion behavior are inherited from the approved E1 system; mobile stacks the showcases and never overlaps devices at 390px.
Confirmation: no two concepts share a layout
Each concept differs in navigation pattern, hero composition, type pair, section flow and conversion journey — not just palette. The gallery above shows all seven side by side; the layout DNA per concept:
BlueLine — Bold Emergency
Utility bar + white nav · full-bleed photo hero, huge condensed type · Barlow Condensed · services in a sharp bordered grid · call-first
Meridian — Modern Comfort
Centered transparent nav · split hero with arched photo · Fraunces serif · membership plan cards · schedule-led
Summit & Slate — Premium Craftsmanship
Minimal charcoal nav with outlined button · architectural gallery hero · Cormorant Garamond · asymmetric portfolio · estimate-led
Willow Shield — Clean & Reassuring
Floating pill nav · centered home-first hero, rounded frames · Nunito Sans · rounded chip cards + 2-plan layout · inspection-booking
Northgate — Architectural & Product-Led
Numbered mono spec-sheet nav · split product hero with blueprint callouts · Archivo + mono · collection cards with spec rows + opener table · quote-led
DryLine — Emergency & Recovery
Dispatch status bar · dark console hero with mono first-hour log · Inter Tight + mono · damage cards + claim-documentation layout · call + callback
Edge & Volt — Precision & Technology
Minimal mono nav with outline button · blueprint-grid hero with corner-bracketed photo · Space Grotesk + mono · breaker-module cards + circuit-line process · assessment-booking
Reusable Master Framework architecture
The seven concepts are isolated skins over shared primitives — which is how the Master Website Framework ships them. Shared core (one codebase): routing and SEO foundations, the Seo/schema component, tracking vocabulary (cta_click / book_call_click with link_location), consent-gated analytics, form infrastructure and phone-first CTA rules.
Distinctive per concept (a token file + a layout component): palette, type pair, radius and border language, navigation pattern, hero composition, card and grid structure, section rhythm and conversion flow. A new trade concept is therefore a design decision, not a new website — this phase added four concepts (pest, garage door, water damage, electrical) on exactly those seams.
Imagery: Unsplash-licensed photography, hotlinked, each photo used exactly once across all seven concepts; screenshots for the Be rAIdy hero mockups are captured from these prototypes by scripts/capture_v2_screenshots.py.
Scope guardrails
Untouched in this phase: the production homepage and the seven /plumbing|hvac|pest|garage|water|roofing|electrician-marketing pages, the seven /for/ concept routes, nav and footer, GTM and consent, forms and the booking flow, the sitemap and prerender lists.
V2/V3 preview pages are noindex, excluded from the sitemap, and reachable by direct link only. Nothing deploys without explicit approval.