Ohanasi
- LP
- コーディング
担当範囲
コーディング
制作期間
3日間
概要
- 日本語学習コミュニティ LPのコーディングを担当しました。
- 日本語学習者向けコミュニティサービス「Ohanasi」のランディングページをコーディングしました。世界55カ国・5,000名以上のメンバーが利用するサービスのLP制作で、英語圏ユーザーをターゲットにしたグローバルな訴求設計が求められた案件です。
- デザインデータをもとに、PC / SP 両対応のレスポンシブ対応で実装。
- CSS設計には FLOCSS を採用し、保守性・拡張性を意識した構成でコーディング。
こだわり
- セマンティックなマークアップを意識し、情報の優先度や構造がコードからも伝わるようなHTML設計でコーディングしました。
- PC / SP それぞれで見やすく操作しやすいレイアウトになるよう、レスポンシブ対応を丁寧に実装しています。
- FVのイラストやデコレーションラインなど視覚的に動きの多いデザインに合わせ、フェードイン・スライドインなどのアニメーションをCSS・JavaScriptで実装。サイト全体の雰囲気を損なわず、自然な動きで視線誘導ができるよう工夫しました。
- ドロワーメニューやCTAボタンの配置など、コンバージョンを意識したUI構造にも対応しています