角川ドワンゴ学園様からのご依頼で、「N高S高N中等部文化祭2021 」通称「磁石祭」
その中核となる文化祭サイトを担当いたしました。

学園らしい文化祭サイトを目指して

生徒数が合計で2万人近く在籍する、N高S高N中等部の今回の文化祭は、完全オンラインでの実施となりました。学校の運営サイドの方々と共に文化祭の賑わいと訪れた方も一体になれるサイトを目指しました。

３Dオブジェクトによる学園生活の表現

学園の普段の活動と賑わいを連想させる、15種類のモチーフを３Dオブジェクトで表現しています。デフォルメしたポップで親しみのあるスタイル、そして色味にこだわってデザイン・モデリングしました。このオブジェクトはサイトを特徴づけるパーツとなります。

文化祭の活気が伝わるデザイン、世界観をより深めるWebGLによる演出

鮮やかな色使い、周りに浮かんでいる3Dオブジェクト、混ざり合う背景のグラデーション、さらに催事で用いられるような、縦型のタペストリーをイメージしたパーツで文化祭の賑わいを表現しました。また、各企画のサムネイルに設置された、ハート形のボタンは、続けて押したくなるようにアニメーション演出を施しています。

そして、WebGLで世界観に奥行きを与える演出を加えています。15点の3Dオブジェクトは質感、色味にこだわり、最適なものをバランスよく配置。ページのスクロールに合わせてオブジェクトがコンテンツを中心に回転しながら上下に柔らかく浮遊します。この回転の演出は遠近感を生み出すため、オブジェクトが近くなるほど、一眼レフカメラのようなボケの表現を付けています。また、各画面解像度に対応した細かな調整や描画コストの軽量化を行うことでサイト表示のパフォーマンスを高めました。
 

数多くの企画が目に留まる工夫とレスポンシブ対応

生徒の企画が埋もれず、なるべく多くの人の目に留まるために２つの工夫を施しています。１つ目は企画をランダムに配置することで見るたびにページ内に変化をもたせました。２つ目は企画をタグでカテゴリ別に絞り込めるようにしてジャンルごとに探しやすくしています。

そして、どのような端末でも視認性高く閲覧できるよう、サイズの違うブラウザ、様々なスマートフォンを想定したレスポンシブ対応をしています。

通称「磁石祭」の「生徒みんなが、色々な人を引き寄せる祭り」という思いが感じられる、
文化祭の楽しさや賑わい、訪れた方との一体感のあるサイトになりました。
是非ご覧ください！

学校法人角川ドワンゴ学園
© KADOKAWA DWANGO educational institute

「N高S高N中等部文化祭2021」はこちら