いいなと思ったWebサイト紹介-Vol3

2020年10月08日

その他

少しブログを更新できてなかったので、またしっかり更新していきます!今回は、いいなと思ったWebサイト紹介の3回目です。いいなと思ったサイトを分析して、アニメーションなど自分のインプットにもつながるのでしっかり紹介していこうと思います。

_________🚗___________

https://bruno-simon.com/

最初に紹介するのは、海外のクリエイティブディベロッパーの方のサイトです。これに関してはもうすごいとしか言いようがないですよね。Webでここまで3Dを表現できるとは考えたこともありませんでした。WebGLを使って作っていると思います。このサイトは、キーボードで車を動かしてコンテンツを見れるようになっています。ボウリングや壊せる壁など遊べるところもかなりあって、ずっと没頭してつい動かし続けてしまいますね。下の方にあるSNSなどのリンク部分のGitHubの猫のモデルが可愛らしくて好きです。どうやって作ってるんですかね。

RINGO アイスバー | ICE BAR

https://ringo-applepie.com/lp/icebar/

続いて紹介するのは、またWebGLで作ってあるサイトになります。美味しそうなアイスのサイトみたいですね。1月前くらいなら食べたかったです。このサイトは、アイスと背景で落ちてきている氷みたいなのが3Dになっています。マウスでアイスをホバーすると、アイスがクルクル動きますね。下にスクロールしていくとアイスの形の背景で説明が書いてあります。全体を通してしっかりアイスのイメージを貫いているのはいいなと感じました。また右下のシェアのボタンもあまり見ないホバーすると上部にスッと出てくるタイプのボタンでした。こうゆうのをスマホ表示の時に取り入れてみるのもありかなと思いました。

サハルプロダクツ

https://saharu.work/index.html

柔らかく、可愛らしい印象を受けるサイトですね。メインビジュアルやプロフィール、フッター部分に3Dの岩のようなモデルを使っていて、可愛らしいというだけでなく、見る人をより楽しませるようになっています。特にフッターのアニメーションはすごいですね。また、流動シェイプの丸っこい部分をマウスでホバーすると、少しだけ動いたりして細かい部分にも気を遣ってこだわっているなと感じました。

まとめ

今回はWebGLを使っている立体的なWebサイトを重点的に紹介してみました。WebGLの技術的な部分はほとんど何も知りませんが、ここまでWeb上でできちゃうというのはとても魅力的ですよね。面白そうですしどこかで触ってみたいです。サイトを紹介していくことで自分自身の勉強にもなりますし、シンプルにいろんなサイトを見るというのは楽しいのでまた記事にまとめていこうと思います。

Pocket

related

2月の自己評価と3月に向けて

少し前まで1月が終わって2月になったばかりだと思っていたらいつの間に2月の末になってしまいました。時間が流れるのが最近早い気がしてきました。1月の末に書いた記事と同じように2月の自己評価と3月に向けて

その他

2020.02.29

名刺交換のマナーについて

今、学校の進級展に向けて作品づくりであったり作品のパネルづくりなどいろいろな準備しています。進級展には、企業の方もいらっしゃるのでそこで名刺の交換などさせていただく機会もあるかと思います。その時のため

その他

2020.01.18

Copyrightの正しい書き方

WebサイトのコーディングやデザインしているときにCopylightを書いているのですが、どうやって書けばいいか毎回調べている気がしたので今回は自分の備忘録としてもCopylightの正しい書き方をま

その他

2020.03.09

いいなと思ったWebサイト紹介-Vol2

7月の末にいいなと思ったWebサイト紹介の記事を書きましたが、今回はそのVol2です。前回と同様どこが好きなのかなど詳しく紹介していこうと思います。 アニメ「OBSOLETE」公式サイト https:

その他

2020.09.20

profile

kobayashi kent

トライデントコンピューター専門学校Webデザイン学科
アニメとかゲームとか音楽聴くのが好き