AIに予算計算ツールを作ってもらう。日本語の条件から動くHTMLへ

1. 入力・計算式・例外時の表示まで日本語で指定

「予算ツールを作って」だけでなく、人数と費目、予備費の計算、円単位の丸め方まで指定しました。期待する答えを一つ伝えると、できあがったツールの照合もしやすくなります。

今回は外部通信や保存機能のない、単体のHTMLを依頼しました。これは今回の成果物の条件です。すべての生成ツールが自動的に同じ仕様になるわけではありません。

社内イベントの予算を試算する小さなツールを、1つのHTMLファイルとして実際に作って納品してください。コード実行でファイルを作成。HTML内にCSSとJavaScriptをすべて含め、外部通信・外部ライブラリ・トラッキング・データ保存なしでローカルで動くもの。架空の計算例です。

入力：参加者数（初期値30人、整数0以上）、1人あたり飲食費（1500円、0以上）、会場費（20000円、0以上）、備品費（5000円、0以上）、予備費率（10%、0〜100）。
結果：基本費用=人数×飲食費+会場費+備品費、予備費=基本費用×率を円単位で四捨五入、総額=基本費用+予備費、1人あたり=総額÷人数を円単位で四捨五入。人数0のとき1人あたりは「—」。入力に応じて即時再計算。負数や空欄は赤字で入力エラーを示し、誤った結果を表示しない。
白と紺・ティールの読みやすいデザイン、スマホ対応、日本語ラベル。初期値で基本70,000円・予備7,000円・総額77,000円・1人2,567円になることも検査し、検証TXTを一緒に納品してください。

2. 実ファイルを受け取り、ブラウザで開く

Bestllamのコード実行を使ってHTMLと検証TXTが生成され、回答のリンクから取得できました。HTMLには画面の構成、見た目、計算処理が一つに入っています。

掲載したZIPを展開すると、event_budget_tool.htmlと検証TXTが入っています。HTMLをブラウザで開くと、上の画像と同じ計算画面を試せます。掲載用のZIP化以外に、生成されたHTMLのコードは修正していません。

拡大して見る

3. 人数を変え、表示される金額を確かめる

30人から40人へ変更すると、基本費用85,000円、予備費8,500円、総額93,500円へ更新されました。1人あたりは四捨五入で2,338円です。

人数0のときは会場費と備品費が残り、総額27,500円になります。1人あたりは0で割らず「—」。人数の空欄・負数・小数や、予備費率101%では入力エラーを表示し、結果の金額を「—」にすることも確認しました。

4. スマホでも入力しやすい配置を指定する

PCでは入力欄と試算結果が左右に並び、スマホ幅では縦に並びます。今回の実ファイルを幅1280pxと390pxで開き、横にはみ出さないことと計算操作を確認しました。

画面の幅だけでなく、入力エラーや0件時の挙動も依頼に含めると、日常の小さな道具として確認すべき点が明確になります。計算の前提を変える場合も、まず期待値を決めてから変更を依頼すると照合しやすくなります。

よくある質問