AI Creative Prototype

Prototype

上流が決まっていれば、AI でここまで組める。

架空のクライアントを 10 社立て、オリエンシートから始めて、ブランドの言語化・競合分析・サイト戦略設計を先に行い、そのうえで AI コーディングで TOP ページを組み上げた制作例です。「AI で安く作る」の実演ではありません。判断が先にあるから速い、という順番を見せるためのものです。

すべて架空企業のデモです。掲載している社名・人物・数値・事例・競合企業はすべて架空で、取引実績ではありません。写真は生成画像です。各ページは検索エンジンと AI クローラーに対して noindex を設定しています。

10 社の制作例

5 つの入口に 2 社ずつ、10 社です。カバーをクリックすると、架空クライアントの TOP ページが開きます。「リニューアルの相談」は、各社のオリエンシートにある言葉を、仮想クライアントの一人称でまとめたものです。そこから AI に組ませる前に決めた 5 つ(概要・核・競合・戦略・トンマナ)は、各社のクリエイティブブリーフに。

株式会社白鉄組(架空)の TOP ページ

01 / 採用 / 鉄筋・型枠の専門工事

株式会社白鉄組(架空)

できない状態で入っていい。一年目と三年目で、顔つきが変わる会社。

リニューアルの相談仮想クライアントの言葉

代表取締役(56 歳)/ 愛知県小牧市 / 従業員 42 名 / 創業 1994 年

「サイトは 12 年前に知人に頼んだきりです。求人は媒体にも出していますが、応募が年々減っていて、特に 20 代が来ない。『会社の雰囲気がよく分からなかった』と言われます。

若い人には『建設業は怖そう』『怒鳴られそう』と思われている。実際は昔とだいぶ変わっていて、見て盗めだけでは人は育たないと思っています。ただ、優しそうに見せすぎて『楽そうな仕事』と思われるのも違う。夏は暑いし、冬は寒い。そこまで隠して採っても続きません。

うちは完成した職人を採りたいわけじゃない。できない状態で入ってきてもらって、一年目と三年目で顔つきが変わっていくのを見せたい。給与と休日しか比較されない媒体では、そこが伝わらないんです。

黒くてカッコいい建設会社のサイトもいいと思う。でも怖く見えるのは困るし、SNS で踊るみたいなのはやりたくない。初任給をトップに出すか、社長が前に出るかは、まだ社内で決めていません。」

看護ステーションしろいろ(架空)の TOP ページ

02 / 採用 / 訪問看護

看護ステーションしろいろ(架空)

一人で判断しなくていい。でも、誰かの指示だけで動かなくていい。

リニューアルの相談仮想クライアントの言葉

代表兼管理者(43 歳)/ 名古屋市昭和区 / スタッフ 17 名 / 設立 2021 年

「今のサイトは設立時のテンプレートで、『普通の訪問看護ステーションに見える』とスタッフにも言われます。利用者向けなのか採用向けなのかも分からないし、求人媒体と書いてあることが同じです。

急に増やしたいわけではなくて、年に 3〜4 名、考え方の合う看護師を採りたい。応募の時点で『一人で訪問するのが怖いです』『オンコールは大変ですか』という質問が、とても多いんです。

病院にいた頃、ずっと時間が足りないと思っていました。訪問看護は一人の利用者さんの家に 30 分、60 分いられる。だから看護師自身が考える時間がある。ただ『自由な職場』という言い方は好きじゃない。判断できるということは、責任もあるので。

一人で訪問する、車移動が多い、オンコールがある。隠したくないことは隠さずに載せたい。白っぽくて余白が多い感じがいい。医療サイトっぽい青にはしたくないし、全員笑顔で並ぶ写真も使いたくないです。」

黒子醸造株式会社(架空)の TOP ページ

03 / 事業承継 / 味噌・醤油醸造

黒子醸造株式会社(架空)

なぜ、100 年同じ作り方なのか。

リニューアルの相談仮想クライアントの言葉

四代目(36 歳)/ 岐阜県恵那市 / 従業員 8 名 / 創業 1926 年

「2027 年に父から会社を継ぎます。それに合わせてサイトを作り直したい。今のサイトは 15 年前のもので、和紙の背景に筆文字、蔵の写真。老舗感を出しすぎていて、初めての人には全部同じ味噌に見える。今どういう人が作っているのかも分からない。

このまま同じ売り方だと、10 年後は厳しい。うちの味噌を食べてくれている人は高齢になっていて、その子ども世代に知られていない。味を今風にしたいわけじゃない。変えたいのは伝え方です。100 年続いていることを自慢したいのではなくて、なぜ 100 年同じ作り方なのかを伝えたい。

父は『味噌は味噌だからね。格好つけても仕方ない』と言います。昔からのお客さんが『黒子じゃなくなった』と思うようなのは困る、とも。和風じゃなくてもいい。でも、味噌屋に見えるように。父も納得するところに着地させたいです。」

中部クロコ機装株式会社(架空)の TOP ページ

04 / 営業言語化 / 産業機械の技術商社

中部クロコ機装株式会社(架空)

売る会社ではなく、選ぶ会社。

リニューアルの相談仮想クライアントの言葉

社長 / 愛知県刈谷市 / 従業員 58 名 / 取扱メーカー約 80 社

「ホームページを、営業に使えるものにしたい。今は取扱メーカーと商品一覧が中心で、問い合わせは『この製品ありますか』という指名がほとんどです。本当は『こういう問題があるけど、何を選べばいい』という相談を増やしたい。

Amazon みたいに商品を並べても、うちの価値はないんですよ。製品情報はメーカーのサイトを見れば分かる。じゃあ、なんでうちから買うのか。ベテランはそれを説明できている。若手は『このメーカーのこの製品がおすすめです』で終わってしまう。サイトを作るなら、会社の判断基準そのものを整理したいです。

営業部からは『メーカー一覧は絶対残してほしい』『商品検索もなくしたくない』と言われています。それでも商品一覧を主役にはしたくない。売る会社じゃなく、選ぶ会社にしたい。BtoB なので奇抜じゃなくていい。スタートアップみたいなのは違います。」

白黒税理士法人(架空)の TOP ページ

05 / AI 検索 / 税理士法人

白黒税理士法人(架空)

それ、税理士に聞いていいんです。

リニューアルの相談仮想クライアントの言葉

代表 / 名古屋本社・岐阜支店 / スタッフ 28 名(税理士 6 名)/ 設立 2014 年

「きっかけは、ChatGPT で『名古屋で会社設立に強い税理士』と聞いたら、うちが出てこなかったことです。競合が紹介されていた。これからは Google だけじゃないんじゃないか、という話になりました。

ただ、SEO をやりたいというだけではないです。そもそも今のホームページを見ても、うちが何に強い税理士なのか、自分でも分かりにくい。どの税理士法人にもあるサービスが並んでいて、担当税理士の顔もほとんど出ていない。

お客様からすると、税理士に何を聞いていいのか分からないと思うんです。こちらには普通の相談でも、お客様は聞いていいか迷っている。初回面談の半分は、税金になる前の話です。会社を作った方がいいか、融資、経理をどうするか。サイトだと全部『税務顧問』にまとめられてしまっています。

テクニックだけで AI に出したいわけではありません。『節税できます』の強調や、AI という言葉をトップで押し出すのは避けたい。専門的だけど、話しかけやすい。ちゃんとしてるけど、相談しやすい。そういう法人に見えてほしいです。」

木々と暮らす工務店(架空)の TOP ページ

06 / コアデザイン / 注文住宅

木々と暮らす工務店(架空)

完成した日より、住んで 10 年後がいい家。

リニューアルの相談仮想クライアントの言葉

代表(48 歳)/ 愛知県日進市 / 社員 14 名 / 年間 約 18 棟

「今のサイトでも問い合わせは来ています。ただ、うちの会社らしさが自分でも分からない。高気密、高断熱、耐震等級 3、自然素材、自由設計。全部本当なんですけど、全部ほかの工務店も言っています。施工事例が主役で、Pinterest みたいに見える。

家って、完成したときが一番きれいじゃないですか。でも本当はそこから 30 年、40 年住む。なのに住宅会社の広告は、完成した瞬間の写真ばかり。僕らは間取りより先に、この家族が 10 年後どうなっているかを考えたい。子どもが出ていった後に空き部屋だらけになる家をつくるのは、違うと思っています。

問い合わせでは『坪単価は』『断熱性能は』と聞かれます。本当は、価格や性能の前に聞いてほしいことがある。写真はちゃんと見せたいし、住宅雑誌っぽい感じは好き。でも高級住宅会社みたいにはしたくないし、家族全員が笑顔でジャンプする写真は使いたくない。『30 年』という数字を前面に出すかは、まだ決めていません。」

MEDIARC DENTAL GROUP(架空)の TOP ページ

07 / AI 検索 / 歯科・自由診療クリニックグループ

MEDIARC DENTAL GROUP(架空)

やらない治療も、選択肢です。

リニューアルの相談仮想クライアントの言葉

理事長(47 歳)/ 名古屋 5 院 / スタッフ 約 86 名 / 設立 2013 年

「きっかけは、ChatGPT で『名古屋でインプラントを相談しやすい歯医者』と聞いたら、うちがほぼ出てこなかったことです。広告をよく見かける他院や、専門治療に特化した医院が紹介されていた。Google 広告だけに頼るのは、今後違うんじゃないかと思いました。

今のサイトは 4 年前に作り直したもので、見た目に大きな問題はありません。ただ、自由診療の集患を目的にした結果、治療別のページが大量に増えて、SEO 記事も 300 本ある。アクセスはあるのに、どんな歯科医院なのかが伝わっていない。患者さんが治療名から探さないといけないサイトになっています。

自由診療って、患者さんからするとかなり怖いと思うんですよ。数十万円、場合によっては 100 万円以上になる。しかも自分では治療の良し悪しを判断できない。だから本当は、治療を売る前に『相談できること』が大事だと思っています。僕らは『これをやりましょう』ではなく、やらない選択肢まで含めて話す歯科でありたい。

症例数競争はしたくない。でも専門性が低く見えるのも困る。高級ホテルみたいな歯医者サイトは違うし、白衣の先生が腕組みしている写真も、もう古い気がします。清潔感は絶対必要ですが、真っ白な歯医者サイトは避けたい。高級感というより、信頼感です。」

LOOP CODE LAB(架空)の TOP ページ

08 / コアデザイン / 小中学生向けプログラミングスクール

LOOP CODE LAB(架空)

動かなかったら、試せばいい。

リニューアルの相談仮想クライアントの言葉

代表(39 歳)/ 名古屋市千種区 3 教室 / 生徒 約 240 名 / 設立 2019 年

「今のサイトは『将来必要なプログラミングスキルが身につく』を前面にしています。問い合わせは来ますが、競合と比べられると『Scratch が学べます』『Python まで学べます』『少人数制です』の機能比較になってしまう。教育塾の広告みたいになっているんです。

プログラマーを育てたいわけじゃないんです。もちろん、その道に行く子がいてもいい。でも僕が一番育てたいのは、『やってみて、失敗したら変えてみる』が普通にできる子です。学校だと、どうしても正解を当てることが多い。プログラミングって、間違っても戻せるんですよ。動かなかったら試せばいい。そこが教育として面白いと思っています。

AI がコードを書く時代になって、コードを書けること自体が価値なのかは分からない。むしろ、AI を使ってでも自分のアイデアを形にできる子の方が大事だと思う。『プログラミングスクール』という名称を変えるかどうかも、社内で話しています。

子ども向けだけど、子どもっぽすぎないものにしたい。カラフルなのはあり。でも教育業界っぽい青とオレンジは避けたいし、天才プログラマー育成とか、将来高収入になれるとか、そういう訴求はしたくない。作品や子どもの表情を見せたいです。」

白色システムワークス株式会社(架空)の TOP ページ

09 / 営業言語化 / 地方の受託 SIer(製造業向け)

白色システムワークス株式会社(架空)

そのシステム、本当に必要ですか。

リニューアルの相談仮想クライアントの言葉

代表(54 歳)/ 石川県金沢市 / 社員 74 名 / 設立 1998 年

「営業部から『Web サイト経由でまともな問い合わせが来ない』という声が出ています。来るのは『システム開発できますか』『Java のエンジニアを派遣できますか』ばかり。増やしたいのは、『工場の業務を改善したいが、何をシステム化すればいいか分からない』という相談です。

お客さんに言われたものを作るだけなら、もう厳しいと思っています。最近は SaaS もあるし、AI でも作れる。うちの価値は、『そのシステム、本当に必要ですか?』と言えるところじゃないかと思っています。工場に行って話を聞くと、システムの問題じゃなくて、そもそもの運用がおかしいこともあるんですよ。

今のサイトは 7 年前のもので、『DX』という言葉が多すぎる。25 年以上の実績、ワンストップ、高い技術力、柔軟な対応。全部間違ってはいないけど、どこの会社も言っていますよね。うちは 25 年間ずっと工場の中に入ってきた。でも営業は、その違いを説明できていません。

IT 企業らしい先進性は欲しい。ただ東京の SaaS 企業みたいなのは違います。工場の現場写真を使いたいし、青系は多いので少し変えたい。『システムを作ります』を TOP に書きたくないんです。作らない提案もできる会社にしたい。」

黒白精機株式会社(架空)の TOP ページ

10 / 事業承継 / 産業機械・装置メーカー

黒白精機株式会社(架空)

何でも作る会社ではなく、考えて作る会社。

リニューアルの相談仮想クライアントの言葉

三代目(38 歳・専務)と二代目(67 歳)/ 岐阜県各務原市 / 社員 63 名 / 創業 1976 年

「2028 年頃に父から代表を引き継ぐ予定です。その前に、『うちは何ができる会社なのか』を整理しておきたい。既存のお客様には知られていますが、新規営業と採用には弱くて、Web 経由の問い合わせはほぼありません。

うちの強みって、今は父の頭の中にあると思うんです。お客様が『こういう装置できますか?』と相談すると、父が話を聞いただけで、だいたい構造が見える。でもそれって、父が引退したらどうなるのか。会社の技術として残っていないといけないと思っています。

今のサイトは 13 年前のもので、完成した機械の写真が 30 点並んでいるだけ。何がすごいか分からないし、装置名も『自動組立装置』みたいな名前だけで、どういう課題を解決したのかが分からない。父は『別に会社は昭和からあるんだからいいんじゃないか』と言いますが。

産業機械なので格好よくしたい。黒やグレーでもいい。ただ、未来・革新・イノベーションの多用や、ロボット会社に見えるのは避けたい。父を否定する承継ストーリーも違う。何でも作る会社ではなく、考えて作る会社。父の会社から、みんなの会社にしたいんです。」

なぜ、架空のクライアントで
10 本つくったのか。

実案件では、いちばん大事な工程を見せられない。

「AI で Web サイトが作れる」は、もう誰でも言えます。私たちが見せたかったのは、作れるかどうかではなく、その前に何を決めているかでした。

実際の案件では、経営者の言葉、競合をどう読んだか、誰に何を最初に見せると決めたか。そこは機密で、公開できません。だから架空のクライアントを立てました。オリエンシートを書き、ブリーフに落とし、同業 3 社を見て空いている立ち位置を決め、そのうえで AI に組ませる。本番と同じ順番を、途中を隠さずに。

10 社の入口は、5 つ。採用、事業承継、営業の言語化、AI 検索、コアデザイン。私たちが日ごろ相談を受ける入口に、2 社ずつ並べました。

自分たちが現場でやっていないことは、語らない。このページはその実証です。

AI を使った Web サイト制作の、
良いところと、気をつけること。

10 本つくって分かったことを、良い面と、そうでない面の両方から書きます。

Pros

AI でできること

  1. 01

    組み立てが短い

    設計図があれば、TOP 10 ブロックの初版は分単位で立ち上がります。04 は初版が約 7 分、動きと画像を含めておよそ 45 分の実測でした。

  2. 02

    往復が減る

    デザイン画を描いて、確認して、直して、の往復が減ります。動くものを見ながら判断できるので、経営者との会話が具体的になります。

  3. 03

    予算を上流に回せる

    組み立てが短いぶん、言語化と設計、仕上げに時間と費用を使えます。私たちが AI を使う理由はここです。

  4. 04

    方向を試せる

    構成を変えて作り直すのも短い。「これは違う」を早く言えることは、制作では大きな価値です。

  5. 05

    AI 検索に読まれる構造を最初から入れられる

    見出しの設計や質問文の置き方を判断基準として渡せば、AI はそのとおりに組みます。

Cons

AI ではできないこと、人がやること

  1. 01

    判断基準がないと、平均点に寄る

    AI は「それらしいもの」を出すのが得意です。核の 1 行と競合の空きがないまま組むと、どこかで見たサイトになります。安っぽさは AI ではなく、基準の不在から生まれます。

  2. 02

    写真と人物は、生成では代わりにならない

    今回の写真はすべて生成画像です。架空だから成り立つ話で、実在の会社なら、社長の顔と現場は撮影が要ります。

  3. 03

    検証は人がする

    表示崩れ、読みやすさ、法務や表記のチェック。AI が組んだものを、デザイナーとエンジニアが見て直してから公開します。

  4. 04

    上流を飛ばすと、速さが意味を失う

    何を伝える会社かが決まっていないと、速く作れるものは、速く作り直すことになります。

  5. 05

    表現そのものが差別化の会社には向かない

    写真の一枚、動きの一つが「この会社らしさ」を決めるなら、オーダーメイドで描くほうが正しい。ルートは選べます。

制作の順番。
10 本とも同じです。

順番だけが、このプロジェクトで言いたいことです。詳しい進め方は「Web サイト制作、2 つの進め方」に書きました。

  1. 01

    言語化

    オリエンシートから、経営者の言葉を核の 1 行に。整えすぎない。

  2. 02

    設計

    同業 3 社を見て空いている立ち位置を決め、誰に、最初の 3 秒で何を見せ、どこへ動かすかを決める。

  3. 03

    つくる

    核と判断基準を AI に渡して TOP を組む。写真は生成、動きは共通の部品。

  4. 04

    検証

    1440px と 390px で崩れを見る。参考にした構造の色や言葉が残っていないか、機械的に確かめる。

  5. 05

    公開

    架空なので noindex。実案件なら、AI 検索の認識まで確認して運用へ。

Web サイト制作、2 つの進め方(オーダーメイド / AI 構築)

まずは、
30分の対話から。

経営者の想いが言葉になれば、すべてが一貫します。デザインも、Webも、採用も、営業も。顧客があなたの会社を「正しく理解してくれる」。社員が同じ方向を向いてくれる。AIがあなたの企業を正確に紹介してくれる。

無料相談でお伝えする3つのこと

  1. 1AI検索の現状確認 — ChatGPTがあなたの企業をどう認識しているか、その場で確認します
  2. 2課題の整理 — 「伝わらない」原因がどこにあるのか、一緒に整理します
  3. 3最初の一歩のご提案 — 御社の状況に合った、具体的な始め方をお伝えします
無料相談を予約する

Web サイトリニューアル診断を見る