概要
本案件は、朝活習慣を支援するサービスの利用促進を目的としたランディングページ（LP）のコーディングを行ったものです。
Figmaで作成されたデザインカンプをもとに、HTML・CSS（Sass）・JavaScriptを用いて忠実に再現し、レスポンシブ対応およびアニメーション実装まで対応しました。
また、サービスの特性上、「継続できるか不安」というユーザー心理を考慮し、行動を後押しする情報設計と導線設計を意識して制作しています。
ターゲット
・20代〜40代の男女
・自己成長や習慣化に関心がある層
・朝活に興味はあるが継続できていないユーザー
・仕事や勉強の効率を上げたいビジネスパーソン
・新しい生活習慣を取り入れたいと考えている方
課題
・「続けられるか不安」という心理的ハードルが高い
・サービスの利用イメージが湧きにくい
・他の自己啓発サービスとの差別化が難しい
・登録や利用開始までの導線が弱く、離脱が発生しやすい
解決
・ファーストビューで「理想の朝のイメージ」を提示し、興味を喚起
・サービスの利用ステップを段階的に説明し、継続イメージを明確化
・特徴やメリットを整理し、他サービスとの差別化を強化
・CTA（登録・利用開始）を適切に配置し、行動を促進
・スクロールアニメーションにより視認性を高め、最後まで読了される構成とした
制作範囲
・コーディング（HTML / CSS（Sass） / JavaScript）
・レスポンシブ対応（PC / スマートフォン）
・アニメーション実装
制作期間
・約2週間
※本LPはコーディング課題として制作したポートフォリオです。