オンラインスクールの課題で作成した子連れ歓迎カフェのランディングページデザインです。 テーマの設定からデザイン、コーディングまで作成しました。 子育て世代の20〜40代の男女が主なターゲットで、サイトの目的はカフェの認知の拡大、サイトを通じてカフェの予約をしてもらうことです。 スクールで学んだデザイン基本4原則（まとめる、揃える、繰り返す、メリハリをつける）を意識し、見やすく整ったレイアウトを意識して作成しました。

子ども歓迎のカフェなので、温かみやほっこり感、親しみなどをイメージし配色はオレンジやブラウンを使用しています。 また、英語文字や写真の角を丸っこくすることで、ほっこり感や優しさなどを表現しました。 カフェのコンセプトをしっかり伝えること、予約までの動線がスムーズな流れで設定されるよう事を重点に置き作成しました。

• すべてのリンクやボタンにホバーアクションを設定することで、クリックできる要素であることをわかりやすくしました。
• ユーザーがより安心して来店できるように、店内の様子などカフェの雰囲気がわかる写真をたくさん掲載しました。写真はsliderを使用し、jQueryを用いて動きのある実装をしました。
• どの画面幅でもレイアウト崩れがないように、スマートフォン画面幅の時も、画面幅に応じてレイアウトを調整し、レスポンシブ対応がしっかりと行いました。
• 「お問い合わせボタン」は他のボタンと差別化し、アクセントカラーであるオレンジでしっかりと目立たせました。

Photoshop/Visual Studio Code

https://wild-saito-5641.nobushi.jp/