まるでセンシングを行っているかのようなビジュアルがおもしろい U x Machina のウェブサイト
世界観がしっかりしている
今回ご紹介するのは、U x Machina というスタジオのウェブサイトです。
カメラで撮影した映像に、リアルタイムにセンシングを行っているかのような不思議な表現を中心に、さまざまなインタラクションが実装されたウェブサイトです。
サイト全体としてのデザインに WebGL の実装が見事にマッチしています。
リンク：
U x Machina | Crafting Human-Machine Interactions
工夫たっぷりのインタラクション
今回のサイトのトップページは、U x Machina というスタジオの名前を模したものです。
3D のオブジェクトとして描かれているスフィアとパイプを組み合わせたような構造物が、アルファベットの x を表しているみたいですね。
このオブジェクトが形を変えながら生き生きと動きます。
スクリーンショットではちょっとわかりにくいかもしれませんが、画面上には絶えずセンサーがなにかを捉えたかのように、スコープやラインが現れます。
このような表現がなにを意図したものなのか、わたしには完全には読み解けていないかもしれませんが、細部にまでしっかりと分析や解釈を重ねていく、そんな姿勢が体現されているようにも感じます。
スタジオに所属するメンバー（たぶん二人？）の紹介がされるセクションにも、デザインとしてのなにか通底する雰囲気がしっかりと貫かれています。
今回のサイトの特徴として、あまりほかでは見かけない個性的なインタラクションがあるように感じました。
特に、トップページをスクロールしていくと最後のほうに出てくる、カーソルを動かすとインタラクティブに線が引かれる表現とかは本当におもしろいですね。
スフィアとスフィアの間に物理的に紐が結ばれていくような感じの独特な触り心地があり、こういう手触りを想起させるような実装にはやっぱり感激してしまいますね。
WebGL の実装部分を中心に見てきましたが、今回のサイトの場合は全体としての完成度の高さもかなりハッキリと感じることができます。
インタラクティブな要素は WebGL の実装に限らず、CSS を駆使したものもすごくこだわって作り込まれている感じがあります。
テーマカラーやコンセプトも統一感があり、スタジオのウェブサイトとして主張したいことがかなりしっかり表れていると思いました。
ぜひチェックしてみてください。
