たわむようなモーションを効果的に取り入れた各種演出がおもしろい Studio K95 のウェブサイト
なにかアート的なものを感じる
今回ご紹介するのは Studio K95 というデザインスタジオのウェブサイトです。
どうやらイタリアのデザインスタジオみたいなのですが、なんというかいわゆるデジタルっぽさも残しつつ、どこかアートを連想させるような不思議な魅力のあるウェブサイトになっていますね。
WebGL を用いていくつかの演出が組み立てられています。
リンク：
Studio K95 | Brand & Digital Design Studio based in Italy
インタラクティブ性をたわみに反映
今回のサイトの WebGL 実装は大きく２つの方向性があります。
１つは、薄い板のような構造に対して、やわらかくたわむようなモーション。
そしてもう１つは、ドットを奥行き方向に引き伸ばしメタリックな質感で描画したもの。
トップページではその両者が共存した状態になっていますね。
このトップページ、円筒形のシルエットにサムネイルが並んでいるという構造ですが、この構造は比較的ウェブサイトの表現としてよく見るパターンです。
今回のサイトの場合は、背景が濃いブルーになっていること、その上に黒っぽいラインが等間隔で引かれている、というのが外見上の特徴でしょうか。この見た目がなんかデジタル方向に全振りしている感じでもなく、妙に含みのある見え方になっていておもしろいですね。
スクロール操作をすると、サムネイルが歪む現象が起こります。
この上の画像は、各事例の詳細ページの様子です。
こちらでも、スクロール操作に連動して画像が歪む演出が使われています。
普通に見ているときは単に平面的な画像のように見えているのに、スクロールに連動してごく僅かに形状が変化する、しかも派手すぎる感じでもなくほどよい温度感ですね。
すごくちょうどいい遊び心のある見せ方だと思いました。
About ページも、すごく見せ方が凝っていてかっこいいです。
ぜひ実物を見てみることをおすすめします。
今回のサイトの場合、WebGL の技術という意味ではそんなに難しいことをしているわけではないのですが、とにかく見せ方が個性的で、サイト全体としてのスタイリングともマッチしていて完成度が高く感じます。
なんとなくイタリアっぽい雰囲気を感じるのは、わたし個人の先入観のせいなのでしょうか…… すごく魅力的なサイトだと思います。
ぜひチェックしてみてください。
