女性向けの架空のパーソナルトレーニングジム「Queen GYM」のランディングページのデザインです。
URL
https://www.figma.com/design/todEYPrV0BuVOhfyFIIPEj/Queen-gym-LP?node-id=0-1&t=3uKkFQF4BerW2pUb-1
担当
デザイン
使用ソフト
Figma / Photoshop
サイトの目的
無料カウンセリングへの誘導
制作期間
デザイン：1カ月(ペルソナ設計～完成まで)
ターゲット
東京都（中野区）在住の20代中盤～40代前半の運動不足に悩む女性
デザインについて
・サイト全体の配色は紫とピンクをメインカラーにし、濃い黄色をアクセントカラーにしました。各色の明度を低めにすることで、ターゲットである20代中盤～40代前半の落ちついた女性のイメージに合わせユーザーに親近感を与えるようにしました。濃い黄色は差し色としてボタンや下線、枠線などに使用することで配色に退屈さが出ないようにしました。
・お客さまの実績とお客さまの声のセクションは、スライダーにすることでページ全体をコンパクトにしてユーザーの回遊率を下げないようにしました。加えてレスポンシブデザインでは料金プランにスライダーを設置しました。トレーナー紹介、サービス紹介、無料カウンセリングなどの要点・順序がある部分はそのままのレイアウトにしています。
・トレーナー紹介の背景はセクションの見出しを英語でワンポイントで配置したり、ロゴをグラデーションを薄めに掛けて配置したりしています。画面内が淡泊にならないようにかつ目立ちすぎない、をテーマにデザインしました。
デザインの工夫ポイント
・最初のセクションにトレーナー紹介を持ってきています。
→自己開示を初めに行うことで、お客さまの信頼度を上げる事が狙いです。（製品のパッケージに生産者の顔が載っているイメージです。）
・メインビジュアルの要素は視線を意識した配置にしています。
→伝えたい要素を右側、女性のビジュアルを左側に配置。対比を作り視線を誘導させています。キャッチコピーは比較的余白が多い画面左側に配置しています。
