Lightlines
Catalogue
Sign in
By backnotprop

plannotator-visual-explainer

backnotprop

Turn technical ideas into clear visual explainers.

technical visualization

What it does

Generate self-contained HTML visual explanations, plans, and PR walkthroughs, then deliver them through Plannotator.

When to use it

Use it for implementation plans, PR explainers, architecture diagrams, data tables, slide decks, project recaps, comparisons, or other visual explanations.

How to use it

Give it a technical visualization task in the project; it generates a self-contained HTML explainer and delivers it through Plannotator.

What you provide

  • the visual explanation topic
  • An existing project

Access · 4

This skill

npx skills add nicobailon/visual-explainer -g --yes

Execute

Installs visual-explainer

plannotator annotate

Execute

Opens Plannotator annotation UI

visual-explainer SKILL.md

Read

Reads visual-explainer instructions

~/.claude/skills/visual-explainer/SKILL.md and ~/.agents/skills/visual-explainer/SKILL.md

Read

Checks skill installation paths

What you need · 2

The plannotator command must be available to open the generated file in its annotation UI.

The visual explainer path delegates to visual-explainer and requires its workflow, references, and templates.


About this skill

Visibility
Public
Repository
backnotprop/plannotator
Created
Oct 8, 2026
Updated
Oct 8, 2026
Files
6