前回(第2話)は、公式から3つの条件付きで許諾をもらい、サイト名が「はちみつ研究所」に決まったところまででした。
いよいよ中身を作ります。今回は、この連載でいちばん景気のいい回です。
なにしろ、初期設計からおよそ1日で、サイトを見られる状態まで進みました。
🍯 この体験記について
AIを使って実際にサイトを作り、公開し、間違いを見つけて直していった記録です。「1日で完成した」という話ではありません。速く進めた部分と、その後に必要だった検証を、分けて書きます。
📋 今回の実施記録
実施日: 2026年7月25日〜26日
環境: Claude Code、Astro、Markdown、Cloudflare Pages
所要時間: 初期設計から最初の公開版まで約1日
追加費用: 0円(契約済みのAI利用料を除き、無料公開枠を使用)
結果: 15ページをPCとスマートフォンから見られる状態で公開
記録の再確認日: 2026年8月3日
道具を決める
まず、何で作るかを決めました。
- Astro(アストロ): Webサイトを組み立てる道具。表示が軽くなるのが特長です
- Markdown(マークダウン): 見出しや太字を、記号だけで書ける文章の書き方。原稿をそのままページにできます
- Cloudflare Pages: 作ったサイトをインターネットに置いて公開してくれるサービス。無料の枠で始められます
難しそうに見えますが、私がやったのは「この方針でいきます」と決めたことだけです。設定や組み立ては、AIに任せました。
原文を100ページ、まるごと手元に保存した
作業の最初にやったのは、記事を書くことではありませんでした。
公式の資料(英語版100ページ)を、丸ごと手元に取ってくることです。取得用の小さなプログラムをAIに書いてもらい、まとめて保存しました。
そのとき、もうひと工夫しています。各ページの内容からSHA-256という値を計算して、一緒に記録しておきました。
🔤 用語メモ: SHA-256(ハッシュ)
文章の内容から計算される「指紋」のような値です。中身が1文字でも変わると値が変わるので、後から「このページ、更新された?」を機械的に見つけられます。
これが後々かなり効いてきます。公式の資料は、こちらの都合と関係なく更新されるからです。
1日で、最初の公開版まで到達した
そこからは、あっという間でした。
作業開始からおよそ1日で15ページを作り、Cloudflare Pagesに公開。パソコンでもスマートフォンでも、実際に見られる状態になりました。
正直に書くと、ここは驚きました。私一人で資料を読み込み、サイトを1から立ち上げていたら、同じ時間ではまず進められませんでした。
ただし、ここを誤解しないように書いておきます。
⚠ 「1日で完成」ではありません
1日で到達したのは「最初に人が見られる状態」までです。完成ではありません。このあと7日間、内容の検証と修正が続きました。むしろ公開は、確認作業の始まりでした。

AIのキャッチコピーは、却下した
同じ日に、トップページも作り直しています。
そこで一番もめたのが、いちばん上に置く1行でした。AIが出してきた案は、これです。
歩くことが、通貨になる。
一見、かっこいい。でも、私はこれを却下しました。
このサイトは「儲かります」と言うためのものではありません。この1行だと、お金の話が主役になってしまいます。しかも、フッターには投資勧誘ではないと書いてあるのに、上ではお金を強調している。ちぐはぐです。
代わりに私が出したのが、この1行でした。
続かない運動に、続ける理由を。
こちらを採用しました。AIの案は「稼げる」に寄っていて、人間の案は「続く」に寄っていた。この違いは、あとで紹介動画を作るときに、誰に向けて話すかを決める軸にもなりました。
顔になったのは、黄色いレインコートのハチ
トップに置く絵は、別のAI(Antigravity)に作ってもらいました。
できあがったのは、黄色いレインコートに赤い長靴のハチが、雨の中を飛んでいる絵です。これがサイトの顔になりました。
この絵、あとから思うとよく働いてくれました。雨で外に出られない日の遊び方を説明するときに、そのまま挿絵として使えたからです。狙って作ったわけではなく、結果的にそうなりました。
今回の学び: 速いのは「公開まで」
📝 今回の学び
AIを使うと、最初に人が見られる状態まで到達する速度は、はっきり上がります。ここは実感しました。
ただし公開は、ゴールではなく検証の開始でした。「速く出せた」と「正しく書けている」は、まったく別の話です。
さて、無事に公開できて、私はすっかり安心していました。
ところが数日後、前提が崩れます。私が100ページ読んでいた英語版は、実は原本ではありませんでした。


コメント