iwat.co.jp/anniversary/
https://www.iwat.co.jp/anniversary/

◎視点
サービス紹介をする場合、どうしても文字数が多くなる。その場合、どのようにしてユーザーが離脱せず読んでくれるようなデザインにすべきかに着目して、イラストが活用されているこちらのサイトに着目した。

◎概要
周年記念イベントのコンサル会社の、サービス内容を周知させるためのLP
最初に、周年記念を行う利点を述べ、ユーザーの興味を惹きつける。
次に、想定される疑問点を羅列し
それらを解決できる会社の特徴を羅列。
次に、サービス内容をまとめ
FAQ,お問い合わせフォームへと進む構成。

◎配色

◎文字サイズ
p(ベース)14px
h1 28px
h2 24px
h3 20px

◎余白
見出しとコンテンツ間28px

◎FV
最近よく見るイラストをメインに設置で柔らかい印象を与える。
あえて見出しとイラストの間隔を広げることで、見出しが目立ち、なんのサービスかを伝えることができる。
背景のふにゃふにゃ?のバイカラーがアクセントになってる。

◎利点
私であれば、ここにサービス特徴を載せてしまいそうだが、そもそも周年記念に何かをするという概念のない人が大多数なので、
まず周年記念をすることによって得られる利点を紹介することで、利用者数を上げる狙い(推測)
数字の位置が絶妙!
見出し下に濃い色で映画を小さく入れることで、いいアクセントになる。

◎疑問不安
ピンクとは対照の青を背景にすることで、不安感をだす。
背景下を三角にすると、次の項目で解決できるイメージをあたえることができる

◎特徴
これも数字のあしらいが絶妙。

◎サービス
ここにイラストを大きく入れることで、内容をサッと認識できる。

◎FAQ
タップでアコーディオン風に広がるデザイン。

◎会社概要
th部をグレー、td部を白にすることてメリハリをつけるデザイン。

◎コンタクト
電話、メールボタンが大きく設置されている。
背景がこれまでと異なるパキッとした色なので目立つ
フォームは線などはなく、色の明度でフレームと入力欄のメリハリをつけている。

ページキャプチャ

コメントを残す