Border

AD:PIANO V Noir

Web / Design, Develop (2017)

Diverse Systemのピアノコンピレーションアルバム、「AD:PIANO V Noir」の特設Webサイトのデザインと実装を担当した。
基本的な世界観・トンマナは前作「AD:PIANO IV Monochrome」を踏襲しつつ、シリーズ2作目ということで、物語における起承転結の「転」を意識し、転調・暗転というようなイメージでデザインと演出をおこなった。

前作「AD:PIANO IV Monochrome」と同じく、アニメーション、演出はPixiJS + GSAPで実装した。合わせてVue.jsをテンプレートエンジン的に使い、コードの記述量を抑えている。

URL

http://adp5.diverse.jp/

Design Tool

  • Photoshop

Teck Stack

  • Vue.js /
  • PixiJS /
  • GSAP