ランディングページ
まとめサイト

presented by Be-DASH Inc.

パイロンPL顆粒サイト シオノギヘルスケア

2018年 医療・医薬品 HTML5&CSS3パララックスレスポンシブ イエロー系ホワイト系レッド系

うすいイエロー(黄色)系とレッド(赤色)系を基調に制作された、ロングセラー風邪薬「パイロンシリーズ」のPRランディングページ(LP)です。

 

白い背景の中央に、赤い線で描かれた女の子が登場するローディングアニメーションがかわいいです。

 

さらに、真っ赤な背景に表示された風邪薬1包が動いたあと、「あっ! このかぜ薬」と吹き出しが大きく出て、商品パッケージ(箱)が上から落ちてきて、商品に光がさすファーストビューがとても目を引き、続きが見たくなります。

 

「あっ かぜかも…と、なってしまうまえに」の段と、「あっ かぜかも…と、なってしまったときは」の段では、ローディング画面に登場した女の子のイラストや、ファーストビューと同様の「あっ」の吹き出しを使い、ページ全体に統一感をもたせています。

 

また、それらの段の内容は項目ごとに、カード風のオブジェクト内に見出しとイラストのみを表示し、「もっと詳しく」をクリックするとカードがくるりと裏返しになり、説明を読むことができるようになっているので、一度に目に入る文字の量が少なく、すっきりとまとまっています。

 

全体にスクロールエフェクトを使い、フォントのジャンプ率が高いので、メリハリのあるページに仕上がっています。

 

派手な色を使いながらも、シンプルで品のあるデザインにしたい際の参考になるページです。

投稿した人

mimayo

2017年12月よりランディングページ(LP)のデザイン制作を始めたばかりです。 今はまだ知識も技術もありませんが、いつかここにアップされているようなものをデザインできるようになりたいです。