Skip to content
cccskills
FreePublished on GitHub

reimagine-it-infographic

Content-derived infographic poster — reads the source file and builds a statistical poster from the facts already in it. Not a dashboard, not a CV, not an AntV template. Uses common-scale encodings (Cleveland–McGill floor), ISOTYPE unit counts (Neurath), custom data glyphs (Lupi/Fragapane), and a lossless data table. Palette, glyphs, and composition are derived from the source's own content. No pies, donuts, gauges, 3D charts, or fabricated KPIs. Part of the reimagine-it Content-Derived Design suite.

The English summary is being prepared. Showing the original description.

Run score Not tested

See how to install

Files included (1)

  • SKILL.md4.3 KB

SKILL.md (original)

Review the instructions the agent will receive before you install.

/reimagine-it infographic

Parent: ../SKILL.md — the full Content-Derived Design engine. Research pack: ../references/research/infographic-craft.md — 15-source infographic method (Cleveland–McGill, Tufte, Bertin, ISOTYPE, Minard/Snow, Cairo, Lupi, FT Visual Vocabulary, USWDS, WCAG charts, InfoAlign layouts). Domain pack: ../references/domains/infographic.md — the infographic domain non-negotiables.

Builds a statistical poster of facts already in the source — not an ops dashboard, not a CV, not an AntV template clone.

Hard non-negotiables

  1. Cleveland–McGill perceptual ranking. Position along a common scale > length > angle > area > volume > color saturation. Encode the most important comparisons as positions, not pies.
  2. ISOTYPE unit counts when the data is discrete countable things (Neurath: one pictogram = N units, repeated, not scaled).
  3. Custom glyphs from the source. Lupi/Fragapane pattern — draw a visual alphabet from the data itself (leaves, braids, snakes, whatever the content demands), not generic bar/pie/donut.
  4. Lossless data table. Every chart has a companion table; the infographic is a supplement to the data, not a replacement.
  5. No pies, donuts, gauges, or 3D charts. Pie charts rank last in Cleveland–McGill; donuts are pies with the center punched out (worse); 3D distorts perception.
  6. No fabricated KPIs. Every number on the poster comes from the source, not extrapolated or invented.

Structure router

Before drawing, sniff the source and lock a structure:

StructureWhenInfoAlign scenery
listUnordered peersgrid, star
sequenceSteps / dated beatsportrait, landscape
hierarchyTree / nestingportrait
compareTwo+ groupsportrait-grid
valuesMagnitudesportrait-grid
relationNodes + edges the source namesspiral

Do not default to gold Texas (sequence+compare on portrait-grid). Derive from THIS source.

Procedure

  1. Load ../references/research/infographic-craft.md and ../references/domains/infographic.md.
  2. Extract anchors from the source (3–5 concrete nouns, dates, numbers).
  3. Route the structure (list/sequence/hierarchy/compare/values/relation).
  4. Pick InfoAlign scenery (grid/star/portrait/landscape/portrait-grid/spiral).
  5. Derive palette from source content (≤ 5 colors).
  6. Build a custom visual alphabet from one datapoint.
  7. Encode comparisons using common-scale positions (not pies).
  8. Include a lossless data table below the poster.
  9. Verify: every number traceable to source, no fabricated KPIs, no AntV template chrome.

Must not

  • Clone gold Texas infographic's scenery or poster chrome onto a different source
  • Use a pie chart, donut, gauge, or 3D chart
  • Invent statistics the source does not contain
  • Use AntV/Looker/Datawrapper templates
  • Skip the structure router and default to portrait-grid
  • Ship without a lossless data table

Reviews

No reviews yet. Tell others what you thought.

Comments

No login needed. Share how it worked for you, ask a question, or note where it did not run.

No comments yet. Be the first to write one.

Comments are published right away. Do not include personal information such as email addresses or phone numbers. Up to 2 URLs.

0 / 1,000 characters

This form is protected by reCAPTCHA, and the Google Privacy Policy and Terms of Service apply.

More skills from this repository

Content-Derived Design — reads existing HTML and writes a stronger standalone page from headings, facts, names, dates, numbers, links, emails, and colors already in that file. CLI: npx reimagine-it --auto -i page.html -o out.html; also variations, lock, and audit. Use when the user says /reimagine-it, "reimagine it", "reinvent this", "redesign this page", "make an infographic", wants a content-aware redesign or a visual leap instead of a mood board. All 17 tokens: webpage, infographic, svg, 3js, simulation, artistic, cinematic, dashboard, photography, landing, editorial, gradient, showcase, motion, glass, lookbook, particles — plus leftover words as a brief. Also /reimagine-it audit for quality checks. The agent runs the CLI; it does not hand-author the page. Installed via npx skills add Kayforkind/reimagine-it or plugin marketplace. Not /better. Not a mood board. Does not ingest PDF, PPTX, or DOCX.

The English summary is being prepared. Showing the original description.

Kayforkind/reimagine-it211Updated Oct 22, 2026

Design Health — runs 19 deterministic quality checks on HTML output. Use when the user says /reimagine-it audit, "audit this page", "check design quality", or wants to verify craft-floor compliance before shipping. Catches blank plates, missing focus rings, non-compositor motion, off-palette accents, dead motion, fabricated content. No LLM, no API key. CI-ready with --json and exit codes. Part of the reimagine-it Content-Derived Design suite.

The English summary is being prepared. Showing the original description.

Kayforkind/reimagine-it211Updated Oct 22, 2026

Emit the content signals reimagine-it reads from an HTML file — title, anchors, proper nouns, dates, numbers, emails, links, source hex colors, and the derived palette — as JSON without generating a redesign. Use when the user says /reimagine-it extract, "what does the engine see in this page", "extract the palette", "pull the facts from this page", or wants content analysis for research, migration, or design-system work. CLI: npx reimagine-it extract -i page.html -o signals.json. Part of the reimagine-it Content-Derived Design suite.

The English summary is being prepared. Showing the original description.

Kayforkind/reimagine-it211Updated Oct 22, 2026

Generate one Content-Derived Design direction from an HTML source, or let Auto choose the strongest direction. Use when the user says /reimagine-it generate, "redesign this page", "make it a landing page", "turn this into an infographic", names a token (all 17: webpage, infographic, svg, 3js, simulation, artistic, cinematic, dashboard, photography, landing, editorial, gradient, showcase, motion, glass, lookbook, particles), or wants a content-aware redesign instead of a mood board. CLI: npx reimagine-it --auto -i page.html -o out.html. Part of the reimagine-it Content-Derived Design suite.

The English summary is being prepared. Showing the original description.

Kayforkind/reimagine-it211Updated Oct 22, 2026

Design DNA capture — extracts palette, type stack, motifs, motion, and 3D signatures from a shipped HTML file and saves them as a reusable reference pack. Use when the user says /reimagine-it lock, "lock this design", "save design DNA", "capture this look", or wants to reuse a shipped design on a different target. Locks capture palette, type, motif, and motion from a shipped HTML file. Part of the reimagine-it Content-Derived Design suite.

The English summary is being prepared. Showing the original description.

Kayforkind/reimagine-it211Updated Oct 22, 2026

Generate several distinct design directions from one HTML source plus a contrast sheet that shows every direction side by side. Use when the user says /reimagine-it variations, "show me options", "give me three takes", "which direction works best", or wants to compare design directions before choosing one. CLI: npx reimagine-it variations -i page.html -n 4 -o review/. Part of the reimagine-it Content-Derived Design suite.

The English summary is being prepared. Showing the original description.

Kayforkind/reimagine-it211Updated Oct 22, 2026

See all skills by Kayforkind

Report a problem with this skill