/stick-figure: 棒人間で作る漫画解説
ユーザーがアイデアや質問（「なぜあくびはうつるのか？」「なぜ猫はものをテーブルから落とすのか？」「なぜ先延ばしにするのか？」）を入力します。あなたはその答えを一行で書き、それを示す小さなシーンを構成し、数フレームを確認した後、動画をレンダリングして無音のMP4（5〜7秒）を手渡します。
${CLAUDE_SKILL_DIR} はこのスキルが配置されているフォルダ（このSKILL.mdがあるフォルダ）です。環境が自動で埋め込まない場合は、そのフォルダのパスを手動で指定してください。すべてのファイルはユーザーのカレントフォルダ、またはユーザーが指定したフォルダに保存してください。
0. セットアップ確認
python3 "${CLAUDE_SKILL_DIR}/scripts/render.py" --check
数秒かかります。このコンピュータがセットアップ済みか不明な場合は実行してください。"ready": true なら問題ありません。そうでなければ、"fix" にリストされたコマンドを実行し、ユーザーに「一度だけのインストールです」と伝えてください：python3 -m pip install playwright（ブラウザドライバ）、python3 -m playwright install chromium（Google Chrome や Edge がインストールされていない場合のみ、約150 MB）、python3 -m pip install imageio-ffmpeg（ffmpeg がない場合のみ）。pip が「外部管理環境」を理由に拒否した場合は、プライベート環境を一度作成し、すべてのコマンドにそのPythonを使用します：python3 -m venv ~/.animate-skills && ~/.animate-skills/bin/pip install playwright imageio-ffmpeg、必要に応じて ~/.animate-skills/bin/python -m playwright install chromium。Windows の場合は python3 の代わりに py を使用してください。ここでブラウザが使用できない場合（Claude アプリのサンドボックスなど）は、このファイルの末尾を参照してください。
1. シーンを計画する（簡潔に）
- タイトル: 質問やアイデアの短いもの（最大約40文字）。
- 答え: 一行での説明で、真実かつ簡潔（最大約45文字）。これは 1 秒ほど経ってから表示されます。
- シーン: 1〜4人のキャラクターが、5〜7秒の間に3〜8ビートで答えを表現します。現象が起きている様子を見せます：あくびが人から人へ移る、猫がテーブルからマグカップを落とす、犬が起きて尻尾を振る。最後のビートがオチとなり、画面に残ります。
2. 仕様を書く
stick-<topic>.json を保存します。例（examples/knock-things-off.json）：
{
"title": "Why do cats knock things off tables?",
"answer": "Hunting instinct, and it gets your attention",
"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": "You", "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": "My mug!"},
{"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}]
}
その他の例：examples/contagious-yawns.json（3人）、examples/procrastination.json（オフィス、誰かが入ってくる）、examples/dog-wags.json（犬と子供、公園）。
シーン：street（空、歩道、道路）、park（太陽、丘、芝生）、room、office（窓から街並み）、classroom（黒板に "board": "text" を追加）、night（星と月）、plain（"background": "#hex" を追加）。
フィギュア（x は0＝左端、1＝右端。登場前や退場時は -0.2 や 1.2 を使う）。縦長の動画には3人が快適に収まります（x 0.2、0.5、0.8）。4人目を追加する場合は scale を約0.85、間隔を約0.22にします。犬や猫の横顔はフレーム幅の約0.35の大きさ（x は体の位置、鼻は約0.2前方）。ペットが走り寄る人物から約0.3の距離で止まるように設定してください。名前ラベルは短く（「Bill」、長い説明は避ける）：
kind：person（デフォルト）、cat、dog（横顔、人の身長の約3分の1）。id、x、label（足元に表示される名前：「You」、「Your brain」）、scale（子供は0.6〜0.8）、facing（left/right。指定がない場合は中央を向き、最後に動いたり、指さしたり、スワイプした方向を向く）。on：家具の上に立つ：table、desk、bench、shelf、bed（同じ x に家具プロップを配置）。- 人物：
hat（cap、tophat、beanie、crown、bow、hair）、hatColor（髪の色にもなる）、head（肌の色）、glasses（true）、tie（色）。ペット：head（毛の色）、hatColor（耳の色）。
ビート（{"who", "do", "at", "for", "to", "say"}、単位は秒）。to は別のフィギュアのidか、x座標（0〜1）。
do（人物） | 見た目 | do（人物） | 見た目 |
|---|---|---|---|
walk、run | to に向かって移動 | talk | 口が動き、片手でジェスチャー |
wave | 手を振り、大きな笑顔 | yawn | 両腕を上げ、大きなあくび、目を閉じる |
look | 顔を to に向ける | point | to を指さす（フィギュアの頭、またはテーブルの高さのx座標） |
think | 手をあごに当てる（say があれば思考吹き出し） | shrug | 「さあね？」 |
jump | 嬉しそうにジャンプ | cheer | 両手をV字に上げる |
surprised | 飛び上がり、「！」 | sad | うつむき、涙 |
sleep | 目を閉じ、Zzz | laugh | 跳ねながら大笑い |
dance | 踊る、音符 | idea | 手を上げ、電球 |
love | ハート | fall | 倒れてそのまま |
raise | 片手を上げる（投票、質問、「私！」） | write | 机で書いたり署名したりする |
relabel | 名前タグを変更：{"who": "bill", "do": "relabel", "at": 4, "text": "Law"} |
ペット：walk、run、jump、sit、swipe（to に向かって前足で払う、物を落とす動作）、sleep（丸くなり、Zzz）、meow / bark / talk（口を開ける；say を追加）、surprised（背中を丸め、「！」）、look（to の方を向く）、wag（嬉しそうに尻尾を振る）、love、idea、sad。
say はそのビートの間、そのフィギュアの上に吹き出しを表示します（最大5単語。think は思考吹き出し。吹き出しはそのビートの小さなアイコンに置き換わります。他の人の顔に重ならないように調整されます）。各フィギュアの最後のビートは終了時までポーズを保持します（walk、run、talk、yawn を除く）。シーン内で最後に発せられた台詞もそのまま表示されるので、オチで終わるようにしてください。point は遠くのフィギュアの頭を、近くのフィギュアの胸を狙います。
小道具（{"type", "x", ...}）：家具とセットピース bus-stop、tree、bench、desk（ノートパソコン付き）、table、door、sign（text 付き）、car（"drive": 1 で通り過ぎる）、house、plant、lamp、tv、bed。小さなオブジェクト cup、mug、glass、vase、bottle、plate、ball、book、phone、box、paper（書類）。小さなオブジェクトは床に置くか、"on": "table"（または desk、bench、shelf、bed）と指定します。x はその家具の横幅（その x を中心に約±0.15）の範囲内に設定します。"wobbleAt": s でぐらつかせ、"fallAt": s で落とします（"fallDir": -1 で左に）。カップ、グラス、花瓶、ボトル、皿は割れて「CRASH」と表示されます（"sound": "SMASH!" で変更可能）。ボールは跳ねて飛び去ります。その他 color、scale、front: true（キャラクターの前面に描画）。
矢印（{"from", "to", "at", "for", "color", "hold"}）：頭から頭への点線の矢印で、「それが伝わる」様子を表現。hold は描画後に表示され続ける時間（デフォルト 0.9 秒）。
その他のフィールド：answer は適切な位置（1行あたり約24文字）で自動改行されます。改行位置を指定したい場合は | を挿入します。answerAt（秒、デフォルト約1.1）、size（"1080x1920" デフォルト、"1080x1080"、"1920x1080"）、duration（デフォルト：最後のビートの終了時間 + 1.3 秒、最低 5 秒）、fps（デフォルト 30）。
ステージングのコツ：最初のビートは 0.0 秒から始め、誰も最初から静止しないようにします。ビートを少し重ねて常に何かが動いているようにします。各ビートは 0.8〜1.6 秒。倒したり、重要な瞬間は中盤に配置し、その後のリアクションを入れます。
3. 3フレームを確認
python3 "${CLAUDE_SKILL_DIR}/scripts/render.py" stick-<topic>.json --still 0.5 --out stick-<topic>-check1.png
python3 "${CLAUDE_SKILL_DIR}/scripts/render.py" stick-<topic>.json --still 2.5 --out stick-<topic>-check2.png
python3 "${CLAUDE_SKILL_DIR}/scripts/render.py" stick-<topic>.json --still end --out stick-<topic>-check3.png
--still には秒数または end を指定します。重要な瞬間（物が倒れる、明かされる瞬間）の時間も確認してください。画像を見て：キャラクターが画面にいて正しい方向を向いているか、誰かが他の人を通り抜けていないか、吹き出しが顔やタイトルを隠していないか、音声なしでストーリーが理解できるかを確認します。問題があれば位置やタイミングを調整し、再度確認します。
4. 動画をレンダリング
python3 "${CLAUDE_SKILL_DIR}/scripts/render.py" stick-<topic>.json --out stick-<topic>.mp4
約10〜25秒かかります。確認用画像は削除します。
5. 引き渡し
ユーザーにMP4のパスを伝えます（環境がファイルを表示できるなら表示します）。音声は含まれていないので、音楽やナレーションを後から追加できます。必要に応じて、1つのバリエーション（別のエンディング、別のシーン）を提案します。
ここでブラウザが使えない場合（Claude アプリのサンドボックスなど）
セットアップ確認でブラウザが起動できない場合は、代わりにアニメーションをページとして出力します：
python3 "${CLAUDE_SKILL_DIR}/scripts/render.py" stick-<topic>.json --html stick-<topic>.html。このページは任意のブラウザで再生できます（可能であればアーティファクトとして表示します）。ユーザーには、MP4が必要な場合はコンピューター上のClaude Codeを使用するか、ページをスクリーン録画するよう伝えます。