【LP制作サンプル】新製品紹介・販促用ランディングページ【Web制作の解説】
デザインのポイント
ホームセキュリティ用の監視カメラを紹介する特設サイトのサンプルです。
ホームセキュリティについて大げさなものではなく、もっと身近で手軽に、20代の若い方にも導入してほしいというコンセプトで堅くなりすぎず、やわらかい・ポップな雰囲気でデザインをしました。
アニメーション表現のポイント
フェードアニメーション(各要素を際立たせる)
要素を流し読みすることをできるだけ防ぐため、スクロールをすると各要素がフェードインして表示されるようにしています。スクロールアニメーションを入れることで、各要素を注目させる効果があります。
マウスホバーアクション(フォームへの導線)
申し込み・お問い合わせなどのフォームのリンクには、マウスホバーのアニメーションを取り入れました。
マウスホバーアニメーションを取り入れることで、クリックできると認識させ、コンバージョンとなるフォームへのアクセスを促します。 今回はホバーするとグラデーションが流れ、ボタンも「押している」という感覚を持ってもらえるようにcssで設定をしています。
アコーディオン(Q&Aをコンパクトに表示)
Q&Aはサイトによってはたくさんあるため、アコーディオンにして最初はコンパクトに表示させておき、クリックをするとアンサーが表示されるようになっています。情報をまとめるだけでなく、ユーザーが自分の見たい製品についての詳細を探しやすくする効果もあります。
制作の期間 | 約5~8営業日 |
---|---|
URL |
当社で担当した制作パート
具体的な制作実績については、
こちらから資料のご請求をお願いいたします。