Web業界に片足突っ込んでみた。

フリーランスWebプロデューサー・ディレクター兼代表取締役社長が語るWebとか格闘ゲームとかの話これ即ち完全にチラ裏

いい感じのデザインを見よう13回目

 

仕事に追われるな、仕事を追え。

 

 

自分の会社の仕事をする時はそんな姿勢ですが、やはり組織に与するとその姿勢はほぼ無理な気がします。

 

こんばんわ代表取締社畜Aです。

 

さて、13回目のいいデザはこちら。

 

 

 

www.lupin-3rd.net

言わずと知れた天下の大泥棒、ルパン三世のpart4公式サイト。

 

今回はPC版から。

 

読み込み後は背景→各文字要素が順番に浮き出る仕組み。

また時間がたつとマウススクロールのアイコンが浮き上がる。

下へ行けよと。

 

ページ右には今いるカテゴリーのナビがいますね。

 

twitter要素の下にはintroduction、基本背景が固定(少し動く感じのやつ)に要素を乗せるスタイルですね。それだけでも充分カッコよく見えてしまうのが既に自分の目が肥えていない証拠なのかもしれません。。。間抜けだ。

 

キャラ紹介は白黒から、マウスホバーでカラーに。かつ、名前が浮かび上がります。

 

レベッカやニクスはマウスホバーでポスターの枠が赤くなる

 

黒背景に乗せる文字は一部が赤に。伝統的な表現ですが、それでもかっこいい、昔から「かっこいい表現」は、今でもかっこいいですね。

 

ハンバーガーメニューはheader部分に展開されるようですね。誰も右じゃなきゃいけないなんて言ってないですしね。。。

 

SP版は基本左右への移動を使い要素を長くなり過ぎないように納めています。

 

後はホップアップで情報をうまくまとめる感じですね。

 

ルパンpart4はOPが特に素晴らしかったと思います。

 

あ、話変わってます(笑顔)

 

www.youtube.com

片目をつぶって見ると一部浮き上がるように見える「片目3D」を意識して作られています。SplitDepthGIFsという手法らしいですね。

 

ルパンⅢの「Ⅲ」という枠をうまく使って表現しています。

 

総合すると、

 

 

 

 

 

 

 

 

 

 

 

 

レベッカも悪くなかったよね?

 

 

 

 

ってトコですね。