URL

https://portfolio.okanajapan.jp/static/lp/sayori_demo/scl001.html

※再現デモです

概要

自社レオタード商品の販売促進を目的としたランディングページをリニューアル制作しました。

担当範囲

LPデザイン／商品撮影／構成ディレクション／ライティング／モデル撮影ディレクション／コーディング

意図・ポイント

【全体的なデザインに関して】

商品の機能性とデザイン性の両立を訴求するため、全体のビジュアルトーンをブランドの世界観に合わせて統一しました。 撮影からページ構成まで一貫して担当し、自然光を活かした柔らかい印象を重視しています。

【コーディングに関して3つのポイント】

実際の楽天市場の販売構成を忠実に再現しつつ、WCAG（アクセシビリティ）基準を意識したセマンティックなマークアップを行いました。

1. 見出し構造： デザインを損なうことなく、スクリーンリーダー等にも配慮した適切な見出し階層を構築しました。
2. レスポンシブ： 関連商品エリアでは、PC（3列）とスマホ（2列）で最適な情報量になるよう、メンテナンス性の高い効率的なコードで実装しました。
3. ユーザビリティ： フォントには「Noto Sans JP」を採用し、デバイスを問わず高い視認性を確保しています。

問題と解決策

既存ページでは情報が散乱しており、また画像のサイズ・解像度や全体のトンマナが統一されておらず、商品の魅力が十分に伝わっていませんでした。
そこで、社内ヒアリングを重ねて商品の特徴を明確化し、構成・キャッチコピー・ビジュアル面を整理しました。
ファーストビューで購買意欲を高める構成に刷新しました。

結果

入社してすぐの全面リニューアル後には、楽天デイリーランキングに入賞するようになり、以後定期的に週刊ランキングトップ5に入賞するようになりました。
また2020年の大幅リニューアル時はデザインも刷新し、現在もブランドの主力商品ページとして、継続的に使用されております。