skills.rest
lauhon
lauhonCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

show-me

Generates self-contained HTML artifacts that explain decisions, trade-offs, risks, and systems visually.

5|2|Updated Mar 9, 2026
Search Tags:#decision making#html#data visualization#communication#diagram#visual explanation#explanation frames
One-click install
npx skills add https://github.com/lauhon/pi --skill show-me-lauhon
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: show-me
Source: https://github.com/lauhon/pi/tree/main/skills/show-me
Command: npx skills add https://github.com/lauhon/pi --skill show-me-lauhon

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? When someone says "I don't get it" or buries an answer in a wall of prose, plain text often fails to make an idea land. This Skill turns a confusing topic — a decision, trade-off, risk, process, or unfamiliar concept — into one slim, self-contained HTML page that explains the idea itself, not the conversation that produced it. ## Core Features & Use Cases - Confusion-first routing: Diagnoses the shape of the confusion (no bottom line, unclear trade-off, unknown odds, repeated failure) and maps it to a named explanation frame such as Minto's Pyramid, Cynefin, Gigerenzer's natural frequencies, Tufte's slopegraphs, or Meadows' causal loops. - Single-file HTML output: Builds one self-contained HTML artifact with inline CSS, optional inline SVG, and at most one Mermaid CDN include — no build step, no framework. - Evidence-based craft rules: Enforces direct labeling, one accent color with the Okabe–Ito palette, assertion-style titles, and strict removal of decorative elements. - Use Case: After a long discussion comparing three database options, ask for a visual and receive a 2×2 quadrant HTML page placing each option on the two axes that actually matter, readable by someone who never saw the conversation. ## Quick Start Ask the assistant to show you a visual explanation of the trade-off between the three options we just discussed as a single HTML file.

Frequently Asked Questions about show-me

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I turn a confusing explanation into a visual HTML page?▼

Describe the decision, trade-off, or concept you want clarified and ask for a visual explanation. The Skill identifies the type of confusion, picks a matching frame like a 2×2 matrix or frequency tree, and outputs one self-contained HTML file you can open in a browser.

What kinds of diagrams can this HTML explanation skill generate?▼

It produces quadrant matrices, frequency trees, icon arrays, slopegraphs, small multiples, causal loop diagrams, timelines, big-number cards, and side-by-side analogies. Each form is chosen based on the reader's confusion, not the subject matter.

Does the generated HTML file need any libraries or build tools?▼

No. The output is a single HTML file with all CSS inline and no framework or npm dependencies. The only optional external include is one Mermaid CDN script for flow diagrams, and pure SVG is used instead when the file must work in sandboxed viewers.

When should I not use a visual explanation artifact?▼

Skip it when a single sentence or a small table already makes the point. HTML visuals earn their cost only when the idea is spatial, proportional, relational, or comparative and the reader would otherwise hold several things in their head at once.

Why does the artifact avoid mentioning the conversation that produced it?▼

The artifact explains the idea itself so a stranger who never read the discussion can understand it. References to the session, chronology of the analysis, or options that only came up in passing are removed because they add load without aiding comprehension.

Related Skills

Explore More Content & Communication Skills→
wpsnotewpsnote
162

class-note-builder

Organize raw learning materials into structured study notes with WPS.

Official
Intermediate
memectmemect
13

pdf-review-dashboard

Generate a self-contained HTML dashboard comparing PDFs with verification results.

Community
Intermediate
jiahao-shao1jiahao-shao1
36

paper-analyzer

Generate a structured causal-chain analysis report from an arXiv paper.

Community
Advanced
propane-aipropane-ai
4

data-views-and-reports

Generate dashboard specs and report content from connected data tools.

Official
Intermediate