浦安に店舗を構える美容室CO-DYの新規サイトを制作しました。
- 制作期間
-
8週間デザイン4週間 コーディング4週間
- 担当範囲
-
ディレクション、デザイン、コーディング、保守
- 制作人数
-
1人(自身のみ)
- 使用技術
-
Illustlator, Photoshop, XD, HTML, CSS, JQuery
- 対応機種
-
PC,SP レスポンシブ可
Detail Info.
- クライアント情報
-
浦安市にある地域密着型の美容院で、オープンしてから約1年です。話好きの店長さんと、共同出資者の2人で経営していらっしゃいます。 小規模ですが、店内はティファニーブルーのようなブルーグリーンを基調とし、広めにスペースをとったバリアフリー設計となっています。
名前の由来は「cozy＝くつろぐ場所」とお二人のお名前から。
- 制作目的
-
自社サイトをお持ちでなかったことと、広告媒体を増やすこと、そして自社サイトを所有することは世間の認可と信頼を得ることにつながるため、営業拡大のお手伝いをすべくご提案しました。
- サイトコンセプト
-
見ている人が一目見て店のイメージがわかり、ユーザビリティを優先したサイトを目指しました。
デザイン面について
-
クライアント様からの要望でもありましたが、店のイメージカラー（ブルーグリーン）とやさしいイメージということでこのクリーム色を採用しました。さまざまな閲覧者がいる中で、店のイメージが同じように伝わってほしいという思いで作成しました。
-
フォントは見出しには「Josephine Sans」を採用しました。複数の美容室サイトで使用されていて、且つデザイン書体ですが、サンセリフ体なので、可読性も備えているからです。本文は「游ゴシック体」を採用しました。これも可読性を意識したためです。
-
地域密着型の美容院ということで、閲覧者に親近感を伝えたかったので、サイト内写真は店長様と私が撮影したものを使用し、ヘアモデルもお店のお客さまのものから選定しました。また背景が店のカラーになっているものからなるべく選び、統一感を狙いました。
コーディング面について
-
動的デザインは接続スピード、離脱率を考慮し、ユーザーが使用する際の利便だけを考えました。格安プランのWi-Fiも増えてきているため、「つながるのが遅い」もどかしさをなくせるよう努めました。
-
ページの行き来はユーザーへの負担になるため、なるべく内容を1ページ内に集約させ、スクロール移動で把握できるように工夫しました。
-
ナビゲーションもユーザーの負担が少なくなるように、常に画面内にあるようにしました。スクロールすると上でつくようにし、footerナビゲーションが出てくると、自然に消えるようにJQueryを施しました。
サイト開設・運営について
-
新規サイトということで、クライアント様はドメインをお持ちでなかったため、サーバーとドメインを提案し、代わりに契約いたしました。
-
契約後もGoogle Analytics、Google Search Consoleなどを施し、Googleで検索できるようにしました。今現在では店名「CO-DY」という重要なワードで1位にヒットするようになりました。
-
当初開設したときよりも画像サイズを小さくしたり、descriptionなども整理し、こまめに更新するようにしています。その結果、サイトの総合点数も90点以上となりました。
Other Pages
