Webサイト制作におけるワイヤーフレームのポイント

こんにちは。ウェブ解析士の佐藤佳です。
今回は、「Webサイト制作におけるワイヤーフレームのポイント」のお話です。

Contents

■ワイヤーフレームとは？

簡単に言うと、Webページの設計図のことです。
ポイントは、

「どんな情報を」
「どこに置いて」
「どうコンバージョンを取るか」

この３つを掛け算して、もっとも最適な設計をすることです。

この３つは別の言葉で置き換えると、
「コンテンツ選択」「レイアウトの構成」「サイトの導線」とも言えます。

私はこのワイヤーフレームを作る作業がとても好きで、
サイト制作の中でも特に時間を割いている工程になります。

また、ワイヤーフレームを【作る前に】行う大切なことは、
ターゲットとなる人（ペルソナ）と、その人のニーズやウォンツです。
つまり、「誰に」という部分ですね。

ここをあいまいにしたままワイヤーフレームを作ってしまうと、
刺さらない内容になってしまうので、まずはターゲットを定めましょう。

■鉄板の流れ

ワイヤーフレームの構成については、いわゆる「鉄板」があります。
例えば、AIDMAとかAISASを始めとした購買心理を取り入れたものなど。

以下に、よくある流れをご紹介します。

★ファーストビュー（一番はじめに目にする部分）で、
　簡潔に自社や商品の良さを伝える（サービス概要、強み、コンセプト等）
　※ここの出来具合で、下の項目が見られるかが決まる重要な部分。
　　ファーストビューの切り口は、ABテストで決めてもいいと思います。
↓
★問題提起
　こんなお悩みありませんか？などと、
　ユーザーが顕在的・潜在的に持っている課題や悩みを書くことで、
　「自分事」に感じてもらう。
↓
★解決法の提案
　こんな方法で解決できますよ！などと、
　対策案や方法論などを提示して、行動の必要性をユーザーに気づかせる。
↓
★具体的な解決法の紹介（商品など）
　ここのフェーズはいくつかに細分化できると思いますが、
　簡潔に言うと「誰に」「何を」の２つがポイントで、
　そのターゲットに対して【共感】してもらうことが重要です。
↓
★料金提案＆オマケ
　いくらかかるのかといった商品の料金について明示します。
　※〇月までのお申込みで○○の特典が付くなど、
　　オマケ訴求もあるとユーザーの行動を促しやすい。
↓
★選ばれる理由
　どうしてこの会社・商品が選ばれるのか？ポイントを絞って紹介。
　数字やエビデンスを盛り込む。
↓
★お客様の声
　実際に体験した人の感想などを掲載。
　※匿名よりも実名、そして顔写真や、権威のある人ほど信頼性があります。
↓
★お問い合わせの流れ
　お問合せから商品購入までにどのようなフローがあるのかを説明して、
　購入に対する不安を軽減する（その１）
↓
★Q&A
　よくある質問などは先に出しておいて、事前に解決できるようにしてあげる。
　購入に対する不安を軽減する（その２）
↓
★お問い合わせ

以上、いかがでしたでしょうか？
「なんかこのつくりのサイト見たことある」って思いませんでしたか？

世の中にはいろいろなサイトがありますが、
「自分が買いたくなるなぁ」と思うようなページを参考に、ぜひ作ってみてください。