女性向けの架空のパーソナルトレーニングジム「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代前半の落ちついた女性のイメージに合わせユーザーに親近感を与えるようにしました。濃い黄色は差し色としてボタンや下線、枠線などに使用することで配色に退屈さが出ないようにしました。

・メインビジュアルは伝えたい情報を画面右側に配置し、女性のビジュアルを左側に配置することで対比を生みより伝えたい場所に視線を誘導することを意識しました。キャッチコピーも同じような狙いで比較的余白が多い画面左側に配置しています。

・お客さまの実績とお客さまの声のセクションは、スライダーにすることでページ全体をコンパクトにしてユーザーの回遊率を下げないようにしました。加えてレスポンシブデザインでは料金プランにスライダーを設置しました。トレーナー紹介、サービス紹介、無料カウンセリングなどの要点・順序がある部分はレスポンシブに関わらずそのままレイアウトしています。

・最初のセクションにトレーナー紹介を持ってきた意図は、トレーナーの顔と実績を早く自己開示することで以降のセクションでの信頼度を上げるという狙いがあります。(製品のパッケージに生産者の顔が載っているイメージです。)