保育園のTOPページ・ロゴ・イラスト

自然に囲まれた保育園をイメージしてロゴ・TOPページのデザイン・イラストの制作を行いました！
どんな保育園なのかを想定し、競合サイトのリサーチやターゲットを決めるなどして取り組んでいます。

ロゴのデザイン

森の子保育園のロゴ

森の中にある小さな保育園というイメージで、保育園の名前から考えました。

自然とふれあいながら木々のようにすくすく育つこどもたちをイメージし、こどもの手が芽に触れようとしている様子をイメージしたシンボルマークに。
漢字のなかにある点を、葉に見立てて自然を表現しています。

ロゴのラフスケッチは紙と鉛筆で行いました。
その中から選抜したラフをIllustratorで制作、そこからさらに候補を絞ってこちらのロゴの清書しています。

Webサイトの顔となるTOPページデザイン。
「わくわく感」「安心感」を大切に、楽しいデザインを目指しました。

スマホ、タブレット、PC、それぞれの環境できちんと見やすいようにレイアウトの調整をしました。
写真の色味調整にはPhotoshop、サイトのデザインカンプにはXDを使用しています。

森の子保育園のWebサイトは、ロゴに使用したグリーンをポイントカラーに、全体としてはふわっと柔らかいカラフルな配色。
背景はひだまりのような温かいイエローにしています。

森の子保育園が「Webサイトを制作する理由、目的」を仮説することで、よりWebサイトに必要な要素などが浮かび上がってきました。

保育園のWebサイトをいくつか拝見していくと、北欧テイストのイラストや水彩タッチのイラストなど優しい印象のある手描き風のイメージが印象的でした。

森の子保育園のデザインでは、アイコンやページ内の装飾は、ページ内で統一感がでるように色鉛筆タッチで統一しています。

これからこどもを保育園に預けたいと考えている保護者や、働くことを検討している方に、安心感を持ってもらえるよう、ぬくもりのある配色、絵本のような優しいタッチになるよう心がけました。

イラストはiPadで描いています。
使用ツールは、Adobe Frescoです。

ポートフォリオサイトのデザインが一段落したら、いよいよ作品を公開…ということで、サンプルとなってくれる作品づくりに取りかかりました。

私は「何ができるのか」「何が得意なのか」を伝えることを目標に、今回は自分の好きな雰囲気ややりたいと思っていることを活かしたデザインを思いきってみました。

サンプルのサイトとして保育園を選んだ理由は以下の2つです。

・保育園のWebサイトに得意なイラストのテイストがマッチすると感じたこと
・こどもに関するデザインのお仕事に関わってみたいと思っている

見に来てくださった方に「どんなWebサイトのデザインができるか」Webサイトのイメージをよりわかりやすく届けられたら、という思いも込めて制作しています。

はじめは、ファーストビューのデザインのみで完成させるつもりでスタートしました。
ファーストビューは、Webサイトの中でも特に印象を引っ張ってくれるインパクトの強い存在なので短期間でWebサイトの雰囲気を伝えられるんじゃないかな、と考えたからです。

だけど、いざファーストビューのデザインのみを制作してみると「なんだかWebサイト全体のイメージが伝わりにくいかも…」と感じました。

今回デザインをしていくにあたっての目的は、私が「どんなデザインができるのか」わかりやすく伝えたいということ。
思い切ってTOPページを作る方向で仕切り直しました。

たくさんのWebサイトのモックアップを並べて公開するなど、場面によってはファーストビューのみをつくるという選択をするかもしれません。
目的に沿ったデザインの見せ方や手段を柔軟に選択できるようになれたらいいな、なんて思っています。

長くなりましたが、ここまで目を通してくださりありがとうございます！

プロジェクト	森の子保育園
作業内容	ロゴデザイン、イラスト、Webサイトデザイン（TOPページ）
使用ツール	Illustrator Adobe Fresco XD
製作期間	1ヶ月