Googleスライドに「動く矢印」を入れる方法
— 流れる矢印GIFの作り方と貼り方

「処理の流れを矢印で見せたい」「データが流れている感じを出したい」— スライド作りでそう思ったことはありませんか。この記事では、Googleスライドで流れる矢印を実現する方法を、仕組みから手順まで詳しく解説します。

結論: GIFを貼るのが唯一の現実解

Googleスライドの標準アニメーション(「アニメーション」メニュー)でできるのは、フェードやスライドインなど図形単位の出現・退出だけです。PowerPointにある「ワイプ」や「モーションパス」のような、矢印そのものが流れ続ける表現は用意されていません。また、Googleスライドのアドオン(Apps Script)からもアニメーション制御のAPIは提供されていないため、プラグインでも実現できません。

そこで有効なのが、流れる矢印のアニメーションGIFを画像として挿入する方法です。GIFはGoogleスライド上で編集中も発表中も自動でループ再生されるため、実質的に「動く矢印」として機能します。

手順1: FlowArrowで流れる矢印GIFを作る

FlowArrowは、ブラウザだけで流れる矢印の透過GIFを作れる無料ツールです。登録・インストールは不要で、画像はすべてブラウザ内で生成されます。

1. パスを描く — キャンバスをクリックして点を追加します。最初の点が始点、最後の点が終点(矢じり)になります。点はドラッグで動かせます。直線・フック・M字・S字のプリセットから始めるのが手軽です。
2. 動きを選ぶ — 破線や「≫」が流れる「フロー」と、線が伸びていく「描画」の2種類があります。データフローには「フロー」、手順の強調には「描画」が向いています。
3. スタイルを調整 — 色・太さ・間隔・速さ・矢じりの有無を調整します。スライドのテーマカラーに合わせると馴染みます。
4. フチ合わせ色を設定 — 貼り先のスライド背景色(白背景なら白)を指定します。詳しくは後述。
5. GIF書き出し — ボタンを押すと flow-arrow.gif がダウンロードされます。

FlowArrowで矢印GIFを作る →

手順2: GoogleスライドにGIFを挿入する

1. Googleスライドで貼りたいスライドを開く
2. メニューの 挿入 → 画像 → パソコンからアップロード を選ぶ
3. ダウンロードした flow-arrow.gif を選択
4. 位置とサイズを調整(GIFは図形と同じように拡大・縮小・回転できます)

これだけです。編集画面でもプレゼンテーション(発表)モードでも、GIFは自動でループ再生されます。再生ボタンを押す必要はありません。

コツ: 透過GIFの「フチ」を目立たせない

GIFの透明は「透明か不透明か」の2値しか持てないため(2値アルファ)、線のフチのなめらかな部分は背景色と混ぜて焼き込む必要があります。これが「フチ合わせ色(マット色)」です。

背景色と大きく異なる場所に貼ると、線の輪郭にうっすら別色のフチが見えることがあります。その場合はFlowArrowに戻ってフチ合わせ色を変えて書き出し直してください。

PowerPoint・Notion・その他での活用

よくあるつまずき

Q. スライドに貼ったGIFが動かない

Googleスライドでは基本的に自動再生されます。動かない場合は、書き出したファイルがGIF形式か(スクリーンショット等でPNGになっていないか)確認してください。PowerPointの編集画面では静止表示ですが、スライドショーを開始すると再生されます。

Q. 印刷やPDF書き出しではどうなる?

アニメーションは失われ、最初のフレームが静止画として使われます。配布資料が主目的の場合は、矢印の全体が写っているフレームになるよう「描画」モードより「フロー」モードがおすすめです。

Q. 動きが速すぎる/遅すぎる

FlowArrowの「速さ」スライダーで調整して書き出し直してください。発表で使うなら、1〜2秒で1周期程度のゆったりした動きが目に優しくおすすめです。

まとめ

• Googleスライドの標準機能では「流れる矢印」は作れない
• アニメーションGIFを画像として挿入するのが唯一の現実解
• フチ合わせ色を貼り先の背景色に合わせるのがきれいに見せるコツ

作例は作例ギャラリーにまとめています。設定レシピ付きなので、真似して作ればすぐ同じものが作れます。