- 投稿日：2026/04/19
- 更新日：2026/04/20
「AIに話しかけるだけでホームページができた」
〜50代が、クロードAIとクロードデザインで実際にやってみた〜
きっかけ
学長がすすめてくれたクロードAI。4月17日に「クロードデザイン」という新機能がリリースされたと聞いて、これを使ってホームページを立ち上げられるか、実際に試してみました。
まずクロードAIに「クロードデザインって何？」と聞いてみたところ、
『「クロードデザイン」というのを確認させてください！』
と逆に聞かれました！
最新すぎて、AI自身もまだ知らなかったのです。
Claude Designは現在リサーチプレビュー段階で、クロードAIではまだ使えないとのこと。
私が自分でブラウザを立ち上げればいいというので、やってみました。
ステップ1：クロードデザインを開く
URLを教えてもらい、claude.ai/design をブラウザで開いてみます。
ステップ2：クロードAIで仕様書を作る
ここで迷ったのが「どう使えばいいか」という問題。
迷ったら、AIに聞いてみること。
①クロードデザインに直接アイデアを伝えるのと、②クロードAIにアイデアをまとめてもらってからコピペするのと、どちらがいいか。
AIに聞くと「②がいい」という答えが返ってきました。
コンセプト：数年前に金沢に行ったときのことをブログ記事としてまとめてほしい。星野リゾートのホームページを参考してほしいとURLを記載。２泊３日で行ったこと。カニを食べたこと。兼六園に行ったことなど。そしてクロードデザインに渡す仕様書を作ってほしいこと
ざっくりとしたアイデアをクロードAIに伝えてしばらくすると、立派な仕様書を作ってくれました。
内容はこんな感じ——
ステップ3：仕様書をコピペして送信
出来た仕様書はクロードデザインの左の入力欄にコピペして、送信ボタン
画面が変わったので、プロジェクト名をいれて再度クロードデザインの入力欄に仕様書をコピペして送信。
するとクロードデザインから質問がありました。
「何を作りますか？」「どのデバイス向け？」「どんな雰囲気にしたいですか？」
これがあることで、仕様書がなくてもある程度対話できる仕組みになってるのかな？
適当にポチポチして送信。
しばらく待つと……
「墨と金箔の街で、静かに呼吸する」
指定していないのに、このコピーが出てきた瞬間、声がでました。
写真は私が用意したものではないので、どこからか拾ってきたもの？
詳しくはわかりません。
上限に引っかかった
途中で「データ使用量が上限を超えています」という表示が出て、制作が止まってしまいました。
毎朝7時にリセットされるとのこと。研究プレビュー版なので仕方ないけど、これは残念でした・・・
次の展開：Cloudflareで無料公開へ
調べると、Cloudflare Pages という無料サービスを使えば、今日作ったHTMLをそのままネット上に公開できることがわかりました。
実際の導入手順
全部で4ステップです。
① GitHubアカウントを作る（無料）
Cloudflare PagesはGitHubと連携して動きます。GitHubはファイルを置く「倉庫」のようなものです。
② GitHubにHTMLファイルをアップロード
今日作った index.html と style.css を倉庫に入れる作業です。Claude Codeで自動化できます。
③ Cloudflareアカウントを作り、Pagesでプロジェクトを作成
GitHubの倉庫と連携させるだけ。コードをプッシュするだけで自動的にデプロイ（公開）してくれます。
④ 独自ドメインを設定（任意）
無料のHTTPS証明書が自動で発行されるため、証明書の管理や更新作業が不要です。
サーバー代ゼロ。次回はここに挑戦する予定です。
まとめ
まずクロードAIで仕様書を作ってからクロードデザインにコピペするのが正解だと思います。
クロードデザインはたぶん、デザイン作成に特化しているんでしょう。
正直、慣れていない人が自分の作りたい物を伝えることは難しいと思います。
私には無理でした。
ですので、クロードAIに自分の作りたい物、イメージを伝えて仕様書を作ってもらった方が近道でしょう。
おまけ
実はもう一つ作っていたので上限にひっかかってしまいました。
こちらもなかなかだと思います。
次回があれば、Cloudflareで実際に公開してみようと思います
最後まで読んでいただいてありがとうございます。
最近のAIの進歩に、本当に驚いています。思いついたことをこんなすぐに形にすることができるなんて。紹介してくださった学長には、ただただ感謝です。
