デザイン×UX×マーケ×ブランディング | 4軸で見るサイト分析のルールと方法
毎日の日課としているサイト分析をどのような方法で進めているのか私の分析ルールとフローを共有します。
① 分析するサイト選び
まずサイトを選びですが、
業種・テイスト・サイトの種類(コーポレート、採用、LP、EC…)
などひとつのテーマに揃え、3サイトほど続けて分析
するようにしています。
同じテーマで続けて見ることで
共通点や差分が見つけやすく、競合比較もできます。
場所やターゲット、集客導線など
同じ業種のサイトでもこんなにデザインの違いがあるんだ、
という気づきがあります。
実案件に関わるジャンルのサイトを分析すれば
競合調査やデザイン制作の時短になります!
② まずは深く考えず、第一印象を言葉にする
最初にやるのは、とてもシンプルです。
ぱっと見でどんな印象か、形容詞3つで書き出します。
例)
シンプル/高級感/信頼感
明るい/ポップ/親しみやすい
かっこいい/シャープ/都会的
ここでのポイントは、
理由を考えなくていいということ。
合ってるかは気にせず、
この第一印象は、あとで
本当にそう見せたいサイトだったのか?
を確認するためのメモになります。
③誰に向けたサイトかを考える
次にやるのが、サイトの前提整理です。
まず見るのは
- どんな会社・サービスか
- 誰に向けているか
- このサイトで何をしてほしいか
できれば、こんな一文にします。
〇〇な人に向けて、〇〇を伝え、〇〇してもらうサイト
これが決まると、
この目的に合っているか?でデザインを見られるようになります。
(正解はわからないので、仮説を立てて分析)
④ ブランディング視点で見る
ここでは統一感を見ます。
チェックするポイント
- 全体の雰囲気は企業やサービスのコンセプトに合っているか
- 写真・色・文字のトーンがバラバラになっていないか
- 伝えたい強みがページごとに変わっていないか
イケてるデザインかどうかではなく、
ここでは 一貫性 見ます。
たとえば、
- 全体的に勢いを感じる素材の加工とストレートな表現の文章で、伝えたいメッセージに合っている。
- 高級感のある配色、論理的で固めな言葉遣いが企業の強みに合っていて、下層ページまで雰囲気が統一されている
一貫性のあるデザインを見ることで、
サイトのコンセプトをしっかり固める事が大事なんだな、と痛感します。
(正直、作っているうちに方向性がブレブレという経験がたくさんあります、、)
⑤ マーケティング視点で見る
次は、
「ユーザーがこのサイトをどう使うか」
を考えます。
見るポイント
- 最初にどの情報が目に入るか
- 次に何を読ませたいか
- 問い合わせ・申し込みまで迷わず行けるか
ここでの考え方はシンプルで、
「自分が初めて来たユーザーだったらどう動くか」。
・FVですぐユーザーがサービス内容を理解し、固定のCVボタンが目に入るようになっている。
・一瞬何のサイトかわからないが、惹き込まれるデザイン、アニメーションで思わずスクロールしてしまう。
目的達成のための設計に注目します。
⑥ デザインを言葉で説明する
ここでようやく、見た目を細かく見ます。
見るポイント
- 配色(なぜこの色なのか)
- レイアウト(なぜこの順番なのか)
- 余白・文字サイズ(文字感、行間など)
- 操作しやすさ(迷わず使えるか)
- あしらい(あしらいの位置や意味)
- 動き・エフェクト(なんのための動きなのか)
デザインの意味を言葉にできると、
なぜこのデザインにしたのか、
意図を提案時や改善案に使えます。
⑦ 学びとまとめ
最後に、自分のデザイン業務へ還元できる形でアウトプット。
- 取り入れたいデザイン
- 新しく知った表現・構成
- トレンドとして使えそうな部分
- 改善できそうな箇所
- 他サイトにも応用できるアイデア
ここが学びのストックになるので、一番大事にしています。
特におすすめなのは、真似できそうなことを書くことです。
分析は、自分の引き出しを増やすのにとても役立ちます。
私は真似したいパーツ毎に、スクショを
Notionで作成したサイト分析表に保存していて、
カテゴリー分けをして絞り込みできるので便利です。
この60分を繰り返し、
なんとなくデザインしている状態から
少しずつ抜け出せるようになったと思います。
Webサイトを見るときの視点は、完全に変わりました。
以前は、色やレイアウトなど“デザインそのもの”しか見ていなかったのに、
今は自然と、
- これはどんな会社なんだろう
- 誰に向けたサイトなんだろう
- どうしてこのサービスが生まれたんだろう
- なぜ、このタイミングでリニューアルしたんだろう
そんな背景を見るようになっています。