DreambaseRegistry
BlocksSkills

Getting started

  • Introduction

Blocks

  • Overview
  • Questionnaire CardNew

Skills

  • Overview
  • data-presentation
  • data-stories
  • echarts
  • industrial-schematics
  • mcp
  • micrographic-design
  • public-reports
  • skill-creator
  • visualization-design

Built by Dreambase. Open source under MIT.

GitHub

Skill

dreambase-micrographic-design

Design graphics in the micrographics style — the aesthetic that borrows the visual language of regulatory compliance labelling (rating plates, garment care tags, spec sheets, technical drawings) and uses it as intentional design. Hairline rules, boxed compartments, tick scales, registration marks, corner brackets, LABEL: value pairs, invented telemetry and seals, barcodes, batch codes, mono micro-type against huge display type, line-screen and halftone texture. Use when the user asks for a spec-sheet, technical-label, rating-plate, care-tag, "utilitarian", "technical graphics", "micro design", or FUI look; wants a compliance-label pastiche; wants apparel, poster, zine, packaging, credential-badge or identity work in a technical/industrial idiom; asks for graphics that "look engineered" or "like a spec sheet"; or wants tick marks, crosshairs, callout leaders, or micro-typography as a design system — even if they can't name the style. Covers the certification-mark legal guardrail.

evalsreferences
npx skills add DreambaseAI/skills --skill dreambase-micrographic-design
View on GitHub

Micrographic Design

The aesthetics of technical information: design that borrows the visual language of regulatory compliance labelling and uses it deliberately.

Two things, kept straight

Compliance labelling is the real-world artifact — the legally mandated marks on a power brick, an appliance nameplate, a garment tag. It's a subfield of information design, usually executed by regulatory affairs staff and packaging engineers rather than graphic designers. That's why it looks the way it does.

Micrographics is the aesthetic movement that borrows that look on purpose.

The skill teaches the style. The source is where the vocabulary comes from. Keeping these separate matters constantly: a real care label must be correct, a micrographic graphic must be convincing, and the two goals diverge the moment a legal requirement enters.

A caveat worth stating to users: "micrographics" is a moodboard term with no formal definition — no dictionary, standard, or institution defines it, and the real dictionary meaning is microfilm/microform reduction, something else entirely. Adjacent tags people actually use: utilitarian, micro design, technical graphics, spec-sheet aesthetic, FUI (itself an unstandardised term). Of the whole cluster, only "vernacular design" and "anonymous design" have real critical literature behind them. Don't present any of these as established terminology, and don't repeat the common claim that the phrase "the aesthetics of technical information" was coined by the creator who popularised it — references/lineage.md has the correct genealogy.

Two modes — decide this first

Nearly every mistake in this idiom comes from confusing them.

Simulation — produce a plausible artifact: a fictional rating plate, a care-tag pastiche, a credential badge, a spec sheet. Monochrome, compliance-scale, assembled by constraint. The test is whether someone who reads plates would believe it.

Applied — design something in the idiom: apparel, a poster, an identity, a UI. Palette is free and often saturated or dark; the display face is free and often warm; scale contrast is extreme; composition is deliberately art-directed. The test is whether it looks designed and the message lands.

Applied is the more common request, and it's where the style actually lives commercially. The rules that make a simulation convincing — deliberate misalignment, monochrome, everything at 4–9 pt — will strangle applied work if you apply them literally.

The strongest pieces nest the two: a composed poster or garment carrying one simulated fragment — a spec block in a corner, a data plate on a sleeve. The simulated part lends credibility; the composition makes it design.

references/visual-grammar.md splits every rule by mode. Read it before building.

What actually makes it work

The style is not a texture pack. Every visual rule traces to a physical or legal constraint on the real artifacts, and the constraints are what produce the coherence:

  • Single-colour printing — so grouping is done with hairline rules and boxed compartments, because a rule is the cheapest mark available and colour costs a whole pass.
  • Binary marking processes — so no gradients, no halftones, no shadows. There is physically nowhere for a tone to live.
  • A legibility floor of roughly 4–9 pt set by five separate regulators — so the compression is the aesthetic.
  • A fixed regulatory payload meeting a fixed area — so density is a consequence, not a style choice.
  • Marks from a dozen standards bodies that no authority can harmonise — so the assembly is genuinely incoherent, and that incoherence is the hardest thing to fake.

Read references/visual-grammar.md for the full chain of cause and effect. Knowing the why is what lets you break a rule intelligently rather than accidentally.

The legal gate — raise this early

Conformity marks carry real liability, and so do the care symbols.

Never place a genuine certification mark (UL, CE, FCC, CSA, TÜV, RCM, PSE, KC, CCC …) on a product, package, or mockup in a way that implies certification the product doesn't hold. That's certification fraud with real consequences — in the EU it's a per-se offence with no confusion test, and US law reaches trafficking in the labels and stickers themselves.

Three things make this trickier than it first looks:

  1. Lookalikes are banned too. The instinct — draw something CE-shaped but slightly different — is precisely what the rules target ("likely to mislead… as to the meaning or form"). Either show the genuine mark editorially, or invent something clearly distinct. The middle path is the dangerous one.
  2. Marketing counts, not just products. Displaying a trust or quality mark without authorisation is unfair in all circumstances — a landing page or an ad can be an offence with nobody actually deceived.
  3. The garment care symbols are live registered trademarks, held by GINETEX and licensed. Reproduce the construction logic, not the symbol set.

So: stop and raise this with the user whenever the output could become a physical product, packaging, or advertising — including a t-shirt, which is itself a product. Then invent marks instead (references/marks-and-legal.md has the procedure, and inventing is aesthetically free — it costs nothing and often looks better).

Editorial, artistic, and UI contexts are much lower risk. Merch is the hard case, not the poster.

This is design guidance built from primary legal sources, not legal advice — for anything shipping, say so and recommend real review.

Failure modes

The five ways this style fails, in the order they actually happen:

  1. Fake data — but know what "fake" means here. Invented telemetry is the point: STATUS: ACTIVE, CLEARANCE: LEVEL 3, DIVISION: CORE PRODUCTION, fictional seals and issue numbers are world-building, and the idiom runs on them. What must be real is anything a viewer would reasonably act on or verify: a barcode or QR must scan, a measurement presented as a measurement must be one, and a real standard number must not sit beside an invented mark. Fiction is fine when it reads as fiction; fakery is not fine when it reads as fact. Invent the institution first and the telemetry stays consistent by itself.
  2. Illegibility. In applied work the micro-layer is texture and counterpoint — the message lives in the display type. When micro-type carries the core message, it buries it. Test: can a normal person find the point in two seconds? If the answer is only in 6 pt type, the design has failed at its actual job.
  3. Wrong brand fit. The style signals rigor, engineering, and measurement. On a brand whose value is warmth, play, or simplicity, it's a borrowed costume. Say so rather than executing it well in the wrong place.
  4. Redrawing legal marks. Real conformity marks have fixed geometry and restyling them to match your grid is both wrong-looking and, on shipping product, illegal.
  5. Over-composing — in simulation mode only. Real plates are assembled by regulation, not taste, so perfect optical alignment reads as fake and you deliberately preserve misalignment as the trace of real constraints. In applied mode the opposite holds: compose deliberately, align properly, art-direct it. Faking incoherence in a poster or a garment just reads as sloppy. Know which mode you're in before you decide whether alignment is a virtue.

Workflow

  1. Pick the mode. Simulation or applied — or applied-with-a-simulated-fragment, which is usually the best answer.
  2. Check the fit. Does this brand and this message benefit from a rigor signal? If not, say so before building.
  3. Check the surface. Web, print, apparel, or data display — each has a different legibility floor, production ceiling, and legal exposure (references/applications.md). Apparel and packaging trigger the legal gate.
  4. Build the institution as an identity, not a garnish. Name and descriptor, a mark (bar-array formula), a warm wordmark, one saturated ground colour, a telemetry vocabulary, an identifier format, a territory and date stamp (references/identity-system.md). Everything else falls out of this, and skipping it is why output reads as a spec sheet rather than a brand. Gather any genuinely real content too — a real URL to encode, real specs where they exist.
  5. Choose the source register. Rating plate, care tag, spec sheet, credential badge, drawing title block, or a hybrid (references/source-vocabulary.md).
  6. Set the system. Simulation: monochrome, compliance scale, two sizes. Applied: pick the ground colour and the four type registers; decide print or emissive surface; establish the huge/tiny scale contrast with nothing between; choose two or three texture moves (references/visual-grammar.md).
  7. Invent any conformity marks with fictional identifiers (references/marks-and-legal.md).
  8. Compose according to mode — assemble by constraint for simulation, art-direct for applied.
  9. Put it on something. This idiom is almost always shown on a physical object — a container, a coach jacket, an embroidered patch, a laminated credential, a packaging box, a print spread, a hardware panel. A mark on white is not the deliverable; the system applied across two or three artifacts is.
  10. Render it, measure it, then look at it. Run references/self-check.md against the actual output — empty area, type-register distinctness, contrast, micro-band content, mark at 16 px, placeholder residue, code decoding. Reading your own markup is not verification; every check in that file exists because the failure it catches is invisible in code and obvious in the render. Expect the first fix attempt at a density failure to relocate the void rather than remove it — re-measure after fixing.

References

  • references/visual-grammar.md — the buildable spec: the two modes, why each signature exists, typography, the small-size band, elements, layout, colour, texture, the emissive variant, and the incoherence rules. Read first for any build.
  • references/identity-system.md — the mark formula (primitive + modulated bar array), wordmarks, the four type registers, seals, illustration modes, and how to build the fictional institution as a full identity. Read whenever the output is a brand, logo, apparel, or anything that should look designed rather than assembled — this is what's missing when output reads as a spec sheet instead of a brand.
  • references/source-vocabulary.md — care labels (ISO vs ASTM, the modular construction system, the modifier grammar), rating plates, IEC/ISO equipment symbols, IP codes, date codes, and machine-readable codes. Read when borrowing a specific register.
  • references/marks-and-legal.md — the four-tier free-vs-restricted taxonomy, what a designer may and may not do, the three legal regimes, how to invent a mark, and how marks actually sit on a real plate. Read whenever a conformity mark is involved.
  • references/self-check.md — runnable checks to verify your own output before returning it: empty-area measurement, type-register distinctness, contrast, micro-band audit, mark legibility at 16 px, placeholder residue, code decoding, mode consistency. Run this on every build.
  • references/applications.md — per-surface craft for web, print/packaging, apparel, and data visualisation, plus composition with the other Dreambase skills.
  • references/lineage.md — the pictogram tradition this inherits from (ISOTYPE, Aicher, DOT/AIGA) with their actual construction rules, vernacular design as a concept, and how micrographics differs from adjacent aesthetics. Read when justifying an approach or building an original symbol family.

Output discipline

State the source register, the surface, and the type scale up front. Deliver real content or explicitly flag placeholders as placeholders — never let invented specs pass silently as real.

Every code scans. Every metric traces to something. Every chart still passes dreambase-visualization-design's integrity gate — the style signals precision, which means an inaccurate micrographic display is worse than an inaccurate plain one, because the aesthetic itself is a claim to rigor.

When the user wants this on something shippable, raise the certification-mark question before building, not after.