わ
か
ば
の
も
り
保
育
園
(架
空)

- サイト
- わかばのもり保育園(架空)
- コンセプト
-
保育園のリニューアルに伴ったサイト制作。ターゲットは20~30代の子育てをしながら働いている女性で、時間がない中でも子供のためにとって良い環境の保育園をリサーチしている、といったペルソナを設定しています。 また、いかに知りたい情報にアクセスしやすいかというユーザビリティの観点と、写真や画像をたっぷり使用することで施設の雰囲気を感じ取ってもらい保護者にとって安心できるようなサイトを目的と致しました。
- 仮想クライアントからの目的・要望
- 以前は簡素な情報とシンプルなデザインであったため、入園された後からの齟齬を無くしたい。確実な情報と保育園の魅力を伝達をしたい。 また、子供たちが過ごしている時間を保護者にも安心してもらえるようにブログを開設し、現代的な要素を組み合わせたデザインにしてほしい。
- ― デザイン面 ―
-
ロゴについて
ロゴのテキスト部分は元気で躍動感を与えつつ、「双葉」や「青葉」は子供をイメージしており文字に遊び心として取り入れました。 すくすく成長してほしいという願いを込めて「木」を保育園のイメージロゴとしています。
サイトの色合いも緑系統・丁子色(薄いブラウン)で「木」を想定させ、ロゴの配色でレイアウトしています。
保育園ロゴ
-
サイト全体
「角のない丸い子に育てる」をテーマにしたことで、全体的に丸いフィルムを散りばめました。アニメーションで所々に動きを付けることによって親しみやすさや温かい雰囲気にしました。 また、「トップに戻る」画像にも丸いフォルムの風船をIllustratorで制作し配置しました。
「トップへ戻る」 - トップページ上部にある文字(子供が安心して…の部分)に、白の背景を入れ輪郭を動かすアニメーションを加えています。 子供たちの写真を随所に散りばめることにより、普段の日常生活の様子を想像しやすいレイアウトとなっています。
- ― 情報設計 ―
- 忙しい中で、他保育園との比較をするユーザーにとって、目的のページにたどり着きやすい動線を意識しました。
また、お問い合わせの「電話」のラジオボタンをクリックすると時間を選べるドロップダウンリストが出てくる仕組みによって、ユーザビリティを考慮した構成となっています。
スマートフォンでの閲覧が多いことを想定し、レスポンシブのレイアウトも見やすい配置に整えました。 - 制作期間
- 企画 1日
- ワイヤーフレーム 2日
- デザインカンプ 5日
- コーディング 20日
- 使用ソフト
- Adobe Illustrator/Photoshop/XD/VScode

ための風船画像








