Project

パーソナルトレーニング
ムーブメトリクスジムWEBサイト

Type : Website
URL : https://movemetrics-gym.com

使用ツール : Illustrator / Photoshop / Figma / Visual Studio Code

概要

パーソナルトレーナー カネコ ユウスケ様の個人用WEBサイトです。
インスタグラムやTikTokなどのSNS経由で知った方に向けてのサイトとなります。

HTML/CSS、jQueryによるコーディング後、WordPress化をしています。

ターゲット

・ダイエットや健康のためにトレーニングを検討している20〜50代の女性がメイン。
・完全な女性向けではなく、男性も3割ほど視野に入れています。

目的

・サービスの認知拡大
・実際にサービスを申し込んでいただくこと

課題

① ユーザーがサービス内容や料金、お申し込みなどをわかりすく知れるようにしたい。
② 運動習慣のない方でも、運動や親しみやすさを感じさせる必要がある。
③ 女性がメインのターゲットとなるので、女性が好むデザインが必要となる。

情報設計

流入経路はインスタやTikTokからとなるので、コンセプトを簡単に説明した次は、料金体型や予約までの流れをすぐ伝えるようにしています。また、画面の右下には、予約ボタンを固定で配置することで、すぐに予約フォームにいくことも可能です。

個人のWEBサイトとなりますが、お客様の声や質問も配置することで、ユーザーのトレーニング申し込みまでを狙ったLP的な役割も持つように設計しました。

デザインの特徴

① 色

黒、ピンクよりの赤、薄いグレーを使うことで、ジムらしさはありつつも、女性が親しみを持ちやすい配色にしました。

② 余白感

余白感を意識し、流行的なサイトにすることや、情報のわかりやすさを心がけ、ユーザーの離脱を防ぐことを狙っています。

③ 写真や素材

実際のトレーニング風景やお客様を多く載せることで、トレーニングのイメージをつけやすくしたり、信頼感を出しています。また、全体的に装飾の角をなくすことで、親しみやすいさやハードルの低さを感じさせています。

制作範囲・期間

企画、ワイヤーフレーム:2週間
デザイン:3週間
コーディング:2週間
WordPress化:2週間

企画書

PCデザイン

SPデザイン