Whiteboard Explainer

Build VideoScribe-quality whiteboard explainer videos in HyperFrames — the photo-hand mask-reveal architecture with per-element isolated artwork, Whisper word-timestamp sync, and hard QA gates that prevent the classic failure modes (elements cut off or overlapping, draws out of sync with the voiceover, graphics visible before the hand reveals them, low-detail art). Use whenever the user asks for a whiteboard / hand-drawn / sketch-style / "drawn by a hand" explainer video. This skill governs MECHANICS only — visual style (fonts, palette, art direction, music) is designed fresh per project and m

9 stars 2 forksImages, Video & Audio

Install

skills CLI (Claude Code, Cursor, Codex and more)

npx skills add brandonvant/claude-skill-whiteboard-explainer --skill whiteboard-explainer

Manual install

git clone --depth 1 https://github.com/brandonvant/claude-skill-whiteboard-explainer.git /tmp/claude-skill-whiteboard-explainer
mkdir -p ~/.claude/skills
cp -r /tmp/claude-skill-whiteboard-explainer/. ~/.claude/skills/whiteboard-explainer

Personal skills live in ~/.claude/skills. Use .claude/skills in a project folder to share a skill with your team.

From the SKILL.md

# Whiteboard Explainer

Produces a whiteboard-animation explainer where a photographed hand appears to
draw detailed illustrations and hand-written labels on paper, in sync with a
voiceover. Built on HyperFrames — read `/hyperframes` and `/hyperframes-core`
for the composition contract; this skill adds the whiteboard-specific
architecture and its non-negotiables.

**Style freedom clause (hard rule):** this skill never prescribes fonts,
colors, art styles, subjects, or music. Design every video's look fresh with
the user. Only the mechanics below are fixed.

## The architecture (non-negotiable)

Professional whiteboard tools (VideoScribe, Doodly) do NOT animate the art's
stroke paths. They reveal **finished, detailed illustrations** through an
**animated mask** sweeping a serpentine path, while a **photographed hand
holding a marker** rides the mask's tip. Line-quality comes from the artwork;
the animation only controls WHEN each region appears. Never hand-author
minimal SVG figures as the artwork — that caps quality at stick figures.

Three structural rules eliminate whole error classes *by construction*:

1. **One image per drawable element.** Every element that appears at its own
   narration moment (a ship, a label's background, a magnifier inset, a
   thought bubble) gets its own isolated image on a pure white background,
   stacked in identically-positioned art blocks. Never share one image
   between elements revealed at different times — shared-image region

Read the full skill on GitHub

Details

Skill name: whiteboard-explainer
Repository: brandonvant/claude-skill-whiteboard-explainer
License: MIT
Repo updated: 9 July 2026

FAQ

What does the Whiteboard Explainer skill do?

How do I install the Whiteboard Explainer skill?

skills CLI (Claude Code, Cursor, Codex and more): npx skills add brandonvant/claude-skill-whiteboard-explainer --skill whiteboard-explainer. Skills go in ~/.claude/skills (personal) or .claude/skills (project), and Claude loads them automatically when a task matches the description.

Is Whiteboard Explainer popular?

It lives in brandonvant/claude-skill-whiteboard-explainer, which has 9 GitHub stars and 2 forks.

Related skills

Youtube Publisher

smixs/youtube-publisher

End-to-end video publishing pipeline: download from Google Drive, upload to YouTube, transcribe audio via Deepgram or Fireworks Whisper, generate title/description/timestamps, clean up temp files. Use when: "залей на YouTube", "опубликуй видео", "upload to YouTube", "видео из Drive на YouTube", "meet recording to YouTube", "транскрибируй и залей", "publish video", "upload recording". NOT for: video editing, adding intros/effects, non-Drive video sources, YouTube channel management, or live streaming.

Images, Video & Audio

Video Structure Analyzer

sharon-laicc/viral-video-decomposer

拆解爆款短视频、Vlog、小红书/抖音/B站视频、广告素材或竞品视频时使用。用于把视频链接、截图、录屏、字幕、逐字稿或参考视频拆成镜头级拉片表、爆款机制、可复用结构、批量选题变量、脚本/分镜/prompt，以及给后续视频生成 agent 使用的 JSON brief。也适用于用户说“分析爆款视频”“拆视频”“拉片”“拆解短视频”“复刻这种视频结构但不要抄”“根据爆款批量产出视频方案”等场景。

Images, Video & Audio

Imperium Brain

ceoimperiumprojects/imperium-brain

The Ultimate Startup OS for Claude Code. Routes to 18 domain skills across startup ops, competitive research, and content creation. Use when the user mentions anything related to: startups, strategy, fundraising, marketing, sales, product, finance, legal, engineering, competitive research, ecosystem mapping, LinkedIn posts, carousels, presentations, slides, brand identity, tone of voice, SOPs, runbooks, video creation, API discovery, images, visual media, stock photos, or any business/startup/content topic.

Images, Video & Audio

Heypocket Reader

tmustier/heypocket-reader

Read transcripts and summaries from Pocket AI (heypocket.com) recording devices. Use when users want to retrieve, search, or analyze their Pocket recordings, transcripts, summaries, or action items.

Images, Video & Audio

Linear Style Illustration

yanliudesign/linear-style-illustration

Dark "Linear/AI-OS" style technical diagrams — near-black background, cyan × purple × lilac duotone, JetBrains Mono uppercase labels, pill-shaped SVG nodes, glowing hub/kernel layer. Use when the user wants a "Linear 风格 diagram", a dark tech/architecture diagram, a product flow / state machine / layered-stack / hub-and-spoke diagram for a deck or landing page, or references screenshots that look like a dark AI product OS deck. Outputs a self-contained HTML file with inline SVG, ready to drop into a slide deck or export as PNG. Keywords: Linear style diagram, dark tech diagram, kernel diagram,

Images, Video & Audio

Etsy Listing Helper

silennsong/etsy-listing-helper

Generate complete, copy-paste-ready Etsy listing content (title, tags, description, materials, category, attributes, alt text, variation ideas) from POD product spec text and/or white-background product photos. Use this skill whenever the user provides product information (Material Description, Product Size, Printing Technique, etc.) and/or e-commerce product images and wants Etsy listing info, listing copy, SEO tags, or anything related to publishing a product on Etsy — in any language. Also trigger when the user only sends product images in a session where product base info was given earlier

Images, Video & Audio

Browse the most popular Claude skills, all images, video & audio skills, or write your own with the skills generator.