美容サロンサイト(企画・デザイン・コーディング)
卒業制作としてクライアントワークスで美容サロンのwebサイトを制作。企画、デザイン、コーディングまで自分で作成。
●制作したWebサイト
美容サロン「beauty salon Rene」
●使用技術
Photoshop、XD、HTML、CSS、jQuery
●制作期間
2022年7月〜8月
●クライアントについて
・富山県富山市の完全個室・自宅エスティックサロン。
・おすすめメニューとして美肌光脱毛、眼球エステ(ネトラバスティ)、アロマリンパマッ
サージがある。
・クライアントの要望としておすすめメニューをアピールした新規Webサイトの開設。
●サイト開設の目的
お客様にお店の情報や魅力をわかりやすく伝え、安心してご来店してもらう。
●ターゲット
20〜30代女性
<ペルソナ>
- 24歳 実家暮らし 事務職 富山市内在住
- 新卒でエステティックサロンに就職。1年働き、事務職に転職。美容意識には高く、コスメや健康食品に気を使っている。週末は運動場に行き友達と走りに行くことがある。しかし、ズボラなところもあり流行りのダイエット方法を試してはたびたび失敗している。暇があればインスタで流行りの美容に関する情報を調べている。
●デザインコンセプト
お店の雰囲気に合ったシンプルで上品な落ち着いたデザイン。
●工夫したところ
<全体>
・デザインコンセプトに沿ってカラーは白、ベージュ、グレー、ゴールドを取り入れた。
・フォントも上品な雰囲気を出すために「Sippori Mincho」を使用。
・落ち着いていてゆったりした雰囲気を出すためスクロールをすると、ふわっと出てくる
動きをつけた。
・お客様が知りたい情報のページにすぐに行けるようにヘッダーは固定にした。スマホで
はハンバーガーボタンを固定した。
・画像は優しく落ち着いた雰囲気が出るように少し白っぽく加工をした。
・シンプルでゆったりした感じを出すために余白を多めに取った。
<トップページ>
・トップリードの箇所はお店の名前の由来なった「生まれ変わる」をイメージし、文字が
順番に流れ出てくるようにした。
・お店のおすすめメニューがトップページで目につくようにし、そこから詳しい情報が見
れるようにページに飛べるようにした。
・お客様が安心して来てくださるようにレビューの画像を配置し、スライドで見ることが
できるようにした。
<脱毛ページ>
・脱毛のメニューは数が多かったため、Women、Men、Kidsで分けてタブメニューに
し、わかりやすく見れるようにした。
<お問い合わせページ>
・お店ではインスタのDM、LINE@、minimoで予約を受け付けていたが、直接サイトか
らもお問い合わせができるようにした。