概要
スマートフォンアプリ「OHA!」を紹介するランディングページのサンプルサイトです（仮想案件）。
担当はコーディングで、Figma
の支給デザインから実装しました。アプリのダウンロードにつなげる訴求動線を、スマートフォンでも快適に動く形で組み立てています。
制作会社さまの視点では、アプリ紹介
LP に必要なモバイル操作性と、世界観に合わせたフォーム実装力を確認いただける一例です。
課題
アプリ紹介 LP では、アプリストアへのダウンロードという明確なゴールへ、訪れた人を迷わず導くことが求められます。
利用者の多くがスマートフォンから訪れるため、すべての操作がモバイルで快適に動くことが欠かせない要件でした。
解決アプローチ
操作性への配慮： フリックとボタンの両方に対応したスライダーを実装し、スマートフォンでの操作感を最優先にしました。アプリの画面や特徴を、指先でスムーズに切り替えながら見てもらえます。
デザイン一体感への配慮： コンタクトフォームにオリジナルの CSS を適用し、既製の見た目に頼らずアプリの世界観と一体感のある問い合わせ導線を実現しました。フォームまで含めてブランドの印象を崩しません。
レスポンシブへの配慮： レスポンシブデザインに配慮した実装で、画面サイズを問わず崩れない表示を保っています。
工夫したポイント / 想定効果
フォームを既製の見た目に頼らず、オリジナル CSS でアプリの世界観に合わせて作り込んだ点が工夫です。
フリックとボタンの両対応により、スマートフォンでの操作離脱を抑え、ダウンロード導線まで自然に進んでもらえることが期待できます。