Bark & Purr — Wireframe System

Structure for every page from the approved site map. Every page opens with a real HERO (the #1 fix — old site had missing/sideways heroes). Skin is set by the chosen mockup; this is the bones.

Universal [U] — engine, lifts to any client Industry [I] — swaps grooming → nails Brand [B] — Bark & Purr config
Pages: ① Home · ② About + subpages · ③ Services Index · ④ Service Detail · ⑤ Den Club · ⑥ Pricing + Estimator · ⑦ Pet Wellness · ⑧ My Account · ⑨ Book Now

🌐 Global shell — on every page [U]

Heroes use REAL images, orientation normalized on import.

① Home

index.html · [B]

The conversion showcase. Hero answers the 4 questions; proof + paths follow.

Hero
Full-bleed real photo · eyebrow · H1 + sub · 2 CTAs (Book / Explore)
Answers: what · where (Allen TX) · why trust (4.9★ / fear-free) · next action
Trust band
Rating · review count · method badges
Fear-Free · One pet at a time · No cage drying · T.A.I.L.S. Report
Services
3 tiles — Dog · Cat · Boarding (from-price each)
Real photos, one-line value, link to detail
Den Club
Membership teaser — 4 tiers, Perfect Zen highlighted
Proof
Before/After gallery — real regulars
Highest-converting grooming asset
Reviews
Named, photographed reviews · Google ★
CTA
Book Now + "Get a price estimate" + concierge nudge

② About + subpages

about · team · first-visit · regulars · reviews · faq

Shared template; Our Story / Team / First Visit / Regulars / Reviews / FAQ all inherit it.

Hero
Page hero — real lobby/team photo + page title + one-line promise
Body
Story / team grid / first-visit steps / regulars wall / reviews / FAQ accordion
Pattern varies per subpage, same frame
Team = real staff photos [B]First Visit = process [I]FAQ = accordion [I]
CTA
Book / Ask the concierge

③ Services Index

services/services_index.html · [I]
Hero
Services hero — "Grooming designed around the animal"
Catalog
Dog · Cat · Boarding cards → detail pages
Pulled from live catalog where possible
Why us
Method / fear-free differentiators
CTA
Book / Estimate

④ Service Detail

dogs_services · cats_services · boarding · [I]
Hero
Service hero — real groom photo + from-price + Book CTA
What's included
Process steps · add-ons · coat/breed notes
Proof
Before/After for this service + reviews
Pricing snapshot
From-price + link to estimator
CTA
Book this service

⑤ Den Club (Membership)

memberships.html · [B]/[I]
Hero
"Membership for the well-groomed life"
Tiers
Squeaky Clean · Zen Refresh · Tidy Trio · Perfect Zen ★ (16 visits/yr)
Perfect Zen = 8 grooms + 8 refreshes; no groom-only discount
Benefits
Predictable pricing · priority booking · Zen Paws Rewards
CTA
Enroll / Compare plans

⑥ Pricing + Cost Estimator

pricing.html + cost-estimator.html · [I]
Hero
Transparent pricing hero (no "call for quote")
Price matrix
By size / coat / service · from-prices visible
Estimator
≤3-step interactive estimate — captures email (lead)
CTA
Book at this price

⑦ Pet Wellness (blog/library)

pet-wellness.html + articles · [I]
Hero
Wellness hero + featured article
Article grid
Dog/cat coat, matting, fear-free, senior care…
SEO engine — existing rich article set
Capture
Newsletter / lead magnet
CTA
Book / Ask concierge

⑧ My Account (customer portal)

portal_v2.1.html · [U]

The PAWrent's customer view — gateway to their Intendant-customer surface.

Hero
Welcome bar — "your fur family" + next visit
My Pets
Fur family · profiles · T.A.I.L.S. reports
My Visits
History · upcoming · rebook
My Profile / Membership
Den Club status · rewards · details
CTA
Book next visit

⑨ Book Now

booking.html · [U]

The conversion endpoint — ≤3 steps, mobile-first.

Hero
Light hero — "Book their sPAW Day" + reassurance
Step 1
Pet + service
Step 2
Date/time (live availability)
Step 3
Details + confirm
Confirm
Confirmation + add-to-calendar + concierge follow-up

Every block fires analytics events (hero CTA, service view, estimator, chat open, booking start/complete) → HELM/Intendant funnel.