はじめに
「プログラミング経験がなくても、AIだけで実用的なWebツールを作れるのか？」
この疑問に答えるべく約36時間をかけて、プライバシーポリシージェネレーターを開発しました。コーディング知識ゼロの状態から、ChatGPTとClaudeというAIツールだけを頼りに、完全に動作するWebアプリケーションを作り上げた記録をお伝えします。
完成したツールはこちら：プライバシーポリシージェネレーター – Web Privacy Guide
なぜ「AIだけ」で作ろうと思ったのか
Webサービスを作りたいけれど開発コストが課題になることは少なくありません。外注すれば数十万円、自分で学ぶにも時間がかかる。そこで、AI時代の今なら、非エンジニアでも実用ツールが作れるのではないかという仮説を検証したいと考えました。
プロジェクトの準備：要件定義フェーズ
AIに丸投げするのではなく、まず自分で要件を明確にすることに一番時間をかけました。
アイデアを具体的な要件に落とし込むことが、実は一番難しいと思ってます。これには経験や知識が必要で、「何を作りたいか」を言語化する力が必要です。
必要な機能のリストアップ
最終的に以下の要件を定義しました
- 最小限の入力で完結：サイト名・運営者名・メールアドレスのみで法的に有効なポリシーを生成
- 日本の法律に準拠：個人情報保護法 第18条（利用目的の特定）等に対応
- データ非保存：ユーザーの情報をサーバーに保存しない
- 修正容易性：生成後に編集可能
- 法改正への追随性：将来的な法改正にも対応できる設計
- 初期状態で適切なデフォルト設定：「該当なし」項目を自動チェック、標準文言を自動挿入
ターゲットユーザーの設定
- 個人ブログ運営者
- 小規模事業者
- プライバシーポリシーを手軽に作りたい人
開発の背景にあった課題意識
「自分のWebサイトコンテンツの内容を入力するだけで自動生成してくれて、なおかつ日本の法律内で収めてくれるツールが欲しい」
「よくわからないところは、デフォルトで法律の枠内におさまる『プライバシーポリシー』が欲しい」
こうした明確なニーズがあったからこそ、要件定義を進めることができたと考えます。
技術選定の理由
- フロントエンド重視：バックエンド不要のシンプルな構成
- 無料で運用可能：無料ホスティング
- メンテナンス性：自分でも理解できる範囲の技術
開発環境とツール構成
使用したAIツール
- ChatGPT：初期のコード生成、アイデア出し
- Claude：コードのデバッグ、詳細な説明
はじめはChatGPTで作業を進めていましたが、途中で質問を投げてまた元の話しに戻ろうとしたとき、ChatGPTは話しを広げる傾向にあったため、Claudeへ契約替えを実施しました。
開発環境
- VSCode：コードエディタ
- ローカルサーバー：動作確認用
ホスティング環境
- Vercel：デプロイの簡単さと無料枠で選定
プログラミング初心者でも扱いやすい、シンプルな構成を心がけました。
36時間の開発プロセス
所要時間の内訳
- 要件定義：10時間
- コーディング：4時間
- デプロイ：2時間
- デバッグ：20時間
システム構成と動作の理解
AIへの指示の出し方：「要件定義書」として伝える
AIに対しては、「〇〇を作って」という曖昧な指示ではなく、要件定義書のように具体的に伝えることが何よりも重要です。
例：
「プライバシーポリシー生成ツールを作りたい。ユーザーがサイト名、運営者名、連絡先を入力し、送信ボタンを押すと、それらの情報が埋め込まれたプライバシーポリシーのテキストが表示される仕組み。HTMLとJavaScriptで作成し、非エンジニアでも改修できるレベルにしてください。」
このように、何を、どのように、どんな技術で作るかを明確にすることで、AIは的確なコードを返してくれました。
簡単なプロンプトを皮切りに、細かい仕様を固めていき、最終的にはA4サイズ2枚分の要件定義になりました。
最大の壁：専門用語が全く分からない
要件定義を固めているとき、最も苦労したのはAIが返してくる専門用語の理解でした。
特に苦戦したのがNode.jsに関する説明です。AIに何度も質問しましたが、初心者には理解が難しく、堂々巡りになってしまいました。※ここは自分の知識不足です
そんな中、AIから「結局のところ、Vercel使えば？」という提案があり、この時初めてVercelの存在を知りました。Node.jsの複雑な設定を避け、シンプルにデプロイできる方法があると知ったことが、プロジェクトの大きな転機となりました。
他にも理解に苦しんだ用語：
- 「DOM操作」
- 「イベントリスナー」
- 「レスポンシブデザイン」
これらの言葉が何を意味するのか分からず、何度もAIに「これってどういう意味？」と聞き直しました。AIは親切に噛み砕いて説明してくれるので、分からない言葉はその場でAIに質問するというサイクルを繰り返しました。
乗り越え方の工夫
- 小さく試す：全体を作るのではなく、1機能ずつ実装
- エラーをそのままAIに投げる：エラーメッセージをコピペして解決策を聞く
- 動くまで諦めない：何度も修正を繰り返す根気
- 分からない技術は避ける選択肢もある：Node.jsが難しければVercelという代替案
開発を終えて得たもの
成果：完全にAIだけで完成した
結果として、プログラミング知識ゼロの状態から、実用的なWebツールを完成させることができました。AIだけで作れなかったものは一つもありません。
スキル習得：副産物としての学び
ツールを作る過程で、以下のスキルを習得しました：
- Vercelの使い方：デプロイからドメイン設定まで
- Gitのpush操作：コードをリポジトリにアップロードする方法
ただし、Git の巻き戻し（revert）はまだあまり理解できていません。これは今後の課題です。
今後の展開：継続的な改善
ツールは完成しましたが、ユーザーからのフィードバックを元に継続的に改善していく予定です。
- UI/UXの改善
- 生成テキストのバリエーション追加
- 多言語対応
非エンジニアがAIを活用する可能性
今回の経験を通じて、AIは非エンジニアにとって強力な武器になると確信しました。
初期コストを大幅削減
外注なら数十万円かかる開発が、実質無料（AIの利用料のみ）で実現できました。
アイデアを素早く形にできる
思いついたアイデアを、数日〜数週間で実際に動くツールにできるのは大きなメリットです。
ただし、アイデアを具体的な要件に落とし込むことが最も難しいポイントです。これには経験や知識が必要で、ある程度の試行錯誤は避けられません。
学びながら作れる
開発しながらプログラミングの知識も少しずつ身につくため、次のプロジェクトはさらにスムーズになります。
まとめ
「AIだけでWebツールは作れるのか？」という問いに対する答えは、YESです。
ただし、丸投げではなく、要件を明確にし、AIと対話しながら進めることが重要です。専門用語に戸惑うこともありますが、その都度AIに聞けば丁寧に教えてくれます。理解できない技術があれば、別の方法を提案してもらうこともできます。
これについては、今のところClaudeの方が初心者に対して教え方が上手だと思います。
プログラミング経験がない非エンジニアでも、AIを活用すれば自分のアイデアを形にできる時代になりました。この記事が、同じように挑戦したい方の参考になれば幸いです。
今回開発したツールはこちらから無料で使えます：
プライバシーポリシージェネレーター – Web Privacy Guide