立体的な構造として見せることでその性能をわかりやすく示した Lightweight のウェブサイト
シンプルで力強い
今回ご紹介するのは Lightweight という自転車のホイールを製造しているメーカーのウェブサイトです。
わたしは競技用の自転車などにまったく詳しくないのですが、ドイツのこのメーカーはヨーロッパにかなりの数のディーラーを展開しているようなので有名なブランド・メーカーなのかもしれません。
シックで落ち着いた感じのデザインですが、そういった雰囲気のなかにも力強さみたいなものがあるような気がします。
リンク：
画像や映像もすごくいい
今回のサイトの WebGL 実装は、トップページから始まる一連の演出にのみ用いられています。
サイト内のいろんな要素が WebGL で装飾されているタイプとは異なり、より印象的に見せたい場面でのみ限定的に WebGL を使っている感じですね。
自転車のホイールというと、一般人の感覚ではなかなかどんな違いがあるのか想像しにくい場合も多いかと思いますが、立体的なインタラクティブなビジュアルとして見てみるとすごく説得力があります。
わたしはデザインのことはよくわからないですが、サイト内に多く配置されている十字のアイコンやラインなども、このサイトの雰囲気を作るうえで重要な役割を担っている感じがします。
なにかこう、精密な設計図のようなものを想起させる感じがあって、すごくかっこいいんですよね。
あえて色彩やトーンを抑えているのがなんともいい感じです。
WebGL の実装では、スクロールしながらセクションが変化していくタイミングで、3D の構造がシンクロするように変化します。
ホイールの内側ってこんなふうになってるんだ、と純粋に興味深く見てしまいます。
また今回のサイトでは多くの写真や映像が使われていますが、それらの品質もすごく高いように感じます。
なんかよくわからないしうまく言語化できないけど、ドイツらしい感じがすると言うか、日本人の持つ職人的なマインドに近いものを感じるウェブサイトだと思いました。
今回のサイトに限った話ではありませんが、立体的な構造をどういうふうにユーザーに提示すればいいのか、というのはなかなか難しいテーマです。
単純にインタラクティブな WebGL で実装すればそれが確実に正解ということもないでしょうし、場合によっては写真や映像のほうがわかりやすく伝わることも多いはずです。
今回のサイトの場合は WebGL によって構造をわかりやすく提示するという目的も多少はあるのでしょうが、サイト全体としての雰囲気にマッチするビジュアルを考えたときに、WebGL を用いるという選択があったのではないかなと想像しました。
ぜひチェックしてみてください。
