探究学習塾様| コーポレートサイト新規制作
キャッチコピー 「教育×エンタメ」で探究心を加速させる。 ワクワクと信頼感が共存する、プレゼン教育の拠点を構築。
プロジェクト概要 「プレゼンを日本中に流行らせる」をミッションに掲げ、探究教育イベントや出張授業を展開する「小川探究」様の公式Webサイトを制作しました。 単なる教育サービスにとどまらず、エンターテインメント性を融合させた独自のブランド世界観をWeb上で表現。学校関係者や企業、保護者の方々に対し、事業内容を直感的に伝え、お問い合わせやイベント参加につなげることを目的としています。
制作のポイント・こだわり
- キャラクターと世界観をリンクさせた「海」のデザイン メインキャラクターである「オルカ船長(シャチ)」に合わせ、サイト全体のモチーフを「海」に設定。 学びの深さを連想させるディープブルーと、子供たちの快活さを表すライトブルーを基調に配色を設計しました。教育の信頼性を担保しつつ、冒険に出かけるようなワクワク感のあるビジュアルを目指しています。
- 没入感を高めるアニメーション演出 「海の中」というコンセプトを体感できるよう、動きの実装にもこだわりました。
- スクロール連動: スクロールに合わせて要素が浮かび上がる動きを取り入れ、海を潜っていく/泳いでいくような深度や浮遊感を表現。
- パーティクル表現: JavaScriptライブラリを使用し、背景に「泡」が立ち上る演出を実装。 視覚的な楽しさを加えつつ、コンテンツの閲覧を邪魔しない絶妙なバランスで調整し、静的な情報サイトにはない「生きたWebサイト」として印象付けました。
- 多岐にわたる事業の整理と導線設計 「書籍」「イベント(プレラボ杯)」「出張授業」「グッズ」という異なる性質のサービスを、トップページで明確にカテゴリ分けしました。ユーザーが目的のページへ迷わず辿り着けるようナビゲーションを整理し、各サービス詳細からお問い合わせへの導線を確保しています。
- 運用性を考慮したCMS構築 イベント情報や活動レポートをクライアント様側でタイムリーに発信できるよう、WordPressを導入。「プレラボ杯」の開催告知や日々の活動記録を容易に更新できる設計にしました。
使用ツール・技術
- Design: Figma / Adobe Illustrator
- Coding: HTML5 / CSS3 (Sass) / JavaScript (Animation Libraries)
- CMS: WordPress
- Responsive: スマートフォン・タブレット・PC完全対応
担当範囲
- 企画・構成 / UI・UXデザイン
- フロントエンド実装(アニメーション演出含む)
- CMS構築
- サーバー・ドメイン設定