/stick-figure: eine cartoonartige Erklärung mit Strichmännchen
Der Benutzer gibt eine Idee oder eine Frage („Warum sind Gähnen ansteckend?“, „Warum schubsen Katzen Dinge von Tischen?“, „Warum schieben wir Dinge auf?“). Du schreibst die Antwort in einem Satz, inszenierst eine kleine Szene, die sie zeigt, überprüfst ein paar Frames, renderst das Video und übergibst ein stummes MP4 (5–7 Sekunden).
${CLAUDE_SKILL_DIR} unten ist der Ordner dieses Skills (der Ordner, in dem sich diese SKILL.md befindet). Falls deine Umgebung ihn nicht ausfüllt, verwende den Pfad dieses Ordners. Speichere alles im aktuellen Ordner des Benutzers oder im von ihm benannten Ordner.
0. Setup-Prüfung
python3 "${CLAUDE_SKILL_DIR}/scripts/render.py" --check
Es dauert ein paar Sekunden; führe es aus, wenn du nicht sicher bist, ob dieser Computer eingerichtet ist. "ready": true bedeutet, es kann losgehen. Andernfalls führe die unter "fix" aufgeführten Befehle aus und teile dem Benutzer mit, dass es sich um eine einmalige Installation handelt: python3 -m pip install playwright (der Browser-Treiber), python3 -m playwright install chromium (nur wenn Google Chrome oder Edge nicht installiert ist, etwa 150 MB) und python3 -m pip install imageio-ffmpeg (nur wenn ffmpeg fehlt). Falls pip sich mit „externally managed environment“ weigert, erstelle einmal eine private Umgebung und verwende für jeden Befehl dessen Python: python3 -m venv ~/.animate-skills && ~/.animate-skills/bin/pip install playwright imageio-ffmpeg, dann ~/.animate-skills/bin/python -m playwright install chromium falls nötig. Unter Windows verwende py statt python3. Kein Browser möglich (z. B. in der Sandbox der Claude-App)? Siehe Ende dieser Datei.
1. Szene planen (kurz)
- Titel: die Frage oder Idee, kurz (maximal ~40 Zeichen).
- Antwort: die einzeilige Erklärung, wahr und einfach (maximal ~45 Zeichen). Sie erscheint etwa eine Sekunde nach Beginn.
- Die Szene: 1–4 Figuren, die die Antwort in 3–8 Beats über 5–7 Sekunden nachspielen. Zeige, was passiert: Gähnen, das sich von Person zu Person ausbreitet, eine Katze, die eine Tasse vom Tisch stößt, ein Hund, der aufwacht und wedelt. Der letzte Beat ist der Höhepunkt und bleibt bis zum Ende auf dem Bildschirm.
2. Spezifikation schreiben
Speichere stick-<thema>.json. Beispiel (examples/knock-things-off.json):
{
"title": "Warum schubsen Katzen Dinge von Tischen?",
"answer": "Jagdinstinkt, und es lenkt deine Aufmerksamkeit",
"scene": "room",
"props": [{"type": "table", "x": 0.62}, {"type": "cup", "x": 0.70, "on": "table", "wobbleAt": 1.6, "fallAt": 2.15},
{"type": "plant", "x": 0.08}],
"figures": [{"id": "cat", "kind": "cat", "x": 0.52, "on": "table", "head": "#F4A261", "hatColor": "#F4A261"},
{"id": "you", "x": 1.2, "label": "Du", "hat": "hair", "hatColor": "#6B4423"}],
"beats": [
{"who": "cat", "do": "look", "at": 0.0, "for": 1.0, "to": 0.7},
{"who": "cat", "do": "swipe", "at": 1.0, "for": 1.2, "to": 0.7, "say": "Boop"},
{"who": "you", "do": "run", "at": 2.3, "for": 0.8, "to": 0.86},
{"who": "you", "do": "surprised", "at": 3.1, "for": 0.9, "say": "Mein Becher!"},
{"who": "cat", "do": "sit", "at": 3.3, "for": 1.0},
{"who": "you", "do": "point", "at": 4.1, "for": 1.2, "to": "cat"},
{"who": "cat", "do": "love", "at": 4.4, "for": 1.0}
],
"arrows": [{"from": "cat", "to": "you", "at": 3.6, "for": 0.4}]
}
Mehr: examples/contagious-yawns.json (drei Personen), examples/procrastination.json (ein Büro, jemand kommt herein), examples/dog-wags.json (ein Hund und ein Kind im Park).
Szene: street (Himmel, Bürgersteig, Straße), park (Sonne, Hügel, Gras), room, office (Fenster mit Stadt), classroom (füge "board": "text" für die Tafel hinzu), night (Sterne und Mond), plain (füge "background": "#hex" hinzu).
Figuren (x von 0 = linker Rand bis 1 = rechter Rand; verwende -0.2 oder 1.2, um außerhalb des Bildschirms zu beginnen und hereinzulaufen). Drei Personen passen bequem in ein vertikales Video (x 0.2, 0.5, 0.8); eine vierte benötigt scale ~0.85 und ~0.22 Abstand. Ein Hund oder eine Katze von der Seite ist etwa 0.35 der Bildbreite (x ist sein Körper; die Nase ist ~0.2 davor): platziere ein Haustier ~0.3 von der Person entfernt, zu der es läuft.
Halte Namensschilder kurz („Bill“, nicht „Der Gesetzesentwurf“):
kind:person(Standard),cat,dog(seitlich, etwa ein Drittel der Körpergröße einer Person).id,x,label(ein Name unter ihren Füßen: „Du“, „Dein Gehirn“),scale(0.6–0.8 für ein Kind),facing(left/right; ansonsten schauen sie zur Mitte, dann dorthin, wo sie sich zuletzt bewegt, gezeigt oder geschlagen haben).on: auf Möbeln stehen:table,desk,bench,shelf,bed(platziere die Möbelprobe an der gleichen x-Koordinate).- Personen:
hat(cap,tophat,beanie,crown,bow,hair),hatColor(auch die Haarfarbe),head(Gesichtsfarbe),glasses(true),tie(eine Farbe). Haustiere:head(Fellfarbe),hatColor(Ohrenfarbe).
Beats ({"who", "do", "at", "for", "to", "say"}, in Sekunden): to ist die ID einer anderen Figur oder ein x-Wert (0–1).
do (Personen) | Wie es aussieht | do (Personen) | Wie es aussieht |
|---|---|---|---|
walk, run | Bewegt sich zu to | talk | Mundbewegung, eine Hand gestikuliert |
wave | Winkt, breites Lächeln | yawn | Arme hoch, großes Gähnen, Augen zu |
look | Dreht den Kopf zu to | point | Zeigt auf to (Kopf einer Figur oder Tischhöhe an einer x-Position) |
think | Hand am Kinn (mit say: eine Gedankenblase) | shrug | „Wer weiß?“ |
jump | Springt vor Freude | cheer | Arme hoch im V |
surprised | Springt zurück, „!“ | sad | Kopf gesenkt, eine Träne |
sleep | Augen zu, Zzz | laugh | Hüpft, breites Grinsen |
dance | Tanzt, Musiknote | idea | Arm hoch, Glühbirne |
love | Herz | fall | Fällt um und bleibt liegen |
raise | Eine Hand hoch (Abstimmung, Frage, „Ich!“) | write | Schreibt oder unterschreibt an einem Schreibtisch |
relabel | Ändert das Namensschild: {"who": "bill", "do": "relabel", "at": 4, "text": "Gesetz"} |
Haustiere: walk, run, jump, sit, swipe (eine Pfote schlägt in Richtung to, um Dinge umzuwerfen), sleep (zusammengerollt, Zzz), meow/bark/talk (Mund offen; füge say hinzu), surprised (gewölbter Rücken, „!“), look (dreht sich zu to um), wag (glücklich, Schwanz wedelt), love, idea, sad.
say platziert eine Sprechblase über dieser Figur für diesen Beat (bis zu 5 Wörter; think macht eine Gedankenblase; die Blase ersetzt das kleine Icon des Beats; Blasen halten sich von den Gesichtern anderer Personen fern). Der letzte Beat jeder Figur hält ihre Pose bis zum Ende (außer Gehen, Laufen, Sprechen und Gähnen), und die zuletzt gesagte Zeile in der Szene bleibt ebenfalls stehen, also ende mit dem Höhepunkt. point zielt auf den Kopf einer weiter entfernten Figur und auf die Brust einer nahen.
Requisiten ({"type", "x", ...}): Möbel und Bühnenbild bus-stop, tree, bench, desk (mit einem Laptop), table, door, sign (mit text), car ("drive": 1 fährt sie vorbei), house, plant, lamp, tv, bed; und kleine Objekte cup, mug, glass, vase, bottle, plate, ball, book, phone, box, paper (ein Dokument). Kleine Objekte stehen auf dem Boden oder "on": "table" (oder desk, bench, shelf, bed; gib ihnen einen x-Wert innerhalb der Breite dieses Möbelstücks, die etwa ±0,15 um seine x-Position beträgt); "wobbleAt": s macht eines wackeln, "fallAt": s stößt es um ("fallDir": -1 nach links); Tassen, Gläser, Vasen, Flaschen und Teller zerbrechen mit einem CRASH ("sound": "SMASH!" ändert das Wort), Bälle springen weg. Auch color, scale, front: true (wird vor den Figuren gezeichnet).
Pfeile ({"from", "to", "at", "for", "color", "hold"}): ein gepunkteter Pfeil von einem Kopf zum anderen, wie „es überträgt sich“; hold gibt an, wie lange er nach dem Zeichnen bleibt (Standard 0,9 s).
Andere Felder: answer bricht um, wo es passt (etwa 24 Zeichen pro Zeile); setze ein | dorthin, wo der Umbruch erfolgen soll. answerAt (Sekunden; Standard ~1,1), size ("1080x1920" Standard, "1080x1080", "1920x1080"), duration (Standard: Ende des letzten Beats + 1,3 s, mindestens 5), fps (Standard 30).
Tipps zur Inszenierung: Beginne einen Beat bei 0.0, damit zu Beginn niemand erstarrt ist; überlappe Beats ein wenig, sodass sich immer etwas bewegt; jeder Beat 0,8–1,6 s; platziere das Umstoßen oder den Schlüsselmoment in der Mitte und die Reaktion danach.
3. Drei Frames überprüfen
python3 "${CLAUDE_SKILL_DIR}/scripts/render.py" stick-<thema>.json --still 0.5 --out stick-<thema>-check1.png
python3 "${CLAUDE_SKILL_DIR}/scripts/render.py" stick-<thema>.json --still 2.5 --out stick-<thema>-check2.png
python3 "${CLAUDE_SKILL_DIR}/scripts/render.py" stick-<thema>.json --still end --out stick-<thema>-check3.png
--still akzeptiert Sekunden oder end; überprüfe auch den Zeitpunkt des Schlüsselmoments (das Umstoßen, die Enthüllung). Betrachte sie: Figuren auf dem Bildschirm und in die richtige Richtung blickend, niemand läuft durch jemand anderen hindurch, Blasen bedecken keine Gesichter oder den Titel, die Geschichte ist auch ohne Ton verständlich. Passe Positionen oder Timing an und überprüfe erneut, falls nötig.
4. Video rendern
python3 "${CLAUDE_SKILL_DIR}/scripts/render.py" stick-<thema>.json --out stick-<thema>.mp4
Dauert etwa 10–25 Sekunden. Lösche die Überprüfungsbilder.
5. Ausliefern
Gib dem Benutzer den Pfad zur MP4-Datei (zeige sie an, falls deine Umgebung Dateien anzeigen kann). Sie hat keinen Ton und ist bereit für Musik oder eine Stimme. Biete eine Variation an (ein anderes Ende, eine andere Szene).
Kein Browser hier? (z. B. in der Sandbox der Claude-App)
Wenn die Setup-Prüfung keinen Browser zum Laufen bringt, schreibe die Animation stattdessen als Seite: python3 "${CLAUDE_SKILL_DIR}/scripts/render.py" stick-<thema>.json --html stick-<thema>.html. Die Seite läuft in jedem Browser (zeige sie als Artefakt an, wenn möglich). Teile dem Benutzer mit, dass das MP4 Claude Code auf einem Computer oder eine Bildschirmaufnahme der Seite erfordert.