広告用LPにおけるワイヤーフレームシート

マーケティングにおける「プロモーション」分野では広告施策を活用するケースが非常に多いです。その際に必ずと言ってもいいほど必要になるのが「ランディングページ」です。

既存のWebページを活用し、そこに広告集客をするケースもありますが「Web広告」に多くの予算を投じるケースやその広告効果が事業にとって非常に重要なポイントとなる場合は広告用のランディングページを制作するケースも多いです。

meycoでは、お客様に最大限結果を出すために、様々な施策を推進して参りました。

その際に、最も結果に繋がった工程を「ユーザーグラフマーケティングメソッド」として開発、発信してきました。

今回は、マーケティング施策を行う多くの方が使用される「ランディングページ」におけるワイヤーフレームのテンプレート（化粧品商材）をまとめました。

これまで数多くのランディングページ、サービスサイト等を制作してきた中で、成果につながりやすい共通項を取り入れたランディングページのワイヤーフレームの型をご紹介します。

参考：ランディングページのワイヤーフレーム_テンプレート（XD）

※上記、薬機法の規制における責任は負いかねますのでご了承ください。

ワイヤーフレームを制作する前に_事前整理

いざ、ワイヤーフレームを制作するぞ！と手を動かしてはいけません。

広告用ランディングページの目的は、流入したユーザーに対し、購入やお問い合わせといった行動をとってもらうことです。いかに、CVRが高いランディングページを制作することができるかが肝となります。

したがって、手を動かす前の事前の準備が必要となってきます。

ワイヤーフレーム作成の前に整理すべき3つのポイント 

①配信媒体などランディングページ流入までのフローは、どのような設計を前提としているか。（配信設計）

②流入するユーザーは、どのくらいの検討段階と推測されるか。（関心度）

③どのような行動を取らせたいのか。（オファー設計）

配信媒体などランディングページ流入までのフローは、どのような設計を前提としているか。（配信設計）

どのような経路でユーザーが流入するかにより、ランディングページを閲覧するユーザーの属性は異なります。流入部分をイメージすることで、ランディングページ内のコンテンツや文章を適切なものに調整しやすくなります。

流入するユーザーは、どのくらいの検討段階と推測されるか。（関心度）

1と通ずるところがありますが、流入するユーザーの関心度を推測することです。その商品/サービスを全く知らない人が閲覧するランディングページなのか、知っている人が閲覧するランディングページなのか、知っていて購入/利用までを具体的に検討している人が閲覧するランディングページなのかなど、ユーザーの関心度によって、伝えるべき情報は変わってくるはずです。

どのような行動を取らせたいのか。（オファー設計）

ランディングページの主目的である購入やお問い合わせなどの行動を取ってもらう際のオファーは重要です。購入なのか、トライアルなのか、資料請求なのか流入ユーザーの属性をイメージしつつ、適切なCTAを設定します。CVまでのユーザーのハードルがあまりに高いと感じる場合は、○○%OFF / 無料トライアルなどのハードルを下げるオファーもつけましょう。

ワイヤーフレーム作成の流れ

ワイヤーフレーム作成の事前準備ができたら、具体的に作成を行っていきましょう。

大枠の手順としては、下記となります。

ワイヤーフレーム作成の流れ

①目的を定める

②ターゲット、訴求決定

③構成作成

④ライティング

目的を定める

目的は上述した事前整理である程度見えてきていると思います。

具体的には、どのようなユーザーを、月間（月間でなくとも目標値があると好ましいです）どのくらいの購入/お問い合わせ/資料請求を獲得したいかという設定です。

ターゲット、訴求決定

ランディングページでは、閲覧者の興味・関心を引き、CVにつながるような訴求をする必要があります。訴求を決めるためには、ターゲットを具体的にすることが必要不可欠です。顧客の解像度を上げ、お金を出すほどまでに苦しんでいるポイントはどこにあるのかを具体化する必要があります。

解像度が上がれば訴求だけでなく、構成やデザインの質も高めることができます。

構成作成

目的とターゲットが明確になったら、ランディングページの構成を考えます。構成作成では、何をどのような順番で伝えたほうが良いのかを設計します。いわば、顧客の購入に至るまでの感情を予測した上で作るストーリー構成のようなものです。

プレゼンなどで相手が理解しやすいように順序立てて話すように、ランディングページでもユーザーが情報を把握しやすいように、かつ、購入しない理由を払拭できるように構成を作成していきます。

ランディングページの構成が出来たら、ワイヤーフレームを作成します。ワイヤーフレームとは「WEBページの設計図」のことで、構成をより具体的にWEBページの形に落とし込んだもののことです。

ワイヤーフレームによってコンテンツの整理やレイアウトの設計ができるだけでなく、メンバー同士で認識を擦り合わせることができます。

ライティング

最後にライティングです。訴求軸をブラすことなく、言葉の表現にこだわります。表現の基本は、「ターゲットが使う言葉は何か」です。顧客が日頃使う共通言語に揃えましょう。作り手が使っている言葉と顧客が使っている言葉は乖離が生まれるものです。理想は、顧客へのインタビューができれば良いのですが、時間や費用を考えるとなかなか実施できないもの。その場合は、ひたすら表現をブレストし、顧客の距離に近いものを選定しましょう。

ワイヤーフレームの基本構成

こちらではランディングページのワイヤーフレームの基本の型を紹介します。

基本的にランディングページの構成は、大きく3つに分かれます。

1.ファーストビュー

キャッチコピー＆アイキャッチ画像で閲覧者を惹きつけるパート。CTAボタンも設置し、取ってほしい行動を伝えます。

2.ボディ

導入文、商品やサービスの特徴などを伝え、購入までに必要な情報を伝えます。

3.クロージング

よくある質問・導入の流れを伝え、購入の際にハードルとなる部分を払拭するパートです。

スムーズに入力フォームへ誘導します。

下記は弊社が使用しているランディングページ構成の型で、実施する商材やターゲットによってカスタマイズして作成しています。

ランディングページのワイヤーフレームの考え方について、分かっていただけましたでしょうか。今回は型を紹介しましたが、あくまで型であり、ユーザー視点に立つということを忘れずに活用いただけましたら幸いです。

参考：ランディングページのワイヤーフレーム_テンプレート（XD）

本記事が皆様のマーケティングにおける課題解決に少しでもお役に立てれば幸いです。

meycoではユーザーグラフの考え方に則ったマーケティングに関するご支援をしています。よろしければお気軽にご連絡ください。

ユーザーグラフマーケティングのmeyco

お問い合わせはこちら