モーショングラフィックスの事例:動画の役割別に整理した AI 支援作品
執筆者 Potto AI Team·
役割別に整理したモーショングラフィックスの事例。ローンチ映像、製品画面、キネティックタイプ、データストーリー、解説、ロゴリビール。いずれも作者を明記。

役に立つモーショングラフィックスの事例は、見た目の様式ではなく、その動画が担う仕事で分ける。ローンチ映像、動く製品画面、キネティックタイプのリール、データストーリー、解説、ロゴリビール。仕事ごとに長さも比率も、伝える順序も違う。だから「良い事例」は、種類が合って初めて役に立つ。このガイドは Potto の AI モーショングラフィックス動画 ライブラリから 21 本を選び、この 6 つの仕事に分け、それぞれについて作者、長さ、アスペクト比、見るべき点を示す。
先に一つだけ。これらの動画は、どれも Potto が作ったものではない。 独立したクリエイターが制作して公開したもので、以下では X のハンドルでクレジットする。Potto が集めているのは、視聴し、作者が共有したプロンプトを読み、そのアイデアから自分の動画を始めるためだ。説明に使うのは各動画のタイトルと、そのページにある情報(作者、カテゴリ、長さ、比率、ツール)だけである。目的は何を学ぶか選ぶことで、他者の作品を評することではない。Potto 自身のツールについて書く内容は、今日の製品が実際に行うことに限る。
モーショングラフィックスとは何か

モーショングラフィックスは、動きを与えたグラフィックデザインである。文字、図形、アイコン、チャート、画像が動き、何かを説明し、何かを知らせ、ブランドの見た目を作る。Adobe のガイドはこれを「動きのあるグラフィックス」と定義し、「楽しませたり情報を伝えたりする、短めのアニメーション」と呼ぶ。登場人物と筋のある長編アニメーション映画とは対になる。Wikipedia の モーショングラフィックデザイン の記事は、モーションデザインが通常、抽象的な物体、文字、その他のグラフィックデザイン要素を動かすことと結び付くと述べている。
二つの出典を合わせると、仕事が現れる場所が挙がる。映画とテレビのオープニングクレジット、放送とニュースのグラフィックス、広告とブランディング、アニメーションするタイポグラフィ、ユーザーインターフェースのデザイン、解説動画と宣伝動画。その一覧は業界別だ。このガイドはタスク別に組む。動画を作るときの問いは「何を伝えたいか」であり、「どの業界か」ではない。下の 6 つの仕事はライブラリのカテゴリに対応し、企業やクリエイターが実際に必要とすることの大半を覆う。
| 仕事 | 何をするか | 典型的に答える問い |
|---|
| ローンチ | 製品やリリースを知らせる | 何が新しく、なぜ気にするのか? |
| 製品画面 | インターフェースを動かす | この製品はどんな見た目で、どう動くのか? |
| キネティックタイプ | 動く言葉を主画面にする | 覚えておくべき一文は何か? |
| データストーリー | 一つの数字や傾向を届ける | 何が、どれだけ変わったのか? |
| 解説 | 段階を踏んでアイデアを教える | これはどう動くのか? |
| ロゴアニメーション | ブランドマークを見せる | 誰が作ったのか? |
21 本の選び方
ライブラリは大きく、増え続けている。このガイドは総数を引用しない。ページには常に現在の数字が出る。事例を選ぶフィルタは四つ。クレジットされた作者があること、長さとアスペクト比が記録されていること、再生できる動画があること、何についての動画かタイトルが言っていること。各仕事の中では、長さ、比率、ツールがばらつく作品を優先し、一つの型の繰り返しではなく幅が見えるようにした。
事例の前に、ライブラリ全体について知っておくとよい事実が二つある。2026-10-12 に確認したライブラリの記録に基づき、作品が増えれば数字は動く。
- 作品の大半は 16:9。 およそ 5 本に 4 本が 16:9、およそ 8 本に 1 本が 9:16、残りが 1:1。下のどの仕事も同じ偏りで、見る場所と一致する。ウェブサイト、プレゼンテーション、X である。
- 長さは仕事による。 中央値はおよそ、ロゴアニメーションが 9 秒、キネティックタイプが 15 秒、ローンチが 30 秒、データストーリーが 35 秒、製品画面が 36 秒、解説が 60 秒。仕事ごとの中央値は各節に書く。
21 本は下の各節にあり、それぞれ再生できるページへリンクする。各作品について、作者の X ハンドル、長さ、比率、ページに載っているツール、作者がプロンプトを共有したかどうかを示す。「プロンプト共有」は、作者がその作品ページにプロンプトを公開しているという意味で、再利用する前に読める。
ローンチ映像の事例
ローンチ映像は何かを知らせ、視聴者に一つだけ覚えてもらう。名前である。ライブラリの ローンチ動画 では、長さの中央値は 30 秒で、およそ半数が 30 秒以下。比率の幅もこのカテゴリが最も広く、およそ 5 本に 1 本がスマホ向けの 9:16 である。
見るべき点。 音声を消して一度再生し、製品名が最初に出る秒をメモする。次に、映像が別々の主張をいくつしているか数える。上の事例は、カテゴリ全体に通じる規則を示唆する。短いほど主張は少ない。15 秒の映像は一つのアイデアと名前を運び、50 秒の映像には問題、いくつかの機能、締めの一文が入る余地がある。
Potto で借りる。 Potto の 商品紹介動画 は、説明文またはリンクからローンチ映像を組む。うまく働くブリーフは、相手、長さ、ビートを名指しする。
架空の家計アプリ Ledgerly のローンチ映像。30 秒、16:9。表計算で支出を追う問題から始め、機能を三つ見せ、アプリ名と行動の呼びかけで終える。
製品画面の事例
製品画面 のアニメーションは、インターフェースが何かをする様子を見せる。リストが自分で並び、ダッシュボードが埋まり、スマホが一連の流れを歩く。このカテゴリの中央値は 36 秒だが、中央の半分はおよそ 24 秒から 67 秒に及び、六つの中で最も幅が広い。アプリの流れはスマホで見せることが多いので、9:16 と 1:1 の事例が最も役立つ場所でもある。
見るべき点。 インターフェースが最初に出るフレームで止め、視聴者がどこを見るべきか問う。次に、各状態が画面にどれだけ留まるか見る。目が変化を見つける前に画面が変わると、製品画面のアニメーションは失敗する。ここでの短い事例が一つの変化だけを見せ、長い事例が状態をステップにまとめているのは、そのためだ。
Potto で借りる。 デモ動画作成 は、アップロードしたスクリーンショットから始まる。プロジェクトあたり、画像、ドキュメント、音声ファイルを合わせて八つまで。スクリーンショットのシーンはズームし、カーソルの経路をたどり、各シーンにキャプションを載せられる。よくあるブリーフはステップの一覧だ。
架空の請求アプリの製品デモ。30 秒、16:9。三枚のスクリーンショットを使う。請求書を作る、送る、入金を見る。スクリーンショットごとに短いキャプションを一つ、アプリ名で閉じる。
キネティックタイプの事例
キネティックタイプ は、動く言葉を主画面にする。文字が主役の仕事のなかで最も短い。中央値はおよそ 15 秒で、およそ 10 本に 7 本が 30 秒以下。意味を運ぶインターフェースもチャートもないので、文章が運ばなければならない。
見るべき点。 ミュートして、文字として読む。キネティックタイプはテキストとして成立するべきだ。文が弱ければ、動きは救わない。音を戻し、各語のタイミングが音についているか確認する。15 秒の二本は動きをタイトルカードかテンポに結び、75 秒の二本は構造で注意を保つ。クレジットの一覧と章タイトルである。
Potto で借りる。 Potto のテキストシーンは合図で入る。引用、タイトル、リストのシーンは短い行を載せる。自由な字形のレターアニメーションは提供しない。128 BPM の波紋は、レンダリングの範囲外である。得意なのは、各行が自分の画面を持つ短い台本だ。
キネティックテキストの動画。15 秒、16:9、Bold Pop スタイル。短い五行、一画面に一行。毎週金曜に届けるチームについて。最後の行は “Ship it.”。
データストーリーの事例
データストーリーは、一つの数字か一つの傾向を届ける。ライブラリの データストーリー動画 では、中央値はおよそ 35 秒で、幅は広い。15 秒から、1 分を大きく超えるものまである。カテゴリとしては小さい部類なので、一つずつ見るのに向く。
見るべき点。 覚えてほしい一つの数字を見つけ、動画がそれをどう稼いでいるか見る。その前に何が来て、その後に何を見せるか。三つの事例は同じ仕事に三つの装置を使う。一つは結果を述べ、一つはタイムラインを歩き、一つは数字と、それが測るものの絵を組む。
Potto で借りる。 統計シーンは一つの大きな数字を見せ、チャートシーンは棒グラフかドーナツを描く。値は三つから六つで、カウントアップする。数字をブリーフに書けば、動画は書いたとおりに使う。書き出す前に、各数字を出典と照合する。グラフアニメーション作成 のページには、この種の作品がさらに集まっている。
データストーリー。30 秒、16:9。架空のコーヒー店の 1 日あたり平均杯数が、6 月の 120 から 9 月の 190 に増えた。問いから始め、四か月を棒グラフで見せ、58% の上昇で終える。
解説の事例
解説は、段階を踏んでアイデアを教える。六つのなかで最も長い。長さの中央値は 60 秒で、30 秒以下はおよそ 5 本に 1 本だけ。ライブラリの 解説動画 は扱いの幅も最も広く、ピクセルアートから手描きのホワイトボードまである。
見るべき点。 解説は文のテストを通るべきだ。一度見たあと、そのアイデアを一文で言えるか。問題が解決に転じる瞬間を見て、その瞬間から終わりまでのステップを数える。三つのうち二つは、小さく具体的な対象(一つの数字、オンボーディングの流れ)を取り、それに授業全体を運ばせている。
Potto の 解説動画 は、トピック、リンク、または PDF のようなドキュメントから始められる。手描きやホワイトボードのスタイルはない。組み込みの 12 スタイルは、Clean Modern、Midnight Tech、Editorial Paper、Bold Pop、Blueprint、Warm Organic、Neon Night、Soft Pastel、Mono Minimal、Sunset Gradient、Studio Noir、Fresh Mint である。
ロゴアニメーションの事例
ロゴリビールは最も短い仕事だ。ライブラリの中央値は 9 秒未満で、ここでの事例は 8.7 秒から 21.0 秒。見るものは一つなので、動画の大半はタイミングと動きの形にある。
見るべき点。 最後のフレームを見る。ロゴリビールが成功するのは、最終のマークがきれいで中央にあり、認識できるだけの時間、読めることだ。その前の動きが、マークに個性を与える。8.7 秒の事例は、一つの動き、一つの形が別の形に変わることが、どれだけできるかを示す。
Potto で借りる。 Potto の締めの行動呼びかけシーンは、動画を自分のロゴで終えることができる。ライブラリの ロゴアニメーション カテゴリは、単体のリビールを見る場所だ。Potto は決まったシーンタイプとスタイルからレンダリングし、カスタムのアニメーションコードはない。上のような elastic のモーフィングという特定のイージング曲線は、そのまま写すものではなく、研究するものだ。
自分の版を作る
こうした動画への道は三つある。自分でコードを書く、コーディングエージェントに書かせる、レンダリングしてくれるツールに動画を説明する。
ライブラリの多くのクリエイターはコードで作る。Potto が使うレンダラー Remotion は、React で動画とモーショングラフィックスを作る方法だと自ら述べ、コーディングエージェントが扱えるようエージェントスキルを公開している。Potto の スキル ページは、第三者の作者による無料のエージェントスキルを集めている。SKILL.md を読むエージェントにインストールでき、自分のエージェントと自分のモデルで動く。
Anthropic の Claude Motion は 2026 年 10 月 8 日に発表され、2026-10-12 時点で Team と Enterprise プランのベータにある。プロンプトから文字、チャート、図形、画像を動かし、MP4 を書き出す。Potto は Claude Motion ではなく、Anthropic との公式な関係はない。 Claude Motion の代替 の記事が、確認できる事実で道を比べている。
説明の道が、Potto の モーショングラフィックス AI ツールである。渡すのはプロンプト、公開リンク、またはドキュメント。Claude Opus 5.5 がブリーフ、台本、ストーリーボードを書き、Remotion がシーンを、ナレーション、キャプション、音楽付きの MP4 にレンダリングする。比率は 16:9、9:16、1:1。ストーリーボードは画面ごとに編集でき、チャットで変更を頼める。ライブラリのページでは、プロンプトを共有している動画に「このプロンプトを使う」ボタンがあり、Potto の動画作成へ送る。結果は Potto 自身の版で、シーンタイプとスタイルは Potto のものなので、原版とは一致しない。原版は、アイデア、間、見た目の参照として扱う。
プレビューとストーリーボードは無料。クレジットがかかるのは書き出しのときで、確認の前に合計が表示される(Potto AI 料金 を参照)。Potto は実写映像、アバター、人物を生成せず、すでに持っている動画を編集しない。
よくある質問
モーショングラフィックスの種類は何か?
モーショングラフィックスの種類は、通常、現れる場所でまとめられる。映画とテレビのタイトルシーケンス、放送とニュースのグラフィックス、広告とブランディング、キネティックタイポグラフィ、ユーザーインターフェースのアニメーション、解説または宣伝の動画。このガイドは仕事で分ける。ローンチ映像、製品画面、キネティックタイプ、データストーリー、解説、ロゴアニメーション。Wikipedia のモーショングラフィックデザインの記事は、目的が明確にすることか、感情を起こすことか、認知を高めるかに応じて、解説、感情、宣伝のグラフィックスも分けている。
何がモーショングラフィックスとみなされるか?
モーショングラフィックスは、動きを与えたグラフィックデザインである。文字、図形、アイコン、チャート、画像を動かし、知らせ、宣伝し、ブランドにする。Adobe は「動きのあるグラフィックス」と定義し、楽しませたり情報を伝えたりする短めのアニメーションだと述べる。製品のスクリーンショット、棒グラフ、ロゴを動かす動画はモーショングラフィックスである。登場人物と筋のある長編アニメーション映画は、通常、アニメーションと呼ばれる。
モーショングラフィックスとアニメーションの違いは何か?
モーショングラフィックスは、文字、図形、チャートのようなグラフィックデザインの要素を動かし、通常は短い作品で情報を伝える。アニメーションはより広く、登場人物と筋で物語を語る。二つは重なるので、線は技法より目的と規模の問題である。Adobe のガイドは長さと目的で線を引く。モーショングラフィックスは、楽しませたり情報を伝えたりする短めの作品だ。
モーショングラフィックスの動画はどのくらいの長さにするべきか?
仕事による。2026-10-12 時点の Potto ライブラリでは、中央値はおよそ、ロゴアニメーションが 9 秒、キネティックタイプが 15 秒、ローンチ動画が 30 秒、データストーリーが 35 秒、製品画面が 36 秒、解説が 60 秒。長さはアイデアの数に合わせる。一つのアイデアは 15 秒に収まり、問題、三つの機能、締めの一文は 30 から 45 秒に収まる。Potto の長さの選択肢は 15、30、45、60、90 秒である。
このガイドの動画は Potto で作られたか?
いいえ。独立したクリエイターが作り、それぞれ作者の X ハンドルでクレジットされている。Potto は自作だと主張しない。参照として収録しており、各作品のページは、原投稿がある場合にそれへリンクする。
Potto でこのようなモーショングラフィックスを作れるか?
はい。Potto が提供する種類に限る。ローンチ映像、製品画面、文字が主役の動画、データストーリー、解説で、11 のシーンタイプ、12 のスタイル、自分のブランドカラーから組む。Potto はプロンプトから自分の版をレンダリングするので、結果は原版を写さない。カスタムのアニメーションコード、手描きスタイル、自由な字形のレターアニメーションには対応しない。
出典
すべてのページは 2026-10-12 に照会した。
次の製品発表動画を作りましょう。
気になったアイデアを、自分の動画や画像にしてみましょう。スクリーンショット、テーマ、プロンプトを用意してください。