＜担当範囲＞
要件定義 / デザイン / コーディング
＜使用ツール＞
- Adobe XD：ワイヤーフレーム、デザインカンプ
- Photoshop：画像加工
- Visual Studio Code：コーディング
1.要件定義（架空）
■事業内容
イメージコンサルティングサロン運営
■概要・目的
理想の自分になれるというイメージを持ってもらい、サロン予約してもらう
■ターゲット
- 30～40代女性
- 自分に何が似合うのかよく分からない方
- 好きな世界観が合うサロンを探している方
- ショッピングで失敗したくない方
- 生き生きとした毎日を過ごしたい方
2.デザインのポイント
●ページデザイン
■イメージ/コンセプト
- 女性らしく、清潔感がある
- 予約しやすくなるように、エレガントすぎないデザイン
- いきいきと輝いている女性の写真を使用
■配色
ターゲットの年齢に沿うよう、明るすぎない少しくすんだピンクとブルーを使用し、華やかさと清潔感が出るようにしました。
■その他のデザインのポイント
①日常の暮らしをイメージ
特別な日だけでなく、「日常の自分が輝ける」というイメージを持ってもらえるよう、道端や窓辺の写真など、日常の暮らしを切り取った画像を使用しました。
②統一感のあるサービスイメージ
サービス内容のイメージに花の画像を使用することで、5つのサービスに統一感を出し、女性らしく華やかな印象になるようにしました。
③比較しやすいメニュー
メニューは3つに絞り、松竹梅のように並べることで、金額や内容の比較がしやすく選びやすいメニューにしました。
④身近に感じられるプロフィール
個人サロンは、オーナーの想いや顔が見えないと予約しにくいので、オーナーの自己紹介・所有資格だけでなくサロン運営への想いや顔写真を載せました。
また、背景にサロン店内の写真を使用し、サロンの雰囲気も伝わるようにしました。
⑤シンプルで未来を期待させるCTAセクション
ユーザーに迷いが出ないようシンプルにCTAボタンを1つ配置し、輝いた自分への出会いを期待させる窓辺の写真を背景に使用しました。
3.振り返り
自分がファッションが好きなこともあり、実際にユーザー側の立場でサロンを探したことがあったので、その時に感じたことをサイト制作に活かしました。
「サイト全体やオーナー様の雰囲気が自分とマッチしているかどうか」、「メニューがわかりやすく選びやすいか」は自分が重視している部分だったため、特に意識し制作しました。