CASIO G'zOne TYPE-R

オールフラッシュではじめに商品が水に浸かるシーンが流れます。
リズミカルでインパクトのあるシーンからナビゲーションのシーンへスムーズに流れます。
商品の注目してほしいポイントをかっこよくわかりやすく伝えれているシーンだなーって思いました。

Flex Store

プログラム開発に特化したフラッシュ開発アプリケーションFlexのプロモーション（？）というかサンプルです。よくできてます。以下主な機能です。
・商品サムネイルのドラッグ→カートイン
・商品サムネイルの価格絞り込み（対象外は半透明になります）
・商品名順・価格順の再整列
・サムネイルとリスト表の表示切替
・カート内の商品名・品数・価格の整列
・タブかされた購入画面

キーボードオンリーでの操作も可能になっているみたいです。
[tab][space][←][→][↑][↓]
バランスいいですね。

TYPEDRAWING

全て文字で構成するグラフィック・イラストレーションが作れるサイトです。ENTERをクリックして入ると、大きく分けてGALLERYとDRAWINGのふたつの内容があります。自分で描くのと、他の人の作ったグラフィックを見るののふたつですね。DRAWINGはマウススピードで文字サイズが変化するので躍動的な線（文字の並びですが）がかけます。作ったものはメールで送ったり、サイトに来た人に見てもらったりできるみたいです。

Imagination Cubed

ラクガキして友達にメールを送れるサイトです。ペンがマウスについてきます。インク残量を表示することで、処理制限を制限できていていいアイデアだと思います。

VW Features

VWのGTI MkVプロモーションサイトです。
MAZDAのウェブチューンファクトリーみたいに（サイトから直で発注→受注生産ってかんじまではできなさそうですが）パーツを組み合わせて見積もりができます。

面白いのは、自分でエンジンやホイールやボディーや内装なんかをセレクトして組み上げたGTIがテスト走行するムービーを見れるところです。（サイト内の"watch your joyride"をクリックすると見れます）
カットごとに内装の場面や人形をひかないように蛇行運転するシーンなんかがあって、パーツの組み換えパターン分全部のムービーが用意されているみたいです。
たぶんカットごとに読み込みを分岐しているようですが、カット自体は、ボディーの色だけでも何回も撮影しないといけないし大変じゃないかなーって思います。
使い回しされそうなカットはなぜか"寄り"のシーンが多いんですが、たぶん余分なのものが入ってパターンが増えないようにするためなのかなーとか思います。

パーツ換えて合計価格が変わったときの、数字の動き方が一瞬で変わるんじゃなくてカラカラ変わってくのが個人的に好きです。

neaf

遊びという目線から、物理的、論理的なルールを養ってもらう目的で面白い発想の玩具を作っている、ペア・クラーセン【Peer Clahsen】さんを紹介するBEYESのサイトです。前回、リアルとウェブの連携から自動で生まれるエフェクトで紹介したサイトも大本はBEYESです。
玩具を実際に使っているところを説明できるテキストと写真を数枚見せたり動画をみせたりして商品の魅力をわかりやすく伝えていると思います。

子供達が玩具で遊んでる写真。
部屋写真の玩具自体をオーバー→クリックするか、下のサムネイルをクリックすると、玩具の詳細がめんになります。遊んでる子供の表情と、わかりやすい玩具の仕組みの実演が両方ちゃんとわかっていい表現だなーって思います。

CELLA

ELLIPSO
表情いいですね。

CUBICS
すごいちっちゃい子も遊んでます。

TOROFLUX
動画でも見れてわかりやすいです。

RAINBOW
打楽器としても遊べるってのが実演写真でみるとわかりやすいです。

SANDPENDEL MIDI
動きの面白さが写真と映像で伝わっていいなーって思います。

WIPPLES
遊び方が実演してあってわかりやすと思います。

ってかんじで紹介の仕方が上手だなーって思うサイトでした（'u'）
フラッシュコーディングは広島工業大学卒のnull加入の+39さんです。

Taku Satoh Design Office:デザインの解剖

いつもおせわになっている明治おいしい牛乳のパッケージデザインをした佐藤卓デザイン事務所の中にあるコンテンツです。（ここの部分は実際フFLASHではなくShockWaveで作られています）

最初、3Ｄデータになっているおいしいしい牛乳ひとパックがぽつんとあるんですが、牛乳パックをクリックすると、構成されているデザインパーツが、爆発して当たりに散らばります。
「青の帯」や、「あけぐち」や、「賞味期限」…全部の部品が散らばっていてその中からひとつずつ選んで、クリックして、デザインの意図や解説を読むと、選んだ部品が元の位置に戻ります。

明治乳業のおいしいしい牛乳の商品サイトからこのコンテンツにリンクがあるのも面白いなと思います。クライアントのサイトから制作会社へのリンクが大々的に繋がっているってところとか…。

Life with softbank

ボリュームは薄いサイトですが、閲覧操作がとても楽な作りだとおもったので紹介します。
縦に長いコンテンツ（というかループしています）で、タイムチャート型になっています。マウスホイールをコロコロ回すとフラッシュコンテンツなのにスクロールするので、サムネイルを選びやすいつくりだと思います。（MACは反応しません）
最初サイトに訪れた時、サイトに訪れた時間が画面の中央に来るので、サイトに来るたびに違うサムネイルが中央に来きます。紹介する内容の"時間"と見る人のそのときの"時間"が一緒になるので、共感しやすい（？）とかかなとおもいます。

BBDO

世界各地のハイクオリティーなTVCMや広告が、ワールドマップを回遊するように閲覧できるサイトです。広告作品を閲覧するための操作は新しい感覚ですが、ぼく的にはわかりやすいし使いやすいインターフェイスだと思います。紹介されている広告ひとつひとつがおもしろいので、「他のもいたいあれもみてみたい」って見て回りたくなるサイトです。ローディングも個別処理なので待ち時間も短いしサクサク動くのでいじっててたのしいですよ。

感覚的にクリックしていたらズームしたりズームアウトしたりします。
中で紹介されているCMにおもしろいのがたくさんあります。
まずは…

CHILD HOPE ASIA
住む家のない子供（ストリートチルドレン？）の問題定義型のマニラのCMです。
子供が普通の生活にあこがれて、チョークでキッチンやお風呂やベッドを路上にラクガキで再現…したつもりになってせつなく生活してます。↑これは水溜りにラクガキして作ったお風呂に入るシーン。

PEPSI
ブラジルのペプシのCMです。
有名どころのサッカー選手がサーフィンしながら海上でサッカーしてます。
オシャレなインパクトCMですね（'u'）

ほかにもたくさん面白いのがあるのでみてみてください。

Sketch Swap

イラストを描くと他の人が書いたイラストがもらえます。ユーザーが勝手に、提供する情報を増やしてくれるので管理者はなにもしなくていいのがすごい仕組みだと思います。

ライフカード

最近「続きはウェブで！」のような流れで終わるＣＭが増えてきました。
ぼくのなかでこの手法の代表的なＣＭがライフカードです。
たぶんこういうのをクロスメディアって言うんだと思います。
（ＴＶとウェブサイトを、複数のメディアをひとつの目的で使っているあたりとか）

ＴＶって一度にすごいたくさんの人へ情報を告知（たれながし）できる媒体です。でも、640×480px、15秒の限られた制限の中で伝えたいことが伝えたれないと思ったとき、「続きをきにならせて、制限の少ない"ウェブサイト"媒体に誘導する」という手法のＣＭが生まれたのだとおもいます。
ＳＥＯ・ＳＥＭと絡めて、きになった人は検索エンジンで、ＣＭで告知したキーワードを入れてもらい、目的のウェブサイトに誘導してるようです。
ＴＶＣＭの"多くの人へ告知"というメリットと、ウェブサイトの"興味を持った人にじっくりみてもらう"というメリットをうまくクロスさせているよなーって思います。

手法はさまざまだと思います。
ライフカードの場合、ほんとにＣＭのストーリーの続きが見えるんですが、、
FOMA N902のNを探せは携帯の機能を認識してもらいつつ遊べる本格推理ゲームに繋がってます。サイトに訪れる時間帯によって推理できることが変化したりして何度もサイトへ訪れてもらう構造になってたりとか考えてるなーと思います。
あと、キーワードを連呼するOCNのＣＭ光体操 とか。

JSTバーチャル科学館 地球ガイド

フラッシュでのインタラクティブの表現がちゃんとわかってる上で、しっかり情報整理して作ってあるサイトだなーって思いました。
細部で気に入ってるのは…

[3]空はどこから宇宙になる？
…の高度をドラッグして、スクロールさせるツールがわかりやすいなと思ったのと、
高度ごとに、東京タワーや、流れ星、ジャンボジェット機などのイラストと情報をみせる表現の形が面白いなーって思いました。

[6]地球はどんな物質からできている？
…にある元素記号の表で、「人体」「地球」などを選ぶと、それがおもに含まれた元素が明るくなって、構成されている元素がすばやくわかるつくりがおもしろいです。

あと、最初の８種類の「クエスチョンマップ」というメニューをオーバーした時に出る音が、音階になってるのが好きです。これは結構個人的には好奇心くすぐるつくりだと思います。

WANT-TO LAKE

バナーからほのぼのレイクのサイトに誘導する繋ぎのコンテンツのようです。
ほしいもののキーワードを入力するとYAHOOの公開されているプログラム（API）を通して、キーワードに関連する画像をサムネイルにしてばらばらと表示する仕組みのようです。

ほしいものの画像をたくさん見て、これ買いたいけどお金なかったらレイクで貸してあげます。っていう流れのようです。

■CacheAsBitmap
画像の表示量（というかパーツ素材の量）がめちゃくちゃ多いのに処理落ちをしていかないのはビットマップキャッシュ（flash8からの新機能）を使っているからだと思います。
いままでだと細かいパーツの塊があるとき処理が重くなっていきます。細かいパーツの塊をひとつの画像としてキャッシュしてしまい、変化した時だけ再キャッシュするというものです。
まだやったことないですが、処理速度を上げる新しいやり方アンド主流になっていくと思います。

Interactive Interior

BEYES表参道ヒルズ関連のサイトです。
いっけん普通のサイトじゃんって思いますが、裏ではものすごいことをやっているようです。

主にこのふたつ
・店舗映像の輪郭検出
・サイトに来た他のユーザーのマウス座標の取得

じっくり見てたらわかってくると思いますが…
背景で動いているカラフルな模様は、
店舗カメラの近くを通る人のシルエットで、
店舗の映像をリアルタイムにグラフィックに変換しているエフェクトなんです（ﾟロﾟ）ｽｺﾞｲ

あと、マウスの軌跡もエフェクトになるので、
知らず知らずにサイトに来ている人全員と、
店舗をうろつくお客さんとのコラボレーションで
エフェクトを自動生成している仕組みみたいです。
このエフェクトが店舗上のスクリーンでも投影されているようなので
サイト見てる人と来店した人の繋がってる感がある斬新なアートですね。
店舗の映像がサイトに映ってると微妙ですが、
これは個人を特定できないけど、自分の動きが反映されてるのはわかるので
かなりありだとおもいます。
でも、ユーザー・来店者参加型の映像ってのに気づきにくいのがもったいないなーとか思いました。

■FCS・FMS(FlashCommunicationServer1.5・FlashMediaServer2)
W GrandLacereの制作で使ったサーバを経由して座標データや文字情報をリアルタイム共有したり、ビデオチャットを作れるサーバアプリケーションです。
このサイトはこれを使っているんですが（たぶん）…難しいのは共有した映像を加工して表示している部分。コマの映像の全ピクセルの色を覚えておいて、ひとコマ前のピクセル色と今のピクセル色を比較。ある程度変化したピクセルは「ここ動きがある！」って判断してカラフルにしているようです。
画像・映像の色をピクセル単位で取得できるのはFlash8からです。

d'strict d'fines d'gital

今日、大志君から教えてもらいました。
韓国の制作会社のサイトらしいです。
インターフェイスが新鮮です。
カラフルな新聞の上を四角いルーペをドラッグしながら閲覧する感じで操作します。
一瞬どうすれば情報の詳細を見ることができるのか迷いますが、
感覚的にわかるつくりだとおもいます。

フルフラッシュなのに、フラッシュ内にスクロールがないので画面サイズがある程度ないとみれないのもネックだとおもいます。

セキスイハイム DESIO

3階建ての家の模型をパカパカ開けて部屋の中に、家族4人のレゴみたいなオモチャをドラッグできます。
置いた人形の噴出しアイコンをクリックすると、各部屋の紹介に移ります。

ゲーム感覚をいうより、シミュレーション感覚のインタラクティブコンテンツだと思います。
自分の家族をイメージしながら人形を、摘んでは置いて…摘んでは置いて…ってしていると、
この家に住んだらどんな風に楽しく暮らせるかをイメージしてしまいますね。
インターフェイスも迷わず扱えて好奇心もくすぐるいいバランスだと思います。

IKEA DRÖMKÖK ÅT ALLA

※めちゃ初期読み込みが重いサイトです。

でも、表現はとても興味深いものなので紹介しておきます。
時間が止まった状態でカメラが動くという「マトリックスみたいに」っていって伝わるメジャーな映像表現ですが、今見ても新鮮で面白いですね。それをウェブでやっているのがここ、世界シェアno.1（？）のIKEAのキッチンプロモーションサイトです。
そのときどきのキッチンで起こる、いちシーンの瞬間を時間を止めて見せています。

時間が止まった空間をマウスで左右にドラッグすることでカメラを動かすことができます。

面白いのは、カメラを動かすことで
初めて見えてくることとかがあって…

例えば…

キッチンの裏にサプライズするために
隠れている人達がカメラを回すと見えたり…

トランプをしてるマダムたちのひとりが
切れてちゃぶ台返し（トランプ台返し）をしているシーン…

お父さんがキッチンの高い棚から小麦粉を取ろうとして
ひっくり返してしまった瞬間…

女の子が水道流しっぱなしで長電話してて、
食器洗い洗剤があふれる瞬間…

などなど
IKEAのキッチンを使った時の生活スタイルがとてもイメージしやすくて
あ。こんな生活したい！とか共感を生みやすい良いつくりだなーって思いました。

データ読み込みがネックです。これを解決していればもっといいのにっておもいます。
ムービーデータをflvで作ってストリミングにすれば早いのかも。
マウスの動きを映像の時間軸に変えてるだけなのでフラッシュコーディング的には
とてもシンプルで単純なものですが、これはそういうことじゃなくマッチしたプランですね（'u'）

EOVISION

amana.jpの新しいブランドみたいです。
今までの写真素材販売サイトだとサムネイルの閲覧する時、10件おきにページをリロードしないといけなくて時間がかかってしまっていました。このサイトのようにインターフェイスを色々模索して形にしている部分など、いいなって思います。

このサイトの場合、上のサムネイルにあるように、サイト上で写真を見せる方法がMOSAICとNOMALの２種類があります。MOSAIC（左）のほうは、写真の人気度合いによってサムネイルの大きさが仕分けされて、自動でレイアウトされてるのかもしれません。NOMAL（右）だとマウスホイールでスクロールができます。（MACは対応していません）

制作したのはtha:中村勇吾さん関係（？）のスタジオのようです。

lickrGraph

flickrのデータから情報を最適化しつつ、SNS系の人の繋がりをグラフィカルに表現しています。サムネイルとサムネイルが線でつながっていて、知り合いの知り合いとかがよくわかる表現になってます。でも、遊び：実験でつくってるようで、実用的な操作性ではないような気がします。

flickrのデータを拾ってくる部分がどういう仕組みかよくわかりません。
RSSとかから抽出してそうです。

サイトに行って最初は何も起こりません。上にある入力ボックス[search by flickr username]にflickrユーザーの名前を入れると始まります。