GIF Compressor v2 — 動画をNOTE用GIFに変換するブラウザツールをアップデート
以前作った「GIF Compressor 」をアップデートしました。
高性能化しすぎてNOTEの仕様に合わずGIF出力はできても、アップロードに失敗。
今回は、NOTEの仕様を調査して動く状態に修正。
更に、対応する動画ファイルも「MP4 / WebM / MKV」などに対応。
GIFを、ブラウザ上でNOTEに最適化されたGIFアニメーションに変換するツールへバージョンアップ。
これでやっと気軽にNOTE動画をアップできるように。
サーバーへのアップロードは一切なしで、すべてブラウザ内で完結します。
🔗 https://lain-lab.com/gif_compressor
動画:
OBS studioで録画したmkv動画を、GIF Compressor v2へドロップして、変換してアップろーしたGIFアニメ。


意外な事に、640x854pxという規格外っぽいサイズでもアップできてます。
NOTEのGIFアップロード、失敗しがち問題
NOTE記事にGIFアニメを貼ろうとして
「画像のアップロードに失敗しました」
を見たことがある人、多いと思います。
公式のヘルプには「20MBまで」としか書かれていませんが、実はファイルサイズだけでなくフレーム数が裏の制約になっています。
経験上、200フレーム以下なら安定してアップロードできます。
つまり、ただ圧縮するだけでは不十分で、FPSとフレーム数を正確にコントロールする必要があります。
できること
動画 → GIF変換: MP4やWebMをドロップするだけでGIFに変換
GIF → GIF圧縮: 既存のGIFファイルの再圧縮にも対応
NOTEプリセット: ワンボタンでNOTE向け最適設定(640px / 10fps / 200フレーム以下)を適用
トリム機能: 動画の開始〜終了をスライダーで指定
フレーム数警告: NOTE上限を超えそうなとき事前に警告
使い方
1.ファイルをドラッグ&ドロップ(MP4 / WebM / GIF)

2.動画の場合、トリムスライダーで使いたい区間を指定

3.プリセットを選択(NOTE / BLOG / CUSTOM)


4.「EXECUTE」をクリック

5.完了したらダウンロード → NOTEに貼り付け
技術的な話
内部では2つのエンジンを組み合わせています。
gif.js — 動画のフレームを抽出してGIFにエンコード(Web Worker並列処理)
Gifsicle WASM — 生成されたGIFをさらにLossy圧縮&色数最適化
FFmpeg WASMという選択肢もありましたが、初回ロードだけで25MB以上あり、一部のホスティング環境では動作しない制約もあるため不採用。
ブラウザの標準的な動画デコード機能を活用する軽量な構成にしました。
詳しい技術仕様やプリセット一覧は詳細ページにまとめています。
🔗 https://lain-lab.com/featured/gif-compressor/

おわりに
元々は自分がNOTEにGIFを貼るために作ったツールです。
「動画をGIFに変換して、さらに別のツールで圧縮して、それでもNOTEに弾かれる」
という手間から解放されたかった。
同じ悩みを持っている方の役に立てば幸いです。
公開ツールリスト

