AI × WEBSITE
このデザインは、
もうAIで作れます。だから、作って終わりにしないホームページ制作を
この画面は、AIが作った美容サロンのページです。
隠さずに実物をお見せしたうえで、その先のお話をします。
同じ写真を渡して、頼み方だけ変えました
題材は架空の美容サロンです。スクロールで動く、今どきのデザインのページを、AIに2通りの頼み方で作らせました。
366字の頼み方を、そのままAIに渡しました。87秒で出てきた物を、手を入れずに載せています。
実際にスクロールする ↗
指示文は12,298字。画面を撮って確かめては直すことを4回くり返し、最後にスマホの1か所だけ人が直しました。
実際にスクロールする ↗①でAIに渡した文（これだけ）
美容サロンのおしゃれなホームページを、1つのHTMLファイルで作ってください。スクロールすると動く感じの、今どきのデザインでお願いします。サロンの名前は「凪と灯（なぎとあかり）」です。席が三つだけの、完全予約制のヘアサロンです。メニューはカット 6,600円、カラー 8,800円から、パーマ 11,000円から、トリートメント 5,500円です。火曜定休で、10時から19時です。写真は img フォルダに入っています。（以下、写真のファイル名の説明）
どちらも架空のサロンです。写真は Unsplash の無料写真（顔の写っていないもの）を使っています。何も知らない別の会話のAI（Claude）に、文だけを渡して作らせました。
①でも、店のページとして読めます
正直に書きます。①は87秒で出てきて、写真の置き方も色も破綻していません。「とりあえずページが要る」なら、これで足ります。
最初の画面
メニュー
予約の案内
ただし②は、1回では出ません
②は、見出しが髪の後ろへ滑り込み、写真がアーチの窓に縮み、読む速さで文字に色が入り、メニューが横に流れます。少し前なら、これだけで「デザインに強い制作会社」と言えた動きです。
同じ頼み方でも、AIは回ごとに違う物を出します。エラーは1つも出ないのに、画面だけが壊れます。②は、画面を撮って確かめては直すことを4回くり返して、ようやく出た物です。
見出しが、髪の後ろへ滑り込む
写真が、アーチの窓に縮む
読む速さで、文字に色が入る
メニューが、横に流れる
数字が、数え上がる
文字の中に、髪が見える
このくらいのページのご依頼も、もちろんお受けします。AIを使うぶん、早く、費用も抑えてお作りできます。
4回のうち、どの回で何が壊れたか
| 作った回 | 画面で起きたこと |
|---|---|
| 1回目 | 最初の画面の上に、次の区画の文章が重なった原因：区画の箱そのものに「重ねて置く」指定が付いていた |
| 2回目 | パソコンでは全部そろった。スマホで、長い文章が左右にはみ出した原因：見出し用の「途中で折らない」指定が、長い文章にも付いていた |
| 3回目 | はみ出しは直った。今度はスマホのメニューが横に流れず、縦に積まれた原因：2回目では正しく出ていた所。指示文は同じでも、回ごとに書き方が変わる |
2026年9月20日に作ったときの記録です。画面を見て原因を言い当て、直せる人がいて、はじめて②になります。
MESSAGE
見た目を作れることは、
もう、選ぶ理由になりません。
おしゃれな見た目も、スクロールで動く仕掛けも、AIで作れる範囲に入りました。これからもっと簡単になります。
ですから、ホームページを頼む相手を選ぶときは、「きれいに作れるか」の先を見てください。そのサイトで何を伝えるのか。誰に見つけてもらうのか。公開したあと、誰が数字を見て直すのか。
エールクエストも、作る手にはAIを使っています。そのうえで、AIに頼むだけでは出ない所まで作っています。
AIを使うなら、ここまで出せます
このサイトのトップは、中を歩ける3Dの島です。同じAIを使って作りました。ただし、指示文を書けば出てくる世界ではありません。
指示文だけでは、出ない作業
- 01形を作る
建物も動物も、3Dの形から作ります。動物は写真から形を起こします。AIに「島を作って」と頼んで出てくるのは、箱と円柱を組んだ島までです。
- 02動物には、骨を入れる
歩く・座る・寝る。四本足の動物は、動きに合う骨の組み方（リグ）から考えます。ここを間違えると、足が地面を滑ったり、関節が逆に曲がったりします。
- 03光を、先に焼き込む
建物の光と影は、あらかじめ計算して絵として貼っています。その場で光を計算させると、スマホでは重くて動きません。
- 04スマホで重くしない
端末の速さを見て、画質を4段で自動的に上げ下げします。動物は1体110〜300KBに収めています。
- 05検索とAIに読ませる
3Dの中の文字は、検索エンジンには読めません。同じ内容を文章と構造化データでも置き、3Dを描けない相手には代わりのページを返します。
こうした作業にも、AIを使っています。ただ、何を頼めばいいのか、出てきた物が正しいのかは、知識が無いと判断できません。AIは手を速くしてくれますが、何を作るかは決めてくれません。
エールクエストが、その先でやること
ふつうのホームページでも、3Dのサイトでも同じです。AIが作ったページには、まだ入っていない物です。②のデモにも、どれも入っていません。
-
01魅せ方から、一緒に考える何を一番に見せるか。何を載せないか。写真は何を撮るか。AIは頼まれた物を形にしますが、「この店は何を前に出すべきか」は決めてくれません。お話を伺って、そこから決めます。
このサイトのトップ。「何の会社か」を、読む前に歩いて分かる形にしました トップの3Dを見る → -
02検索とAIに、見つけてもらうSEO対策に加えて、ChatGPTやGeminiに紹介されるための対策（AIO対策）まで行います。店名・内容・料金を検索エンジンとAIが読める形で書き、実際にAIへ質問して、どう紹介されるかを確かめます。
自社で作ったAIO診断ツール「カツプロ AI SEO」で、このサイトを調べた画面（2026年9月20日）。AIに引用されやすい作りかを、項目ごとに点検します カツプロ AI SEO を見る ↗ -
03公開してからの数字を見て、直すどのページが、どんな言葉で、どこから見られているか。毎月の数字を見て、直す所を決めます。サイトは、公開した日がいちばん新しく、そこから古くなっていきます。
毎月お渡ししている保守レポート（見本。会社名はサンプルです） 保守・運用の内容を見る → -
04協業という形でも制作費をいただいて作るだけでなく、役割を分けて一緒に育てる形のご相談も受けています。メディア運営やシステムはこちらで、営業や広報は御社で、といった組み方です。
自社で作って育てているメディア「チアセブンアーチ」。メディアの運営を受け持つ形の協業は、この経験が土台です 協業のご相談について →
費用の考え方
作るときの費用と、公開したあと一緒に取り組むための費用は、分けて考えています。後者は、内容に応じて柔軟に決めます。②のようなページだけのご依頼も、お受けしています。
- 作るとき 1ページのサイト・LP 8万円〜／会社・お店・メディアのサイト 30万円〜
税別です。ヒアリングのあと、動く初稿をお見せしてから進めます。
Webサイト制作の料金を見る → - 公開したあと（月額） 守る 月額 4,000円／見える 月額 10,000円／広げる 月額 20,000円
税別です。「守る」はサイトを止めない・壊さない。「見える」は数字の見える化。「広げる」はAIにどう紹介されているかの調査など、見つけてもらう工夫まで。
保守・運用の内容を見る → - 協業（売上に応じた形） 売上に応じた割合など、組み方はご相談で
制作費をいただかず、生まれた売上を分ける形などです。何を一緒に作るかを伺ってから、形を決めます。
協業のご相談について →
売上が上がることをお約束する物ではありません。数字を一緒に見て、直し続ける取り組みです。