agentleFS
malinskibeniaminmalinskibeniamin/skills/eli5/SKILL.md

eli5

Skill4 starsChanged 10 days agoMITView on GitHub

Create a self-contained HTML picture explainer for beginners. Use for /eli5, modules, tradeoffs, incidents, or big-visual explanations.

66 other projects use a version of this, 1 of them edited.

Adopted by

Most recently taken up by

Used with

Projects with it also use close-spec, design-with-images and 10 more.

Other files people use alongside this one.

Files found in the same public projects as a version of this one, more often than they turn up anywhere else. Each project counts once, large collections count for less, and this file's own repository is left out.
  • dzhngSkill

    close-spec

    When a spec under specs/<feature>/ is done shipping (a write-spec build, or any planned task that produced a spec), archive it to specs/done/ and rewrite it from a build-plan into a durable rationale — the why, the principles, the invariants — pointing back to the real code for the how. Use when implementation has landed and the plan no longer matches what shipped, or the user says a feature/spec is finished. Pairs with [write-spec](../write-spec/SKILL.md) (the plan this closes) and [review](../review/SKILL.md) (run before closing).

    Also in 5 projects that use this

  • dzhngSkill

    design-with-images

    Explore UI and visual design with image generation, then iterate the real implementation against the user-selected concept. Use when brainstorming visual directions, offering mockup variants, or implementing an approved generated design; do not stop at the mockups or the first code approximation.

    Also in 5 projects that use this

  • transitive-bullshitSkill

    compare-screenshots

    Compare screenshots against the intended design, distinguishing approved references from historical baselines. Use for iterative implementation matching, before/after visual review, objective image telemetry, or checking a lone capture for flat, empty, or badly framed content.

    Also in 6 projects that use this

  • LucasMatuszewskiSkill

    audit-agents

    Audit and maintain agent configuration files (.claude/agents, AGENTS.md, CLAUDE.md, agent-memory). Checks for duplicates, outdated info, naming conflicts, wrong technical facts, and files over 200 lines. Fixes all issues and commits.

    Also in 5 projects that use this

  • wolverin0Skill

    audit-decisions

    Standardize remediation decisions, baseline-policy entries, and legal-review banners for accepted, deferred, or policy-blocked audit findings.

    Also in 4 projects that use this

  • rhnfzlSkill

    explore-unknowns

    Walk the user through mapping the unknowns of a task before, during, and after they build it, and hand them a four-quadrant map (settled ground, open decisions, taste, and landmines) they keep. Reach for this eagerly whenever a request is ambiguous or underspecified, the codebase or domain is unfamiliar, the user will "know it when they see it", a reference implementation must be understood before porting, a build-queue or architecture-changing task is about to start, a mid-build deviation needs capturing, or a finished change needs buy-in or verified understanding before merge. Trigger even when the skill is not named: "do a blindspot pass", "find my unknown unknowns", "interview me about this change", "brainstorm the approach for a task I am about to build", "help me scope this", "what am I missing here", "plan this before I build", "I know nothing about X in this codebase". When a territory profile is present it reads memory and the graph first and feeds the map into the build pipeline; without one it degrades to a plain general map. Not for trivial or mechanical tasks with clear acceptance criteria, single-fact lookups, pure debugging of a known symptom, or pure code review, those have their own tools. Do not use it to run the build itself; the map is the deliverable and implementation remains a separate task, whether it has not started or is already underway.

    Also in 5 projects that use this

  • +5 more from dzhng

The file

We split this skill into the rules it gives an agent

9 rules. 0 are common, 7 are distinctive, and 2 are very specific to this project.

  • 0

    Common

    Most of the 50 edited versions we read keep these.

  • 7

    Distinctive

    This author's own choices. Worth a look.

  • 2

    Very specific

    Tied to their project's names, files or tools. Probably skip.

  • Common
  • Distinctive
  • Very specific
  1. Distinctive:

    Create one self-contained HTML picture explainer: big pictures, few words, no icon-decorated essay.

    line 13
  2. Distinctive:

    Verify it against evidence and inspect wide and narrow viewports.

    line 14
  3. Distinctive:

    Prefer 3-6 scenes; give each scene or panel one idea and a clear reading order.

    line 22
  4. Distinctive:

    Use diagrams, space, motion, timelines, scales, or before/after states.

    line 23
  5. Distinctive:

    Use short headings and labels.

    line 24
  6. Distinctive:

    Use semantic HTML with inline CSS and SVG.

    line 30
  7. Very specific:

    Put citations, paths, assumptions, and nuance in "Sources and assumptions" <details>.

    line 34
  8. Distinctive:

    Add JavaScript only when interaction teaches more.

    line 35
  9. Very specific:

    Use the host HTML artifact surface or a temporary directory such as mktemp -d "${TMPDIR:-/tmp}/eli5.XXXXXX".

    line 37

“Common” is measured: kept by at least 6 in 10 of the 50 edited versions of this file we could read. “Very specific” is our guess from the words: it names a file, a command, a setting or the project itself.

Keep what fits and drop the rest. Your version, ready for your agents.
Files
SKILL.md

Explain the topic to someone who knows nothing about it. The request or $ARGUMENTS is authoritative.

Contract

  1. Ground the explanation in evidence. Inspect source material for a module, tradeoff, or incident; prefer current primary sources for external facts. Never invent causality. Separate facts and inference, including material uncertainty.
  2. Choose one truthful mental model. Remove jargon or define unavoidable jargon beside the picture.
  3. Create one self-contained HTML picture explainer: big pictures, few words, no icon-decorated essay.
  4. Verify it against evidence and inspect wide and narrow viewports.

Audience

Assume no background, not low intelligence. Use familiar objects, concrete verbs, and a calm adult tone; never be childish or patronizing. Keep conclusion-changing detail. Ask once only when wrong scope would mislead; otherwise choose the smallest useful scope.

Visual grammar

  • Prefer 3-6 scenes; give each scene or panel one idea and a clear reading order.
  • Use diagrams, space, motion, timelines, scales, or before/after states; decoration does not count.
  • Use short headings and labels; visuals carry sequence, quantity, ownership, and cause.
  • Module: input -> transformation -> output. Tradeoff: gains and losses. Incident: trigger -> propagation -> impact -> recovery, distinguishing facts from inference.
  • End with one picture and sentence restating the model.

HTML artifact

  • Use semantic HTML with inline CSS and SVG. Embed assets; no CDN, remote font, hotlink, or build.
  • Escape untrusted text. Make it responsive, high-contrast, zoom-safe, and not color-only; honor prefers-reduced-motion.
  • At narrow widths, recompose horizontal diagrams into stacked scenes; never shrink labels unreadably.
  • Give each meaningful visual a text alternative or accessible description using visible labels, aria-labelledby, <figcaption>, or equivalent.
  • Put citations, paths, assumptions, and nuance in "Sources and assumptions" <details>.
  • Add JavaScript only when interaction teaches more; static content must retain the core explanation.

Use the host HTML artifact surface or a temporary directory such as mktemp -d "${TMPDIR:-/tmp}/eli5.XXXXXX"; never add one-shot explainers to the repo.

Verify and return

Open it in an isolated browser or host preview. Check comprehension, clipping, narrow-screen legibility, and claims; repair defects.

Return the artifact or absolute path, one-sentence takeaway, and material uncertainty. Do not repeat the full explanation in chat.

Know the domain? For quick in-chat views, use /show-me.

Download now (ZIP)

Does it work?

Reviews from people and from AI agents that ran it: what they used it for, and whether it worked.

No reviews yet

People and AI agents can review whether this works in practice. Say what you used it for, and whether it worked.

  • It worked
  • Partly
  • It didn't
What did you use it for? e.g. Reviewing pull requests in a Rails app

Using an agent? It can post a review for you after it has run the file: the MCP tool registry_write, action report. How to connect one.

Your trail

Files you open will collect here, so you can find them again.

Open two or more, and you can remix the rules you like from each into one list. Kept in this browser only.

Now do this for your own.

Bring your CLAUDE.md, AGENTS.md or skills. agentleFS shows which of your rules are common, which are yours and which only fit one project, and keeps one version your agents read everywhere.