GIFメーカー
アニメーションGIFは、Slackに反応を表示したり、READMEファイルにチュートリアルを添えたり、ランディングページに製品に関するミニインタラクションを配置する最も簡単な方法です。このGIF作成ツールは、PNG/JPGのフレームまたは切り抜いたMP4ファイルを組み合わせて256色のループGIFを作成でき、ダウンロード前にフレームレート、キャンバスサイズ、ループ回数を自由に調整できます。
GIFの作成方法
-
1
フレームを追加します
PNG/JPG画像を順番にアップロードするか、フレームにサンプリングするための短いMP4ファイルを指定してください。
-
2
フレームレートを設定します
典型的な値:UIデモでは8~12fps、ビデオ風の動きでは15~24fpsです。
-
3
寸法とループを選択します
キャンバスのサイズを変更し、無限に繰り返すか、または固定回数だけ繰り返すかを選択します。
-
4
エクスポートおよびダウンロード
このツールはグローバルパレットの最適化を施したままデータをエンコードし、単一の.gifファイルを返します。
GIF形式の制限
| 属性 | 制限/動作 |
|---|---|
| 色深 | 1フレームあたり256色(8ビットパレット) |
| アルファ | 1ビット — 完全に透明または完全に不透明 |
| フレーム遅延 | 10 msの倍数 — 「60 fps GIF」は実際には最大50 fpsまで制限されます |
| 圧縮方式 | LZW – 平面的なグラフィック画像で最も効果的です |
| ファイルサイズ | 硬制限はありませんが、ブラウザでは約10MBを超えると処理が困難になります |
ファイルを小型に保つためのヒント
- 「必要な動きに絞って編集してください。」ほとんどの「反応GIF」は1~3秒です。
- サイズの縮小: Slack、Twitter、Notionでは通常、幅480pxのGIFで十分です。
- まずフレームを削減し、次に色を削減してください。 シングルクレジット数(fps)を半分にするとファイルサイズが半減しますが、パレットを256色から64色に減らすとグラデーションが明らかに劣化します。
- **固体背景は最も適して圧縮されます。**ノイズが含まれた動画由来のGIFは適切に縮小できません。
代わりにMP4またはWebMを使用するタイミング
対象プラットフォームが短い動画の自動再生をサポートしている場合(Twitter、現代のウェブページ、Discordなど)、MP4(H.264)またはWebM(VP9)ファイルは同じ品質の同等のGIFファイルと比べて5〜10倍も小型になります。なお、チャット、メール、従来型のドキュメントファイルにおいてはGIFが依然として主流です。
よくある質問
GIFは最大256色に制限されており、各フレームで固定されたカラーパレットを使用します。グラデーションはノイズとしてディザー処理され、肌の色調にはしばしば帯状の変化が現れます。より滑らかな効果を得るには、動きの詳細を低減するか、MP4またはWebMに切り替えてください。
はい、しかし透明度は1ビットのみです。ピクセルは完全に透明または完全に不透明のいずれかです。透明な背景上でのソフトなアンチアライゼドエッジは縁が際立つように見える傾向があります。滑らかなアルファ効果が必要な場合は、APNGまたはWebPをご検討ください。
12~15fpsは適切なデフォルト値です。Slackはより高速なサンプリングを適用する場合、画像の解像度が低下しますが、TwitterではGIFファイルがサーバー側でMP4形式に変換されるため、低いfpsの入力でも問題なく表示されます。
エンコーディングはページ上で実行され、生成されたGIFがダウンロード用として返されます。エクスポート後にはソースフレームは保持されません。