Files
pbakaus_impeccable/skill/reference/craft-floor.md
T
Paul BakausandClaude Fable 5 33a1c5fcae Ban kickers outright: one eyebrow above a heading is one too many
The detector's repeated-section-kickers rule waited for three tracked
labels before calling the pattern; generated pages earn the finding on
the first one. Retire that id and replace it with kicker-above-heading,
which flags any tracked-caps or small-caps label block sitting directly
above an h1-h4 or heading-role element, at full warning severity.

The candidate gate absorbs the false-positive shapes the repetition
count used to paper over: editorial category-and-date meta lines,
breadcrumbs with separators, legal and chapter numbering, application
panel context labels, nav landmarks before page titles, and stat
callouts with the label below the number. Hero-scale h1 eyebrows stay
with hero-eyebrow-chip so one element gets one finding, and the static
cascade now carries font-variant so small-caps kickers register.

The craft floor entry moves from caution to ban in the same breath.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
2026-07-27 18:55:52 -07:00

5.4 KiB
Raw Blame History

Craft floor

Load this after the direction is settled, and build without announcing the checklist. A pinned brief or the committed visual world overrides anything here; your own habit does not. When the design hook is active it already enforces the mechanical checks below as you edit: act on its findings instead of re-auditing each rule.

Verify

Each of these is a check on the built result, not an intention. Run them together in the batched inspection rounds, not as separate screenshot trips; the checks share one render.

  • Contrast: body and placeholder text ≥4.5:1, large text ≥3:1. On colored surfaces tint secondary text from that hue or the foreground; never gray.
  • Depth: shadows carry an offset and a soft blur. A zero-offset colored halo is decoration.
  • Spacing: tight groups, generous separation, more space above a heading than below it. Read the computed values.
  • Type: body measure 6575ch, display max 6rem, tracking floor -0.04em, balanced headings, obvious scale and weight steps. Run the real copy at every breakpoint and fix what overflows.
  • Motion: one authored moment, not scattered effects and not one identical entrance on every section. Exponential ease-out from an already-visible default. Reach past transform and opacity: blur, backdrop-filter, clip-path, mask, and shadow belong to the palette when they stay smooth.
  • States: hover, disabled, loading, error, empty. Plus real content, working controls, responsive composition, keyboard focus.
  • Copy: the product's own language. Controls name their action; errors name the problem and the recovery.
  • Coverage: every brief requirement present and findable within seconds.

Refuse

These are the category's defaults, not bans: the brief's own words can earn any of them. Reaching for one when the axis is free means you were not deciding; recognizing that means rewriting the element, not softening it.

Page scaffolds:

  • Same-size cards of icon plus heading plus text as the page structure. Cards are the lazy container; nested cards are always wrong.
  • The hero-metric template: big number, small label, supporting stats, accent.
  • A kicker or eyebrow above a heading. This one is a ban, not a default: no brief earns it back. The heading carries its own weight; delete the label and let the heading speak.
  • Section numbers (01 / 02 / 03) unless the sequence itself carries information the reader needs.
  • A modal for a task that needs neither interruption nor protected focus.

Surface habits:

  • Gradient text. Emphasis comes from weight or size.
  • Glass and blur as decoration rather than as a specific effect.
  • A colored border-left or border-right above 1px on cards, list items, callouts, or alerts.
  • Sparklines, progress rings, and soft-shadowed rounded rectangles standing in for content.
  • Monospace as a costume for "technical" rather than for code, data, or measurement.
  • Light or dark picked by category. Pick it from the use scene: who, where, under what ambient light.
- Tracking stops at -0.04em. -0.02 to -0.03em usually reads better. - Declare elevation once, border or shadow. A 1px border under a wide soft shadow is the ghost card. Card radii stay at 1216px; pills are for small controls. - Real illustration or none. Sketch-style SVG scenes, `loose-sketch` / `doodle` class names, and `feTurbulence` grain read as amateur. - Backgrounds are surfaces, textured only from the subject's world. `repeating-linear-gradient` stripes and two-axis grid overlays need an actual canvas, map, blueprint, or measuring tool under them. - Claims and configuration come from supplied truth; label illustrative values honestly. Naming a concept and then ironizing it is not a claim. Never animate an image on hover, directly or through its parent. It is not an action target. Give the container the feedback.

The floor holds the mechanics; it never picks the direction. With every check green, spend the page on the committed world, and when torn between refined and committed, commit.