WebGallery

Webデザインの初心者がスマートフォン対応しているWebサイトを淡々と紹介していくサイトギャラリーです。

*

映像の切り替わるモーションが面白い!「TAO TAJIMA」さんのwebサイト

   

TANGRAM co. ltd.に所属する映像ディレクター「TAO TAJIMA」さんのホームページです。

とにかく映像の切り替わりのモーションが面白い!サイトです。
まずサイトに訪れると画面いっぱいに動画が流れるようになっているのですが、スクロールしようとすると画面がうにょうにょ動くんです!
ある程度スクロールさせると映像が切り替わる仕組みになっています。そうすることで、「TAO TAJIMA」さんが手がけた数々の映像を見ることができるんですね!
紹介の仕方がとてもお洒落です…

画面の一番下にはページナビも設けられており、スクロールしなくても映像を切り替えることが可能です。

しかも!メニューをクリックするとさらに面白い動きをしています。
映像の一覧をサムネイルで紹介しているのですが、左側のハンバーガーメニューをクリックするとそのサムネイルに仕舞われるかの様な動きで映像が消えるようになっています。
さらにメニューを閉じると先程まで見ていた映像がまた見れる仕組みです!一体どうなっているんだ…
私もいつかこんなカッコいいアニメーションを使ったサイトを作ってみたいものです…勉強になります!

 - 動きで表現

  関連記事

自分が本を選んでいるかのようなスクロール

  丸善出版株式会社とジュンク堂書店が佐賀県とコラボレートした「ほんの …

想像するだけでワクワクが止まらない「ハンズの夏準備」

「ハンズの夏準備」という東急ハンズの特設サイトです。 サイトのトップには、キャッ …

作品の雰囲気を損なうことなく、イラストを上手く配置した「ムーミン展」のサイトがかわいい!

2019年の4月9日(火)から6月16日(日)まで、六本木ヒルズ森タワー52階に …

トップの部分だけでなく、色々な場所で背景に動画を使用する

毎年夏に東京ビッグサイトで行われるアートイベント「万国學生藝術展覧祭 學展」のホ …

特殊なアニメーションを使って展示された作品を紹介している美術展のサイトが、ユニークな動きで面白い!

2018年の4月14日(土)から7月8日(日)まで、東京都美術館で開催されている …

アニメーションをゆっくりとした動きにし、筆のようなフォントや落ち着いた配色で重厚感を感じさせるデザイン

北海道沙流郡平取町にある「二風谷アイヌ匠の道」のホームページです。 黒・白・赤の …

ワンちゃん・ネコちゃんをメインに作られたサイトが、どれもオシャレで可愛い!

今年でうちの愛猫も2歳になるのですが、大きくなるのは早いですね… 大きくなっても …

写真を使って島の魅力を伝える

2016年4月に「星野リゾート リゾナーレ西表島」からリオープンする「ホテル ニ …

海の中にいるような幻想的なデザイン

大阪府吹田市にある水族館・動物園・美術館が融合した新感覚ミュージアム「ニフレル」 …

大人の京都を演出したデザインで和風と高級感を出す

京都府にある太秦映画村で行われているイベント「江戸酒場」のホームページです。 シ …