//サイトurl//
https://mons-design.com/komeko
//制作期間//
- デザイン：2週間
- コーディング：3週間
//使用技術//
- HTML 、CSS、jQuery、Illustrator、Photoshop、Dreamweaver
//対応機種//
- PC/SP
//制作目的//
- 個人で経営するパン教室のwebサイトを通じて、より多くの集客に繋げる。
- パン教室のこだわりを知ってもらう。
//デザインコンセプト//
上品で落ち着いた雰囲気、高級感、清潔感
//ターゲット//
- 30代以上の女性
- 健康意識が高く、オーガニック、無農薬野菜を日頃から取り入れている
- グルテンフリー、砂糖不使用に興味がある
- 自身、もしくは家族が小麦アレルギー
- 子育て中で、家族の健康に気を使っている
- 子育てが落ち着き、趣味に時間とお金を使えるようになった
//こだわったところ//
- ベースカラーを白、メインカラーをグレー、アクセントカラーにゴールドを使用。ポイントで背景に大理石の画像を使用した。
→webサイトの基本の配色ルールにすることで見やすさ、まとまりができた。基本の守ることの大切さを学べた。
→白とグレー、大理石の背景で落ち着いた大人の雰囲気、ゴールドで高級感、パンの色味を表現した。 - メインビジュアルのスライドの画像にパンの写真だけでなく、実際にパン作りをする女性の写真やキッチンの写真を取り入れた。
→パン教室の雰囲気をより具体的にイメージしやすくするため。 - パン教室の強み、こだわりをメインビジュアル直下のコンテンツ（CONCEPT）として配置した。
→サイトを訪れた人にグルテンフリー、健康意識の高いパン教室という情報をすぐに知らせるため。
→文章をシンプルに簡潔にわかりやすくし、ストレスを与えないようにした。 - ロゴと、それぞれのコンテンツの見出しのアイコンに同じ稲穂のイラストを使用した。
→「米粉」を使用したパン教室のため、稲穂のイラストを自作し、アクセントにすることでパンの世界観を演出した。 - GALLERYコンテンツでパンの写真を流して見せるスライドショーを実装した。
→複数のパンの写真を流して見せ、動きをつけることでユーザーの目線を引き付けるため。 - フッター画像を自作した。パンのイラスト、料理道具の写真を切り抜き、下部に規則的に置かれているようなデザインとした。
→女性心をくすぐるような柔らかい、優しい雰囲気のイラストを使用し、読まれづらいフッターに目線がいくようデザインを載せた。 - フッターにサイトマップを作成した。
→indexページを最後まで見たユーザーがその後すぐに申し込みやレッスン内容を確認したりと、知りたい情報にすぐアクセスできるようにした。 - 全てのページをレスポンシブ対応させた。
→ナビのハンバーガーメニューの実装、横並びコンテンツから縦並びデザインにする、コンテンツの横幅、フォントサイズの調整を行った。
