アートパネルの展示に加え実物を購入することも可能! ヨッキューくん ギャラリー がおもしろい
ほぼすべてのインターフェースに WebGL が関連する
今回ご紹介するのは、@igaryon0809 さんが公開しているウェブ漫画、ヨッキューくんに関連したウェブサイトで、アートパネルの展示されたバーチャルギャラリーサイトです。
アートパネル、というのは木のパネルにアクリルガッシュなどの画材でイラストを描いたもののようで、それらが展示されたギャラリー風の場面が WebGL によって描かれます。
アートパネルは実物を購入することもできるようですし、ヨッキューくんの漫画を読むための導線などもギャラリー内に配置されています。
リンク:
タッチ操作を意識したコントローラーがおもしろい
今回のサイトは PC だけでなくモバイル端末などのタッチ系デバイスでの閲覧も考慮し、独自のコントローラーのインターフェースが画面内に置かれています。
視線を左右に振るためのボタンと、視点自体を平行移動させるためのジョイスティック風のボタンがあります。
操作感はとてもなめらかで心地よくレスポンスを返してくれますので、慣れれば操作はそれほど難しくなく、かなり直感的に操作可能だと思います。
ギャラリーの壁には、ヨッキューくんのアートパネルが展示されており、それぞれなにかしらの「欲求」をテーマにしてデザインされています。
アートパネルのそばに置かれている冊子の部分をクリックすれば、当該の欲求をテーマにした漫画の回を読むこともできるようになっています。
アートパネルと漫画の作品が実際にギャラリー内に展示されていて、冊子をおもむろに手に取って読み始めるような、そんな雰囲気を体感することができます。
カメラが微妙に揺れている感じや、移動しているときの動き方なども没入感がより高まるように工夫されていますね。
アートパネル部分をクリックすると、その詳細情報を見ることができます。
実際にオフラインで展示したこともあるのか、具体的なアートパネルの大きさなども「詳しく」と書かれたボタンから確認することができます。
サイト全体のデザインも見事ですが、3D 表示が非常にこなれていて、ぐいぐいと思った通りに操作できる感じがすごくいいですね。
かなりいろんな種類の欲求が作品として展示されているので、時間のあるときにゆったりとギャラリーを巡るような気持ちで眺めてみるのがよいかもしれません。
今回のサイトを実装された @ryuU213 さんは、デザインの一部、フロントエンド、バックエンド、それらすべての実装作業を一人で行っているらしく、単純にそのフルスタックな感じに驚きます。
また、途中でも書いたように 3D コンテンツとしてのインターフェースデザインが非常によくできていて、イージングの掛け方やカメラワークといった 3D 特有の心地よさの追求みたいな部分にもこだわりを感じます。
ヨッキューくんというコンテンツ自体の魅力を損なうこと無く、見事に立体化しつつ1つの体験として提供できていると思います。
ぜひチェックしてみてください。