アイスランドを愛するひとたちが思いを込めたアイスランドの魅力を伝えるウェブサイト
たくさんの魅力が詰め込まれたウェブサイト
今回ご紹介するのは、アイスランドをテーマにしたウェブサイトで、たくさんの画像や文章によってアイスランドの魅力を惜しげもなく詰め込んだ内容となっています。
私はアイスランドについてオーロラが観測できる、くらいのかなりざっくりとした理解しかなかったのですが、豊かで壮大な自然を中心にした、アイスランドの魅力が強く伝わってくるサイトですね。
特徴的な部分がかなりいろいろある、非常に手の込んだ作りのサイトになっており、WebGL による演出だけでなく様々なポイントに注目したい、そんなサイトです。
二次元的な WebGL の活用と DOM の動く様子がすごい
今回のサイトの一番の特徴は、DOM がどんなふうにサイトを構成しているのか……ということになるような気がします。
もちろん、WebGL を使ったこだわりのビジュアルというのは用意されているのですが、それはあくまでも脇役的な位置付けになっているように見えますね。
スクロールしたり、あるいはリンクをクリックしたときの、そのシーン遷移というかページの切り替わりのトランジションがすごく見事なんですよね……
それこそ WebGL のことを意識するのを忘れてしまうほど、見事な DOM 制御だと思います。
どうですか、この大迫力の映像。
もうこれだけで圧倒されそうになってしまうのですが、このような迫力満点のアイスランドの美しい光景の写真が、このサイトにはたくさん用意されています。
また CSS 芸とでもいいましょうか、先ほども書いたように WebGL とは直接関係ない部分の実装レベルが半端ではなく、まあとにかくありとあらゆるものが非常に滑らかに動きます。
WebGL の利用されている場所は、実は結構いろいろあり、特に、上のキャプチャ画像のように見えている部分も、画像ファイルが置かれているというわけではなくてレンダリングされたものですね。
その上にはパーティクルがふわふわ漂うようになっていて、非常にさりげない感じではあるのですが、幻想的な雰囲気の底上げに一役買っています。
また、この上の画像は、ちょっとこの様子だけを見せられるとわかりにくいかもしれないのですが……
左側に見えている青い色の風景の部分が、ノイズによって歪められたようになって波打っています。あまり見かけないタイプの、グリッチとホワイトノイズの混合技みたいな感じの演出ですね。
もともとは鮮明な画像だったものが、DOM などのアニメーションと同時に若干ノイズで荒れたような感じになるのですが、ガラリと印象が変わる様子がとても面白いです。
このサイト内で見られるアニメーションはどれもかなり緩慢な動きになるよう調整されているようで、WebGL によるエフェクトも、ゆっくりとした、しかしいかにも印象的な感じに仕上げられているように感じました。
ノイズが掛かった様子は静止画ではわかりにくいのでぜひ実物をご覧いただくことをおすすめします。
オーロラが見られるということからもわかると思いますが、アイスランドは非常に厳しい自然がすぐそこに広がる、日本とはまったく気候の異なる地域です。
しかし写真を通して垣間見えるものだけでも、その厳しいながらもものすごい迫力を持った自然の姿に、圧倒されそうになりますね。
今回のサイトのアニメーションが全体的にゆったりとした動きになっているのも、なんだかお国柄というか、アイスランドという風土に近い雰囲気を演出するひとつの要素のようにも感じます。
とにかく WebGL 以外の部分も含めて、本当に丁寧に、愛情込めてつくられたサイトという感じです。
ぜひチェックしてみてください。
