ShopCanary
ShopCanary · Visual System v1

The bird that
doesn't blink.

ShopCanary watches for failures that make no noise. The design system has to feel like an instrument that is definitely still switched on — calm, precise, and impossible to mistake for decoration.

01 — Concept

Night-watch instrumentation

The reference is not a dashboard. It's an instrument on a night shift: a seismograph, an ECG, a hangar panel at 3am. Dark ground, one signal colour, hairline rules, monospaced numerals. Nothing decorative competes with the one thing that matters — whether the line is flat.

FLAT IS GOOD. THE SPIKE IS THE PRODUCT.

The trace line is the system's signature. Use it as a section divider, a loading state, an empty state, and the hero motif. It runs flat until something breaks. It is never used as generic ornament — a spike in the artwork should always mean the copy nearby is about a failure.

02 — The mark

Read the eyes

The canary carries the entire proposition in its face: a checkmark in one eye and a bar chart in the other. Verification and measurement, staring straight at you. Those two glyphs are the brand's secondary iconography — use them wherever the product proves something rather than claims it.

Vigilant, not cute

The brow is angled. Never soften it, never tilt the bird into a friendly mascot pose. It is on duty.

Gold on dark

The mark is drawn for dark grounds. On light backgrounds it needs the ink outline to survive — never place it on mid-tone grey.

Clear space

Keep the crest's height as minimum breathing room on every side. The spikes must never touch a container edge.

03 — Colour

One signal, one ground

Canary Gold
The signal. Status, emphasis, the trace, one CTA per view.
Ink
The mark's outline. Borders and structure on light grounds.
Canvas
The default ground. Near-black, faintly blue.
Paper
Text on dark. Warm — never pure white.
Calm
All-clear only. Used sparingly; quiet is the default state.
Alarm
Confirmed failures. Never for marketing urgency.

Gold does the work of an accent colour and a brand colour, so it must stay scarce. If a screen has three gold elements competing, two of them are wrong.

04 — Typography

Industrial display, humane body

Your store breaks quietly
Archivo · 700–800 · headlines, −0.02em tracking
A discount stops applying and nobody gets an error. The orders just quietly go out at full price.
Instrument Sans · 400–600 · body, 1.6 line-height
412 orders · 3 rules · 0 failures
JetBrains Mono · 400–500 · numerals, status, evidence
05 — Status

Four states, no ambiguity

All clear Needs a look Problem found Not checked yet

“Not checked yet” is a real state and must never render as green. A canary that has never reported and one that just passed look identical to a hurried merchant — and that confusion is precisely the failure this product exists to prevent. Grey it, name it, and say when it will next run.

06 — Voice

Evidence, not adjectives

Do

  • “12 qualifying orders were charged shipping.”
  • “Expected: shipping 0 · Actual: USD 9.95”
  • “This started about 2h after ‘Free shipping over 100’ was edited.”
  • “Checked 412 orders against 3 rules.”
  • “This is a problem with ShopCanary, not your store.”

Don't

  • “Never lose revenue again.” — a guarantee we can't make
  • “Everything looks great!” — a claim with no receipts
  • “Powerful AI-driven insights” — says nothing
  • “URGENT!! ACT NOW” — alarm colour is for real alarms
  • Any comparison naming another app

Every claim in the product and the marketing must be something the app can show. ShopCanary detects and reports; it never edits a store, and the copy must never imply otherwise.