Illustratorのデザインカンプをもとに、要素サイズや余白を確認しながらレイアウトを構築し、デザインとのズレが出ないようピクセル単位での再現を意識してコーディングを行いました。 また、LP全体で統一感のあるUI表現になるよう、テキストリビールや円グラフなどのスクロールアニメーションを実装し、視覚的にわかりやすいサイト構成を意識しています。 SCSSではコンポーネント単位でスタイルを整理し、フォント管理や共通スタイルをまとめることで、CSS設計を意識した保守性の高いコード構造を心がけました。
スクロールアニメーションが多いLP構成だったため、個別にアニメーション処理を書くとコードが複雑になってしまう点が課題でした。 そのため、アニメーションの共通クラスや処理を整理し、再利用できる形で実装することでコードの可読性と保守性を向上させました。 また、本業と並行しながらの納期課題だったため、作業の優先順位を整理しながら効率よく実装を進めることで、期限内に制作を完了することができました。