アニメーション絵文字ガイド：動き・サイズ・書き出し形式の選び方

静止した絵文字は対象を伝え、動きは感情を伝えます。バウンスはお祝い、パルスは高揚、ゆっくりしたフロートは穏やかな反応に向いています。まず表情と輪郭を読みやすくしてから、動きを一つ加えます。

動きより先に反応を決める

最初に透明背景の静止絵文字を作り、実際の表示サイズで確認します。次に反応に合う動きを選び、128px、240px、512px の用途からキャンバスを決めます。最後にループとエッジを明るい背景、暗い背景の両方で確認します。

アニメーション絵文字の手順

互換性を優先するなら GIF、対応する配布先で小さいファイルを使いたいなら WebP が向いています。どちらを選ぶかは、作る側ではなくアップロード先の仕様で決めてください。

• •動きは一つの感情に合わせる
• •最後のフレームから最初のフレームへ自然につなぐ
• •小さい表示で表情が読めるか確認する
• •静止 PNG を元ファイルとして保管する

GIF と WebP の選び方

すべてのフレームで背景を透明に保ちます。白いマット、色のにじみ、端で切れた手足は暗い背景にすると見つけやすくなります。

透明背景をフレームごとに確認する

GIF と WebP の対応、最大ファイルサイズ、長辺の解像度、静止 PNG の fallback を確認し、実際の picker とメッセージ欄でテストします。

アップロード前の確認

GIF と WebP の対応、最大ファイルサイズ、長辺の解像度、静止 PNG の fallback を確認し、実際の picker とメッセージ欄でテストします。

アニメーション絵文字ガイド FAQ

GIF と WebP はどちらがよいですか？

互換性なら GIF、対応環境で容量を抑えるなら WebP を選びます。静止 PNG も残してください。

サイズはどれを選べばよいですか？

行内絵文字は 128px、一般用途は 240px、大きなステッカー風素材は 512px を出発点にします。

白い箱が表示されるのはなぜですか？

フレームに背景色や半透明の縁が残っています。明暗の違う背景で各フレームを確認してください。