
表情豊かなパーティクルを盛り込んだ 3D 表現がおもしろい住友金属鉱山株式会社のスペシャルサイト
リッチな表現だけじゃない
今回ご紹介するのは、住友金属鉱山株式会社が公開しているスペシャルサイトです。
サイト内を読んだ感じ、同社が展開する SOLAMENT という素材を起点としつつ、絶滅危惧の状態にある地場の野菜や、それを生産する農家さんたち、またそれらを取り巻く食文化などを広く救っていこうというのがテーマのウェブサイト・プロジェクトのようですね。
言葉で説明するとどうしても長くなっちゃうのですが、ビジュアルやインタラクションを駆使してプロジェクトの背景や思いが上手に可視化されたウェブサイトとなっています。
リンク:
絶滅危惧野菜を救え by SOLAMENT® | 住友金属鉱山株式会社
メッシュとパーティクルの融合
今回のサイトでは、ページが表示された直後から 3D シーンが表現上の大きな役割を担っています。
話題の核心である絶滅危惧野菜と呼ばれる野菜たちが 3D で再現され、カーソルを添わせるとパーティクルが溢れ出すような表現が見られます。
触ると簡単に崩れてしまうような危うさがこういうふうに表現されているというのはなんとも興味深いです。

これ静止画ではちょっと伝わりにくいかもしれないのですが、画面の中央あたりにある赤いカブ(杉箸アカカンバ)の表面にはポッカリと穴があき、パーティクルが流れ出すようにして漂っています。
パーティクルって CG の世界ではよく華やかさとか幻想的な雰囲気の演出に用いられますが、こういう「脆さ・儚さ」みたいなかたちで使われているのは珍しいケースだなと感じました。すごく、印象的な演出ですよね。
サイトをスクロールしていくとパーティクルは次々に姿や色を変えていき、ひとつのストーリーとして演出されています。

また、今回のサイトでは CG でビジュアルをかっこよく見せようという部分よりも、3D を使うことでより効果的にメッセージを伝えようとしている、という感じがします。
生産者さんにフォーカスしたコンテンツがあったり、マッチングマップのようなちょっと変わったコンテンツがあったり……
いろいろな工夫によって閲覧者自身がこの問題を身近に感じられるようにしているのでしょうね。


WebGL を使ってなにかを表現する場合に限らないと思いますが、そもそもウェブサイトには実現したいゴールや伝えたいメッセージがあって、そのうえでどんな演出や見せ方をするべきかが検討されると思います。
今回のサイトの場合、まず文脈としてある程度フォトリアルな質感と流れるようなパーティクルを共存させる必要があり、それを高い技術で実現しつつ全体としてまとめたような印象を受けました。
たぶん、パフォーマンスを最適化するなどいろいろ泥臭いこともしているんだと思いますが、そういうところも含めて高い完成度を持った事例だと思います。
ぜひチェックしてみてください。