SHIBATA KAITO

← トップ / Works

Personal Works

架空の保育園「すこやか保育園」Webサイトデザイン

「新しい園児の入園につなげること」を目的に、架空の保育園のホームページをデザインしました。自然との触れ合いを通した教育や、子ども同士のコミュニケーションを大切にする園の方針をもとに、サイトのデザインとロゴを制作しています。

すこやか保育園 トップページ(PC)のファーストビュー:園児の写真と手書き風ロゴ
担当範囲
  • Webサイトのデザイン(PC・SP)
  • ロゴ制作
制作期間
デザイン構築 4日
使用ツール
  • デザインPhotoshop / Illustrator / XD
種別
個人制作
(架空の保育園)

概要

架空の「すこやか保育園」のホームページをデザインしました。「新しい園児の入園につなげること」を目的としたサイトです。

自然との触れ合いを通した教育や、子ども同士のコミュニケーションを大切にする方針の保育園を想定し、サイトのデザインとロゴの作成を行いました。

ターゲット

  • 現在、すこやか保育園に通われている保護者様
  • すこやか保育園の入園を検討されている保護者様(とくにお母様方)

デザインの意図

サイト訪問から入園につなげるには、「うちの子を預けても大丈夫か」という安心感を持ってもらうことが大切だと考えました。そのため、園児や園内の様子が伝わる写真を選び、ページ全体に多く取り入れています。

あわせて、入園後のワクワク感や楽しさを伝えるキャッチーなデザインにしつつ、「自然との触れ合いを通した教育」という園の方針を意識し、自然を感じさせるモチーフと色づかいでまとめました。

デザイン上の工夫

  • 安心感ファーストビューをはじめ、園児や園内の様子が伝わる写真を大きく配置し、園の雰囲気がそのまま伝わる構成にしました。
  • 楽しさ手書き風の見出し文字、丸く切り抜いた写真、ポラロイド風の写真フレームで、親しみやすく楽しい印象を演出しました。
  • 自然野菜や土、草花のイラストと、緑・オレンジ・茶を基調とした配色で、自然に触れながら育つ園の方針を表現しました。
  • 導線「園の紹介」「園の取り組み」「お知らせ一覧」へのボタンを各セクションの終わりに配置し、次に見たい情報へ迷わず進めるようにしました。
  • ロゴ木をモチーフにしたシンボルと、やわらかい手書き風の文字を組み合わせたロゴを制作しました。

デザインカンプ

枠内をスクロールすると、ページ全体を確認できます

すこやか保育園 トップページ PCデザイン全体:園の紹介、取り組み、お知らせ、フッターまでの構成
PC:トップページ(幅1920px)
すこやか保育園 トップページ SPデザイン全体:縦1列に再構成したレイアウト
SP:トップページ(幅720px)