kokeblog

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

  • 2020年07月30日
  • 今回は、いろいろとWebサイトを見ていて、個人的にいいなと思ったサイトをどこが好きなのかなど詳しく紹介していこうと思います。

    電音部 ーdenonbuー

    https://denonbu.jp/

    一発目の紹介するサイトは「 電音部 ーdenonbuー 」の公式サイトです。この 電音部はバンダイナムコの音楽を原作とする新規キャラクタープロジェクトのことみたいですね。

    全体的に立体的で見ていてとてもおもしろいですよね。個人的にネオン街みたいな背景が好きです。ナビゲーションもホバーすると縦に立体的に回転するアニメーションで他ではあまり見ないよなアニメーションで面白いですね。あとマウスストーカーも動かすとフニャッとなって細かいところにもアニメーションが入っています。背景は、多分canvasで作っているっぽいですね。canvasここまでできるもんなんですね。

    BLUE PROTOCOL

    https://blue-protocol.com/

    続いて、「BLUE PROTOCOL」の公式サイトです。こちらはバンダイナムコのPC用オンラインアクションRPGみたいです。

    メインヴィジュアルの抗え。の文字がとても印象的ですね。全体的に文字や写真のレイアウトが面白いいです。バラバラに配置されているように見えますけど、割と揃っていて文字の大きさのコントラストもはっきりしています。こうゆう文字の使い方をしているサイトは大体ゲームなどのサイトでしかなく、やっぱり普通の真面目な感じのサイトよりも見ていて楽しいなと感じますね。あと、この置き方でどんな視線の流れをデザイナーさんは狙っているのかなーと少し考えるのも割と楽しいですね。

    ima | 株式会社ima(あいま)

    https://i-ma.jp/

    株式会社 ima(あいま)さんの公式サイトです。

    全体的に星空のようなきれいなサイトですね。最初にサイトに入ったときに点とマウスカーソル線で繋がるアニメーション?が個人的には好きですね。見る人によっては蜘蛛みたいな動きで気持ち悪いかもしれませんけど。各地に点でバラバラに広がっている人たちを線でつなげるといったことが書いてあったのでそれをサイトでうまくきれいに表現できているなと感じます。六角形を使っているのも印象的ですね。ちょっとしたパララックスもあって細かいところも面白いなと感じます。

    まとめ

    今回、初めて自分のいいなと感じたWebサイトを言語化してまとめてみました。やっぱなかなか難しかったです。こうみてみるとアニメーションやフォントに自分は目がいってるのかなーと感じました。うまくアニメーションを制作物に僕は入れてないですがもっとアニメーションの動きであったり、実装の仕方を勉強していきたいなと思います。フォントに関してもいろいろなものを見て使っていきたいですね。

    Pocket

    関連記事

    デザインの4つの基本原則をちゃんとまとめてみた

    XDでニューモフィズムを作ってみた

    黄金比と白銀比(大和比)について

    カテゴリー