非エンジニアがClaude Codeでサイトを公開してわかった。時間を食うのは、コードではない

この夏、所属コミュニティの千人規模のカンファレンスに向けて、28セッション・登壇者113人分の「事前学習サイト」を作って公開した。私はプログラミングを業務では使わない、医療機器メーカーのしがない事務員である。相棒はClaude Code。着手からサイト公開まで16日だった。

「AIでサイトが作れるらしい」は、あなたの職場でも誰かが言っているはずだ。実際に作れる。ただし、丸投げした人から順に沼にハマる。

先に答えを言っておく。16日間でいちばん時間を食ったのは、コードを書くことではない。113人分のファクトチェックと、作る前に「やらないこと」を削ることだった。先日、この全記録を勉強会で72分かけて話した。この記事はその蒸留で、公開までに効いた原則を4つにまとめる。

原則1：サイトの正体は、73行の設計図だった

PCで、シンプルな作りのサイトを開いて右クリックし、「ページのソースを表示」を選んでみてほしい。出てきた文字列が、そのページの設計図だ。ウェブサイトは秘密の技術でできていない。誰でも中身を見られる、開かれた仕組みでできている。

私が作ったサイトの骨組み（HTML）は、たった73行だった。そこに、見た目を整えるCSSが832行、検索やメモ機能の動きを作るJavaScriptが約1,460行。勉強会では「HTMLは顔のパーツ、CSSはお化粧、JavaScriptは表情の動き」と説明した。この区別が頭に入るだけで、AIへの頼み方が変わる。「なんかいい感じにして」ではなく、「化粧だけ直して。パーツは触るな」と言えるようになる。

原則2：「こんな感じで作って」が、沼の入り口

よそのサイトのスクリーンショットを貼って「こんな感じで作って」とAIに投げる。それっぽいものは数分で出てくる。そして眺めているうちに「あれ、こんなんじゃなかったな」が始まる。どこをどう直せばいいかは、自分でも言えない。

勉強会の参加者の一人が、チャットでこう言い当てた。

そのとおりで、システム開発には昔から「要求・要件・仕様」という区別がある。要求は「なぜ作るか・何がうれしいか」で、普通の日本語でいい。仕様は「どう実装するか」で、いまはAIに渡せる。危ないのは真ん中の翻訳、つまり要求を要件に落とす部分を飛ばすことだ。ここを飛ばすと、必ず事故る。ソフトウェア工学では昔から、手戻りのコストは後工程ほど跳ね上がり、設計段階の10倍から100倍になると言われる。体感ともよく合う。

私の場合、要求は一文だった。「参加者が、当日ぶつけたい問いを一つ持って会場に入る状態を作る」。この一文が決まると、やらないことが自動的に決まった。情報の網羅はしない。個別ログインは作らない。メモは利用者の端末にだけ保存し、サーバーに個人情報を置かない。作る前が8割とは、機能を増やす話ではなく、削る根拠を先に持つ話だ。

ここまで、コードが1行も出てこない

それでいい。書くのはAIだからだ。

要求・要件・設計・実装・テスト・リリース・運用。工程を並べると、「作る」は全体の一箇所しかない。AIが実装を担うほど、人間の仕事はその前と後ろに寄っていく。

原則3：玄関に鍵をかけても、窓が全開のことがある

一番の失敗談を書く。このサイトは身内向けなので、パスワードをかけることにした。AIに頼むと、それらしいパスワード画面がすぐにできた。見た目は完璧だった。

ところが、これは画面を隠しているだけだった。中のデータファイルのURLを直接叩けば、パスワード画面を素通りして登壇者113人分のデータが取れてしまう。玄関には鍵をかけたが、窓は全開だった。 勉強会でこの実演をしたら、チャットに「URLを予測して叩くことあるんすね」と流れた。ある。しかも自動で。

「隠す」と「守る」は別物だ。守るなら、配信の一番手前で認証をかけて、通らない相手には画面もデータも一切渡さない構成にする。私はホスティングをCloudflare Pagesにして、無料枠の認証機能でこれを実現した。数あるホスティングからここを選んだ決め手も、無料で「本物の鍵」が付けられることだった。

公開前の確認方法は単純で、ブラウザのゲストウィンドウで自分のサイトを開き、自分が門前払いされるのを見る。それから、公開の可否を最後に決めたのは技術ではなかった。「誰の名前で責任を持つか」だった。有志による非公式サイトだと全ページに明記し、連絡先を置いてから公開した。

原則4：AIはその道のプロだが、新人である

Claude Codeは、113人分の登壇者情報の下調べを一晩でこなす。プロの仕事量だ。ただし新人でもある。別人のプロフィールURLを自信満々に持ってくるし、余白があると埋めたがる。勉強会では「AIの失敗モードは、間違いよりも、最もらしさと過剰さ。特に過剰さ」と話した。

だから冒頭に書いたとおり、いちばん時間を食ったのは113人分のファクトチェックだった。公開前にはAI自身にレビューをさせて42件の指摘を受けたが、そのうち3件はAIの指摘のほうが間違っていた。検品まで任せきることは、まだできない。

もう一つ。完成度100%を目指して抱え込むのが、一番時間を失う。3割の出来で仲間に見せて、反応を当ててから6割、7割に上げる。AIは作り直しのコストをほぼゼロにしたので、この回し方と相性がいい。

勉強会の最後に、AI時代に人間へ残る仕事を3つに絞った。「要求」と「ファクト」と「引き算」。何がうれしいかを決めること。正しさを確かめること。そして、削ること。この3つを手放さなければ、非エンジニアでも実用サイトは公開できる。

おわりに

もしあなたの手元に「なんか違う」作りかけがあるなら、未練を持たずに一度捨てることを勧める。要求の一文——誰が、どうなったらうれしいのか——を書いてから作り直すほうが速い。AIは作り直しのコストをほぼゼロにした。沼から出る最初の一手は、コードではなく日本語で打てる。

振り返って一番大きかったのは、外注費が浮いたことではない。「参加者が、当日ぶつけたい問いを一つ持って会場に入る」——16日前には世界のどこにもなかったその状態が、実在するようになったことだ。

副産物もある。仕組みが分かると、値札が読めるようになる。本業でウェブサイトの運営会社に「ここの文字を直してください」と頼むと3万円の見積もりが来るが、いまはその作業が何分で終わるかが分かる。作るところまで行かなくても、業者と対等に話せるようになるだけで、学んだ元は取れる。

あなたが明日AIと何かを作るなら、それは誰の、何のためだろうか。

（次に読む1本はこちら）