黒をベースにしつつさまざまな工夫を凝らして世界観を構築した Cosmos Studio のウェブサイト

doxas : 2024-10-28 12:20:44

若干 CPU 負荷は高そう

今回ご紹介するのは、Cosmos Studio というスタジオのウェブサイトです。

UI/UX からブランディングまで、トータルにデザインを手掛けている制作スタジオなのかなと想像します。

スタジオの名前にもある Cosmos という言葉から連想しやすい、宇宙をテーマにしたような個性的なウェブサイトとなっており、WebGL も活用しながら独自の世界観を描いています。

今回のサイトはビジュアルの根幹的なテーマに宇宙を据えつつも、どこかポップで楽しい、おもしろい見せ方をいろいろ盛り込んでいます。

宇宙がテーマだったりすると、どこか荘厳でクラシカルな見せ方をすることが多いような気がするのですが、楽しげなトーンで演出されているのはちょっと独特な感じがします。

トップページの冒頭、最初に表示される宇宙服姿のキャラクターが、サイト内のいたるところで登場します。

宇宙服姿と言っても、現代の実際に存在する宇宙服よりはかなり未来的なデザインのキャラクターになっています。

スクロール操作を行うと、キャラクターが手にしているラップトップを覗き込むようにカメラが動くような場面もあり、3D シーンもダイナミックで視覚効果が大きいです。

背景を含め、3D モデルはモノクロのトーンで描かれているので、だからこそ各事例のスクリーンショットのカラフルなサムネイルが強調されて目に映ります。

ウェブサイト内は、スクロールすることで次々と各セクションを巡っていくことができるような構造です。

なんとなく一種のストーリー仕立てになっているところもありそうで、宇宙のような壮大な世界観が上手にウェブサイトに落とし込まれている感じがします。

WebGL の技巧的なことを言うとあんまり複雑なことをやっている感じはないのですが、見せ方に工夫が感じられ、自分たちの持つアイデンティティをいかにウェブサイトに盛り込んでいくか、よく考えて作り込まれているなと個人的には思いました。

ウェブサイトを見ている印象では、若干ですが CPU 負荷が高い感じがあります。

サイト内に動く要素がたくさんあることと、単純に使っているリソースがかなりたくさんありそうなこと、そこにさらに WebGL を同時に動かしていることが関係してそうな気がしますが……

WebGL ではそんなに複雑なことはやってなさそうなので、どちらかというと、WebGL 以外の要素の多さが CPU の負担になっていそうな感じはしました。