Hand-drawn Presentation Skill for Claude Code

A Claude Code skill that generates hand-drawn, marker-doodle style flowchart images for YouTube videos (or any explainer) on any topic — in one consistent, channel-ready aesthetic.

You call the skill, give it a topic, and it designs the slide and generates the image automatically using OpenAI's image API (gpt-image-1).

The example above was generated by the skill from the prompt: "a fully automated pipeline that scrapes Twitter/X profiles, analyzes them, finds viral posts, has Claude build the project, auto-records a video, and publishes to YouTube."

---

The style

Every image comes out in the same look, so a whole video series stays on-brand:

• Off-white paper background, felt-tip marker texture
• Big hand-lettered title with a loose purple scribble underline
• A row of 5–6 rounded pastel cards, each with a real hand-drawn icon and a short caption above it
• Diamond connectors between cards, start label (left) → end label (right)
• Dashed question-mark callouts hanging under each step
• A dashed "recipe" summary strip at the bottom
• Palette: peach → lavender → light blue → mint → pink → yellow on off-white

The aesthetic is locked in a fixed STYLE BLOCK inside the skill; only the CONTENT BLOCK changes per topic. That's what keeps every slide consistent.

---

Install

Requirements

• Claude Code
• Python 3.8+ (standard library only — no pip installs needed)
• An OpenAI API key with image generation access

Quick install

git clone https://github.com/MomoXplore/handdrawn-presentation-skill.git
cd handdrawn-presentation-skill
./install.sh

This copies the skill to ~/.claude/skills/handdrawn-presentation/.

Manual install

Copy the skills/handdrawn-presentation/ folder into ~/.claude/skills/.

---

Usage

1. Set your OpenAI API key (the skill reads it from the environment — it is never stored or committed):

   export OPENAI_API_KEY=sk-...

2. In Claude Code, run the skill:

   /handdrawn-presentation
   

   or just say "make a presentation for my video". You can include the topic inline:

   /handdrawn-presentation a flowchart about launching a SaaS side project
   

3. Claude asks for / refines the topic, designs 5–6 stages, generates the image, and shows it to you. The PNG saves to ./handdrawn/ by default.

Calling the generator directly (optional)

export OPENAI_API_KEY=sk-...
python3 skills/handdrawn-presentation/scripts/generate.py \
  --prompt-file my_prompt.txt \
  --out out.png \
  --size 1536x1024 --quality high

---

How it works

• skills/handdrawn-presentation/SKILL.md — the workflow + the locked style recipe and the per-topic content template Claude fills in.
• skills/handdrawn-presentation/scripts/generate.py — a dependency-free Python script that POSTs the prompt to OpenAI's image API and saves the PNG. Reads the key from OPENAI_API_KEY.

---

Security

• The script reads your key from the OPENAI_API_KEY environment variable only. No key is read from, written to, or committed in this repo.
• .gitignore excludes .env, generated images, and scratch prompt files.
• Never paste your API key into a chat or commit it. If you do, rotate it at https://platform.openai.com/api-keys.

License

MIT — see LICENSE.