画像1枚から見積書PDFを再現できるか?

kintoneの「印刷屋プラグイン」を用いた帳票作成で、見積書のスクリーンショット画像1枚と簡単な指示出しから元のデザインをどこまで再現できるか検証しました。

概要

  • 指示は画像+1行のみ: 「アプリ 3740 で、画像の見積書を作成して」と送るだけで、二重枠や配色(紺・金)、社印のSVG描画、明細表のレイアウトまで高精度に再現。
  • 2回の依頼でほぼ完全一致: 1通目の微小なズレ(列幅・文字サイズ)に対し、比較画像をもとに「実際に設定ファイルで直す」と伝えてCSSを補正。合計作業時間 約8分(API換算 約$2.56)で元の帳票とほぼ見分けがつかない仕上がりになりました。
  • 自動認識と補完: 画像の見出し(品番・品名)とkintone項目(型番・商品名)の自動マッピングや、画像から読み取れない有効期限ルールの仮定など、AI側の気の利いた補完も確認できました。

詳細な検証手順・プロンプト・CSSの解説はこちら

AIがどのように画像を読み取ったのか、列幅がずれたCSSの原因(box-sizing の有無)、頼み方のコツなどの詳細な技術解説は、Qiitaの記事で公開しています。

:backhand_index_pointing_right: rex0220 印刷屋プラグイン - AI(Claude Code)に帳票を作らせる(画像から見積書を再現)