Pearl Jam Ten Game

Powered by IgWebCap

http://www.pearljamtengame.com/

3Dパズルを解いていくと、
楽曲が1曲ずつ、聞けるようになります。
バリバリの3Dってだけで、引き込まれるのは、
物珍しさ+僕がflasherっていうのはあると思います。

このパズルがちょっと良いと思った点は、
実は1列ずつ色分けされている、ということが、
進めていくと自然に理解できて、
それを発見すると、パズルを解くのが容易にできるようになる点です。

おそらくこの絵図でパズルヲすると、同じピースが出てきて、
納得できない感じになってしまいがちですが、
色があることで、不条理なく解く事ができます。

KDDI

Powered by IgWebCap


http://www.kddi.com/


ネガティブなことはあまり書くスタンスではないですが、
個人的にスゴくストレスを感じたので。
マウスを持っていくところに、メニューが自動的に出る仕組みなんですが、
メニューが出るまでに表示されているバナーが、
マウスを持っていくことで不可視&クリック不可になるところが、
とてもストレスフル。

マウスに追随するメニューなどは気にならないはずなのに、
なぜこれにこんなにストレスを感じるんだろうか。

見えているものをクリックする、
という今までの経験からすると当然の行為を、
直前で阻害されたことが恐らくその原因ではないだろうか。

4D2U Project Website

Powered by IgWebCap
http://4d2u.nao.ac.jp/top.html


先日行った、DeskTopLive.asで発表していた、
小坂さん(http://www.jun.com/)という方が作ったサイト。

ベクターで作られた3Dの空間を、
デスクトップから銀河の果てまで一瞬のうちに旅することができます。

パワーズ・オブ・テンを思わせる、そのダイナミックな動きは、
それだけでユーザーを惹き付けるのに充分な魅力を持っています。

また、下部のタブから指定した場所にすぐに移動する事ができ、
たとえ移動中でも構わずに途中から操作を変更できるという点は、
ユーザーにストレスを与えない快適な動作を実現していると思います。

技術的な話をすると、線画とは言え、こういった3Dのコンテンツを、
すいすいと動かしてしまう事自体(しかもまだ3Dライブラリもない時代に!)
ものすごい事なのです。
技術とデザインは実は密接に関係していますが、
躍進目覚ましいウェブテクノロジーでは、その影響が顕著に出てきます。

Kenjiro Harigai

Powered by IgWebCap

http://www.kenjiroharigai.com/


まず画面全体を埋め尽くす作品の物量と、
華やかさで圧倒される。
何回かロードしたが、同じ画像が同じ場所にくるということは、
ランダムで配置しているわけではないっぽい。
単純にカラフルなものがたくさん並んでいると楽しい。

その作品画像も左上から徐々にマスクが解除されていく形で、
クールなモーショングラフィックスのよう。

作品画像はマウスオーバーで全体が見えるよう、
可視範囲が拡大し、明るくなる。

次に画像をクリックすると、
突然、全ての画像がバラバラと落ちていく。
この演出も画面全体を使った動きで、
ダイナミックに見せつつ、
重力にとらわれて落ちていく様がはかなげ。

作品詳細の部分のナビゲーションも、
大量の情報を見やすいように、サムネイルとマウスオーバーの関係性も、
整理されている。
マウスオーバー時に、可視範囲が移動し、小さなサムネイルの中で、
スクロールする様は触っているだけで楽しくなる。

こうしたモーションが秀逸だからこそ、
全体が黒で統一されているサイトでも、
クールすぎない、ポップな雰囲気を出せているのだと思う。

KIZASHI THE SUITE

Powered by IgWebCap

http://www.kizashi-gion.jp/


京都、祇園の旅館のホームページ。
全体の色彩として、茶、金を基調にして高級感と、老舗の雰囲気を出している。
面白いと思うのは、写真の見せ方。
普通のスライドショーのようだが、
写真ごとに徐々にズームアップしていくことで、
スライドショー的な単調さに陥らずに写真を見せていっている。
写真に被ってくるコピーもドロップシャドウとぼかしが入ってきて柔らかい印象を与えている。

地図の詳細図を表示すると、
鳥瞰図となって、別角度からの立体的な視点になる点も面白い。