Fallzone Play — how the Zone was drawn.

The concept

Fallzone Play sells to local-government parks officers, school business managers, childcare directors and strata managers. Every one of them arrives with the same question — will this fit, and what does it cost — and every one of them has been quoted on equipment before anybody measured the impact area. The page's single job is to turn "what can we fit in this space" into a booking, with the fall zone drawn to scale, the tested depth named, the area in square metres and the price already on screen.

The commercial hinge is the refusal. Below about 7.2 m of clear width nothing in the range can be certified, and the page says so — in the badge, with no dollar figure, and with the impact area drawn visibly crossing the boundary on both sides. A demo that only ever says yes is a brochure.

Palette — measured, not estimated

Argued from the two surfaces councils actually buy (wet-pour EPDM and pine bark) plus the red that marks a fall zone on every set-out drawing. Every ratio below was computed with WCAG arithmetic from the shipped hex by contrast-playgrounds.mjs — 26 rows, 0 fail — including the cross product of every ink against every scene fill it can land on.

The COLOUR chip needed two more fills, because a price-neutral control still has to change the drawing. Both were minted and measured with the rest: terracotta #D09A83 (6.75:1 under the body ink) and bark-natural #C6A986 (7.37:1). Forest green reuses the pinned wet-pour fill.

Service-area map labels are body-ink class with a civic-paper halo (paint-order: stroke), never an accent — the lines-only tokens never label a map.

Type

Bricolage Grotesque 700/800 for display. Its width variation gives headings a civic confidence with no toy-like curve anywhere — this is a page a parks officer pastes into a report. Manrope 400/600 carries the body at 17px. Roboto Mono 500 has exactly one role: dimensions. Every number that is a measurement — 2.4 m FHF · 110 mm · 95 m² — is set in it, on the page and inside the drawing, so the eye learns that mono means "measured".

The typographic moment is the display cut beneath the plan: the live impact area set at clamp(4.4rem, 17vw, 9rem) with OF CERTIFIED IMPACT AREA beneath it in mono at .28em tracking. It is the argument in one number — 95 m² of ground for 30 m² of equipment.

The signature — the Zone

One SVG panel, rebuilt synchronously on every state change, holding two drawings that share a 1 m grid: a plan and a section.

The plan is view-fit to max(yard width, zone width), so the boundary is always inside the frame — including in the refusal, where you have to be able to see the impact area cross it. The equipment footprint is drawn to scale in steel; the impact area is its true expanded outline in the rubber red with a drifting diagonal hatch; both axes are dimensioned; the yard boundary is a pair of hard rules with the clear width dimensioned beneath. Where the zone overruns, the overrun is filled with a dense red hatch on the pale overrun ground and the distance is dimensioned in metres.

The section strip beneath draws the free height of fall as a vertical dimension from the deck down to the top of the softfall, and the softfall depth to scale beneath it. That is deliberately unflattering: at the rest state 110 mm of wet-pour is a 7 px band under a 158 px fall. The thinness is the argument — that band is the only thing the standard is talking about, and its tested critical fall height is printed beside it.

No library. Plain createElementNS, laid out in real CSS pixels per width rather than a fixed viewBox, so a 20 m yard at 375 px still renders 11 px dimension type instead of the 4 px a fixed viewBox would give. The whole drawing is assembled synchronously and the entrance choreography is driven from the animation loop — never by post-hoc DOM insertion, which headless Chrome has been known to leave unpainted.

Liveness has a floor: after the entrance settles, the impact-area outline breathes between 0.62 and 1.00 stroke opacity and the hatch drifts one pattern step every two seconds. The signature is visibly alive at any capture instant, with no phase arithmetic against the seven-second thumbnail settle.

The model — integer millimetres, whole dollars

The impact-area offset comes from the AS 4685 series (following EN 1176): 1,500 mm up to 1.5 m of free height of fall, and above that ceil(2 × FHF / 3) + 500 mm. Swings carry a directional zone instead — 1,500 mm to the sides, 3,600 mm fore and aft. Everything is held in millimetres and whole dollars; Number.isInteger() is asserted on every field the price function returns, and a non-integer anywhere throws.

offset   = FHF <= 1500 ? 1500 : ceil(2 * FHF / 3) + 500      (swings: 1,500 sides / 3,600 ends)
zoneW    = footprintW + 2 * sideOffset
zoneL    = footprintL + 2 * endOffset
area_m2  = ceil(zoneW * zoneL / 1,000,000)
depth    = smallest tested row whose CFH >= FHF, else NOT CERTIFIABLE (module disabled)

scope    = new equipment ? module price + $1,450 inspection : $480 audit + $980 drop test
subtotal = scope + area_m2 * surface rate + access [0 | 1,850 | 2,400]
total    = max(subtotal, $4,200 minimum)

The full control grid is 4 units × 29 yard widths × 4 surfaces × 3 colours × 2 scopes × 3 access options = 8,352 cells, of which 4,806 price. The $4,200 minimum binds in 156 of them. Cheapest reachable output is $4,200, which is exactly the services grid's "softfall replacement, from $4,200" floor; dearest is $93,518 (senior tower on 145 mm wet-pour over 152 m², new equipment, barrow-in). Zero non-integer cells.

The honesty clauses this page carries

Three of them are structural, not decorative.

• The page never certifies a surface. Every depth comes from a table of typical tested values, and the line "These are typical tested depths. The figure that binds is the critical fall height on your surface's own AS 4422 test certificate, and we hand you a copy of it" appears in the badge, in the ledger and in the plain-text mirror — wherever a depth does.
• No claim about injury prevention appears anywhere. The standard's language is impact attenuation, and the page uses exactly that word. A surface has a tested critical fall height; it does not have an outcome.
• The post-installation inspection is named as an independent one, carried out by someone who does not work for the installer, and the FAQ says plainly why an installer signing off their own work is worth nothing in a file.

Alongside those: the business is declared fictional on both pages, the phone number uses the reserved (08) 9000 0405 pattern, the address is suburb-level, the ABN and builder registration are visibly placeholder-patterned, and the live JSON-LD is WebPage/WebSite/CreativeWork only — nothing business-shaped, no fictional reviews marked up as structured data.

Where my oracle disagreed with the spec

The concept's numbers came from a spec-time enumeration. They were re-derived here from the prose in an independent oracle (oracle-playgrounds.mjs, 131 assertions, 0 fail) rather than trusted. Three disagreements surfaced. In each case the page ships the reading that reproduces the pinned endpoints, and the disagreement is reported here rather than quietly resolved either way.

Two smaller gaps the spec left open and this build had to rule on, recorded so they are not mistaken for oversights:

• The disabled-colour reason is per surface. The pinned string is "bark is the colour bark is.", applied to both loose-fill surfaces. It is untrue of sand, which is the other one — a reason string is a claim about every cell it covers. The pinned string ships verbatim on pine bark; sand carries the parallel "sand is the colour sand is."
• When a unit is blocked by both constraints, the yard reason wins. A module can be disabled because it doesn't fit and because no depth of the chosen surface certifies it. The boundary is the harder fact — no depth of surfacing fixes it — so it is the reason shown.

Conversion decisions

• The buyer is not a homeowner. The form asks for the council, school or organisation, and for a purchase order or quote reference; the "you are" select is written in the buyer's own vocabulary (parks or assets, business manager or facilities, centre, strata, contractor). The copy beside it promises a breakdown "laid out so it can be pasted into a council report or a board paper without being retyped", and offers to be the second of three quotes — that is the actual shape of the purchase.
• The signature sits inside the first 750 px at 1200 wide, badge and all, because the thumbnail is the commercial argument. The hero was cut back twice to get it there.
• The price lives on the artwork. A ledger below the fold does not make the capture, so the total is a real text node in a badge anchored to the drawing, with the full note and boundary templates beside it at ≥641 px and pinned short forms when it docks beneath the plan at ≤640 px.
• The set-out hands off to the form. "Send this set-out to us" pre-fills the clear width, the scope and a description of the current configuration — including, in the refusal state, an honest "nothing in the range fits, we need advice" message.
• The confirmation is local and says so. It is hidden on load and on an empty submit, shown only after a valid filled submit, and its second line states that nothing was sent, stored or transmitted. No network round-trip is faked.

Local SEO we'd implement for the real business

None of this ships on the demo — a fictional business in a real index is dishonest markup. This is the schema we would deploy for a real Fallzone Play, with the top-level type HomeAndConstructionBusiness, once the reviews were genuine and the address real.

{
  "@context": "https://schema.org",
  "@type": "HomeAndConstructionBusiness",
  "@id": "https://fallzoneplay.com.au/#business",
  "name": "Fallzone Play",
  "description": "Playground equipment supply and installation and certified softfall surfacing for councils, schools, childcare centres and strata across Perth.",
  "url": "https://fallzoneplay.com.au/",
  "telephone": "+61 8 XXXX XXXX",
  "email": "setout@fallzoneplay.com.au",
  "image": "https://fallzoneplay.com.au/img/malaga-yard.jpg",
  "priceRange": "$$",
  "address": {
    "@type": "PostalAddress",
    "streetAddress": "Unit N, XX Example Road",
    "addressLocality": "Malaga",
    "addressRegion": "WA",
    "postalCode": "6090",
    "addressCountry": "AU"
  },
  "geo": { "@type": "GeoCoordinates", "latitude": -31.86, "longitude": 115.89 },
  "openingHoursSpecification": [{
    "@type": "OpeningHoursSpecification",
    "dayOfWeek": ["Monday","Tuesday","Wednesday","Thursday","Friday"],
    "opens": "06:30", "closes": "16:00"
  }],
  "areaServed": [
    { "@type": "City", "name": "Malaga" },
    { "@type": "City", "name": "Ballajura" },
    { "@type": "City", "name": "Ellenbrook" },
    { "@type": "City", "name": "Midland" },
    { "@type": "City", "name": "Guildford" },
    { "@type": "City", "name": "Bassendean" },
    { "@type": "City", "name": "Bayswater" },
    { "@type": "City", "name": "Morley" }
  ],
  "hasOfferCatalog": {
    "@type": "OfferCatalog",
    "name": "Playground and softfall services",
    "itemListElement": [
      { "@type": "Offer", "itemOffered": { "@type": "Service", "name": "Wet-pour rubber softfall, supplied and laid" } },
      { "@type": "Offer", "itemOffered": { "@type": "Service", "name": "Pine bark softfall to AS 4422" } },
      { "@type": "Offer", "itemOffered": { "@type": "Service", "name": "Synthetic grass over shockpad" } },
      { "@type": "Offer", "itemOffered": { "@type": "Service", "name": "Playground equipment, supplied and installed" } },
      { "@type": "Offer", "itemOffered": { "@type": "Service", "name": "Independent post-installation inspection to AS 4685.0" } }
    ]
  },
  "aggregateRating": {
    "@type": "AggregateRating",
    "ratingValue": "4.9", "reviewCount": "38"
  },
  "review": [{
    "@type": "Review",
    "author": { "@type": "Person", "name": "Real verified customer name" },
    "datePublished": "2026-02-11",
    "reviewRating": { "@type": "Rating", "ratingValue": "5", "bestRating": "5" },
    "reviewBody": "Impact-area set-out drawn over our reserve plan inside two days, and the depth table went straight into the council report."
  }]
}

Beside the schema we would ship: a Google Business Profile with the Malaga yard and the eight service-area councils, a page per surface type (wet-pour / bark / synthetic grass) each carrying its own AS 4422 depth table, and one page per council named the way a parks officer searches ("playground softfall replacement, City of Bayswater").

What would change for the real client

• Their photos. Every visual here is procedural by design — no raster images anywhere. A real build keeps the Zone drawing exactly as it is and adds site photography around it; the drawing is the thing competitors can't copy from a stock library.
• Their reviews feed. The three testimonials are demo copy. Live, they would come from the Google Business Profile with the review schema turned on.
• Their systems. The enquiry would post into whatever they already run — Simpro or AroFlo for a business quoting installs and managing site works, ServiceM8 or Tradify for a smaller crew — and into Xero for the invoice. Council work adds its own: VendorPanel for quote requests, and purchase orders arriving out of TechnologyOne or Civica Authority, which is why the form asks for a PO reference rather than pretending every job starts with a phone call.
• Their certificates. The AS 4422 certificates and the post-installation inspection reports would be attached per job and served from the customer's own handover pack, so the sentence "we hand you a copy" is a link, not a promise.

Iteration log