いま,見ておきたいウェブサイト

第3回 magicsocket,Pretty Loaded,Space

この記事を読むのに必要な時間:およそ 2 分

先月末に開催されたAdobe Max Japan 2009で刺激を受け,創作活動に打ち込める気がしている今日このごろ,いかがお過ごしでしょうか。今回も個人的に感じた素晴らしいサイトの特徴を,いくつかお話したいと思います。

サイトすべてを見てもらうアイデア

『magicsocket ~ Adobe Flash development』

イタリアのトリノにあるインタラクティブエージェンシー,magicsocketのサイトです。縦に長いサイト全体にスロットレーシングのコースを取り付けたようなデザインが,非常に印象に残るサイトとなっています。

図1 スロットレーシングのコースが印象的

図1 スロットレーシングのコースが印象的

credit: magicsocket

このサイト上のコースは,単なるデザインではなく,実際にユーザーがレースをして遊ぶことが可能です。画面上部の「FUN」ボタンを押すか,ナビゲーションの「race now」を選択することでレースが始まります。

図2 レースゲームではさまざまな車種が選べる

図2 レースゲームではさまざまな車種が選べる

サイトの上から下までを大胆に使ったこのレースゲームは,マウスのクリックをアクセル代わりに車を操作するという単純なものですが,ついつい熱中してしまいます。

図3 サイト全面がコースとなっている

図3 サイト全面がコースとなっている

ユーザーに見てもらうための工夫

ウェブサイトを制作すると,制作する側はいろいろなことを考えます。そのひとつに「せっかく作ったのだから,ユーザーに全部のコンテンツを隅々まで見てもらおう」とする,"作ったコンテンツを無駄にしたくない"という考えがあると思います。

ところが,アクセス解析などを使うとはっきりわかるのですが,実際にはユーザーになかなか見てもらえないコンテンツが出てきます。そして,それを見てもらおうとコンテンツの中身を替えても,なかなか思い通りにならないことも多いでしょう。

このmagicsocketは,用意したコンテンツを次々と縦に並べた結果,画面の下に配置されたコンテンツになればなるほど,見るためにスクロールを行わなければならないという,ユーザーにとって面倒な作りとなっています。

しかし,縦長のサイト全体を利用したスロットレーシングゲームを用意することで,コンテンツを見るためにスクロールを行うという面倒な作業を解消するだけでなく,知らず知らずのうちにユーザーが用意されたコンテンツに目を通してしまうという効果を生んでいます。

今後はさまざまなウェブサイトで,コンテンツを用意するだけでなく,このmagicsocketのような"見てもらうためのアイデアを加える"ことを考える必要性が増してくるのではないでしょうか。

ひとつだけに集中してみる

『Pretty Loaded - a preloader museum curated by Big Spaceship』

Flashのサイトでよく使われる,グラフやパーセント表示を用いて,現在どれくらいデータのロードが終了しているのかを表示するプリローダーを集めたサイト,Pretty Loadedです。

図4 次々とさまざまなプリローダーが表示される

図4 次々とさまざまなプリローダーが表示される

credit: Big Spaceship

サイトではさまざまなプリローダーが次々と画面に表示されていきます。中にはコンテンツと同様に,細部までキッチリと描かれ,表現方法も工夫されているものもあります。

図5 中には動画を使ったプリローダーも

図5 中には動画を使ったプリローダーも

また,ダウンロードが可能なスクリーンセーバーや,プリローダーを投稿する画面も用意されており,今後もさまざまな種類のプリローダーが増えていきそうです。

図6 プリローダーは投稿も可能

図6 プリローダーは投稿も可能

ウェブサイトに必要なもの

ウェブサイトを構成するさまざまな部分に注目して,それらを集めているサイトが世界中にはたくさん存在しています。そして,どのサイトも見ていると時間がたつのを忘れさせてくれます。

ウェブサイトを見るとき,誰もが実際のコンテンツの中身や,それを演出する派手なアニメーションやトラジションなどに目を奪われ,注目してしまいがちです。しかし,ロゴやナビゲーション,ヘッダやフッタなどの要素も,ウェブサイトを構成するうえで"決して欠くことができないもの"ばかりです。

このPretty Loadedはプリローダーばかりを集めたサイトですが,そのプリローダーひとつをとって見ても,細部へのこだわりや,飽きさせない工夫が凝縮されているのが本当によくわかります。

私も毎日サイトをたくさん見ていますが,今まで以上にサイトを構成している要素をじっくりと,そして注意深く見ていきたいと改めて思いました。

著者プロフィール

Lançamento(ランサメント)

国内外のウェブサイトを日々紹介する Blog『Lançamento』を運営する,自称“フリーランスという名の無職”。目指すは“エクスペリエンスデザイナー”(O'REILLY『Web情報アーキテクチャ』11ページ参照)。2008年の“ジェフの奇跡的な残留”を目の前で見たサッカー好き。

コメント

コメントの記入