Home > work Archive

work Archive

時間が巻き戻るスクリーンセーバ 「TimeStall」(コンセプトデモVer.)

17875472_640.jpg

■ デザインハック・ミーティングVol.2 「第2回おばかアプリ選手権」にて発表したアプリです。スクリーンセーバとしてこれまでのデスクトップ作業を巻き戻すムービーを流すことで「ぼーっとしていると時間が戻って作業が無になる」感覚を得られる(かもしれない)アプリです。


これは

■MacOSXデスクトップスクリーンショットを定期的に記録するムービーを記録し、一定時間操作しない状態がつづくと保存されたデスクトップ画像を全画面ウインドウで逆転再生します。手を止めていると、そのままの画面でこれまでしてきた作業が元に戻っていくように見えるため、手を止めることへの焦燥感や、全てが無に帰すような無常観を得られるかもしれません。

デモムービーで動作をご覧ください。

“Time stall” Timemachine screensaver prototype app from dotimpact on Vimeo.

使ってみたい

BehindStone同様、バグ修正やアイコン登録などトリートメントが終わったら公開したいと思います。まだ実際にスクリーンセーバとして開発されてないですし。

生きているデスクトップを実現するアプリ 「BehindStone」(コンセプトデモVer.)

17899144_640.jpg

■ デザインハック・ミーティングVol.2 「第2回おばかアプリ選手権」にて発表したアプリです。MacOSXデスクトップを「生きている」ように動かし、デスクトップに散らかったアイコンが片付く(ように見えなくもない)アプリです。


これは

■ デスクトップアイコンが虫のようにデスクトップで動きまわり、ウインドウの下に隠れます。ウインドウを動かすと、その下に隠れていたアイコンがわらわらと動き始めます。

現状ではダミーのアイコン画像をフルスクリーンのデスクトップ画像上で動かしているのみのため、このアプリを起動したままデスクトップ操作を行うことはできません。ジョークアプリのたぐいとお考えください。

デモムービーで動作をご覧ください。

  • 作成したムービーの問題(?)のため実際の速度のよりも早く表示されているみたいです。あとで修正しますー

“Behind Stone” Living desktop concept app from dotimpact on Vimeo.

使ってみたい

おばかアプリ選手権での発表後も何人かの方から「ぜひ使ってみたいので公開してください」というお話をいただいたんですけど、現状まだアプリとして公開できる状態にないので(はじめてのCocoaアプリだったのでメモリリークしまくりです)、バグ修正やアイコン登録などトリートメントが終わったら公開したいと思います。

それと本来はこの状態でOSとして使用できる状態にしたいと思っていたので、本物のデスクトップアイコンを動かせるものかなど、アプリの挙動が技術的に可能なのかを検証して、もし可能なら完全版としてまた公開したいですねー。

iCookpadをちょっと修正しました

■iCookpad、なんか思いがけないほど好評のようで、やっぱiPhone / iPod touchで見れてうれしい人がいるんだなーと思ったいっぽう、いろいろ不具合ほったらかしで申し訳ないです。

とりあえず以下を修正しました。

  • レシピ詳細ページ
    • コツ・ポイントを表示するようにした
    • つくれぽの数を表示するようにした
    • 手順リストに番号を振り、不要な欄は表示しないようにした

■ちなみにこのブログ関連の情報をアナウンスしたり受け付けたりするtwitterアカウントを作ってみました。なんかありましたらお気軽にどうぞです(ご期待に添えるとも限りませんけども)。

あとgithubにてソース一式も公開しております。

YouTube打楽器/VJソフト(?)「TubeObstruction」

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

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

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


TubeObstruction Demo from dotimpact on Vimeo.


これは

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

操作方法

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

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

Tokyo Estate Height Map

tehm.png

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がくわしいです。

  • Comments (Close): 0
  • Trackbacks (Close): 0

Home > work Archive

Search
Feeds
Meta

Return to page top