フランスのミステリードラマ Witnesses のプロモーションサイトは WebGL を効果的に利用した謎解きコンテンツ!
フランステレビシリーズ Witnesses
今回ご紹介するのは、フランスのテレビドラマ The Witnesses の特設サイトです。
このドラマについては正直なにも知らないのですが、サイコスリラーふうの暗い雰囲気がよく伝わってくるなかなかいいサイトに仕上がっていると思います。
ちょっとした謎解きの要素なんかもあり、面白いです。
キーアイテムをすべて見つけることができるか
このドラマは、とあるモデルハウスで殺人事件が起こるところから始まるみたいですね。
トレイラームービーを見た感じだと、結構エグい表現も出てくるサイコホラーとかサイコミステリーというジャンルになるんじゃないかと思います。
主人公側の主要なメンバーは、たぶん捜査官かなにかだと思うんですが、三人いるみたいです。キャラクターの部分にフォーカスを当てるとそれぞれのキャラクターについての説明文が出ます。
背景は全方位パノラマ撮影したような一枚のテクスチャをマッピングして表現しているようで、マウスでドラッグすると自由に眺める方向を変えることができます。
視線を動かすときには、まるで視界がぼやけたかのように背景がダブって見えるような演出が入っていて、芸が細かいです。
また、このシーンのなかには全部で五つのキーアイテムが仕込まれていて、すごく目立つものから、これ明らかに嫌がらせだろというレベルの見つけにくいものまであります。
これらのアイテムは背景のなかで時折、キラリと光る演出が掛かっているので頑張って探してみてください。全部見つけるのに 5 分くらい掛かりました……
アイテムを見つけることができると、それがクローズアップされて 3D モデルで表示されます。これがどういう意味のキーアイテムなのかはわかりませんが、なんかドラマのなかで重要なファクターになるんでしょうね。
全体になかなか凝った作りになっていて、謎解きなどのちょっとした遊び心が仕込まれているあたり面白いなあと思います。実装的には three.js をベースに、DOM や CSS を駆使して表現していますね。最近はこういう three.js + CSS みたいなサイトが本当に増えてきましたね。
ドラマの制作された背景や出演者たちへの予備知識がないので、そういう意味ではあまり没入できないかもしれませんが、サイトとしては非常に面白いのでぜひチェックしてみてください。