How the Subsoil Greywater Co. page was built

The single design decision

The proof element is a cross-section from the house wall to the garden bed, redrawn as you change the house. It shows where each waste pipe goes — bathroom and laundry to the diverter valve, the kitchen straight to the sewer on every system — and one sub-surface drip line per zone under a bed. The picture carries the rules a buyer does not know to ask about: the water goes under the ground, the kitchen never joins it, and the valve has a sewer setting for a wet winter.

At 1024 px and wider the card sits in the hero's second column, so the answer and the drawing are both inside the 1200×750 thumbnail. On a phone the reading order is unchanged: hero, services, then the card.

Palette

Water that has been used once, and the soil it ends up in. The blue is the pipe; the loam is where the water goes. Every ratio below is measured, not estimated — the first eleven are copied from contrast-w59.log, the last four were minted during the build and measured the same way.

Declared FORBIDDEN in the log and kept off the page: any body token on the band, muted on primary (1.02:1), primary on accent (1.09:1). The light buttons in the footer and sticky bar put band on #EEF3F1 — the same pair as the declared light-on-band row, reversed, 11.92:1.

Type

Bricolage Grotesque 600/700 for headings and figures: a grotesque with a slightly hand-cut, workshop edge that reads like a signwritten ute door rather than a corporate brochure. Figtree 400/500 for everything else — round, open and very legible on a phone in the backyard. Cross-section labels are sized in CSS per breakpoint, never as SVG attributes, so they never fall below about 11 px at 375 wide.

The proof element

Three inputs: people in the house (1–6), washes a week (1–14), and a toggle for shower and bath water. The model is ten lines and mirrors figures-w59.mjs exactly: litres a week are washes × 60 L plus, with the toggle on, people × 45 L × 7. The system is a laundry diverter ($590, one zone included) with the toggle off, or a bathroom + laundry system ($1,650, two zones included) with it on. Zones are one per 600 L a week, never fewer than the system includes, and each extra zone is $160. Those three planning figures are the business's own assumptions and the card says so above the drawing.

The drawing is built with createElementNS: the house wall, three outlets, the valve, and for each zone a bed of mulch, deterministic plants, a riser, a drip line with emitters and a pale wet halo under each one, and a label with the litres that bed takes. Labels are measured with getComputedTextLength and shortened (“Zone 5” to “Z5”, “498 L/wk” to “498 L”) only when they would spill out of their bed. Toggling the bathroom off re-routes the bathroom pipe, dashed, to the sewer. The entrance — pipes flowing in, beds fading up — is CSS keyed to an intro class that is removed at 2.4 s, so no redraw or resize can ever replay it and the page is at rest long before the 7-second thumbnail.

Two branches argue against the sale. The laundry-only diverter for the same house is printed in every state: beside the dearer system it shows the money and the honest limit (“it sends 360 L a week, not 1,620, so it waters one bed instead of three”) with isSubstitute:false; when you are already on it, the card says it is the cheapest box and shows what adding the bathroom would cost. Then the $6,900 treated system, the biggest ticket in the grid, carries Health WA's own sentence that treated greywater which is not disinfected may only go sub-surface — so it waters the same beds. The state probe window.__greywater exposes every input and derived figure, the alternative, the upgrade and isSubstitute.

The three passes

Conversion decisions

• Primary CTA is the site look, not a quote. Whether the garden is downhill of the outlets decides gravity or pump, and no calculator can see that.
• Form fields: name, phone and suburb are required; “which water” and “what needs it most” are dropdowns with a “not sure” option so nobody abandons the form for lack of plumbing vocabulary; household size is optional.
• The Health WA rules sit in the hero column, not the FAQ. Sub-surface only, no kitchen water, WaterMark certified: stated beside the headline, where they read as how this business works rather than as small print.
• Included zones are disclosed before the total in the ledger's first line, so the floor is never a surprise.

Sources, and what this page declined to publish

Every sentence about the rules was read on 13 September 2026 from Health WA's Approved greywater systems page (last reviewed 28 July 2026) and from the Code of Practice for the Reuse of Greywater in Western Australia 2010, which that page links. Quoted verbatim: diverted greywater reused in gardens via sub-surface irrigation; diversion devices not fed kitchen greywater; WaterMark certification; treated greywater that is not disinfected used sub-surface only; the garden-or-sewer switch; the definition of greywater; the Code's installation approval from the relevant local government, its sub-surface depth of at least 100 mm below soil or mulch, its winter diversion advice and its sentence on stored greywater and odour.

Declined: any council application fee; any environmental health inspection or “permit to use” step; any water bill or dollar saving a year; any sprinkler roster day or rule; any claim that a particular council has a particular form. The approval step is stated as a mechanism — your local government approves it, and we lodge nothing without you. The market price band the brief anchored the fees against was not re-verified, so it is not printed; every fee on the page is the fictional business's own.

Local SEO we would ship for the real business

The live page carries only a WebPage block naming it a demonstration. For a real licensed plumber we would ship the following, filled with their verified details and real reviews from their Google Business Profile — never with the invented ones on this demo.

{
  "@context": "https://schema.org",
  "@type": "Plumber",
  "name": "[Business name]",
  "telephone": "[verified phone]",
  "url": "https://[their-domain]/greywater",
  "address": {
    "@type": "PostalAddress",
    "streetAddress": "[their verified street address]",
    "addressLocality": "Kelmscott",
    "addressRegion": "WA",
    "postalCode": "6111",
    "addressCountry": "AU"
  },
  "areaServed": ["Kelmscott", "Armadale", "Gosnells", "Canning Vale",
                 "Byford", "Thornlie", "Forrestdale", "Harrisdale", "Southern River"],
  "openingHours": ["Mo-Fr 07:00-16:30", "Sa 08:00-12:00"],
  "hasOfferCatalog": {
    "@type": "OfferCatalog",
    "name": "Greywater systems",
    "itemListElement": [
      { "@type": "Offer", "itemOffered": { "@type": "Service", "name": "Laundry greywater diverter, installed" },
        "priceSpecification": { "@type": "PriceSpecification", "minPrice": "[their price]", "priceCurrency": "AUD" } }
    ]
  },
  "review": [
    { "@type": "Review",
      "author": { "@type": "Person", "name": "[real reviewer, with consent]" },
      "reviewRating": { "@type": "Rating", "ratingValue": "[1-5]" },
      "reviewBody": "[verbatim from their review platform]" }
  ]
}

Plus: a Google Business Profile in the Plumber category with greywater as a listed service, suburb pages only where the business genuinely works, and the page title leading with “greywater” and the area rather than the brand.

What would change for a real client

• Their job system. The form would post to ServiceM8, Simpro, Tradify or AroFlo as a site-look booking with the house answers attached, and fire an SMS to the on-call plumber.
• Their numbers. Their own installed prices and zone sizing, and the planning figures replaced by what they actually measure on site.
• Their photos and reviews. Finished beds and valve installs from their own jobs beside the drawing, and a live reviews feed from their Google Business Profile.
• Their licence and certification details, real and checkable, in place of the patterned placeholders.
• Their council. If most of their work is in one local government area, a link to that council's own greywater page once it has been read and confirmed.

Where this build disagreed with its brief

• “Gravity” is not what separates the two systems. The brief calls only the bathroom + laundry system the gravity system. Health WA describes a gravity diversion device as one fitted to a fixture outlet “such as a laundry tub”, so the laundry diverter is one too, and the Code says gravity suits gardens sloping down from the house while pump devices are used when the garden is uphill or too flat. The page names the systems by what they take (laundry; bathroom + laundry), and says an uphill garden needs a pump unit priced on the site look.
• Approval: the carve-out left the council step unverified. The Code of Practice Health WA links does state that diversion devices and treatment systems need installation approval from the relevant local government, so that sentence is quoted; nothing further about the process or its cost is published.
• No arithmetic disagreement. All four worked examples, both ranges and the $1,220 difference reproduce from the running page. isSubstitute is true only when the house is already on the laundry diverter, because the diverter always sends less water than the bathroom system.
• Health WA's sub-surface sentence repeats “only”; the page quotes it up to the word “irrigation” rather than tidying it.