■さくじつDeskTopLive.asにご来場（もしくはustreamで試聴）くださったみなさまありがとうございました、そしてお疲れさまでした。

ものすごい盛況でイベント自体もすごい面白かったですね。人のプログラミングの様子を見る45分ってどんな時間になるのかなーと若干不安に感じていたんですが、始まってみると思った以上に興味深くてあっという間だったです。プログラムなんてさっぱり、という感じの友人（女子）も何人か来ていたんですけども、そういう人から見ても噂には聞いていたプログラムなるものが実際に目の前でかなりのスピードで打ち込まれていくのは新鮮な体験だったみたいでした。あとASゴングのみなさま（とくに小坂さんのDirector使いっぷり＆饒舌っぷり！）も4nchor5 la6のトークもすごすぎでした。

いっぽう自分のデモはなんとも残念な感じで公開しきりでしたが…　ともかくこのイベントにむけて作ってみたものをこちらでも公開しておきます。YouTubeのストリーミング動画を物理シミュレーションで落下させて映像と音声をミックスするというコンセプトのコンテンツ「TubeObstruction」です。

• http://work.doppac.cc/as3/TubeObstruction/index.html
  • FireFox, Safariにて動作確認してます
  • ※FireFoxだと動かないこともあるみたいで、確認中です

TubeObstruction Demo from dotimpact on Vimeo.

---

これは

■Box2DFlashAS3の物理シミュレーションオブジェクトとしてYouTubeからダウンロードする動画を表示して、動画同士を衝突させて映像や音をミックスして遊ぶコンテンツです。動画のボールは壁や別のボールとの衝突による衝撃が起きた際だけ力の強さに応じて再生されます。

操作方法

• 入力フィールド（画面上段）
  • 検索ワードを入力してリターンすると、YouTubeでの検索結果から動画をダウンロードして、円形のオブジェクトとして落下します。
  • “＜検索ワード＞,3″のようにカンマ区切りで数字を指定すると、落ちる個数を指定できます
  • 検索ワードの代わりにYouTubeの動画パーマリンクを入力することで、特定の動画を指定できます
• スライダーパネル
  • 入力フィールドにマウスオーバーすることでスライダーパネルがスライドします
  • スライダーはマウスを載せてマウスホイール（スクロール操作）をすることで値の増減を操作します
  • TimeStep: 物理シミュレーションの時間単位を変えます。増やすことで時間単位が細かく（＝動きがスローに）なります
  • Gravity: 重力の値を変えます。増やすことで重力が強くなります
  • Density: オブジェクトの密度の値を変えます。増やすことで重量が増し、慣性が強くなるため衝突の衝撃が強くなります
  • Restitution: 衝突時の力の減衰を変えます。最大だと完全反射ですが減らすと衝突するたびに力が弱くなります
  • Friction: 摩擦力を変えます。増やすと衝突時に回転がつきやすいです
  • Impulse_Decay: 衝突時の動画再生の減衰を変えます。増やすと減衰が緩くなるので、再生される時間が長くなります
  • Play_Vibrate: 衝突時の動画再生を一定期間ごとに止めて擬似的なスローモーションをかけます。数値を小さくすると一時停止の間隔が速くなり、スローになります
  • Volume_Fade: 衝突時の動画再生のボリュームの減衰を変えます。減らすと速くフェードアウトします
• 動画ボールオブジェクト
  • 衝突時の衝撃の強さにより、動画が再生されます
  • ボールをドラッグして好きな場所に移動できます
  • マウスがボールの上にある時（ドラッグ中）にマウスホイール（スクロール操作）をすることでボールの大きさが変わります
  • ボールが大きいとボリュームが大きくなります
  • 動画の再生が進むと徐々にボールが大きくなり、再生が終了するとボールは消えます
  • ※動画ストリームの問題により、再生されないまま消滅する場合もあります
• ウインドウ
  • ウインドウのサイズを変えることで、オブジェクトが飛び回るフィールドを広げることができます
  • ウインドウを画面内でドラッグして移動させると、ドラッグ距離に応じてすべてのボールに力を与える（画面を揺らす）ことができます
  • フィールドは上部の見えないところで上端が切れているので、ボールを上に大きく飛ばすと戻ってこないことがあります。

---

ボールが増えれば増えるほど音像としては混沌になってしまうので、多少練習してデモではもうちょっとうまく「演奏」できるかなと思っていたんですが、前のデモの流れから説明中心のデモにしてしまったんでいまいちだったかなと。みなさまにも触ってみていただけるとうれしいです。

■http://realtimemachine.sakura.ne.jp/mashup/tokyoheightmap/

■Sun×RECRUITマッシュアップアワード応募作品です。

桃鉄ネタにつづく、GoogleMaps×ゲームインターフェイスのマッシュアップ（？）でもあります。

これはなにか

■Smatch物件検索APIで取得した物件情報を、価格を「高さ」で表しながらGoogleMapsにマッピングします。東京周辺の地価情報がグラフィカルに一望できます。

詳しくは解説ページを見てください。

つーか内部的にはたたみラボのサンプルをほとんどそのままなんですけど。あんま時間かけてなくてすいません。でも、あんまやられてないけどGoogleMapsのマーカーアイコンの切り替えをうまくすると、けっこういろんなことできるんじゃないかなーと思いまして。

GoogleMaps×スプライト

■あとGoogleMapsのマーカーをスプライト的に動かしたかったので（今回でいうと雲ですね）、APIv2でどうするか調べました。

v1のときはABAさんがやってたみたいにGMarker.point.x/yを触ってGMarker.redraw(true)、とかだったんですが、このへんががらっと変わってます。Gmarker.setpoint(latlng)というメソッド（非公開）がありました。実際のとこ、内部的には今までと変わらないみたい。ちゃんと表示順位をいじってくれるし、影も管理してくれるんで、けっこうスプライトとしてうれしいですよね。重いけど。

APIv2の非公開命令については、Unofficial API 2 Referencehttpがくわしいです。

■2年前にオープンキャンパスの子供向けワークショップで使うために作っていた「iOdorokiban」というソフトがあるんですが、また使いたいとのことで、ProcessingBETAで動くよう修正したので、公開しておきます。

久しぶりに遊んでみたけど、いまでもけっこう楽しい。

• iOdorokiban for ProcessingBeta
  • http://processing.dotimpac.to/?sample%2FProcessing%2FiOdorokiban
• iOdorokibanと映像ワークショップ
  • http://collisions.dotimpac.to/project/iOdorokiban.html

実行形式アーカイブ

■せっかく実行形式でのexportをProcessingがサポートしてるので、バイナリでも置いておきます。

• iOdorokibanアプリケーション（Windows/MacOSX/Linux)
  • http://processing.dotimpac.to/sketchbook/iOdorokiban/iOdorokiban_app.zip
  • 実行にはUSBカメラ（MacならDVカメラでも）が必要です。

Windowsでの使用方法

WinVDIG（USBカメラをQuickTime(forJava)で制御出来るようにするソフト）をインストールする必要があります。

• iOdorokibanをダウンロードして展開します。
• WinVDIG Release NotesからWinVDIG ver 1.0.1をダウンロードしてインストールしてください。
  • WinVDIGは1.0.5が最新ですが、不具合があり、前バージョンでないと正常に動作しません
• 展開フォルダの”application.windows”内にある”iOdorokiban.exe”を実行してください。
• ウインドウが出て、カメラの画像が動いていれば正常に動作しています。

MacOSXでの使用方法

Macでは特にソフトのインストールなしに、使用できると思います（が、未確認です。キャプチャデバイスの選択でこける可能性大なので、できなかったら教えてください）

• iOdorokibanをダウンロードして展開します。
• 展開フォルダの”application.windows”内にある”iOdorokiban.app”を実行してください。
• ウインドウが出て、カメラの画像が動いていれば正常に動作しています。

動かない場合の注意点

• QuickTime7.1 + WinVDIG1.0.1の環境でのみ動作確認してます。QuickTimeのバージョンなど確認してください。
• キャプチャデバイスの選択でさぼっています。デバイス名に”cam”/”CAM”が含まれるものを探すので、接続したデバイスによっては失敗します。その場合は、ソースにデバイス名直接描いて、Processingで実行するとうまくいくかもしれません。

あそびかた

ビデオ画像で驚き盤をつくります。

キーボード、マウスボタンで操作します。

• スペースキー：映像を撮影し、コマを進めます。
• バックスペースキー：前のコマを削除し、戻します。
• マウスボタン：押している間、驚き盤を回転させて動きを確認します
• pキー：画面をjpgで保存します。印刷すれば驚き盤になります。
• cキー：画面をクリアして、驚き盤を作り直します。
• !キー：デモモードです。自動的に撮影を繰り返して驚き盤風のアニメーションが表示されます。

■エイプリルフールエントリはなんかもっともらしいこと書いときゃいいだろ、と思って書いたらぜんぜんウソになってなかった。来年の4/1までにはもうちょっとウソがつけるようになっておかないと。

そんなわけで、「GoogleMaps上でサイコロが振れると桃太郎電鉄みたいでいいなー」というまえまえから暖めていたアイデアをあわてて作ってみたものです。

このページでダイスを振る

GoogleMaps上での使用例

bookmarkletとしても動作するようにしました。以下のスクリプトを任意のwebページを開いてアドレスバーかブックマークに登録しておいて実行すると、そのページでサイコロが転がります。

javascript:(function(){var d=document;var h=’http://realtimemachine.sakura.ne.jp/dice/js/’;var s=d.createElement(‘script’);s.src=h+’dice.js’;d.body.appendChild(s);var s=d.createElement(‘script’);s.src=h+’dicebm.js’;d.body.appendChild(s);})();

まあネタ以外のなにものでもないですが、桃鉄のあのゲーム画面にサイコロが転がる感じはいまだに好きなんで、なんかこういう感じがWebにもあるといいよなーと思っているところです。

■ RecommuniHacks の続きで、 Recommuniでダウンロードした曲にアートワークを追加 なんてのを作って遊んでいたんですが、これがけっこう楽しくてふつうの曲でもやりたくなったので、Amazonから（アーティスト名とアルバム名で該当すれば）アートワークを追加できるスクリプトを書きました。

blog.bulknews.net で宮川さんがつくってた「 iTunes のアートワークを Amazon Web Services からとってくる 」とおんなじですが、まあActivePerlとモジュールがインストールされてなくても使える、というのが利点かなと。AWSのディベロッパトークン（というのですか）は必要です。 Amazon Web サービス登録ページ で登録すればもらえます。ぼくもさっきもらいました。

だいたいもともとCDDBのアーティスト名／アルバム名だろうからAmazonで引っかからないのも多いし、てきとうに書いてるのでうまくいかないかもしれませんが、とりあえず。

• http://processing.dotimpac.to/index.php?sample%2FJavaScript%2FAddArtworkfromAmazon