下記は「架空ライバー事務所のライバー募集LP」のWebデザインにおける説明です。
1:Webサイトの目的
公式ライバー募集が目的。
興味を持ってもらった上で、応募フォームを入力してもらう流れに持っていくことが目的。
2:ターゲット像
20代前半〜30代前半の、エンタメに興味があったりSNS等トレンドに敏感な男女。
また、副業で稼ぎたいと思っている頭の良い男性。
3:キーワード
若々しい、合理的な、知的な、新鮮な、モダンな
4:デザインコンセプト
若々しい心を頭を武器に個の時代の主役になる。
5:構成の並べ替え考察
構成は以下の通りである。
1stview>コピー>DeLive説明A>CVボタン>DeLiveの特徴>クチコミ>DeLiveの説明C>流れ>CVボタン>よくある質問>お問い合わせ」
「1stview」
LPに来訪したユーザーは「DeLive!」のことをよく知らない。
前提を擦り合わせたいところではあるが、ユーザーの離脱を防ぐためにまずは「結論」を1stViewで伝え、当LPの最終ゴールを提示する。
これにより、最終的な期待値が擦り合った上で読み進めてもらえるので、読み進めてさえすれば期待値ズレによる離脱は軽減される。
「コピー>DeLive説明A」
当LPに来訪したユーザーは「DeLive!」のことを全く知らない。つまり不信感を持っている状態だと考えられる。
上記より、「DeLive!」とは何者で何を目的に活動しているのかを擦り合わせることで
「DeLive!」に対する不信感を除く。
「メリット>DeLive説明B>CVボタン」
不信感を払拭した上で、ユーザーへのメリットを提示する。
特徴ではなくメリットを先に提示した理由は、人間の心理では、「商品の特徴」よりも「その商品は自分には利益か不利益」かの方が大切なので、大切な情報をまずは提供する。
メリットを認識すれば、「やってみたい」「買ってみたい」という感情が湧く。一方でその商品は果たして自分に適しているかを悩んでいる可能性があるので、「こんな方にはおすすめ」というセクションにてその悩みを解消する。
「DeLiveの特徴>クチコミ>DeLiveの説明C」
「DeLive!の特徴」については前後関係によってこの配置にしました。
クチコミ(ライバーの声)やDeLive!の説明C(活躍するライバー)のセクションにおいて、以下の疑問点があがる。
「なぜ評判が良いのか」「なぜ活躍できるのか」
この疑問点を事前に解決するために「DeLiveの特徴」を「クチコミ」「DeLiveの説明C」セクションに配置することで、ユーザーは
「この特徴があるから、評判がいいんだ」
「この特徴を生かして活躍しているんだ」
のように因果関係に基づいて理解することができ、「クチコミ」「DeLiveの説明C」に対する納得度合いも格段に上がると見込んだため。
「流れ>CVボタン」
これまでのセクションにて「DeLive!」に対する信頼獲得、興味を掻き立てることができたと見込む。
「ではどうやってライバーになるのか」この疑問点を解消するために、興味・関心・信頼が最高潮になっている直後に「流れ」のセクション、続いて「CVボタン」 セクションを配置することでコンバージョン率を高められると考えたため。
「よくある質問>お問い合わせ」
最後に、LPに読み進めていくにあたって沸いた疑問・不安点を解消した上で、最後のお問い合わせにてコンバージョンを狙う。
6:ファーストビューのポイント
ポイントは2つ。
1つ目は、男女一人ずつが写っている2つのデバイス。
今回の公式ライバー募集のLPにおいてターゲットが女性だけではなく男性も含まれている。
上記より、1stViewには女性モデルだけではなく男性モデルも入れるようにした。これにより1stViewで男性が当LPに来訪しても即離脱可能性は軽減できる見込み。
また、ライバーという職業が活躍する場所はデジタル空間におけるデバイスの中。
上記の情報をより早くわかりやすく伝達するために、男女のモデルをデバイスの中でライバーとして活躍している様子をデザイン。
2つ目は、1stViewの背景画像。夢の提供。
手前のデバイスに映るライバーがゆくゆくは会場を貸し切ってファンを魅了するライバーにも近づけることを連想させるために、本物のライブ会場の画像を選定。トンマナに沿った画像でもある。
7:フォントの意図
「親近感」を連想させる「Noto Sans」のゴシック体を使う。
ライバー職というまだまだ新しくできた職、さらにその華々しさを考慮すると「高級感」を連想させる明朝体を使うと、初見ユーザーにはなかなか敷居が高いと思われる可能性がある。これにより、「親近感」を沸かせるゴシック体を用いることでまずはユーザーとの距離を縮め、LPを読み進めていくにあたりコンバージョンしてもらうことを意図している。
8:配色の意図
青・緑をメインカラーとした配色。
「青」
今回のターゲット像として「頭の良い」男性や女性としている。
上記より、知的さを表現するために「青」を使っている。
「緑」
青だけでは「男性」のイメージが強く出てしまう可能性があるので、中性色である「緑」を使うことでターゲットを男性だけではなく女性まで広げることができると考えたため。
また、緑の心理的な効果の1つとして「落ち着き・リラックス効果」があるとされている。今回のLPはライバー募集で、競合他社のLPを拝見するとどれもポップな色が多用されており、落ち着かない印象があった。これらと差別化を図るため、そして知的な男女に落ち着いて最後まで閲覧、コンバージョンしてもらうために「緑」を使っている。