Skip to content

The collectible artwork needs extracting, not drawing #480

Description

@maximsan

Corrected 2 Sep 2026 against screens.jsx (CardArt*, lines 1676–2311): the colour list below was incomplete — the arts also paint --ink, --art-roast-light, --art-sour, --art-seed-crease and the six --art-cherry-* layer tokens (CardArtLayers); and 32 <text> labels (IBM Plex Mono) appear across the arts, which the icon pipeline has never had to carry.

The collectible artwork exists. Nobody has to draw it.

CARD_ART (prototype/screens.jsx:2312) maps each collectible kind to a drawing, and the app has no counterpart — the tile (#434) and the card sheet (#385) both stand the module's mark in its place, so every card in a module looks the same.

The premise both tickets carried was wrong

Both framed this as "deciding who draws them", the question #87 asked of the grove — and #87's answer was that nothing was owed, because the premise was false. It is false here too, for a different reason:

  • ⚠️ This bullet was wrong, and it changed the shape of the work. Five arts compose a prop-taking FieldGuideFrame and eight compute their geometry with Array.from and Math, so the components have to be run, not sliced as text. The prototype runs them with React and Babel from a CDN — unavailable offline, and this repo's tooling carries no npm dependencies — so the extractor reads the dialect itself, in tool/extract_card_art/jsx.js, and refuses anything outside it.
  • The bank ships thirty-seven collectibles with thirty-seven distinct kinds, one drawing each. No duplication to collapse, and no transform trick like the grove's — but also no illustration to commission.
  • The repo already bridges prototype SVG into bundled assets: tool/extract_icons.js does exactly this for the design system's icon family, "extracts them rather than redrawing them: a mark the app shows is the mark the design drew, down to the stroke width".

So this is an extractor job, not an art job.

What it needs

  • Colour sentinels for the illustration palette. The extractor's SENTINELS cover --surface, --surface-2, --accent, --accent-ink and --bg. The card art also paints in --ink, --ink-mute, --rule, --sage, --berry, --cream, --art-ripe, --art-sour, --art-roast-light/-mid/-dark, --art-seed-crease and the six --art-cherry-* layer tokens (CardArtLayers), which need mapping to MoodColors and ArtColors on the Dart side. assertPaint already refuses anything unmapped, so an unhandled colour fails the run rather than shipping wrong.
  • A second family alongside the icons, since these are 100×100 illustrations rather than 24×24 marks — different viewBox, fills as well as strokes, per-element opacity.
  • Two call sites: the tile's 56px slot and the sheet's 150px well, which also wants the design's tinted frame around it.

The words in the drawings — ruled

Nineteen of the arts have English words drawn into them. ADR-0019 rules that they stay English in every language, as a named exception to ADR-0008 rather than an oversight in it. The alternative — stripping the text and drawing it in Flutter from translatable strings — was weighed and declined for now, and the way back is recorded in the ADR.

Acceptance criteria

  • A sibling — tool/extract_card_art.js — writes all thirty-seven arts as assets and fails the run on any paint it cannot map: extract_card_art_test.dart seeds a bad colour and asserts the run exits non-zero having written nothing. The guard watches stop-color and flood-color too, not just fill/stroke
  • The tile, the card sheet and the unearned face draw the card's own art, in the design's tinted 150px well
  • A kind with no art falls back to the module mark — card_art_mark_test.dart, and card_art_test.dart asserts every kind the bank ships has art today
  • flutter analyze, the metrics gate, dart format, the changelog check and the full suite are clean — 2357 tests, and CI green on PR #496 (544729c). Every one of the 37 arts is asserted to compile, against a control that proves the check can fail

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    design-parityCloses a finding in the app-vs-prototype divergence register

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions