「電音部」公式サイトの制作を担当いたしました。

電音部のテーマ「ダンスミュージック」を音でもビジュアルでも楽しめる！！

バンダイナムコエンターテインメントが送るダンスミュージックをテーマにした音楽原作キャラクタープロジェクト「電音部」。その世界観を最大限に体感できるように、本サイトは音で遊べる要素を盛り込みました！

▼ 動作イメージはツイートでの報告から

https://t.co/m352pw1kMh pic.twitter.com/FgWbwTTjsA

— junni (@junni_jp) 2020年6月30日

アクセスするとSOUNDのON/OFFボタンが登場。ONにして Moe Shopさんの「good night baby (feat. Moe Shop)」がBGMとして流れると、背景のビル群にサウンドメーターが浮かび上がりビートを刻みます。

BGMの再生のON/OFFの切り替えは、下層ページでも可能。本物のミュージックプレーヤーのように楽曲名をテロップで流れるよう工夫しました。

近未来の世界に入り込んだように、３D空間で各エリアを巡れる！

「電音部」が描く近未来の世界を表現するために、３Dモデルでシブヤ、アキバなどのエリアをWebGLで表現。エリアを切り替えながらキャラクターの紹介を楽しめます！さらに、PCだけでなくスマートフォンでもなめらかにコンテンツを閲覧できるように実装を行いました。

各ビルなどのモデリングやその制御などもあわせて実装を行っております。

キャラクター紹介ページでは、アートワークの切り替えを気持ちよく

アキバ、ハラジュク、アザブ、シブヤと4エリアのチームが登場する電音部。
キャラクター紹介ページでは、各校のロゴをオンマウスまたはクリックすると、そのエリアのアートワークに切り替わり、エリアごとの特色を楽しみながらキャラクター紹介へと移行できます。BGM再生からWebGLの3D空間の演出、そしてキャラクターページへの切り替えまでスマートフォンでも快適に体験できるよう徹底的に軽量化もしています！

まだまだプロジェクトははじまったばかりです。今後も電音部サイトを盛り上げていきますので、ぜひご期待ください。

©BANDAI NAMCO Entertainment Inc.
電音部 公式サイト