Visible Tweetsは、Twitterの検索結果を、アニメーション形式で表示するFlash作品。

僕の稚拙な説明だけだと、TwitterのAPIを叩いているだけの作品と捉えられてしまうのですが、この作品がすごいなぁと思うのは、検索結果のトランジションがなんとも言えない心地よさを出してくれている店なんですよね。

例えば、”Hello”で検索した場合。

こんな感じで形態素解析を使って、”Hello”のアルファベットの一部分だけを残して、次のつぶやき(Tweet)にトランジションしていきます。

パブリックタイムラインの検索では検索する度に結果が異なるので、このフワッとした感じで次のつぶやきにトランジションしていく様が、その瞬間を逃すともう巡り会えないその瞬間の“つぶやき”を表現していて面白いです。

形態素解析トランジション以外にも、ローテンションしながら、表示するパターンや、

タグクラウド風に、トランジションする度に検索フレーズが大きくなるエフェクト等の3パターンのトランジションが用意されています。

どれも心地良い感じでボーッと心地よく見ていられますので、興味がある方は是非！

制作は、The Man in Blue

Google Newsのデータをビジュアライズしたプロジェクトとして話題になった、Newsmap。一時期、NewsmapのHTMLパーサーがGoogleから遮断される可能性もあり、閉鎖騒動も話題になっていたプロジェクトですが、Ver2.0にアップデートしていました。

制作者のマルコス・ウェスカンプ氏のブログによると、
Newsmap ver2.0の注目点は、ツリーマップ形式で表示している部分が、これまでの正方形ではなく、テキストに合わせて長方形になっていたり、ディープリンクや検索機能が強化されているようです。

最初のNewsmapが2004年頃に公開されたハズなので、既に公開から5年近く経っているにも関わらず、インターフェースが全く古く感じないのがスゴイですね。

10 Useful Flash Components for Graphing Dataという記事で、チャートやグラフを作成するというデータビジュアライゼーションに使えるFlashのコンポーネントが10個紹介されていましたので、昨今の「○○に使える、○○個のTips」メソッドに便乗して意訳/紹介させて頂きたいと思います。

1.Open Flash Chart

まず最初に紹介するOpen Flash Chartは、Flex用のチャートコンポーネント。データ形式は、JSON形式で扱います。チャートがリサイズできたり、グラフをイメージファイルとして保存したりする事も可能な所が特徴です。
ライセンス形式は、LGPLで基本的には、ドネーションウェアで使用する事が可能です。

Open Flash Chartのデモはこちらから

2.XML/SWF Charts

XML/SWF Chartsは、XML形式のデータを利用して、グラフが作成できるコンポーネントです。

こちらのコンポーネントは、機能が限定されたバージョンであれば、フリーで使う事ができますが、フル機能版およびテクニカルサポート付きのバージョンは、$49と$59で提供されています。

 XML/SWF Chartsのデモはこちらから

3.zxChart

zxChartはテキストファイル、XML形式をインポートしてグラフで表示する事ができるコンポーネントです。

コンポーネントは有償で、€15で購入する事ができます。

4.amCharts

amChartは、CSV形式、XML形式、PHPやRailsなんかのサーバーサイドからのレスポンスをグラフ化してくれるコンポーネント。Google Analyticsのように時間軸でソートができるグラフがサクッと作れてしまうのが特徴ですので、株価の遷移とかを表示するのには良いかもしれません。

amChartのデモはこちらから

5.Fly Charts

Fly Chartsはチャートのセクションにズームインする機能や大きなチャートになった時のスクロール機能、Javascript連携などの機能が使う事が可能なFlashコンポーネント。

Fly Chartsは、個人利用に関しては、Fly Chartsのサイトへリンクを貼る事で無償で使う事ができますが、商用利用の場合には$99〜$799の商用ライセンスを購入する必要があります。

Fly Chartsのデモはこちらから

6.AmiChart

AmiChartは、他のグラフ作成コンポーネントに比べて、MS Officeとの連携がラクチンな所が魅力的です。例えば、エクセルで作成したデータをそのままインポートできたりする特徴があります。

値段は、15日間のフリートライアル付きで、$39。

AmiChartのデモはこちらから

7.Black Box Chart

Black Box Chartはフリーのコンポーネント。Black Box Chart editorというGUIツールも提供されています。

Black Box Chartのデモはこちらから

8.flashCharts

flashChartsはパイチャートやバーチャートなどの代表的な5種類のグラフ生成/ビジュアライゼーションが可能なコンポーネントです。12KBという軽量なコンポーネントになっている所も魅力ですね。

5つセットでの値段は、$99ですが、必要なグラフ毎に個別に購入する事も可能です。

flashChartsのデモはこちらから

9.FusionCharts

FusionChartsは45種類もの、2D、3Dのチャートを生成する事ができるコンポーネント。

こちらのショーケースでサンプルを見る事ができます。

ライセンスは、$69のユーザーライセンスから、$1,999のエンタープライズライセンスまで用意されています。

やはり値段がはるだけあって、3Dグラフィックのインパクト大なグラフを生成する事が可能です。

FusionChartsのデモはこちらから

10.Origramy

Origramyは、グラフエディター&ビューワーのコンポーネントです。インタラクティブを作る事が可能。個人利用ならリンク付きで無償で利用する事ができます。

商用利用の場合は、$99〜。

Origramyのデモはこちらから

こんな感じにいくつかグラフのコンポーネントを紹介させていただいたのですが、コンポーネント以外にも、Flashのディベロッパーならライブラリを使うというのも良いかもしれないですね。

個人的に面白いなぁと感じたのは、海外では、コンポーネントをPayPalやらで商用利用を積極的に行っている事。

今後こういったコンポーネントやライブラリを販売する事がキチンとしたビジネスモデルとして成立すると新しいマーケットや雇用の創出に繋がって行くと思うので一つのビジネス的な手法として期待したいと思いました。

今回のコンポーネントとは別に、ライブラリとして個人的に良く使わせて頂いているのは、Flareというビジュアライゼーションに特化したAS3のライブラリです。

こちらは、グラフやチャートのみならず、ツリーマップやノード形式での表示など、もっと細かいビジュアライゼーションを行う事ができます。

ツリーマップのロジックとかってどうやって生成しているのかしら？と思った時にもライブラリとして提供されていると、ソースレベルで勉強する事ができるので、勉強がてら弄らせて頂いています。

結構重量級(?)のライブラリですが、良かったら是非！

via FlowingData

美人時計が話題になっている中、Flickr ClockというFlickr上の映像コンテンツを繋げて、時計を作るプロジェクトもありました。

Flickr Clockは、Flickr Clock Group Poolというグループに投稿された動画コンテンツのスライスが時間軸に並んでおりサイトにアクセスすると、今の時間のスライスが表示されるようになっています。

各スライスはムービーコンテンツになっていて、下記のように、ムービーを再生しする事も可能です。

各ムービーのスライスが配置されるロジックはどうも、Groupにアップされた時間を取得しているみたいです。

もともとなんの脈略も無かった映像コンテンツが、アップされた時間を元に整理され、時計という表現に落とし込まれているのが面白いなぁと思います。

制作は、SWFMOMAのビジュアライゼーションも行った、stamen.

SEED ui09は、個人的に大好きなポータルサイト、SEEDが取り上げている明るいアイデア/話題をビジュアライズしているインターフェース。

タイル状に並べられた、情報をページ上部のタグでソートする事ができ、各サムネイルをクリックすると、下記のように、そのアイデアやトピックの詳細を見る事ができます。

暗いニュースばかりの昨今、ポジティブな情報のビジュアライゼーションは気持ち良いですね。

Macでもマウスホイールに対応しているなど、デティールにまで細やかな配慮がされている所などにグッときました。

Transparent New Yorkは、ユーザーが、New Yorkの街の「地下鉄」、「街区」、「高速道路」等のインフラを時系列別にマッピングして閲覧する事が出来るプロジェクトです。

上記の画像は、1995-2005年までのNew Yorkの地図の上に、「電車」、「ハイウェイ」、「地下鉄」をマッピングしてみました。

地図をクリックすると、クリックされたエリアがポップアップで開き、詳細を見る事ができますよ。

こちらは、ダウンタウンエリアの詳細になっています。
3Dで表示されるこちらの地図では、「ピア」等のより細かい情報を選択する事ができるようになっていますね。

都市のインフラ部分をビジュアライズする事で、都市像を浮かび上がらせる手法は、以前、HONDA INTERNAVI REALIZATIONでも紹介したのですが、インフラ部分の情報で都市の形って意外と認識できたりするものなんですね！

ちなみに制作は、建築家のBrian McGrath氏

TEXTUREは、佐藤可士和さんが率いるクリエイティブ・ブティックSAMURAIがこれまで手がけてきたフォントタイプを利用して作られたスクリーンセーバー。

NY Timesのニュースソースを利用して文字が、ズラーッとズラーッとひたすら流れてきます。

時折、こんな感じのアップカットで表示されます。

スクリーンセーバーでは、自分のOSにインストールされているフォントを利用する事もできるので、自分の持っているフォントのテストにも使えそうです。

こちらは、”GEIST RND”というフォントで表示してみたところ。

同じニュースソースでも、フォントが変わることで伝わる情報の深度が変わるのが体験できて面白いですね。

制作は、SAMURAIとthaさん

HONDA INTERNAVI REALIZATIONはHONDAのインターナビを使ったビジュアライゼーション・コンテンツ。

このコンテンツの面白い所は、2種類の視点からインターナビをビジュアライズしている点。

まず、上記の、NEURON ROADというコンテンツは、インターナビを搭載した車の軌跡を都市を俯瞰した形でビジュアライズしています。ちなみに、キャプチャは名古屋なんですが、ボーッとみていると、道路を走る車によって都市の骨格が浮かび上がって来る模様が楽しめます。

一点して、こちらのDRIVE LAPSEは、2975枚にもおよぶ写真を用いて、インターナビで走行している様子を車内からの視点に切り替えた表現になっています。

NEURON ROADの都市を俯瞰した状態で感じる「インターナビ」と、DRIVE LAPSEの都市を駆け巡る状態で感じる「インターナビ」。この2つの視点の対比を同時に楽しむ事でナビゲーションシステムに対する感覚の体験度が増すんでしょうね。

制作は、
METAPHORさんとSemitransparent Designさんみたいですよ。

via FlowingData

Data Visualizationは、GridPlane、Instrument、Googleによるプロジェクト。その名の通り、Google Analyticsのデータを利用した様々なビジュアライゼーションを楽しむ事ができます。

まだ、画像しか、公開されていないのですが、いずれGoogle Analyticsに導入されかもしれないと想像すると勝手にワクワクしますね。

ニュース、ソーシャル、ブログといった様々な切り口による、アクセス情報の見せ方が提案されています。

こちらは、アクセス元の情報を地図にマッピングして表現。

このプロジェクトのクレジットはこんな感じ！
Client: Google
Agency: Instrument
Account Manager: Vince Lavecchia
Project Manager: Justin Lewis
Art Director/Designer: JD Hooge
Programmers: Matt King, Ryan Spangler

ちなみに、Google Analyticsのデータをもとに、地図にマッピングする手法は、(suit)menのサイトでも実現されています。

アクセス解析って毎日変化する情報なので、その情報を今後どのように表現していくのかって、マーケティング的な観点から見ても面白い領域ですね。

オバマ大統領関連のニュースは連日、テレビ等で放映されているので、ちょっと熱は冷めた感はあるのですが、データ・ビジュアライゼーションのポータルサイトFlowingDataが「Twitterを利用して就任式の模様をビジュアライズしていた」ので紹介してみます。

このプロジェクトは、1月19日から21日8:00AMまでの期間中に、Twitter上でオバマ大統領の就任に関する投稿をマッピングしています。

時差の関係上、アメリカのTwitterでまず盛り上がって、それからヨーロッパで盛り上がるという、分かりやすい時差の流れが視覚化されているのが面白いですね。

僕個人はというと、オバマ大統領の就任式は、USTREAMで2000人くらいの人達とリアルタイム眠気と戦いながら見ていました。

Twitterのようにタイムラインで情報を追うのとは違い、ザ・インターネット的に不特定多数(2000人くらい)が物理的な距離を凌駕して同じ情報を共有するって体験に立ち会えた事にワクワクしていました。