資料を見る相談する
IDEA / NAYUTA Labo2026-10-01自社検証済み執筆:NAYUTA

社内画像の外部送信を避ける。ブラウザ完結型で動かす画像形式変換ツールの試作

Webサイトの更新やSNS投稿、広報資料の作成などで「PNGをWebPに変えたい」「JPEGの容量を少し落としたい」という場面は頻繁に発生します。しかし、社内ルールや情報セキュリティの観点から、見知らぬ無料変換サイトへ業務画像をアップロードすることにためらいを感じるケースは少なくありません。

01 / SITUATION

現状と課題

デスクトップアプリのインストールが制限されているPC環境では、日常的なフォーマット変換のためだけに画像編集ソフトを立ち上げたり、情報漏洩リスクを抱えながら外部のWeb変換サービスを利用したりすることが業務の摩擦を生んでいました。

02 / IDEA

解決のアイデア

なぜ作ったか

PNG、JPG、WebPなどの画像形式を変換するためだけに外部サービスを探してアップロードする手間をなくし、ブラウザだけで安全かつ簡単に画像変換できる小さな社内ツールを作る。

今回の検証

サーバー処理を行わず、ブラウザ内完結を選択した背景

画像をサーバーに送信してバックエンドで変換処理を行う構成にすると、一時的であってもサーバー上に画像ファイルが滞留し、通信帯域の消費や情報管理上の責任が発生します。

そこで今回のツールでは、Google Apps Script(GAS)を単なるWebページの配信基盤としてのみ利用し、実際の画像デコード・リサイズ・形式変換処理はすべて利用者のブラウザ(Canvas API)上で実行する設計を採用しました。

  • GASの役割はHTMLとJavaScriptの配信のみに限定
  • 画像ファイルは端末のローカルメモリ上で処理され、外部通信は発生しない構成
  • サーバー側のファイル保持ストレージや変換用APIキーが不要

実装した変換仕様とプレビュー比較機能

日常業務での利用を想定し、単に形式を変えるだけでなく、ファイル容量や解像度の変化を確認しながら作業を進められるインターフェースを整えました。

特にJPEG形式への変換時には、透過情報を持つPNGファイルを変換すると透明部分が黒く潰れてしまう特性があるため、背景を自動的に白で塗りつぶしてからエンコードする処理を組み込んでいます。

  • PNG、JPG、WebPの相互変換および画質(品質パーセント)の調整
  • アスペクト比を維持した最大横幅(px)による縮小リサイズ
  • 変換前後のファイル名・画像解像度・ファイル容量の並列表示
  • ドラッグ&ドロップによる複数ファイルの一括登録と個別保存

動作確認の状況と運用上の注意点

本実験では、開発環境上での画面表示および変換フローの一連の動作について自社確認(SELF_VERIFIED)を行っています。

ただし、ブラウザ側の処理能力やメモリ容量に依存する構成であるため、極端に大きな解像度の画像や大量のファイルを一度に処理する場合の負荷については、利用環境ごとの個別検証が必要です。

  • 初回ページ読み込み時にはGAS配信および外部CDN(Tailwind CSS)へのアクセスが発生する点
  • 高画素カメラのRAW画像や極大ファイルではブラウザのタブがクラッシュする可能性がある点
  • 会社ごとのセキュリティポリシーやブラウザ制限に応じた利用判断が必要な点

実際の操作画面

Before
Before
After
After
Complete
Complete
03 / TRY IT

自分の業務で、試してみる

MEMBERS ONLY

会員登録で、制作プロンプトとコードを受け取る

このアプリをGeminiでつくったときのプロンプトと、GASのコードをお渡しします。無料の会員登録で受け取れます。登録はメール配信や営業連絡への同意ではありません。

無料で会員登録して受け取るすでに会員の方はログイン上に見えているのは表示イメージで、この記事の実際のコードではありません。
04 / SCOPE

NAYUTAが実装・支援する範囲

最初は担い、判断基準と運用を会社に残します。

  1. 01PNG / JPG / WebP 形式の相互変換
  2. 02ブラウザ内Canvas APIによるクライアントサイド画像処理
  3. 03最大横幅の指定による比率保持リサイズ
  4. 04Google Apps Script Webアプリとしての社内URL配信
05 / EXPECTED CHANGE

期待できる効果と条件

ここに書くのは期待できる変化です。実際に確認できた変化はお客様の声に分けて記載します。

  1. 01外部の無料画像変換サイトへの業務画像アップロード抑止
  2. 02画像編集ソフトを立ち上げずに済む簡易作業の手間軽減
  3. 03変換前後の解像度と容量の視覚的な確認による最適化

前提条件:利用者の端末スペックおよびブラウザ(Canvas/Blob機能)が正常に動作する環境であること。ページ読み込み時のネットワーク接続が許可されていること。

SUPERVISION / 監修
岸 和伸

監修:岸 和伸

住宅会社で注文住宅の営業を経験した後、Web・SNS・販促・マーケティングへと仕事を広げ、注文住宅に加えて分譲・不動産仲介・リフォームのWeb制作・運用に携わってきました。その後、大手不動産会社で広報・PR、ブランディング、オウンドメディアなどを担当。SNSやAI活用にも取り組んできました。住宅・不動産に携わって、約15年。

監修範囲

住宅・不動産の業務での使い方、手順、試した内容の書き方に関する確認。社内の環境や使い方による結果の違い、法律・税務・情報セキュリティ等の個別専門判断を代替しない。

CONSULTATION / IDEA

このアイデアについて相談する

「社内画像の外部送信を避ける。ブラウザ完結型で動かす画像形式変換ツールの試作」について、30分相談でお話を伺います。自社の仕事でも使えそうか。必要な準備や、取り入れ方から一緒に考えます。

30分相談を予約する

住宅・不動産会社の事業についての初回相談は、約30分・無料です。現状の見立て、優先して確かめること、最初の一歩をお伝えします。詳しい調査・分析、提案書の作成、制作・実装は別途のご依頼です。