Figmaプラグインまとめ
GIFアニメが簡単作成できるプラグイン「Giffy Canvas」
- UIデザイン
- UXデザイン
- Webデザイン
GIFアニメが簡単に作成できるFigmaのプラグインです。
公開日:2020/04/22最終更新日:2021/07/12
1.「Giffy Canvas」とは?
作成したアートボード繋げて簡単にGIFアニメを作成できるプラグインです。
2.「Giffy Canvas」のインストール方法
Figmaのコミュニティで「Giffy Canvas」を検索します。
インストールボタンをクリックして完了です。
3.「Giffy Canvas」の使い方
フレームを作成し、動かしたいオブジェクトを作成します。
今回は簡単な画像で進めます。
最初に作成したフレームをコピーし作成すると、GIFにした際に綺麗に書き出せます。
フレームが揃ったら全て選択します。
「Plugins」から「Giffy Canvas」を選択します。
するとこのようなポップアップが表示されます。このままの設定でダウンロードすることもできますが、もっと詳細設定したい場合は右の「Interval」や「Sort By」で設定を変更することも可能です。
今のままだと間隔が遅いので、もっと短い間隔で画像を動かします。
「Interval」で間隔の調整を行います。数値が小さいほど早い動きになります。
完成したGIFがこちらです。
簡単なGIFアニメを作る際は是非、活用してみてください!
理解度チェック
前のレッスン
Figmaプラグインまとめ
便利なFigmaのプラグインまとめ その1
- 画像からカラーを抽出してくれるプラグイン「Image Palette」
- グラデーションを自動生成してくれるプラグイン「uiGradient」
- 仮のダミーテキストを追加してくれるプラグイン「Content Reel」
- Googleスプレッドシートを反映してくれるプラグイン「Google sheets sync」
- 写真にフィルターをかけることができるプラグイン「Filter」
- 写真の背景を切り取るプラグイン「Remove BG」
- GIFアニメが簡単作成できるプラグイン「Giffy Canvas」
- ワイヤーフレームが簡単に作成できるプラグイン「Wireframe」
- URLからHTMLを生成してくれるプラグイン「Figma to HTML, CSS, React & more!」
- 使用しているインスタンスを検索してくれるプラグイン「Instance Finder」