Figmaからwebpを書き出す方法

Tweet

Pocket

Figmaからwebpを書き出すには、以下の方法があります。

1. jpgで書き出して、webp変換ツールを使う
   Syncer WEBP変換ツール (jpg、pngとwebpを相互変換)
2. Figmaのプラグインを使う
   Olive Press – Image Compression

Olive Pressの使い方
レイヤーを右クリック > Plugins > Olive Press – Image Compression
デフォルトではMediumになっているので、Lightを選択（Medium圧縮はかなりファイルサイズが小さくなるけど、テクスチャ感が失われ綺麗ではない）

1. jpg 988kg
2. Olive Press webp (Medium): 42kb
3. Olive Press webp (Light): 209kb
4. Syncer: 72kb

1のjpgがもちろん最も綺麗。2は汚い。3と4はほぼ変わらないけど、4のSyncerの方が少しだけ少しだけ解像している気がする。

というわけで、枚数が多くなければSyncerを使うのがいいかもしれません。
ただこれもデメリットはあって、一枚ずつドラッグして変換して（変換は一瞬）、ダウンロードする必要がある。しかもファイル名がimage.webp, image (1).webp のようになるため、リネームする必要がある。