iart-ai/motion-design-skills

これは何？

主な機能

• 01特定のツールに依存せず、タイミング、イージング、アニメーションの基本原則を扱います。
• 02After Effectsのエクスプレッション、リギング、書き出し、パフォーマンスに関するガイダンスを提供します。
• 03Reactベースの動画をMP4またはGIFにレンダリングするRemotion向けスキルを収録しています。
• 04Web、動画、アプリ向けに、ロゴのリビール、スティンガー、ローダーのパターンを紹介します。
• 05メッシュグラデーション、シェーダーによるオーロラ、パーティクル背景のガイダンスを提供します。
• 06npxまたはClaude Codeのプラグインマーケットプレイスから、複数のAIコーディングエージェントにインストールできます。

ユースケース

• ぎこちない、またはロボットのようなUIアニメーションを、より自然な動きにする。
• テキストを順番に表示する、キネティックタイポグラフィの動画を作成する。
• RemotionでCSVファイルからデータ駆動型の動画をまとめて生成する。
• Webサイトのヒーローセクションに、控えめなループ背景を追加する。

クイックスタート

1. 1

   npxでスキルをインストールする

   npx skills add iart-ai/motion-design-skills
2. 2

   または、Claude Codeのプラグインマーケットプレイスとして追加する

   /plugin marketplace add iart-ai/motion-design-skills
3. 3

   Claude Codeにプラグインをインストールする

   /plugin install motion-design-skills

使う前に知っておきたいこと

• !READMEでは、これらは単体ソフトウェアではなくAIエージェント向けのプロンプトガイダンスとして説明されており、実行可能なアプリについては記載されていません。
• !エージェントの全機能はiart.aiで提供されており、READMEではスキルと併せて紹介されています。

トピック

よくある質問

motion-design-skills とは？

AIコーディングエージェントにモーションデザインの知識を提供する、インストール可能なスキル集。 Motion Design Skillsは、Claude Code、Cursor、CodexなどのAIコーディングエージェント向けに、9つのスキルをまとめたコレクションです。各スキルは、タイミングとイージング、色と補間、ショット構成、アートディレクション、After Effectsのワークフロー、ビートに合わせた編集、Remotionによるプログラム動画制作、ロゴのリビール、ループする背景など、モーションデザインの各分野を扱います。

motion-design-skills は無料で使えますか？ライセンスは？

motion-design-skills は MIT ライセンスのオープンソースです。商用製品で使う前にライセンス条件を確認してください。

motion-design-skills は今もメンテナンスされていますか？

半年以内に更新あり。motion-design-skills の最終コミットは 2026年6月22日 です。

motion-design-skills は何に使えますか？

ぎこちない、またはロボットのようなUIアニメーションを、より自然な動きにする。 テキストを順番に表示する、キネティックタイポグラフィの動画を作成する。 RemotionでCSVファイルからデータ駆動型の動画をまとめて生成する。 Webサイトのヒーローセクションに、控えめなループ背景を追加する。

motion-design-skills のインストール方法は？

npxでスキルをインストールする: npx skills add iart-ai/motion-design-skills または、Claude Codeのプラグインマーケットプレイスとして追加する: /plugin marketplace add iart-ai/motion-design-skills Claude Codeにプラグインをインストールする: /plugin install motion-design-skills

motion-design-skills はどこで入手できますか？

ソースコードとインストール手順は GitHub にあります：https://github.com/iart-ai/motion-design-skills