HOME / PROCESS
PROCESS — HOW THIS SITE WAS MADE
このサイトを、
どう作ったか
人が決めた所と、AIに任せた所。制作の中身を、そのままお見せします。
NEXUSのサイトを作った工程の記録。ヒアリングから公開後の改善までの5つの工程を、人が決めた所とAIに任せた所に分けて公開します。
このサイトを、
01
HEARING
何を、誰に売るか
まず話を聞きます。売りたいもの、届けたい人、いまのお困りごと。
人
02
DESIGN
構成と見た目を決める
ページの並びと、見た目の方向を決めます。案はAIで広げ、選ぶのは人です。
人AI
03
BUILD
組み上げる
AIがページを組み、人が1枚ずつ確かめます。従来型の作り方にも対応します。
AI人の確認
04
LAUNCH
公開して、計測を始める
公開と同時に、どこから来て、どこで離れたかを測り始めます。
人AI
05
GROW
数字を見て、直し続ける
広告・SNS・検索で人を呼び、数字を見て直します。ここからが本番です。
人AI
WHO DID WHAT
人が決めて、AIが手を動かす
決めることと確かめることは人が、量の多い作業はAIが受け持ちました。
HEARING
DESIGN
BUILD
LAUNCH
GROW
人
AI
THIS SITE IN NUMBERS
このサイトの中身
数字は、このサイトを書き出すときに数えたものです。ページを足すと、ここも増えます。
- PAGES46ページ
- CARTS11カートごとのページ
- SERVICES10サービスのページ
- PHOTOS22写真
- TEXT FOR AI45AI向けテキスト版
WHAT WE DID
工程ごとに、このサイトでやったこと
公開とその後の工程は、まだ予定です。進んだら、ここに記録を足していきます。
01
HEARING済み
何を、誰に売るかを決める
- NEXUSが受け持つことを洗い出し、相談の入口を1つにまとめると決めました
- 市場調査・商品開発・実店舗の改善は、受注ではなく「ここまで考えられる」という深さを示すページにすると決めました
- 日本語のサイトにすること、いまのドメインのまま載せ替えることを決めました
- 料金は細かい金額ではなく、目安だけを載せると決めました
人何を売りたいか、どこまで受け持つか、相談の入口をどう置くかを決めました。
AI対応できるカートやモールの候補を洗い出し、決めるための選択肢を並べました。
02
DESIGN済み
構成と見た目を決める
- 参考にするサイトを集め、取り入れる見せ方と、取り入れない見せ方を分けました
- カートごと・サービスごとにページを分ける構成にしました
- 一度は黒い背景で組み、画面で見たうえで、白い背景で図と写真を中心に見せる形に作り直しました
- 写真は無料の素材から候補を出し、1枚ずつ確認してから使いました
人参考にするサイトを選び、組んだ画面を見て、方向を決め直しました。
AI決めた方向を画面に起こし、図やモックアップをコードで描きました。
03
BUILD済み
組み上げる
- 1つのファイルが1つのページになる作りにして、ページを増やしやすくしました
- サービスの文章は1か所にまとめ、画面とAI向けのテキスト版の両方をそこから作るようにしました
- パソコンの幅とスマートフォンの幅で、文字のはみ出しや崩れがないかを確かめながら組みました
- 相談フォームは、書かせるより選ばせる形にしました
人組み上がった画面を1枚ずつ見て、直すところを決めました。
AIページを組み、画面で崩れがないかを確かめ、指摘を受けて直しました。
04
LAUNCH予定
公開して、計測を始める
- いまのドメインのまま、新しいサイトへ切り替える予定です
- 古いページのアドレスから、新しいページへ転送する予定です
- AIが読むための目次（llms.txt）と、ページごとのテキスト版を用意しました
- 公開したら、ここに記録を足していきます
人公開の時期と、切り替えの段取りを決めます。
AI転送の設定や、公開後の確認を受け持ちます。
05
GROW予定
数字を見て、直し続ける
- 公開したあと、広告・SNS・検索で人を呼ぶ予定です
- どこから来て、どこで離れたかを数字で見て、直す順番を決めます
- 直したことと、その結果を、このページに足していきます
人数字を見て、次に何をするかを決めます。
AI数字をまとめ、直す作業を受け持ちます。
HUMAN / AI
人が決めたこと、AIに任せたこと
人が決めたこと
- 何を、誰に売るか
- 相談の入口をどこに置くか
- 参考にするサイトと、見た目の方向
- 組んだ画面を見て、直すかどうか
- 使う写真を1枚ずつ
- 料金をどこまで載せるか
AIに任せたこと
- 選択肢の洗い出し
- 決めた方向を画面に起こす
- 図とモックアップをコードで描く
- ページを組む
- パソコンとスマートフォンでの見え方の確認
- AI向けのテキスト版の書き出し
REDO
作り直したこと
一度で決めきらず、画面を見て決め直しました。その記録です。
- 背景を黒から白へ
黒い背景で組んだ画面を見て、白い背景で図と写真を中心に見せる形に作り直しました。
- 料金ページをやめる
料金をまとめたページはやめ、料金はサービスごとのページの最後に書くことにしました。
- 推さないカートを小さく
対応はするが前に出さないカートを、図でも一覧でも小さく扱うことにしました。
- 写真と文章を増やす
図だけでは伝わりにくいところに写真を足し、サービスのページの文章を増やしました。
READABLE BY AI
AIにも読まれる作りにしています
検索エンジンだけでなく、ChatGPTなどのAIにも中身が伝わるように作っています。
ページごとのテキスト版
どのページにも、飾りを除いた文章だけの版を用意しています。AIが中身を正しく読み取れるようにするためです。
サイトの目次（llms.txt）
サイトにどんなページがあるかを、AIが一度に読める目次にまとめています。
画面と同じ文章から作る
サービスの文章は1か所にまとめ、画面とテキスト版の両方をそこから作っています。片方だけ古くなることがありません。
テキスト版の目次は /llms.txt にあります。
FAQ
よくある質問
QAIで作ったサイトは、品質が心配です
A方向を決めることと、組み上がった画面の確認は、人が受け持っています。AIに任せているのは、手を動かす量の多い作業です。
Q従来型の作り方でも頼めますか
A頼めます。WordPressなどの従来型と、AIで組む作り方の両方に対応しています。誰がどれくらい更新するかで選びます。
Q自社のサイトも、同じ流れで作ってもらえますか
A同じ流れで進めます。何を、誰に売るかを伺うところから始めます。
Q所要時間は、どれくらいかかりますか
Aページ数や内容によって大きく変わるため、ここでは載せていません。ご相談のときに、内容を伺ってお伝えします。