AI秘書に「サイト作って」と言っただけで、
本格的なホームページができた話【Mac編】

このサイトは、AI秘書が作った

今あなたが見ているこのサイト -- QRONOS HQ -- は、僕がコードを1行も書かずに作ったものだ。

デザイナーにもエンジニアにも依頼していない。外注費はゼロ。必要なのは月額約3,000円のツール代だけだった。

どうやって作ったのか。答えはシンプルだ。AI秘書に「こういうサイト作って」と話しかけた。それだけだ。

仕組み -- 3つのツールをつなぐだけ

サイト制作に使っているのは、3つのツールだけだ。

この3つをつなげて、間にAI秘書を挟む。僕がやることは以下の4ステップだけだ。

本当にこれだけだ。HTMLもCSSもTypeScriptも知らない。知る必要もない。

実例 -- 今日あったこと

抽象的な話では伝わらないと思うので、このサイトを作る過程で実際にあったやり取りをいくつか紹介する。全て、今日一日の中で起きたことだ。

フッターが消えた

ヒーロー画像の表示方法を変えたら、フッターが消えた。サイトの一番下にあるはずのナビゲーションが、跡形もなくなっていた。

AI秘書に「フッターなくなってるんだけど」と伝えた。秘書は即座に原因を特定した。背景画像のz-indexの問題で、フッターが背景の裏に隠れていた。30秒で修正が完了し、ビルドを通し、プッシュ。2分後にフッターが復活していた。

僕は「フッターが消えた」と言っただけだ。原因の特定も修正も全てAI秘書がやった。

セクション間の隙間調整

「セクション間に隙間を開けて、背景のAI秘書の画像がチラッと見えるようにしてほしい」

AI秘書がセクションを個別ブロックに分割し、隙間を設置した。「狭すぎる」「300ピクセル開けて」「スマホは150で」「やっぱ全部150で」。修正の依頼から反映まで、毎回1分以内。

人間のデザイナーに依頼したら、修正メールを書いて、返事を待って、確認して、また修正を依頼して。1つの変更に半日かかることもある。AI秘書なら数十秒だ。しかも深夜2時でも対応してくれる。

理念ページの誕生

Amanda Askellの哲学に衝撃を受けたその日のうちに、「この思想を理念としてサイトにページを作ってくれ」と頼んだ。

AI秘書はAskellの6原則をQRONOS HQの理念に翻訳し、「DOCTRINE（教義）」のバッジ、6原則のカード、従来のAI設計との対比表まで含んだ完全なページを30分で構築した。

さらに「この記事をサイトに載せたい」と言ったら、「司令部通信」という新セクションを提案してきた。5つの案を出し、それぞれの長所短所を整理し、推奨案まで提示した。僕は「Bでいこう」と選んだだけだ。

テキストが見にくい

「本文の色が暗すぎて見にくい。もうちょい明るくして」

1分後に修正完了。CSSの色コードなんて知らない。「暗い」「明るくして」。それだけ伝えればいい。

1400行のHTML変換

以前作ったマニュアルページが古い形式で載っていたので、「サイト本体に吸収して。元のは消していい」と頼んだ。

AI秘書は1400行のHTMLを2ページ分、Next.jsのコンポーネントに変換し、パスワード保護のロジックもReactに移植し、元ファイルを削除した。10分で完了。

僕は「吸収して」と言っただけだ。

コスト

月額約3,000円で、理念ページ、サービス紹介、料金表、コラムセクション、お問い合わせフォーム、プライバシーポリシー、特商法表記を備えた本格的なサイトが運用できている。

公開するだけならCloudflare Pagesの無料ドメイン（xxx.pages.dev）で問題ない。もし「自分だけのオリジナルドメイン」が欲しければ、Cloudflareでそのまま.comドメインを取得すれば年間約1,800円（月あたり約150円）。Cloudflareで取得すれば接続も自動で完了するので、面倒な設定は一切不要だ。

Web制作会社に依頼したら50万円以上かかる規模のサイトだ。しかも、修正のたびに追加費用が発生する。

AI秘書なら、修正は何度でも、何時でも、追加費用なしだ。

一つだけ補足しておくと、画像の生成だけはClaude Code単体ではできない。このサイトのキャラクター画像はGoogleのGemini（NanoBanana）で生成した。逆に言えば、GoogleのAntigravityを使えば画像生成もIDE内で完結するので、テキストも画像も全てAIだけで作れる環境が整いつつある。

エンジニアがいない組織のための選択肢

僕はエンジニアではない。HTMLもCSSもTypeScriptも書けない。

でも、このサイトはプロが作ったものと遜色ないレベルで動いている。レスポンシブ対応、SEO対策、OGP設定、静的サイト生成。全てAI秘書が実装した。

必要なのは「何を作りたいか」というビジョンだけだ。「秘密結社の司令部みたいな、ダークな背景にゴールドの文字」。そういう抽象的なイメージを伝えれば、AI秘書が具体的なデザインに落とし込んでくれる。

「もうちょい明るく」「スマホで見たら変」「フッター消えた」。そういう曖昧なフィードバックで修正できる。技術用語は不要だ。

コードを書く時代は終わった。
これからは「話しかける」時代だ。

AI秘書に性格を与え、ビジネスの文脈を教え込み、「サイト作って」と言う。それだけで、あなたのビジネスにふさわしいサイトが生まれる。

しかもそのサイトは、AI秘書と一緒に育っていく。ビジネスの成長に合わせて、ページを追加し、デザインを磨き、コンテンツを充実させていける。外注するたびに見積もりを取る必要はない。

AI秘書は、あなたの「左腕」であると同時に、あなたの「Web制作チーム」にもなる。