前回の記事(時計カタログ編)では、短い依頼を 3 回重ねて、時計カタログを少しずつ仕上げました。今回はその続編です。
この記事では、AI に案をいくつも作らせて選ぶだけでなく、AI 自身に評価させて、実務で使える帳票に仕上げる進め方を紹介します。
題材は見積書です。まず AI に見た目の違う 3 つの案を一度に作らせました。次に、その 3 案を AI 自身に評価させ、評価をもとに実際の業務で使える「実用版」を作らせています。AI に送ったのは、次の 3 つのメッセージです。
下記レコードを元に見積書を3パターン作成して
シンプル・デザイン性・色彩
https://(kintone のドメイン)/k/guest/15/3443/show#record=5
3パターンを評価して、それを基に実用的な見積書を作成して
見積書は1ページ限定でよい
完成した実用版の見積書(印刷屋で作った PDF)
環境の用意(テンプレートリポジトリ、kintone への接続、印刷屋プラグインの zip)は、rex0220 印刷屋プラグイン - AI(Claude Code)に帳票を作らせる の「環境構築(初回だけ)」のとおりです。本記事は、その環境ができている前提で「頼んでから PDF になるまで」を紹介します。
使ったアプリ
見積書アプリ(アプリ番号 3443)は、ゲストスペースにあるアプリです。
見積書アプリのレコード(例のレコード。明細 4 行)
| 項目 | 種類 | 内容 |
|---|---|---|
| 宛名 | 文字列(1 行) | フォームでは後ろに「様」のラベル |
| 見積番号 | 文字列(1 行) | |
| 担当者 | ユーザー選択 | |
| 見積日 / 見積有効期限 | 日付 | |
| 見積明細 | テーブル | 型番(ルックアップ)、商品名、単価、数量、金額(計算) |
| 小計金額 / 消費税 / 合計金額 | 計算 | 消費税は小計の 10%(切り捨て) |
| 備考 | 文字列(複数行) | |
| 見積書ファイル | 添付ファイル | PDF の保存先 |
例のレコードは、明細が 4 行で、備考に改行があり、見積書ファイルにはすでに PDF が 1 つ入っています。
1 通目: 「3 パターン作成して」
下記レコードを元に見積書を3パターン作成して
シンプル・デザイン性・色彩
https://(kintone のドメイン)/k/guest/15/3443/show#record=5
アプリ番号などを別に説明せず、レコードの URL を貼っただけです(番号は URL に含まれています)。AI は URL から、ゲストスペース 15、アプリ 3443、レコード 5 を読み取り、項目とレコードを調べてから、3 つの設定ファイルを書きました。設定の検査はエラー 0 で、書き出した帳票は 3 案とも 1 ページでした(ページ数を数えただけで、はみ出しが無いかは PDF で見ます)。
3 つの案
3 つの案の PDF(左からシンプル・デザイン性・色彩)
| 案 | AI の説明 |
|---|---|
| シンプル | 白黒で、細い線と余白を活かした形。表は縦の線なし。合計は二重線、末尾に「以上」 |
| デザイン性 | 濃紺と金の 2 色。左端に帯、明朝体の「QUOTATION」、金の縦線つきの大きな金額、TO / FROM の 2 列。下にページ番号 |
| 色彩 | 藍から水色のグラデーションの見出し帯。お客様と発行元を色違いのカードに分け、金額はオレンジの帯。表は角丸、備考は黄色のメモ |
「シンプル・デザイン性・色彩」という 3 つの言葉だけで、方向のはっきり違う 3 案が出てきました。
AI が先回りしたこと
返答には、頼んでいないのに気を配った点が書かれていました。
金額項目の単位が半角の「\」なので、そのままだとフォントによってはバックスラッシュで出ます。そこで金額は
YEN()で「¥」を付けて表示しています。
保存先はダウンロードにし、見積書ファイルには保存しません。レコード 5 にはもう見積書の PDF があるので、比べている間に上書きしないためです。
ほかにも、会社名・住所・社印は仮の値にしたこと、明細は 10 行前後で 1 ページがいっぱいになりそうなこと(AI の見積もり)を伝えてきました。
取り込んで見比べる
3 つの設定ファイルを、印刷屋プラグインの設定画面で「追加」で取り込みます。ボタンの名前が「見積書(シンプル)」「見積書(デザイン)」「見積書(色彩)」と別々なので、詳細画面にそのまま 3 つ並びます。
詳細画面 — 3 案のボタン
2 通目: 「評価して、実用的な見積書を」
3 案のどれかを選ぶ代わりに、評価そのものを AI に任せました。
3パターンを評価して、それを基に実用的な見積書を作成して
AI は次の観点で 3 案を比べました。評価は、AI が HTML と CSS を読んで行ったものです(描画した画面は見ていません)。CSS の色の指定(薄い地色、白い文字、グラデーション)や線の色と太さ、行の高さから、白黒で印刷したときの見え方や、1 ページに入る明細の行数を推定しています。
| 観点 | シンプル | デザイン性 | 色彩 |
|---|---|---|---|
| 白黒印刷・コピー・FAX | ◎ | ○(金の細線が薄く消える) | △(薄い色の地が消え、白文字の帯が潰れる。インクも多い) |
| 金額の目立ち方 | △(金額が下線だけで弱い) | ◎ | ○(目立つが、飾りに埋もれる) |
| 正式な書類としての印象 | ◎ | ◎ | △(店頭・イベント向き) |
| PDF 化での崩れにくさ | ◎ | ○ | △(グラデーション、半透明、角丸での切り抜き) |
| 明細が何行で切れるか(目安) | 約 13 行 | 約 11 行 | 約 9 行 |
表の ◎ ○ △ と行数は AI の見立てで、PDF で確かめた結果ではありません。たとえば「PDF 化での崩れにくさ」は、グラデーションや角丸が PDF で崩れるかもしれない、という懸念として挙がったものです。
1 通目の画像(印刷屋で作った PDF)を見ると、色彩の案のグラデーションや角丸は崩れずに出ていました。一方、シンプルの案では社印が会社名に重なっていて、これは AI の評価には出てきませんでした。HTML と CSS からの見立ては、PDF を見て補います。
さらに、3 案に共通する問題も見つけてきました。
- アプリのフォームでは宛名の後ろが「様」です(3 パターンは「御中」)
- 小計・合計が税抜か税込か書いていない
- 明細が多いと、ページの下ではみ出した行が黙って切れます(合計には入っているのに、行が見えない)
1 つ目は、フォームのラベル(宛名の横の「様」)まで見て気づいたものです。3 つ目は、金額を扱う書類では見落とすと困る問題です。
3 通目: 途中で条件を足す — 「1 ページ限定でよい」
AI は 3 つ目の問題を解こうとして、明細が多いときは次のページへ続ける形を調べ始めました。テーブルの行を自分で組んでページを分ける、手の込んだ作り方です。
見積書は 1 ページで十分なので、ここで口を挟みました。
見積書は1ページ限定でよい
AI はすぐに方針を切り替えました。
1 ページ限定で作ります。…15 行を超えたらボタンを出さない形にして、切れた PDF を作らないようにします。
ただし、行数で止めるのは目安です(「できあがった実用版」で説明します)。
AI が作業している途中でも、条件は言葉で足せます。「複数ページは要らない」の一言で、仕組みはずっと簡単になりました。業務の前提(1 ページ、明細は多くない)は、人のほうが知っています。
できあがった実用版
評価をもとに、AI は次のように仕上げました。
| 評価で出た点 | 実用版での対応 |
|---|---|
| 白黒印刷・PDF 化に強いのはシンプル | シンプルを土台にする。色は紺 1 色だけで、白黒で印刷すると濃い灰色になる |
| 金額の見せ方はデザイン性がよい | 金額の枠と、右上の見積番号・発行日・有効期限の表を取り入れる |
| 宛名は「様」 | フォームに合わせて 「様」 |
| 税抜・税込の区別がない | 小計(税抜)、消費税(10%)、合計(税込)。合計欄の金額は、明細の金額の列と縦にそろえる |
| 明細が黙って切れる | 明細を 15 行までに制限し、足りない行は空き行で埋める。15 行を超えるとボタンを出さない |
| 比べるあいだは保存しなかった | 見積書ファイルに保存し、確認してから作る。PDF があってもボタンは出す(出し直せる) |
例のレコードでは、下に余白を残して 1 ページに収まりました(冒頭の画像)。ただし 15 行以下でも、商品名や備考が長いとはみ出すことがあるので、そういう見積もりは PDF で確かめます。行数でボタンを出さなくする代わりに、ボタンはいつも出し、押したときのプレビューで、はみ出していないかを確かめる方針でもかまいません。16 行以上も作る業務なら、「15 行を超えたら 2 ページ目に続けて」と頼みます(今回は作っていません)。
できた形は、「空き行の追加は要らない」のように言葉で直せます。AI に任せた結果が中途半端なら、3 案から気に入ったものを選び、「デザイン性の案をもとに、宛名は「様」、税抜・税込を書いて」のように直してもらう方法もあります。
AI が自分で確かめたこと
AI は設定を検査し、帳票を HTML に書き出して確かめます。今回は、試し用のレコードを手元で作って、例のレコードには無い場合も確かめていました。kintone のレコードには触れていません。
| 確かめたこと | 結果 |
|---|---|
| 例のレコード(明細 4 行) | ページ数は 1。明細 4 行と空き行 11 行で 15 行。金額はすべて「¥」付き |
| 明細を 16 行にした試しのレコード | 空き行は足されない(ボタンの表示条件は、この確認では評価されない) |
| 有効期限を空にした試しのレコード | 有効期限の欄は空欄で出る |
有効期限が空のときに備えて、AI は最初、日付の式を条件分岐で囲みました。ところが、それが検査で警告になりました。そこで空の日付で試し、もともと空欄で出ると分かったので、条件分岐を外して警告を消しています。
ただし、ボタンの表示条件の動き、PDF が 1 ページに収まるか、添付ファイルへの保存は、AI の手元では確かめられません。そこは kintone と印刷屋プラグインで確かめます。
kintone で確かめたこと
| 確かめたこと | 結果 |
|---|---|
| 例のレコード(明細 4 行。1 行は商品名が 2 行に折り返す)の実用版の PDF | 1 ページに収まった(冒頭の画像) |
| 例のレコードの 3 案の PDF | 色彩の案のグラデーション・角丸・半透明の円は崩れずに出た。シンプルの案は社印が会社名に重なった(1 通目の画像) |
| 明細 15 行のレコードでのボタンの表示 | TODO |
| 明細 16 行のレコードでのボタンの表示 | TODO |
| 明細 15 行で、商品名が多く折り返し、備考も長い場合の PDF の収まり | TODO |
| 見積書ファイルへの保存。PDF がすでにあるレコードでは、追加されるか置き換わるか | TODO |
kintone に取り込む
設定ファイル(settings/APP3443-見積書-実用版.json)を、印刷屋プラグインの設定画面で取り込みます。
- アプリの設定 → プラグイン → 印刷屋プラグインの 設定
- 設定をアップロード で設定ファイルを選ぶ
-
取り込み方を選ぶ
- 3 案のボタンがあるアプリに足す → 追加
- すでに「見積書」という名前のボタンがあり、それと差し替える → 一部置換(置き換え先に「見積書」を選ぶ)。「追加」なら「見積書 (2)」になる
- 保存する → 運用環境に反映
実用版のボタンを押すと、確認の後に PDF を作り、見積書ファイルに保存します(PDF がすでにあるときの動きは、上の「kintone で確かめたこと」)。3 案のボタンが要らなくなったら、設定画面で行のチェックを外して無効にします。
今回はアプリにもともと「見積書」ボタンがあったので、実用版を「追加」で取り込むと「見積書 (2)」になりました。
詳細画面 — 3 案のボタンと、実用版の「見積書 (2)」
かかった時間と費用
| 回 | 依頼 | AI の作業時間 | API 料金に換算 |
|---|---|---|---|
| 1 通目 | 3 パターン作成 | 22 分 29 秒 | $2.30 |
| 2 通目 | 評価して実用版を(途中で条件を足した) | 2 分 07 秒 | $0.58 |
| 3 通目 | 1 ページ限定で | 9 分 03 秒 | $1.50 |
| 計 | 33 分 39 秒(約 34 分) | $4.38(約 4.4 ドル) |
- Claude Code は定額プラン(Max)で使っています。プランの利用枠の中で使ったので、この作業のための別の支払いはありません。表の金額は、同じ量を API で使った場合の目安です(Claude Opus 5.5。100 万トークンあたり、入力 $4、出力 $20、キャッシュの読み込み $0.20、キャッシュの書き込み $8。書き込みの $8 は 1 時間キャッシュの料金で、今回の書き込みはすべて 1 時間キャッシュでした。5 分キャッシュなら $5)
- 作業時間は、メッセージを送ってから AI の返答が終わるまでです。kintone からの取得や設定の検査などのツールの実行(合わせて約 3 分)を含みます。結果を読む時間や、kintone で取り込んで PDF を確かめる時間は含みません
- 1 通目が長いのは、帳票の書き方の資料を読む、アプリを調べる、3 案を書く、を全部含むためです
- 換算額の約 4 割が出力トークン(AI が考えて書いた分)、約 6 割が入力トークン(会話・資料の読み込み。キャッシュの読み書きを含む)でした
- 同じ依頼でも、毎回同じ時間・金額になるとは限りません
頼み方のコツ
- レコードの URL を貼る: アプリ番号もレコード番号も、ゲストスペースかどうかも、AI が URL から読み取ります
- まず複数の案を出させる: 「シンプル・デザイン性・色彩」のように方向を言葉で添えると、違いのはっきりした案が並びます
- 評価も AI に頼む: 観点を指定しなくても、印刷・FAX、PDF 化、書類としての印象など、実務の観点で比べてくれます。3 案に共通する問題も見つけます。評価は HTML と CSS からの見立てなので、最後は PDF で確かめます
- 業務の前提は途中でも言う: 「1 ページでよい」のような前提は、人のほうが知っています。AI が作業を始めた後でも、一言で方針が変わります
- 要件に合わせて訂正を重ねる: 実用版ができた後も、「空き行の追加は要らない」のように言葉で直せます。一度で決めなくてかまいません
- 任せるか、選んで直すか: 実用版を AI に任せると、中途半端な形になることもあります。気に入った案があるなら、それを選んで直してもらう方法もあります
- 比べるあいだは保存しない: 試しの PDF をレコードに残さないよう、比べるあいだはダウンロードにし、保存先は使う版を決めてから設定します
AI が教えてくれた注意点
| 注意点 | 内容 |
|---|---|
| 円記号 | 金額項目の単位が半角の「\」だと、書体によってはバックスラッシュで出る。帳票では YEN() で「¥」を付ける |
| 明細の行数 | 明細は 15 行までに制限(超えるとボタンが出ない)。商品名や備考が長い見積もりは PDF で確かめる |
| 保存先 | 例のレコードで押すと、見積書ファイルに PDF が保存される(もう 1 つ入っている。追加か置き換えかは kintone で確かめる) |
| 仮の値 | 会社名・住所・電話番号・社印は仮。正しい内容を伝えて入れ替える |
| 項目 | アプリに件名・納期・支払条件の項目があると、見積書としてもっと使える(項目を足せば帳票に組み込める) |
中身を見たい人へ
AI が書いた計算式と HTML、CSS の要所です。読まなくても使えますが、自分で手を入れたい人のために載せておきます。
ボタン表示条件(15 行を超えたら出さない)
COUNTROW(見積明細) <= 15 // 明細は 15 行まで(1 ページの帳票)。超えるとボタンを出さない
計算式(明細の表と、15 行にそろえる空き行)
LET(
table, TABLE_HTML(見積明細,
OPT("pref", "est-p-item-"),
ARRAY("No.", ROWNO(見積明細) + 1, "value-center"),
ARRAY("型番", 型番, "value-center"),
商品名,
数量,
ARRAY("単価", YEN(単価), "value-right"), // 単位が「\」なので円記号は YEN で出す
ARRAY("金額", YEN(金額), "value-right")
),
blank, "<tr class='est-p-item-row est-p-blank'>" & JOIN(ARRAY_FOR(6, "<td class='est-p-item-td-value'> </td>"), "") & "</tr>",
blanks, JOIN(ARRAY_FOR(MAX(15 - COUNTROW(見積明細), 0), blank), ""), // 15 行にそろえる空き行
REPLACE($html, "##table##", REPLACE(table, "</tbody>", blanks & "</tbody>")) // テンプレートの目印を明細表に
)
-
TABLE_HTMLで明細を表にし、OPT("pref", "est-p-item-")で表の class 名をest-p-item-…にそろえます - 単価と金額は
YEN()で「¥」付きの桁区切りにします -
足りない行数だけ空き行を差し込む:
ARRAY_FOR(MAX(15 - COUNTROW(見積明細), 0), blank)で空き行を作り、表の</tbody>の前に差し込みます。16 行以上なら空き行は 0 です。各明細行の内容が折り返さず、同じ高さに収まる場合は、明細の数が少なくても表の高さは同じになり、下の合計欄と備考の位置がそろいます(商品名が 2 行に折り返した行は、その分だけ高くなります) - HTML 欄の
##table##の目印を、できた表に置き換えます
HTML(金額の枠と合計欄)
<table class="est-p-amount"><tbody><tr>
<th>御見積金額<small>(税込)</small></th>
<td>${YEN(合計金額)}</td>
</tr></tbody></table>
<table class="est-p-total"><tbody>
<tr><th>小計(税抜)</th><td>${YEN(小計金額)}</td></tr>
<tr><th>消費税(10%)</th><td>${YEN(消費税)}</td></tr>
<tr class="est-p-grand"><th>合計(税込)</th><td>${YEN(合計金額)}</td></tr>
</tbody></table>
- 宛名は
${ESC_HTML(宛名)}で、<や&が入っていても文字として出します - 備考は
${REPLACE(ESC_HTML(備考), NEWLINE(), "<br>")}で、改行をそのまま出します
CSS(明細の行の高さと、合計欄を金額の列にそろえる)
/* 明細の行は 32px。2 行に折り返した行は伸びる */
.est-p-item-td-value {
box-sizing: border-box;
height: 32px;
padding: 4px 8px;
border-right: 1px solid #b8c2cf;
border-bottom: 1px solid #d0d7e0;
border-left: 1px solid #b8c2cf;
}
/* 列の幅(No.、型番、商品名は残り、数量、単価、金額) */
.est-p-item-th-label:nth-child(1) { width: 36px; }
.est-p-item-th-label:nth-child(2) { width: 72px; }
.est-p-item-th-label:nth-child(4) { width: 60px; }
.est-p-item-th-label:nth-child(5) { width: 100px; }
.est-p-item-th-label:nth-child(6) { width: 112px; }
/* 合計欄は表の右下に付け、金額の列(112px)と縦にそろえる */
.est-p table.est-p-total {
width: 272px;
margin-top: -1.5px;
border: 1.5px solid #1f3a5f;
}
.est-p-total th {
width: 160px;
font-weight: normal;
text-align: left;
background: #e8edf3;
}
.est-p-total td {
width: 112px;
text-align: right;
}
まとめ
- 見積書は、AI への 3 回のメッセージで、3 つの案 → AI による評価 → 実用版、と仕上がりました
- 案を並べて比べるだけでなく、評価も AI に任せられます。白黒印刷や PDF 化といった実務の観点で比べ、3 案に共通する問題(宛名の敬称、税抜・税込、明細が切れる)まで見つけました
- 業務の前提は人が伝えます。「1 ページでよい」の一言で、作りがずっと簡単になりました。できあがった後も、「空き行の追加は要らない」のように、要件に合わせて訂正を重ねられます
- AI の作業時間は 3 回の依頼で約 34 分、API 料金に換算すると約 4.4 ドルでした(定額プランなら利用枠の中)
- 最後は、印刷屋プラグインの設定画面で取り込んで、実際の PDF を確かめます
関連記事
- rex0220 印刷屋プラグイン - AI(Claude Code)に帳票を作らせる(環境の用意とご提案書)
- rex0220 印刷屋プラグイン - AI(Claude Code)に帳票を作らせる(時計カタログ編)
- 続編: rex0220 印刷屋プラグイン - AI(Codex)に帳票を作らせる(Claude Code 用のしくみで請求書を作成)(Claude Code 用のしくみで Codex に請求書を作らせる)
- 続編: rex0220 印刷屋プラグイン - AI(Claude Code)に帳票を作らせる(画像から見積書を再現)(見積書の画像 1 枚から、同じ見積書を作らせる)
- テンプレートリポジトリ: https://github.com/rex0220/print-craft-authoring
- rex0220 印刷屋プラグイン
- rex0220 印刷屋プラグイン FAQ




