JPEG↔PNG→WEBP Converterの基本的な使い方と注意点を残しておきます。
1. アップロード前の準備（透かしを使いたい場合）
透かし（ウォーターマーク）を付けたい場合は、まず画像をアップロードする前に設定しておくとスムーズです。
- 画面上部の「透かし設定」ボタンをクリック。
- ポップアップが開くので、透かし用の画像ファイルをドラッグ＆ドロップまたは「ファイルを選択」から読み込み。
- 読み込みが完了したら、サイズスライダーで透かしの大きさ（5～50％）を調整。
- 透明度スライダーで、「どのくらい透けるか」を調整（0％で完全に不透明、100％で完全に透明）。
- 位置グリッドから、左上／中央／右下など好きな配置を選択。
- 設定が終わったら「完了」ボタンを押してポップアップを閉じます。
透かしを先に設定しておくと、後から画像をアップロードしたときにプレビューが一気に反映されます。逆に画像を先アップロードしてから透かしを設定すると、全プレビューを再生成するので少し時間がかかります。
2. 画像ファイルをアップロード
中央上部にある大きな点線の枠（アップロードエリア）に、JPEG/JPG/PNG画像を読み込みます。
- 枠内に画像ファイルをドラッグ＆ドロップ。
- もしくは「ファイルを選択」ボタンをクリックして、複数ファイルを選択。
- Ctrlキー（Macは⌘キー）を押しながら選択すると、複数枚まとめて選べます。
大量の画像（20枚以上など）を一度にアップロードすると、ブラウザの負荷が高くなり動作が遅くなる場合があります。特に高解像度画像はメモリを多く使うため、必要に応じて少しずつアップロードしてください。
3. 出力設定（形式・サイズ・品質）
- 出力形式（WEBP・JPEG・PNG）を選択。選ぶとタイルが青くハイライトされます。
- 出力サイズ（横幅基準）を選択
- Full（オリジナルサイズ）
- 1280px / 1024px / 640px / 400px / 300px
- 品質スライダーで1～100％の間で選択（初期値は90％）。
※PNG出力時は品質設定が無効化され、スライダーは無効になります。
これらの設定を変更すると、すでにプレビューされている変換済み／ダウンロード用のボタンがリセットされます。設定を変えたら、再度プレビューを確認してから変換を行ってください。
4. リアルタイムプレビュー & 個別変換
画像をアップロードすると、下にプレビューエリアが表示されます。
- 選択中の設定（形式・サイズ・透かし）を全て反映したサムネイル画像
- ファイル名・元のファイルサイズ（KB）・元解像度
- 出力解像度・出力形式・透かし適用の有無・EXIF削除済みの表示
- 「○○に変換」ボタン（例：WEBPに変換）。クリックで個別に変換がスタート
- 進捗バー100％になると「変換完了」表示になります
- 「ダウンロード」ボタン（変換完了後に表示）。クリックすると出力ファイルを保存
プレビュー画像をクリックすると拡大モーダルが開き、もう一度クリックかESCキーで閉じられます。
プレビューはブラウザ上で生成するため、枚数が多いと表示に時間がかかります。枚数を絞るか、スペックの高いPC環境で利用すると快適です。
5. 一括処理（すべての画像をまとめて変換）
- 複数枚アップロードしている場合は、プレビュー上部に「すべての画像を変換」ボタンが表示されます。
- クリックすると、プレビュー内の全「○○に変換」ボタンを自動で順次（200ms間隔）クリックして、一括で変換処理を行います。
6. 一括ZIPダウンロード
- 個別変換で2枚以上が完了すると、プレビュー上部に「一括ZIPダウンロード」ボタンが表示されます。
- クリックすると、JSZipライブラリを使って変換済みの画像をまとめてZIP化し、ダウンロードリンクを自動生成します。
- 名前は「
converted_images_YYYYMMDD_HHMM.zip」の形式で保存されます。 - ダウンロード中は「ZIP作成中…」と表示され、完了後は「◯枚の画像をZIPファイルでダウンロードしました！」とステータスメッセージが表示されます（約3秒表示）。
ZIP化にはブラウザのメモリとCPUリソースを使います。画像数が多い場合は分割して少しずつZIP化すると安定します。高スペックなPC環境であるほど処理が速くなるので、大量の画像をまとめたいときはPCでご利用ください。
7. 画像をクリアする
すべてリセットしたいときは、プレビュー右上の「画像をクリア」ボタンをクリックしてください。読み込んだ画像とプレビューがすべて消え、再度アップロードからやり直せます。設定（形式・透かしなど）は保持されますので、クリア後すぐ別の画像をアップロードできます。
8. 注意点と便利なコツ
8.1 大量画像の扱い
- 一度に読み込む画像は20枚以内を目安にしてください。（一眼撮影の解像度の高い画像は10枚程度まで）
- 高解像度の画像（2,000×2,000ピクセル以上など）を大量にアップロードすると、ブラウザが重くなる・クラッシュする可能性があります。
- 重くなってきたら一度「画像をクリア」して、少ない枚数ずつアップロードして処理してください。
8.2 透かし設定のタイミング
透かしを後から追加すると、すでにプレビューされているすべてのサムネイルを再描画する必要があるため時間がかかります。できれば画像をアップロードする前に透かし設定を完了しておくと、スムーズにプレビューが反映されます。
8.3 EXIF情報の自動削除
出力時にはカメラ情報や撮影日時などのEXIFメタデータを自動的に削除します。SNSなどにアップロードするときにプラバシーを守りたい場合に便利です。
8.4 iOS端末での保存方法
- iPhone／iPadのSafariではWeb Share APIを利用し、「写真に保存」で直接カメラロールに保存できます。
- もしWeb Share APIに対応していないときは、別タブで画像を表示後、長押しして「写真に保存」を行ってください。
- iOSのバージョンやブラウザ仕様の変更で保存方法が変わる場合があります。その際は、PCにダウンロードしてからAirDropやクラウド経由でiPhoneへ転送する方法もご検討ください。
9. 実行手順のまとめ
- （必要なら）透かし設定を先に行う：透かし画像のアップロード → サイズ・透明度・位置を調整 → 「完了」
- 「ファイルを選択」またはドラッグ＆ドロップで、JPEG/JPG/PNG画像を複数アップロード
- 出力形式（WEBP／JPEG／PNG）を選択
- 必要に応じて「出力サイズ」を選択（Full／1280px／1024px／640px／400px／300px）
- 品質スライダーで出力品質を調整（PNG出力時は無効表示）
- プレビューを確認し、個別に「○○に変換」ボタンをクリック、または「すべての画像を変換」をクリック
- 変換後、各サムネイルの「ダウンロード」ボタンで個別保存、もしくは「一括ZIPダウンロード」でまとめて保存
- 不要になったら「画像をクリア」ボタンでプレビューをリセットし、再度手順1からやり直し
10. サポート情報
ご要望や不具合のご報告は、Twitter（@ryu9zap）までお気軽にお知らせください。
本アプリの使用によるトラブルや損害について、開発者は一切責任を負いません。ご了承ください。