スクリーンショットの周りに余計な余白があって、資料に貼ると不格好。撮った写真のファイル名が「IMG_4821.jpg」ばかりで、どれが何の写真か分からない。画像を使う前のひと手間は、1枚ずつやると意外と時間を取られます。
この記事では、FlowPocketの画像の余白自動除去と画像一括リネームを使って、画像の余白とファイル名をまとめて整える方法を紹介します。画像はアップロードされず、ブラウザの中だけで処理されます。
マニュアル用のスクリーンショットを何十枚も用意するとき、余白の切り落としと名前の付け直しが、いちばん単調で時間のかかる作業でした。
目的別：どのツールを使えばいい？
| やりたいこと | 使うツール |
|---|---|
| スクリーンショットや商品画像の周りの余白を、自動で切り落としたい | 画像の余白自動除去 |
| たくさんの画像のファイル名を、連番や日付でまとめて付け直したい | 画像一括リネーム |
どちらも複数の画像をまとめて処理でき、結果はZIPで一括保存できます。
画像の余白自動除去
画像の余白自動除去は、画像の四隅の色を背景とみなして、その色が続く余白を上下左右から自動で取り除きます。
- 余白を除去したい画像を選びます（複数選べます）
- 必要に応じて「検出の厳しさ」と「残す余白」を調整します（初期値のままでも大抵うまくいきます）
- 「余白を自動検出して除去」を押します
- 1枚ずつ保存するか、「まとめてZIPでダウンロード」で一括保存します
1590×756の画像が1366×592になりました
画像ごとに四隅の色を調べるので、背景が白い画像と黒い画像が混ざっていても、それぞれに合わせて処理されます。
画像一括リネーム
画像一括リネームでは、連番・元の名前・日付・画像のサイズを組み合わせて、命名規則を自由に決められます。
- リネームしたい画像を選びます（選んだ順番が連番の順になります）
- 「命名規則」を入力します。たとえば
manual_{n}なら「manual_001.png」「manual_002.png」…になります - 「連番の開始」と「桁数」を決めます
- 一覧で新しい名前を確認し、「リネームしてZIPで保存」を押します
使える書式は次のとおりです。ボタンを押すと、入力欄のカーソル位置に挿入されます。
{n}：連番{name}：元の名前{date}：今日の日付{w}・{h}：画像の幅と高さ
ブラウザからはパソコンの中のファイル名を直接変えられないため、新しい名前のコピーをZIPで書き出す仕組みです。ZIPを展開して、元のファイルと差し替えてください。
組み合わせると便利な順番
マニュアルや資料用の画像をまとめて準備するときは、次の順番がおすすめです。
活用シーン
- マニュアル・手順書の作成：スクリーンショットの余白を整え、手順の順に名前を付ける
- ネットショップの商品画像：白背景で撮った写真の余白をそろえ、商品番号で名前を付ける
- スキャンした書類の整理：周りの余白を切り、日付付きの名前にする
- 写真の整理：イベントの写真に、イベント名と連番を付ける
よくある質問
写真の余白も除去できますか？
四隅が単色（または近い色）の画像に向いています。風景や人物の写真のように、四隅にも被写体が写っている画像では、意図しない範囲が切り取られることがあります。写真は画像トリミングで範囲を選んで切り抜いてください。
リネームで拡張子も変えられますか？
変えられません。拡張子は元のファイルのものが自動で付きます。形式そのものを変えたい場合は、画像形式変換を使ってください。
画像がアップロードされることはありますか？
ありません。余白の検出・トリミング・リネーム・ZIPの作成まで、すべてブラウザの中で完結します。
注意点
- 切りすぎ・切り残しは「検出の厳しさ」で調整を：切られすぎる場合は下げ、余白が残る場合は上げてください
- 連番の順番は選んだ順です：並び順を変えたいときは、選び直してください
- 元の画像は残しておきましょう：処理後の画像はZIPで別に保存されます。元のファイルは上書きされません
まとめ
画像の余白とファイル名をまとめて整えておくと、資料作りや画像の管理がぐっと楽になります。FlowPocketの画像の余白自動除去と画像一括リネームなら、何枚でも一度に処理でき、画像をアップロードする必要もありません。
次にスクリーンショットをまとめて用意するときに、試してみてください。
