シーンごとに全く異なる雰囲気を持つ空間を華麗に演出！フランスのワイナリーの美しいウェブサイト

doxas : 2019-03-19 14:34:23

透明な空気感がお見事

今回ご紹介するのは、フランスのワイナリーのウェブサイトです。

ここではいくつかの銘柄が紹介されているのですが、どのページも非常に美しい雰囲気で、なんとなく透明感のようなものが感じられるビジュアルになっています。

各シーンごとにそれぞれ異なる空間を演出していて、エフェクトやシーン遷移の際の演出も含め、非常にきれいにまとまっています。

今回のサイトでは、最初に表示されるシーンは一見すると 2D の、それこそ静止画のようにも見えます。

しかしマウスカーソルを動かしてみると、すぐにそれが立体的な 3D として描かれているということがわかると思います。

一部背景などは平面的な写真をそのまま配置しているだけに見える場所もありますが、基本的に 3D のジオメトリをレンダリングしているんじゃないかなと思います。

マウスカーソルをぐりぐり動かすのも面白いですが、画面の左右にあるナビゲーションをクリックして、別のシーンへと移動しようとすると、モヤのようなものを連想させる遷移エフェクトが発生します。

これがなかなか雰囲気がありますね。

ふたつのシーンを同時にレンダリングしつつ、シームレスにこれを合成してつなげるというなかなか派手な演出です。

やってることはいわゆる画像のトランジションと同じといえば同じですが、二種類のシーンを動的にレンダリングしながら切り替えるというのはなかなか大胆ですごいです。

また、黒い背景の Grands Crus という製品のページでは、ドライアイスから流れ出てくる白い煙のように、ノイズを使った煙のような演出も加えられています。

さらに別のシーンでは、ちょっと画像とかで見るとわかりにくいかなと思いますが、パーティクルが飛んでいるシーンもありますね。

湿地帯というか、熱帯雨林のような、神秘的な空気感がパーティクルによって上手に演出されています。

煙を出したり、パーティクルを飛ばしたりと、シーンごとの演出の強調ポイントがそれぞれに異なっている感じでよく考えられていますね。

キャプチャ画像を見てもらえればわかるとおりで、今回のサイトは FWA でも取り上げられたようです。

実際にサイトを見てみると、確かに一見して受ける印象以上に、かなりいろいろな工夫が凝らされていて、技術的な目線で見ても非常に面白いですね。

スフィアマッピングを使ったガラス瓶への映り込みや、視差を感じやすくするようなオブジェクトの配置、さらにはシーン遷移の際のノイズを活用したエフェクトなど、とにかく見どころが多くあります。