本文へスキップ
開発事例 / Webアプリ

AI証明写真（履歴書用）— 16枚から選んで履歴書PDFに焼き込む

自撮りから証明写真を16通り作り、選んだ1枚を8様式の履歴書PDFの写真枠へ焼き込む

公開中
この形で相談する →実物を見る

写真館に行かずに履歴書用の証明写真を用意する有料サービス（¥980／テンプレート購入者は¥580）。手持ちの自撮り1〜4枚（推奨は正面＋斜めの2枚）から、背景と光4段×レンズと姿勢4列の16通りを一度に作り、選んだ1枚を8様式の履歴書PDFの30×40mm枠へ焼き込む。L判6面の焼き増しシートも書き出せる。加工写真が認められないパスポート・運転免許・マイナンバーカードの申請には使えず、履歴書・エントリーシート・アルバイト応募向け。作った16枚は当社サーバーに保存せず端末のIndexedDBに置き、生成のためOpenAI（米国）へ送ることと同社が不正監視で最大30日保持することは商品ページに明記している。

この作品の要点
困っていたこと履歴書は様式ごとに写真枠の位置が違い、自分で画像を貼ると縮尺も位置も狂う。
やったこと写真枠の座標を8様式ぶん実測して固定し、画面のプレビューと配布PDFを別経路で測って突き合わせた。
起きたこと画面のプレビューと実際に配るPDFの写真位置が、8様式すべて±0.2mm以内（実測の最大ずれ0.15mm）
もくじ

どこでつまずいたか

01履歴書は様式ごとに写真枠の位置が違い、自分で画像を貼ると縮尺も位置も狂う

02証明写真機は撮り直しがきかず、写りを見比べる前に印刷が終わっている

03顔写真を預けるサービスは、どこへ送られて何日残るのかが利用者から見えない

どう解いたか

01写真枠の座標を8様式ぶん実測して固定し、画面のプレビューと配布PDFを別経路で測って突き合わせた

02背景・光とレンズ・姿勢を振った16通りを一度に出し、元の写真と並べて選ばせる

03保存場所を端末のIndexedDBに寄せ、送信先と保持日数を商品画面とプライバシーポリシーに書いた

できあがったもの

結果

01画面のプレビューと実際に配るPDFの写真位置が、8様式すべて±0.2mm以内（実測の最大ずれ0.15mm）
02履歴書HTMLの枠を塗ってPDF化した正解と、座標で焼き込んだ実物を別経路で画素測定し、8様式すべて±0.5mm以内で一致
03画面を実際に操作する自動検査27項目が全OK（16枚の切り出し位置・再読込しても生成APIを1回しか叩かない・合言葉が違うとPDF APIが402で断る）

この作品でできること

  • 2304×3072の4×4シートを1回で生成し、ブラウザ側で16枚に切り出す
  • 背景と光4段 × レンズと姿勢4列。16カット共通で「顔立ち・輪郭・ほくろの位置を変えない」を生成プロンプトに固定
  • チェックを入れた写真と元の自撮りを横に並べて見比べ、タップで拡大できる
  • 選んだ1枚を8様式の履歴書PDFの30×40mm枠へpdf-libで焼き込み、L判6面の焼き増しシートも出す
  • 作った16枚は端末のIndexedDBに置き、タブの合鍵が違うか12時間を過ぎていれば開いた時点で消す

どう作ったか

担当と道具

担当企画・UI設計・AI連携・フルスタック開発・PDF組版
使った技術Next.js 15.5・OpenAI gpt-image-2.5-flare（/v1/images/edits）・pdf-lib 1.17・IndexedDB・Canvas（16分割）・poppler pdftoppm（プレビュー背景の生成）・Square Hosted Checkout

この作品のきほん

種類Webアプリ
いまの状態公開中
規模担当5領域 / 技術7種類
公開先digi.nextcode.ltd

相談する

おなじものが作れます

同じ仕組みを、あなたの商品でも作れます。

この形で相談する →実物を見る

この事例をシェアする

同じ課題を持っている人に届くかもしれません。