モバイルファーストサイト100選　その28　狂ATE the FUTURE　

東大工学部の若き研究者たちが衝動と未来を語る動画メディア

東大工学部の研究者たちの動画が集められています。

https://park.itc.u-tokyo.ac.jp/createthefuture/

いや～かなり攻めたデザインですね。
さすがというべきでしょうか。

構成

メインエリアはやや右寄りに配置されています。
背景は画像のみで、メインはこの上にフロートしています。

タブレット時に右の部分が非表示になります。

メイントップはさほど大きくはありませんね。
シンプルなほうだと思います。
動画の紹介部分がスライダーになっていますが、
これ、PC 時には、マウスのホイールで動かせるんですね。

これ、どうやってんだろ？
初めて見ましたので、宿題にします。

一階層降りた動画一覧のページです。
トップよりこちらのほうが長いですね。

しかしこのページ、一番上にある検索窓で
クラスごとのフィルターをかけられるんですね。
これを使えば、動画の表示数を２～３個へと減らせるので、
とても親切です。
見たい動画だけを表示できるようになるので、
コンテンツが増えてもたどり着きやすいですね。

一覧ページの下にさらに一階層さがって、
個別のページがあります。

このページの真ん中らへんに
「一覧へ戻る」
のボタンがあるのですが、
個人的にこれがとても良いなと思いました。

スマホのサイトで階層が三つぐらい下がると
もとの場所に戻るのが苦労するんですよね。
迷子になりやすいです。
なのでこのボタンは良いなと思いました。

配色

このサイトの配色はこれ

やはり攻めていますね。
これだけ色数が多いと
うまく使うのは難しいはずです。
すごいなあと思いました。

フォント

本文のフォントは　Noto Sans JP
きわめて普通ですね。

文字に関しては奇をてらわない使い方をしているようです。
フォントのサイズも種類が少なく、
まとまった感じがします。

まとめ

最初見たときはなんかごちゃごちゃしていて、
ちょっと見にくそうだなと感じたのですが、
実際はとてもシンプルな操作性で、
迷うことなく見ることができました。

細かな配慮もあって、
勉強になりました。
いろいろ参考にしたいサイトです。