WWW.AKIRAFUKUOKA.COM BLOG

光の速さで作った光サイトです

本当はこの話を光 Advent Calendar 2014に書きたかったんですが間に合わず。毎年恒例になりつつありますが、同人音楽サークルDivese SystemからリリースされるトランスコンピレーションCD「AD: TRANCE4」の特設サイトを制作しました。スケジュール云々の都合により実質4日間くらいでメインの部分は作ったんですけど、大胆なレイアウトとエフェクトを楽しんでいただけるサイトになったんじゃないかと思っています。

テーマは “無限”

このCD、なにがすごいかって4枚組なんです。4枚といっても薄く伸ばされたものでは決してなく、ハイクオリティな楽曲が詰まりに詰まった4枚なのがすごい。ちなみにこのシリーズ前作「3」が3枚組なので一枚ずつ増えている…!! ということはCD1枚の厚みが1.2mmだからこのままシリーズが続けばAD: TRANCE 3146667にはCDを重ねた高さが富士山を超える…かはさておきやはりクオリティを維持しながらボリュームが増えていくというのはすごい話だと思うわけです。そんな無限感を安直に無限スクロールで表現しました。上下左右、どちらに進んでもOK。文字が全体的に斜めっているのは無限スクロールと相性がいいからです。あと無限スクロールはタッチ端末との相性がいいだろうなという読みもあったりします。自分で見つける、ということにコミケしかり同人しかりの醍醐味があると思いますから、この4枚組という無限に広がる広大なアルバムからあなたの好きなアーティストを見つけ出してください！

Web Audio APIとWebGL

fig.1に続き、今回もWeb Audio APIを使って音を鳴らしてます（ほんとSoundCloud貼りゃいいのにね！）。でWeb Audio API経由で波形データを読んでWebGL、というかPixi.jsに突っ込んでキラキラ光彩を背景をアニメーションさせてます。コード的にはシャイニングフォトン【滅】を継承しつつ、動きはだいぶいじってますね。本当はthree.jsを使って3Dでエフェクトを作っていこうとしてたんですが、いただいたジャケットのデザインが玉ボケ満載のきれいなイメージでしたのでエフェクトもそれに合わせました。トランスという音楽のジャンルはアッパーで高揚感のあるものですからそんな音楽性をサイトから感じてもらえたら嬉しいです。

「同人」をどう捉えるべきなのか？

自分の中にはもしこういったシーズンで行われる同人制作物がルーティーン化してしまったとしたら、という漠然とした恐怖感がありました。このCD「AD: TRANCE 4」がリリースされることがどれだけ大ごとなのか、自覚的であって欲しい、という身勝手な思いが、限界を超えてこういうサイトを作ろうという原動力になっていたように思います。Diverse Systemに関係する人たちがいかに特別なことをしているか、自覚的であってほしいし、それこそがDiverse Systemが持つブランドなんだって信じてほしいのです。だってルーティーンになった制作なんて悲しいじゃないですか。私が同人という自由、了承を得ているのに「ヘッダーにビジュアルを置いて、タイトルと値段を書いて、曲リストを置いて…はい完成！」っていうのはもったいないと思うわけですよ！一方で情報を伝える責任もあるわけで、最後まで死ぬほど悩みながら締め切りに追われる辛い思い出ばかりが残っております。もちろん微塵にもアクセシビリティが高いサイトだとは思いませんが、もしまた機会があれば両輪を成立させたようなものが作りたいとは思います。もっと豊かなクリエイティブができるんだということを信じていきたい、2014年末でありました。バカを毎度笑って許してくださっているYsK先生および関係者の皆様にごめんなさいとありがとうの気持ちを記して結びとさせていただきます。コミケ3日目 12/30(火)、東4ホール シ-80Bにみんな集合だかんね！！！！