mcpField
M
minimalistic-graphics

minimalistic-graphics

github.com/artemnovitckiiクリエイティブ・メディア37710 回インストール3 日前に更新
リポジトリ

minimalistic-graphics について

minimalistic-graphics は、点が階段を上る短いミニマルなアニメーション動画を作る Claude Code スキルです。テキストと段数を設定できます。

主な機能

  1. 01階段を上るミニマルな動画の生成
  2. 021行または2行のテキスト
  3. 033〜7段の設定
  4. 04MP4出力と任意のPNG生成

活用シーン

  1. 01継続的な進歩や忍耐の表現
  2. 02短いフレーズのアニメーション化

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/artemnovitckii/claude-animation-skills --skill minimalistic-graphics

インストール後、Claude Code で/minimalistic-graphicsを入力して読み込まれたか確認します。

同梱ファイルbuild.pytemplate.html

詳細

/minimalistic-graphics

┌──────────────────────┐
│ every step feels     │  one lowercase line (swaps to line two at the top)
│ small.         (•)   │  orbit + ring + sparks around the dot
│              ┌──┐    │
│         ┌──┐ │  │    │  hairline steps rise, the dot hops up them
│    ┌──┐ │  │ │  │    │
│ ┌──┐  │ │  │ │  │    │
└──────────────────────┘

初回使用時

このスキルのフォルダーは、読み込み時に Claude Code が表示する「Base directory」です。

SKILL_DIR="<base directory of this skill>"
KIT=$(python3 -c 'import os,sys;print(os.path.realpath(os.path.join(sys.argv[1],"..","..","kit")))' "$SKILL_DIR")
[ -s "$KIT/vendor/gsap.min.js" ] || bash "$KIT/setup.sh"

ffmpeg と Node が必要です。

手順

  1. 言葉。 ユーザーのアイデアを、導入と展開の短い2行に分けます（「every step feels small.」／「until you look back.」）。各行は約30文字以内で、小文字で始め、ピリオドで終わるようにします。1行でも構いません。
  2. 仕様。 <name>.minimal.json を作成します（下記参照）。
  3. ビルド。 python3 "$SKILL_DIR/build.py" <spec.json> を実行します。約10秒かかります。手早く PNG を作成するには --snap 2.4 を追加します。
  4. シートを確認します。テキストが1行に収まり、最後のフレームで点の周りを回る様子が表示されていることを確認します。
  5. mp4 のパスを渡します。

仕様

{"lines": ["every step feels small.", "until you look back."], "steps": 5, "light": false}
  • lines：1行または2行です。点が頂点に達すると、2行目が表示されます。
  • steps：3～7です。ステップ数が多いほど速く進み、動画も少し長くなります（5ステップの場合は3.8秒）。
  • light：白地に黒い線です。
  • hold（任意）：最後に追加する秒数です。out（任意）：出力先のパスです。

テイスト

  • 静かで簡素にします。小文字を使い、絵文字、太字、感嘆符は使いません。
  • 図は、着実な進歩（習慣、積み重ね、忍耐）をテーマにします。点が階段を上る図だからです。
  • 別のモチーフ（迷路、曲がりくねる線、満ちていく円）にする場合は、template.html をコピーして図形を変更します。ルールは守ってください。純粋な黒、極細の白い線、白一色の点1つ、テキスト1行です。

コメント

Markdown 対応