ウダ2.comリニューアル
数年前から準備していたウダ2の新しいトップページを公開しました。
作った順番はスイングバナー→サークルバナー→フッター→ヘッダーの順で最初にとりかかったスイングバナーは2012年に作ったもので最後に作ったヘッダー部分とは約3年の隔たりがあります。
一番上は最近よく見る動画の背景のヘッダー、上にざらついた縦縞のフィルターをかけて低画質の動画を誤魔化せるようにしてる。（使える動画が見つからなかったので公開時点では著作権放棄(CC0)の画像になってます）
ロゴのアフロスカルは前のがレンズが透けすぎだったので「死がふたりを分かつまで」の反射の感じをパクって透け具合を調整した。動きも以前はFlashで笑っていたのをjQueryでアニメーションに刷新しました。
スイングバナーはCSS3のtransformでカーソルを重ねたり、タブレット端末を傾けたり、ブラウザのウインドウを移動させると反応して揺れる。
サークルバナーは「PopCircle Vinmein」をベースにパララックス化したり出方を回転させながらにしたりしてます。
パララックス化したのはパララックス全盛の頃に作ったからです。さらにカーソルを合わせるとCANVASで書かれてタイトルとツールの説明が表示される。
フッターは予定ではパララックスのパラパラアニメを描こうと思ってましたが手が掛かるので放置してたらパララックスのパラパラアニメ自体を最近見なくなったので中止しました。
代わりにCSS3のtransformで角度を付けた長方形をjQueryでスクロールと同期させる事で微妙なパララックスにしました。
中身は新コンテンツ（？）のTシャツを掲載してます。