INDEX
- STRUCTURE
- 8 BLOCKS
- BODY TYPE
- 16PX+
- PRIMARY GOAL
- ONE CTA
DESIGN PRINCIPLE
装飾ではなく、
判断を設計する。
高く見えるHPは、情報が多いHPではありません。読み手が迷わず、比較でき、納得して動けるよう、必要な情報を必要な順序で置くHPです。
DECISION ARCHITECTURE
8章ではなく、
8つの判断。
並び順は情報カテゴリではなく、初めて知った人が相談するまでの気持ちの変化から決めます。
- 01定義
誰の、何のサイトかを5秒で伝える。
- 02即答
場所・料金・時間など、最初の疑問へ答える。
- 03価値
機能ではなく、選んだ後の変化を示す。
- 04証拠
工程・人物・実績など、確認できる根拠を置く。
- 05比較
プランや条件を、同じ物差しで見せる。
- 06体験
利用前後の流れを、具体的に想像できる形へ。
- 07解消
FAQと注意事項で、行動前の不安を減らす。
- 08行動
判断材料が揃った場所で、CTAを一つに絞る。
固定するのは、
見た目ではなく品質。
CONTROLLED VARIATION
同じ骨格でも、
同じ顔にしない。
案件ごとの事実から、強弱・写真比率・情報密度・署名モチーフを変えます。色替えだけの量産にはしません。
LOCK / 固定
- 本文の可読性
- CTAの実接続
- 事実の出典
- レスポンシブ品質
FIT / 可変
- 構成の強弱
- 写真の役割
- タイポグラフィ
- 署名の一手
01 / SOURCE確認済みの事実
02 / EDIT選ぶ理由へ編集
03 / SHIP品質ゲートを通過
VISUAL SLOT / 01実案件では、確認済みの写真・商品・工程がこの構造の主役になります。
SHIP GATE
見た目の前に、
落とさない品質。
100%
- TYPE
- 16px+モバイル本文
- CONTRAST
- 4.5:1主要本文
- WIDTH
- 360–430横崩れなし
- TRUTH
- 0未確認の主張
このデモは架空ブランドのテンプレートです。実績・所在地・価格・口コミは掲載していません。
BUILD FLOW
LLMの自由度を、
役割で制御する。
- 01
事実を閉じる
公開できる内容、禁止事項、CTA、使える素材を先に確定。
- 02
判断の順序を選ぶ
読み手とゴールから、必要なモジュールだけを構成。
- 03
固有の署名をつくる
店名・工程・場所など、実在する特徴をページ文法へ。
- 04
機械と目で検証
可読性、事実、導線、実画面を確認し、合格したものだけ提示。
QUESTIONS
よくある質問
01どの業種でも使えますか?
骨格は汎用ですが、規制業種やB2Bなど意思決定が異なる案件では、情報構造と表現ゲートを調整します。
02写真が少なくても作れますか?
可能です。写真を水増しせず、文字・工程・数値・図解が主役になる構成へ切り替えます。
03毎回同じデザインになりませんか?
品質ゲートは共通化し、写真比率、密度、タイポグラフィ、署名モチーフは案件の事実から変えます。
04この文章や画像はそのまま公開できますか?
できません。このページは構造と品質を確認するデモです。実案件では、確認済みの事実と許諾済み素材へ置き換えます。
START WITH FACTS
まず、選ばれる理由を
一緒に見つける。
制作相談の実導線を想定したサンプルです。案件化時は、予約・電話・フォームなど一つのゴールへ接続します。
HP制作について相談する