その他

2023.12.29

FigmaでWebPが書き出せるようになった話

Figmaの書き出し機能といまだにあまり仲良くなりきれてないコーダー、オガワです。

サイトスピードの改善などで使う頻度が上がってきた「WebP」。
デフォルトの機能で書き出せるツールはまだまだないので、WEBの変換ツールを使ってました…。
画像の数が多いとそれが結構手間になってくるので、FigmaでもWebPが書き出せたら良いなぁ〜と思っていたところ、Xでプラグインがあるとの情報が!

今回はそのプラグインを紹介したいと思います!

その名は「WebP Exporter」

FigmaからWebPを書き出せるようにしてくれる神のようなプラグイン「WebP Exporter」。

使い方は書くことがないレベルでかなり簡単です。
WebP Exporterを開いた状態で書き出したいコンテンツを選んで「Export」ボタンを押すだけ!
「Preferences」からは書き出しサイズなどの詳細を設定することも可能なので、2倍のサイズにしておきたい時にも対応できます。

ショートカットキーがあればもっといいなぁ…とは思いますが、変換ツールを使うことに比べたら普通のエクスポートと同じ感覚でできるのでかなり楽だと思います。

まとめ

コーディングツールは拡張機能で自分の使いやすいようにカスタマイズしているのですが、Figmaもそれができるのでツールを変えたことでコーディングがかなりしやすくなったなぁと思ってます。

今回のWebPのプラグインもそうですが、コーディングの効率をよくできるプラグインはまだまだありそうですね!

この記事をシェアする

関連記事

  • 2024.03.22

    Webデザインにおけるアニメーションについて考えてみた〜実例編〜

    その他

  • 2024.03.12

    Webデザインにおけるアニメーションについて考えてみた〜メリット・デメリット編〜

    その他

  • 2023.12.30

    案件を切り替える拡張機能「Project Manager」が便利!

    その他

おすすめ記事

  • 2023.12.15

    Lottie×FigmaでSVGアニメーションをつくってみた

    その他

  • 2023.11.27

    CTAボタンのデザインポイント

    その他

  • 2019.09.18

    【初心者向け】コーディングのスピードを上げる為の3つの方法

    その他

TAG

×