見やすいLPをデザイン目線で分析してみた
はじめまして、明治大学という、何と評価したらいいかわからない大学に通っているモノです。
普段は都内のベンチャー企業で、デザイナーとしてインターンしています。
そこの上司のデザイナーさんに、
「デザインを勉強するときは、自分がいいなと思ったデザインを模写して、何で見やすいのか、分析してみなさい」
という金言をいただき、自分なりにCASHというスマホアプリの、LPのデザインを分析してみました！
と言っても僕は一応、デザインが好きなので、デザイン目線の切り口で笑
そもそも、LPというのは、何のためにあるのか
LPとは「広告施策用に制作する、１ページで完結する縦長のページ」です。
つまり、商品やサービスがあって、それを購入ないしはダウンロードや会員登録してもらうために見てもらうものと言えるでしょう。
そして、LPにおいては、だいたい最後らへんにボタンがあり（場合によっては最初）、そこがどれだっけクリックされたかによって優れたLPかどうかの判断がなされるわけです（ちなみに、その指標となるのがCTRで、クリック数をPV数で割ったもの）。
したがって、優れたデザインのLPとは、単に美しい、見やすいだけではありません。より人がLPを見てクリックしやすい、ないしはクリックしやすくなるデザイン設計が優れているということでしょう。
と言っても、僕はCASHを運用している人間ではないので、正確なCTRがわかりません笑
なので若干説得力にかけるかもしれませんが、あくまで、デザイン目線で、優れているところをプレゼンさせてください。
一応、コンセプトとターゲットを自分なりに洗い出してみます
CASHのコンセプト：「商品を渡してからお金を受け取るのではなく、お金を受け取ってから商品を渡す」という新しさ
CASHのターゲット：若い層・学生
調べてみて、CASHのLPはデザインのこんな部分が優れています
・フォントがいい
・色の使い分け
・空白の使い方
・フォントがいい
CASHのLPでは游ゴシック体を使っています。游ゴシックは一般的には「スタイリッシュで暖かみを与えるフォント」だと言われています。何となくわかりますよね笑
とはいえ、これだとだとテキトーすぎるので、ゴシック体と比べて、説明します。
上が、游ゴシックで、下が普通のゴシック体です。2つを比べると以下のような特徴がわかります。
・文字のそれぞれの角に丸みがある
・ユニークなはらい（→書体っぽい）
・カーブの仕方が緩い
・文字がスリム（全体の横幅が狭い）
ここからは僕なりの解釈なのですが、ゴシック体とは大きな特徴として、「縦横の線幅」がほとんど変わりません。しかし、それに忠実になりすぎてしまうと、シンプルではあるものの、逆にシンプルすぎるというか、特に何も印象付けることのできないフォントになってしまうと思うんですね。それに見慣れているからこそ、游ゴシック体は、角に丸みを設けたり、文字の横幅を短くしてスリムにすることで、暖かみを演出しているのではないのでしょうか。
CASHでは、上の「游ゴシック」を使用していました。対して、下の図が「ヒラギノ角ゴシック」を使った場合です。游ゴシックに比べて、下のヒラギノ角ゴシックは、全体的にカチカチな印象があります。（僕は若干、游ゴシック体の文章が全体的な文章幅が広く見え、角ゴシックの方は全体的な横幅が短く見えます。多分、錯覚ですが）もう少し言語化すると、文字がスリムでない分、文字間の幅があまり取ることができません。したがって全体的にギュッとしたイメージになってしまうのではないでしょうか。逆に、游ゴシックは一つ一つの文字の横幅を狭く取っているので、余白が生じ、ヒラギノ角ゴシックと比べて落ち着いた印象を与えます。
・色の使い分け
パッと見てわかる通り、CASHのベースの色は言葉で言うと、淡いオレンジのような気がします。カラーコードでいうと、「#fff8ea」がベースカラーで、「#ffcf07」がアクセントカラー。オレンジ色は、元気で活発なイメージを持ちつつも、どこか落ち着いた印象を与えることができる色で、特に、ワクワクするようなデザインを作りたいときには、明るめのオレンジ色を活用することでそのイメージを増大させることができます。
おそらく、お金→黄色というイメージと、「少額資金の需要を瞬間的に解決するという」CASH自体のヴィジョン、若年層がターゲットに即していえば、元気、活発、落ち着き、ワクワクが特徴の淡いオレンジがベストではないかと思います。
・空白の使い方
CASHのLPってガチャガチャしていません。普通、LPって広告なので、載せたい情報は山ほどあります。
今、プロダクト開発の中で一つのキーワードになっているのがシンプル化です。ものが溢れ、様々さ商品が乱立している中で、人間はますますシンプルなものを求めていきます。なぜならヒトの記憶力には限界があるからです。一般的に人が一度に覚えられる単語や数字は5～9個だと言われています。
そもそも今のプロダクトって、初期で多機能では絶対に売れません。FacebookやAirbnbが多機能化しているのに対して、新しく出てくるサービスって用途がわかりやすいですよね（Tinderとか）。
だからLPも、そもそも広告のためにあるので、見せ方がすごい大切です。これは僕の主観ですが、「単機能＝シンプル性」をうまく表現したLPだと思います。
CASHのLPの内容構成って
①目の前のアイテムがキャッシュに変わる
②アイテムを２週間以内に送る
③今、たくさんのアイテムがキャッシュに変わっている
④ユーザーボイス
ってなっています。コンテンツは必要最低限のことしか載せていません。本当は、もっと載せていいコンテンツがあるはずなのに。要は、どれだけ多くの情報を載せるかってよりもどれだけ重要度の低い情報を削ぎ落とせるかが大事なんですね。
その観点からデザインを見てみるととても面白いです。1つの文章は２~３行に制限し、視覚に訴えやすい図を多用し、文字を中央寄せにして、左右に余白を持たせています。認知ファースト、つまりどういうサービスなのかを非常にわかりやすくシンプルに請求していると思います。
スペースがあるからといって、全てに情報をブチこむと、かえって見にくくなります。余白は情報の干渉緩和という効果があり、情報と情報の関係性を余白を保つことで表現することができます。CASHの場合、左右の空白を持つことで、すっきりと、シンプルな印象を与えています。CASH自体のコンセプトが「商品を渡してからお金を受け取るのではなく、お金を受け取ってから商品を渡す」という新しさということ（であろう）ので、当然、新しいプロダクトはシンプルにPRしていく必要があります。CASHはそれをうまく表現していますね。
ちなみに、文字間や行間の余白をなくすと、こんな感じになります。
確かに、余裕はないですよね笑
まとめ
今回、CASHのLPを分析してみて、わかったことはこんな感じ。
・CASHのLPはコンセプトを、フォントや色、余白を使ってうまく表現していた。
・結局PRは、「Public Relation」。つまり、どれだけ請求するのではなく、どれだけ公衆（もしくはターゲット）の信頼を獲得できるか
若干、説得力にかけるかもしれませんが、優しい目で読んでいただけると嬉しいです😂
では、また！
