【スタディ】イケてるキッズ・子ども系のWebデザインまとめ
![キッズ系Webデザイン](https://edge.sincar.jp/wp/wp-content/uploads/2015/07/kids-mv.jpg)
保育所や幼稚園、写真スタジオなど子ども向けサービスのWebデザインについて調べてみましたのでご紹介します。
保育所や幼稚園、近頃では子ども園というものもあるようですが、そのような小さな子どもを対象にした施設・サービスのWebデザインについて調べてみました。
まさに幼稚園サイトをデザインする方や、勉強中の方の参考になればうれしいです。
小浜こども園
![](https://edge.sincar.jp/wp/wp-content/uploads/2015/07/kids-obama.jpg)
メインビジュアルが、まるでテントやステージのようにデザインされており、子どもたちの発表会でも見ているようなイメージに仕上がっています。
ナビゲーションのアイコンはもちろん、中央付近の緑地帯のような背景やフッタの波模様など随所にかわいい演出がされており、楽しい園生活がイメージできそうです。見出し、イラスト、リンクなどなど色数も多いですが、ごちゃごちゃ見えずにまとまっている点などは特に見習いたいところです。
![](https://edge.sincar.jp/wp/wp-content/uploads/2015/07/kids-obama-s1.jpg)
年齢ごとにそれぞれテーマに沿った色とクラス名があるようですが、単に「花」や「山」というだけではなく、コンセプトにあわせたパターンがデザインされています。
実際どこまで活用されているかはわかりませんが、子どもたちの創造性も豊かになりそうです。
![](https://edge.sincar.jp/wp/wp-content/uploads/2015/07/kids-obama-s2.jpg)
文字のジャンプ率でメリハリをつけたり、各時間単位を斜めに並べて動きを出したりと、単調にならない工夫が好印象です。
右上の時計のイラストも、時間の流れを感じさせつつ楽しさも演出できていていいですね。
フォトハウス ハピスタ
![](https://edge.sincar.jp/wp/wp-content/uploads/2015/07/kids-hapista.jpg)
全体はモノクロ、写真だけがカラーであることで自然と写真に目が留まります。また、一つひとつの要素に手書き感が溢れ、細かなイラストが効果的に配置されるなど凝ったつくりになっています。
ビジュアルのビビッドなカラーもアクセントとして効いていますね!
![](https://edge.sincar.jp/wp/wp-content/uploads/2015/07/kids-hapista-s.jpg)
一文字ひともじ書体を変えて遊んでみたり、手書き感のある処理を加えてみたり。
全体としてはシンプルでありながらも独自の世界観が表現されています。
教学寺幼稚園
![](https://edge.sincar.jp/wp/wp-content/uploads/2015/07/kids-kyogakuji.jpg)
ゆるーいイラストとやさしいカラーリングで、子どもらしいかわいさが表現されています。サイトIDを手書き風のひらがなにしているのも潔く、個人的には好感度が高いです。
![](https://edge.sincar.jp/wp/wp-content/uploads/2015/07/kids-kyogakuji-s.jpg)
ナビゲーションのサブメニューやページトップへのリンクなど、細かいギミックで楽しい演出がされています。
フッタのキャラクターにオンマウスすると振り向いてくれるという隠れギミックも面白いですね!
Kids Planet
![](https://edge.sincar.jp/wp/wp-content/uploads/2015/07/kids-kidsplanet.jpg)
明るくやさしい色使いで、メインビジュアルからグローバルナビゲーションに至るカーブが印象的です。
また、ビジュアル1枚目には、子どもがおもちゃの文字を並べたようにカラフルな「KIDS PLANET」とある点も工夫が感じられます。街の中心にあることも考慮してか、かわいいカラーリングの中にも都会的な清潔感が感じられます。
![](https://edge.sincar.jp/wp/wp-content/uploads/2015/07/kids-kidsplanet-s.jpg)
子どもらしいかわいいイラストを交え、1日の過ごし方が紹介されていますが、時計の使い方がうまいですね。また、すぐ横にさりげなく年間行事について触れられていますが、少ないスペースながら楽しくまとめられています。
その他の子ども向けサイト
押原こども園
![](https://edge.sincar.jp/wp/wp-content/uploads/2015/07/kids-oshihara.jpg)
園の基本方針「SMILE FOR PEOPLE」が押しつけがましくなく、楽しくあしらわれているのが印象的です。
単調になりがちな「施設案内」ページを、わかりやすく、楽しく見せている点はとても参考になるのではないでしょうか。
国分幼稚園
![](https://edge.sincar.jp/wp/wp-content/uploads/2015/07/kids-kokubu.jpg)
今回ピックアップした中では最も要素が詰まった印象にはなっていますが、その分、内容も充実しているように思います。
![](https://edge.sincar.jp/wp/wp-content/uploads/2015/07/kids-kokubu-s.jpg)
淡々としている面もありますが、写真やバナーなどちょっとした処理が面白かったりします。
たかみ幼稚園
![](https://edge.sincar.jp/wp/wp-content/uploads/2015/07/kids-takami.jpg)
やさしい色使いとお家のようなコンテンツエリアのデザインが印象的です。
園舎のものと統一されているフラットで素朴なイラストも、子どもが喜びそうないい雰囲気ですね。
まとめ
どのサイトも子どもらしいかわいさに工夫が凝らされており、とても勉強になります。同時に、親御さんが安心できる伝え方や情報の豊富さなど、ある意味かわいさと相反する要素をまとめる力量が求められるカテゴリーであるともいえそうです。
クリニック・医院系のWebデザインについて調べた記事もあわせてどうぞ。