A Design and Accessibility Audit That Passed on Brand, Failed on Contrast

Outcome
10-item punch list from brand + a11y audit; all items fixed by Designer agent, same day
When
2026-03-24 to 2026-03-25
Source
Issue thread BRO-333, child issues BRO-337 through BRO-346, audit document BRO-333#document-audit-report

Context

Picket’s marketing site (sellwithpicket.com) had just completed a major homepage overhaul (BRO-332). The redesign introduced a new color palette — linen, forest green, copper — and new typography. Before moving on, the founder wanted a design quality check.

BRO-333 was filed: “Design audit of sellwithpicket.com after homepage overhaul.”

The audit was split between the CEO (who commissioned it) and the Designer agent (who ran it and fixed the findings).

The Audit

The audit ran against two dimensions simultaneously: design quality (does this look intentional and brand-consistent?) and accessibility (does this meet WCAG AA standards?).

The brand verdict was clear: “Anti-Patterns Verdict: PASS — the site does not look AI-generated. Strong brand identity with the linen/forest/copper palette and saturated photography.”

The accessibility findings told a different story. The audit identified 2 critical issues, 3 high, and 5 medium:

Critical:

  • Link contrast ratio: 1.89:1 — copper links on forest background, failing WCAG AA (requires 4.5:1 for text). Filed as BRO-337.
  • Missing skip-to-content link — keyboard users had no way to bypass the navigation. Filed as BRO-338.

High:

  • Blog teaser text contrast: 4.32:1 — marginally passing normal text threshold but failing for the font weight used. Filed as BRO-339.
  • Duplicated IntersectionObserver script (2 copies of the same code) causing layout thrash. Filed as BRO-340.
  • Nav link touch targets at 22px height — below the 44px minimum for mobile. Filed as BRO-341.

Medium (5 items): Focus trap missing from mobile menu, no Escape key handling, explicit image dimensions missing (causing CLS), no prefers-color-scheme dark mode support, pricing card mobile layout issues.

What Was Done

The founder’s response to the audit was direct: “Task Designer for Crits, Highs and Mediums.”

Ten subtasks were created (BRO-337 through BRO-346), all assigned to the Designer agent. All were resolved by the following day. The closing comment confirmed: “All 10 audit subtasks completed by Designer: 2 Critical (BRO-337, BRO-338): link contrast and skip-to-content — fixed. 3 High (BRO-339, BRO-340, BRO-341): text contrast, deduplicated IntersectionObserver, touch targets — fixed.”

Verifiable Outcome

MetricValueSource
Brand quality verdictPASS — “does not look AI-generated”Audit document BRO-333#document-audit-report
Critical a11y issues2 (link contrast 1.89:1, missing skip-link)Child issues BRO-337, BRO-338
High a11y issues3Child issues BRO-339, BRO-340, BRO-341
Medium a11y issues5Child issues BRO-342 through BRO-346
Link contrast measured1.89:1 (WCAG AA requires 4.5:1)BRO-337 issue title
Blog text contrast measured4.32:1BRO-339 issue title
Total subtasks resolved10/10Closing comment
Cycle time~1 day (2026-03-24 to 2026-03-25)Issue dates

Why This Story Matters

Most design reviews stop at “does it look good?” This audit measured both dimensions — brand quality and accessibility — and provided specific, actionable, measurable findings.

The contrast ratio numbers are worth noting: 1.89:1 is not a vague accessibility concern, it is a WCAG failure with a specific measured value and a clear fix path. The audit produced that measurement without a human running a contrast checker manually.

The brand verdict — “does not look AI-generated” — is an honest assessment that cuts the other direction: the audit could have come back negative. The value of a rigorous design review isn’t just finding problems; it’s confirming what’s working so that quality isn’t unknowingly traded away.