AIで業務ツールを作る方法|コードが書けない人でも来週には完成する手順

AI使ってみたい人
AI使ってみたい人

「AIを使えば業務ツールが作れる、とは聞くけど、具体的にどうやるの?」

と思っていませんか。

ChatGPTに「ツールを作って」と言っても、コードが返ってくるだけで「それをどこに貼ればいいの?」で止まってしまう。私もそういう時期がありました。

プログラミングを独学で始めた頃、最初の壁は「コードをどこで動かすか」ではなく「どんな仕様をAIに伝えればいいか」でした。伝え方がわかると、AIが出してくるコードの精度が一気に上がります。

この記事では、AIを使って業務ツールを作る手順を、仕様の考え方→AIへの伝え方→動かし方→公開まで、実体験をもとに解説します。 コードを自分で書く必要はありません。


結論:AIへの「伝え方」が9割

AIで業務ツールを作るときのボトルネックは、技術力ではなく「何を作るかの言語化」です。

「計算ツールを作って」ではなく、

面積と厚みと比重を入力したら重量をキログラムで出す計算フォームを作って
HTMLとJavaScriptで書いて
スマートフォンでも使えるデザインにして

という粒度で伝えれば、一発で動くコードが出てきます。

私が filmtools.jp のツールを量産できたのは、この「仕様の言語化テンプレート」を作ってからです。これはプログラマーではできないスキルです。現場の人が一番よくわかっているからです。

テンプレートに当てはめてAIに渡せば、ほぼ一発で動くコードが出てきます。


AIで業務ツールを作る4ステップ

ステップは4つです。

  • ① 「何を作るか」を紙に書き出す
  • ② テンプレートに当てはめてAIに渡す
  • ③ 生成されたコードをブラウザで動かす
  • ④ 修正・仕上げ→公開

それぞれ詳しくみていきましょう。


Step1:「何を作るか」を紙に書き出す

AIに渡す前にアナログで仕様を整理する

ここが一番時間をかけるべき工程です。

AIは伝えたことは正確にコード化してくれますが、「察してくれる」ことはしません。「月次集計ツールが欲しい」という曖昧な指示では、想定と違うものが出てきます。

私が最初に作った計算ツールのとき、仕様を整理せずにAIに投げたら「なんか違う」を5回以上繰り返しました。AIに「違う。ちゃんと考えて。」って入力したこともあります。そのたびに修正依頼をしていましたが、仕様を先に書き出すようにしてからは1〜2回で完成するようになりました。

整理する4項目

以下の4項目を書き出します。

  • 入力: 何を入力するか(数値・テキスト・ファイルなど)
  • 処理: 何を計算・変換・抽出するか(計算式や条件)
  • 出力: 何を表示・出力するか(数値・CSV・グラフなど)
  • 制約: エラー処理・デザイン・使用環境など

記入例(フィルム重量計算ツール):

入力:
・面積(㎡)
・厚み(μm)
・比重(数値。デフォルト値1.4)

処理:
・重量(kg) = 面積 × (厚み ÷ 1,000,000) × 比重 × 1000
・小数点3桁まで表示

出力:
・「重量:〇〇〇 kg」の形式でテキスト表示

制約:
・HTMLとJavaScriptのみ(サーバー不要)
・スマートフォンでも使える
・数値以外が入力されたら「数値を入力してください」とエラー表示

Step2:テンプレートに当てはめてAIに渡す

このテンプレートをそのまま使う

以下のテンプレートをChatGPT・Claude・Geminiのどれかに貼り付けて、Step1で整理した内容を書き換えるだけです。

以下の仕様で業務ツールを作ってください。

【ツールの目的】
(例:フィルムの重量を入力値から計算する)

【使用技術】
HTMLとJavaScriptで書いてください。
サーバー不要でブラウザだけで動くようにしてください。
日本語のコメントをつけてください。

【入力項目】
・面積(㎡):数値入力
・厚み(μm):数値入力
・比重:数値入力(デフォルト値 1.4)

【計算式・処理内容】
重量(kg) = 面積(㎡) × (厚み(μm) ÷ 1,000,000) × 比重 × 1000
結果は小数点第3位まで表示する。

【出力】
「重量:〇〇〇 kg」の形式でテキスト表示する

【エラー処理】
・数値以外が入力されたら「数値を入力してください」と表示する
・空欄のまま計算ボタンを押したら「すべての項目を入力してください」と表示する

【デザイン】
・スマートフォンでも使いやすいシンプルなデザイン
・ボタンは押しやすいサイズにする

このテンプレートで出てきたコードは、ほぼそのままブラウザで動きます。

Pythonで作るケース(データ処理・集計)

計算フォームではなく、CSVを読み込んで集計するようなツールはPythonが向いています。その場合はテンプレートの「使用技術」部分を以下に変えます。

【使用技術】
Pythonを使ってpandasとopenpyxlで書いてください。
Google Colab向けのコードにしてください。
日本語のコメントをつけてください。

pandasとopenpyxlって何?となる方は、まず、「Pythonを使って〇〇したいが、まずどのような技術を使えば良いでしょうか?」とヒアリングしてみると良いです。

Step3:生成されたコードをブラウザで動かす

HTMLファイルの場合:メモ帳に貼ってブラウザで開く

  1. メモ帳(またはVS Code)を開く
  2. AIが出してきたHTMLコードを全部貼り付ける
  3. `計算ツール.html` という名前で保存する
  4. ファイルをダブルクリックするとブラウザで開く

これだけです。インストールは一切不要です。

Pythonの場合:Google Colabに貼る

Googleアカウントがあれば今すぐ使えます。Pythonのインストールは不要です。

  1. `colab.research.google.com` にアクセス
  2. 「新しいノートブック」を作成
  3. AIが出してきたPythonコードをセルに貼り付ける
  4. `Ctrl+Enter` で実行

エラーが出たときの対処法

エラーが出たら、エラーメッセージをそのままAIに貼るだけです。

以下のエラーが出ました。修正してください。

【エラーメッセージ】
(エラー文をそのままコピペ)

【現在のコード】
(コードをそのままコピペ)

私の経験では、これで8割のエラーは解消されます。残り2割は「変数名が違う」「ファイルパスが違う」などの設定ミスで、エラーメッセージを読めばわかります。


Step4:修正・仕上げ→公開

見た目を整える

動いたら、次はデザインの調整です。AIに以下のように追加依頼します。

先ほどのコードのデザインを改善してください。
・背景色はライトグレー(#f5f5f5)にする
・ボタンは青色(#0066cc)にする
・フォントサイズを少し大きくする
・入力欄と結果の間に余白を設ける

細かい見た目の調整もAIが一発でやってくれます。CSSの知識は不要です。

公開する

HTMLファイルのツールなら、以下の3つが選択肢です。

方法費用手順
共有フォルダに置く無料ファイルをコピーするだけ
GitHub Pages無料GitHubにpushするだけ
Netlify無料ドラッグ&ドロップするだけ

私は filmtools.jp をGitHub Pages→独自ドメインで運用しています。URLを送るだけで全員が最新版を使える状態になるので、Excelファイルの配布と違って更新コストがほぼゼロです。


AIで作ったツールの実例:filmtools.jp

filmtools.jp

作った背景

フィルムパッケージの製造現場では、毎日同じ計算式を手作業でやっていました。担当者ごとにExcelファイルが違い、バージョン管理が崩壊していたのです。

「ミスが出るたびに誰のファイルが正しいか確認する」という無駄な時間が月に4〜5時間ありました。

AIでツールを量産して全部Webアプリにしたのが「Filmtools」です。使っている技術はHTMLとJavaScript(Vue.js)です。

AIに出してもらったもの

  • 計算フォームのHTML/JS(ほぼそのまま使用)
  • バリデーション(エラー処理)のロジック
  • レスポンシブ対応のCSS
  • 計算式の日本語コメント

「コードを理解してから作る」ではなく「動かしてから理解する」の順番で作りました。この方針のほうが圧倒的に早いです。


AIツール作成でよくある失敗と対処法

失敗1:「なんか違う」が続く

→ 仕様の言語化が足りていません。Step1の4項目(入力・処理・出力・制約)を埋めてからAIに渡してください。

失敗2:エラーが出て止まる

→ エラーメッセージをそのままAIに貼れば解決します。「エラーが出て動きません」だけでは不十分です。必ずエラー文とコードをセットで渡してください。

失敗3:動いたけどデザインが使いにくい

→ デザインの指示はコードと別で「改善して」と追加依頼するのが一番です。最初から全部指定しようとするとプロンプトが複雑になります。

失敗4:作ったけど誰も使ってくれない

→ 公開方法の問題です。「URLを送るだけで使える」状態を作ることが最優先です。GitHub PagesやNetlifyで公開すれば解決します。


まとめ

  • AIで業務ツールを作るボトルネックは技術力ではなく「仕様の言語化」
  • 入力・処理・出力・制約の4項目を書き出してからAIに渡すと一発で動くコードが出る
  • HTMLツールはメモ帳に貼ってブラウザで開くだけで動く
  • エラーはエラーメッセージ+コードをAIに渡せばほぼ解消できる
  • 完成したら GitHub Pages か Netlify で無料公開して「URLを送るだけ」の状態にする

AIで業務ツールを作ると、どんな仕上がりになるか見てみたい方は filmtools.jp をご覧ください。フィルムパッケージ向けの計算ツールをAIを活用して量産しました。


「AIがあればコードが書けなくても作れる」という時代になりました。

ただ、「仕様を言語化する力」「エラーを読み解く力」「どんなツールを作れば業務が改善するか考える力」は、AIには代替できません。この力を身につけた人が、これからの職場で一番価値を出せるのです。

製造業や総務部門で「AIを使いこなせる人材」はまだ希少です。今学び始めれば、2〜3年後には確実に差がつきます。今の職場でスキルを積むのも正解ですし、スキルをもって転職するのも正解です。どちらにせよ、行動を始めるなら早いほど有利です。

製造業・非エンジニア向けAI活用・業務改善の始め方