見出し画像

ちょっとだけコツをつかんだぞ!

大阪南森町のオフィスより。。。

今日はLP(ランディングページ)のファーストビュー(ページを開いた時に最初に見える部分)のデザインを制作していたのですが、いつもだったら5回以上リテイクを繰り替えすのに、今回は2回で通りました。

わーい!!!ヾ(o´∀`o)ノ

今回上手くいったのは

・「完成形」がイメージ出来ていた
・コツが分かってきた

からなのですが。

この「コツ」ってすごい言語化が難しいなと。。。

LPのファーストビューのデザインで大事なのが、
①パッと見て一瞬で何が手に入るのかが分かること
②文字が目に入ってくること

なのですが、これを再現性のある形にするにはどうすればいいのか。。
ひとまず、今できそうな部分だけ、自分の中の
チェックポイントとして言語化しておこうと思います。

①パッと見て一瞬で何が手に入るのかが分かること

☆チェックポイント
・画面向かって右側に手に入るもののイメージを配置する

◎ベスト
商品とそれを使用した際のベネフィット両方をイメージとして入れる
〇ベター
商品か、もしくはそれを使用した際のベネフィットのイメージどちらかを入れる
×バッド
商品も、ベネフィットをイメージするものもどちらとも入っていない

②文字が目に入ってくること

☆チェックポイント
・画面向かって左側に文字を配置する
・文字の大きさは一番小さい文字で16px~20px、一番大きい文字で100~120pxで緩急をつける
・1文の横幅が70px以内
・プリヘッド、ヘッドライン、サブヘッドの間は30px以上あける
※全てPC表示、ヒラギノ角ゴシックのW8で仮定

こんなもんだろうか。。

あとは、つくった後に縮小表示(30%くらい)して見てみても「なにが手に入るか」が分かって「良さそう」に見えたらOKな気がする。。。

他にも色々要素としてはありそうだしフォントに依っても変わってきそうだけど、今のところはこんなところかな。。。

また、ブラッシュアップできそうなチェックポイントが見つかったら言語化しておこうと思います。

明日もがんばろう(/・ω・)/☆彡

この記事が気に入ったらサポートをしてみませんか?