Home > diary > ggg に行きまくって気づいたメモ

ggg に行きまくって気づいたメモ

ggg が職場から徒歩5分の距離なので、「見て感動する」→「記憶を頼りに家で真似てみる」→「また行って自分のと比べてみる」→「なんで気持ちいいのか考える」を繰り返すという、なかなか刺激的な生活を満喫しています。

FFFFound の地図写真(GoogleMaps)のやつ

ちょうど自分も地図写真(UMap)をいじってたので、今回の展示で一番興味深く見てました。リクルートが扱う情報には地図と連動させると有用な商材が多いので、「ユーザを惹きこむ地図の見せ方」として参考になることが多かったです。以下気付いたりやったりしたこと:

  1. でかい上空写真ってそれだけでカッコイイな。
  2. しかも静止写真じゃなく、ちょっとでも動いているとさらにカッコイイな。
  3. UMap で同じようなのを作ってみる。uMap.panByXY(new Point(1, -5)); みたいにすれば地図をピクセル単位で動かせるんです。
  4. あまりに真似っ子だったので、時計と絡ませ(それもどうかと思うがw)、秒針に合わせて地図がトゥイーンでギュンって毎秒移動するようにしてみる。
  5. なんか写真として楽しめなくなる。やっぱ地図移動はじわじわスクロール移動の方がいいみたい。
  6. 移動量が大きいとタイルのロードが間に合わない。スクロール量は少なめに。初期表示分はさらにロード時間を確保しておく必要あり。→一定秒数マスク用矩形をオーバーレイして隠しておく。なるほど ggg のも黒バックで情報表示してる時間があったな。たぶんあれは裏で地図ロードしてるんだろうな。
  7. 作ってたサンプルを見てくれたiandeth の石橋さんが VirtualEarth の BirdsEyeView が面白いよと教えてくれて、見てみたら写真の質もとても良かったので、そいつを Flash 上で表示させてみようとする。
  8. UMap じゃ BirdsEyeView は表示できないっぽい。ネットを探すと「Lost In ActionScript」の人が BirdsEyeView 等のタイリングライブラリを公開してくれてる。
  9. いろいろいじくり、ローカルで動作確認できたが、FTP すると地図が表示されない。いじりすぎておかしくなったのかと思い、ダウンロードしたオリジナル swf をそのままアップするも、BirdsEyeView のサンプルだけがもとから動かない。たぶん Sandbox エラーだろうけど、どう対処すればいいのか分からんのでとりあえず頓挫。
  10. 地図写真の見せ方とは別に、音と絡ませる結構いいアイデア思いつく。これで差異化できるかも。
  11. もう一回 ggg 見に行く。ベジェ曲線で各国(gggのはテキスト→国だけど)を結ぶ表現カッコイイ。
  12. 表示場所はプリセットで決め打ちしているっぽい。白テキストが上手く見えるように場所を選んでいるかも。人力でポイントをガーっと入力しておくっていう「生身の人間の手作業の跡」っていうのはユーザ側から見ても素敵に感じるんじゃないかなと最近思ってる。
  13. フォントはたぶん Helvetica。自分のも文字をピンクにしてしまいそうでヤバい。→水色にした。地図右下、左下ともに白地でGoogleロゴが小さく入ってた。
  14. 上から下にラインがビーってなる写真と黒マスク板とグラフィックのトランジションのやり方が上手い。

作ってるものに関してはまだまだパクリの域を出ていないので公開はやめときますー。

ggg の展示作品のほうはデバイスが絡んでるから東京にしかないのかな?逆に大阪にしかない作品とかもあるんやろか?

MoMaのやつ

線の動き気持ち良過ぎる。大画面で見るとラインが途中でウニョウニョくね曲がってるのがよく分かるのでさらに驚きました。二次三次ベジェ(ベジェハンドラが始点終点の両方から出てる線という認識でOK?参考)かと思ってたけど、ラインがだんだん透けていってるってことは細かく lineTo してるんかも。どういう軌跡計算してるんだろか、スゲー。

展示の見せ方として、超縦長コンテンツが一番下まで行ったらどうなるか待ってたら、最下端でそのまま折り返した。なるほどそういう見せ方かー。

AmazType

4枚のパネルで四文字熟語構成・表示のタイミングが素敵。展示専用にこういう見せ方をしてくれるおもてなしっぷりが素敵ですねぇ。でもこれ会場の秒音と何か連動してるんだろか?B1の展示の興味深いところは「数多く展示されてる時計表現の中で、どんくらい小さい動き・時計らしさを抑えた表現でも時計に見えるか?時計として気持ちよく感じれるか?」の境界線を探せることだと思う。画面が大きく切り替わるタイミングが作品ごとに、秒単位・何十秒単位・分単位といろいろあり、展示としてどれくらいのペースで画面変化すると見入るか?みたいなことは、ユーザがリアルに「立つ」、バーチャルに「サイトアクセスする」時の注意払い度合いというものを考えさせてくれる。

佐藤かしわのやつ

よく見りゃ小さい矩形が秒針に合わせてアルファで明滅してる。
グリッドで見せるためにクレジットの行数を制限して、切れた部分は Read More させる見せ方は参考に覚えておこう。

地下のWebカムのやつ

いつ顔キャプチャされるかヒヤヒヤなのでもう近づけないw

サッカーのやつ

つくづく、あのリアルタイムトラッキングっぽいことって Flash でできるのか!!と驚く。

地下のプロフェッショナル仕事の流儀の文字のやつ

面白そうなのでやってみたい。アプローチは違うけど、にとよんさんの PotrAs 触らせてもらおう。前は超絶すぎそうで触ってなかったから。。

粘土の時計のやつ

インスパイア元っぽいジョン前田さんのグラフィックは僕も本で見たことがあるのだけど、あれは動くのかな?この粘土のはyugopさんらしい動きがついてて、これまた心地よい。分裂してエリア広がる時に画面がバウンス(まぁ自作なのでしょうね)して広がるとかすごいディテールだなぁ。
分裂する時と、新規に小玉が登場する時がある。ややもすると最終の4×4のグリッド内で展開していくように思ってたけど、そうではなくて超ランダムにグリッドの制約なく粘土が広がっていくようなコードになってる。(言い表しにくいけど)

白バックで跳ねるやつ

スロー撮影して地面に跳ね返った時に時計がでるということだけは分かったのだけど、何か裏テーマがあるんでしょうかね。たぶん展示作品の中では「観客を待たせる」ほうの作品なので、パッと見せて驚かさないとユーザに次に行かれてしまう Web とは違う文脈で見るのかな?分んなかったけど。

まだまだ行く予定、追記予定。

Comment:0

Comment Form

コメントを表示する前にこのブログのオーナーの承認が必要になることがあります。

Remember personal info

Trackback:0

TrackBack URL for this entry
http://www.trick7.com/blog/mt-tb.cgi/780
Listed below are links to weblogs that reference
ggg に行きまくって気づいたメモ from trick7.com blog

Home > diary > ggg に行きまくって気づいたメモ

持っている Flash & ActionScript 関連本の中から、自分的おすすめの読む順番をご紹介。各書籍のレビューは books カテゴリからご覧頂けます。
この順番でどう?(AS3.0)
  • Adobe Flash CS3 詳細! ActionScript 3.0 入門ノート (DVD付)
    Adobe Flash CS3 詳細! ActionScript 3.0 入門ノート (DVD付)

    デザイン方面からFlashデビューして、そのままAS2.0を使うようになった人が、難しいと評判のAS3デビューする時の最初の1冊として、とにかく目を通しておくと良いかと思います。プログラミング経験の少ない方でも、サンプルをじっくり読めば、ゼロからのAS3デビュー可。
  • ActionScript 3.0 アニメーション
    ActionScript 3.0 アニメーション
    洋書「Making Things Move!」の日本語訳本。ActionScript3.0で数学的アニメーションを作ることがメインテーマなのですが、前半部分でAS3.0の基礎を分かり易く解説されています。後半の重力, IK, 3D表現等のアニメーション解説も楽しい。僕はこれのAS2.0洋書版を読んでFlashの面白さに気付きました。
  • Adobe Flash CS3 詳細! ActionScript3.0入門ノート2 (CD-ROM付)
    Adobe Flash CS3 詳細! ActionScript3.0入門ノート2 (CD-ROM付)
    この次の辞典のような洋書を読む前の事前知識としてこの本の内容を理解しておくといいかも。
  • Essential ActionScript 3.0 (Essential)
    Essential ActionScript 3.0 (Essential)

    900ページ以上ある相当分厚い本。基礎からOOPまでを解説。ほぼ網羅しているので、これを抑えておけばAS3博士になれそう。
  • Actionscript 3.0 Cookbook
    Actionscript 3.0 Cookbook

    ActionScript3.0のリファレンス本。問題とその解決法が1ページぐらいで細分化されているので空いた時間にちょっとずつ読み進められる。WebでAS3のソースを見て勉強する時の字引としても使う。ただ、時期的に初期の本なので、AS3自体が仕様変更してたりするので正誤表は必読。
  • Object-Oriented Actionscript 3.0
    Object-Oriented Actionscript 3.0

    7/23に発売されたFlash&OOP本。AS2.0版は持っているのだけど、オブジェクト指向の初歩的な解説から入って、後半は僕の理解を超える難度になっていきました。今度こそ理解できるか?
この順番でどう?(AS2.0)
  • Foundation Actionscript Animation: Making Things Move (Foundation)
    Foundation Actionscript Animation: Making Things Move (Foundation)

    スクリプトでアニメーションさせる方法を学べる。プログラムの知識というよりも数学や物理の知識が必要。バネの表現や3D表現など、汎用性の高いテクニックを身に付けられ、個人の表現力をレベルアップするのに最適。参考までに、僕が調べた英単語リスト。2007年4月に、AS3対応版も発売されました。
  • ゲーム開発のための数学・物理学入門 Beginning Math and Physics for Game Programmers
    ゲーム開発のための数学・物理学入門  Beginning Math and Physics for Game Programmers

    「Making Things Move!」の世界を突き詰めたい人用のステップアップのための本。行列や物理運動、2D/3D表現。Flashの本ではなく、じっくり読むタイプの本なので、あとまわしにしてもいいかも。
  • Flash 8 Essentials
    Flash 8 Essentials

    Flash8の新機能を紹介。全10章が独立した構成で、興味のある部分から読めます。フィルタやビットマップ、ビデオの使い方とかを、基礎から順を追って理解していけるので、ゼロからスクリプティングできるようになる。僕はビットマップ関連の作業の際のリファレンスとして常用しています。
  • .fla―Idea of Flash Creation
    .fla―Idea of Flash Creation

    上の本でFlash8の基本を身に付けて、それをどう面白い表現に落とし込むかを学べます。深津さんの、試行錯誤・実験しやすいスクリプティング、クラス設計に凄さを感じました。YouTubeやFlickrのAPI、PHPとの連携記事も。
  • FLASH ActionScript 2.0入門完全ガイド+実践サンプル集 [CD-ROM付]
    FLASH ActionScript 2.0入門完全ガイド+実践サンプル集 [CD-ROM付]

    ここまでで表現力が付き、テンションが上がるので、その勢いで難解なオブジェクト指向に挑戦。プログラム経験のない人がいきなり英語のOOP本を読むのは厳しい。この本で継承とかインターフェースとかポリモーフィズムとかの用語を理解しておくといいかも。
  • オブジェクト指向でなぜつくるのか―知っておきたいプログラミング、UML、設計の基礎知識―
    オブジェクト指向でなぜつくるのか―知っておきたいプログラミング、UML、設計の基礎知識―

    Flashの本ではありませんが、OOPの概念を気軽に読めるボリュームで解説してくれます。英語と日本語のOOP用語の対応を図るためにも「Object-oriented Actionscript for Flash 8」と併読するのがおすすめ。なんとなく読んでおくだけでも結構違うのでは。
  • Object-oriented Actionscript for Flash 8
    Object-oriented Actionscript for Flash 8

    前半はOOPの利便性や基本の紹介。デザインパターンやMVCの理解。13章からグッと難しくなって大変。Flash8対応。
  • Essential Actionscript 2.0
    Essential Actionscript 2.0

    上の本よりもさらにOOPプログラマ向け。同じOOP本ということでやや重複しており、こちらはMX2004時代の本なので見送ってもいいかも。分かりやすい英語で良著。この本のAS3版が出たら間違いなく買い。

Page Top