日曜日, 11月 01, 2009

クロアチアから帰ってきた

クロアチアに1週間ほど滞在し、展覧会のオープンを見届け、無事帰国して参りました。
今回僕達を読んでくれたのはKONTEJNERという団体で、インディペンデントで展覧会などの企画をしている。

クロアチアの「Device Art」と日本の「デバイスアート」は、名前は同じだけど少し性格が異なっていて、それをうまく対比させる目的があったようです。トリエンナーレ形式で、今回が3回目。IAMAS関係者が多いのはアルスエレクトロニカでのキャンパス展が面白かったかららしい。

確かに日本の作品はプロダクトのような形式なのに対し、クロアチアやスロベニアの作品はキネティックスカルプチャーと言った感じ。同じなのはそれぞれ身の回りにあるものや技術を使って作っているということや、ナンセンスであるということ。ナンセンス、というのは微妙な表現だな。明らかに遠回りで、冗長なのだけど、だからと言って単に意味がないという訳ではない。

初日
マヤとステファンが空港まで迎えに来てくれて(ステファンがデバイスアート展のポスターを広げながら待ってた)、滞在するユースホステルまでの途中、建築中のクロアチア初の現代美術館や図書館、コンサート会場などを教えてくれた。

ホステルに着くとIAMASの先輩達が待っていて、一緒に夕食。案内してくれたのはマリーナ。ボランティアで展覧会のこととか全然知らなかったけど日本文化を勉強してるからってので頼まれたらしい。こういう感じが最高。
成田からフランクフルトまでの機内食を普通に夕食レベルで食べ、フランクフルトからクロアチアに来る途中のフライトでもサンドイッチが出て、しかも近くに乗ってた日本人のおばちゃんが食べられないからってくれた分まで食べてしまったので全然お腹は空いてなかったけどスープやサラダを食べた。おいしい。オリーブオイルやバルサミコ酢が新鮮な感じ。
食事後は僕とそう君、マリーナで夜の街へ繰り出す。マリーナの友達も合流してクラブ的なところへ。凄く混んでた。

2日目

展覧会場に入って準備。ビゴルとカメリアが連れてってくれる。カメリアはジャパノロジーを勉強していて、百人一首とか和歌を勉強したらしい。英語で話してたら「日本語でいいですよ」と言われ、帰ったらもっと英語勉強することを決意。カメリアは日本語に訳すと椿。


会場は隣がMočvaraというクラブで、元々は鉄工所だったところを改装した建物。若者には人気の場所らしい。クロアチアのこういうとこはあんまりガイドに載ってないしネットでも見かけない。

お昼は会場近くのサンドイッチ屋でサンドイッチを頼む。チーズとかハムとかが挟んであるパンを選んで、トーストしてもらう。野菜とソースを選べるが、野菜は何種類選んでも料金は同じ。今回の企画を手伝っていて、ベルリンで活動しているサウンドアーティストの森田さん、IAMAS後輩のそう君と近くの川岸で食べる。

3日目
オシロスコープも届き、勘で使い方を覚えながら調整。読めないというほどではないが何故か波形が汚く読みにくい。マシンはMac OS10.4でPPCのminiMac。最新のProcessingだと起動しなかったが(おそらくstartup commandの問題)1つ前のバージョンにしたら動いた。

夜は川北さんと渡邊君で軽く御飯。ピザなど。

4日目
会場での作業が本格的になってきて、暖房が入った。


これで温風が送られて会場が暖められる。


中から見るとこんなの。

僕の作品は2階で、温風が来なくて寒かったが、キュレーターのオルガがアウターを貸してくれた。

マシンを直前で手配できたiMacのSnow Leopardに取り替えてもらった。動作が軽くなり波形も綺麗になる。動作が重い→音が悪くなる→波形が汚くなる、と推測。
代わりにAWTのTextEditorから日本語入力ができなくなるが、使うのはビゴルとカメリアくらいなので今回はこれでいくことにした。。本当にコンピュータはわからないことだらけで、よくこんなものを使って作品なんて作ってるなと毎回思う。僕はあまり作品という意識はなく、自分用だけど。

オープン前日という雰囲気では全くなかったが、森田さんは「できちゃうんですよねーこれが。去年もそうでした。」と余裕。

5日目
オープンは19時からで、本当に沢山の人が集まった。森田さんの言葉通り、ちゃんと展覧会ができ上がっている。
彼はオープニングに合わせて髪を切ってきた。流石です。

キュレーターのスンチザに教えてもらった店で切ったらしいんだけど、普通の家を改装したようなところで、鏡とか椅子とかがアンティークな感じだったらしい。「自分の好きな部屋で、好きな客の髪を切りまくる、というのは良い仕事だね」という話をした。僕はずっと坊主で自分で切ってるけど、そういう店なら行ってみたい。

山辺さんの作品前で記念写真を撮るのが流行った。左端に写っているのがマルコで、今回の会場の設営のリーダー。展示台やスクリーンは全て発泡スチロールで、会場の照明は青とブラックライト。建物の雰囲気によく合っている。


Močvaraでサウンドイベントが始まる。オープニングということでハウスとかがかかってパーティ!って感じかと思いきや本気のノイズだった。

23時過ぎても全然人が引く気配がなく、0時過ぎてようやく閉めたんだけど、平日だし次の日も平日なのに本当に皆元気でびっくり。ちゃんと遊んでちゃんと仕事もする感じはYCAMとかにも近いかも知れない。

6日目
プレゼンの日。と言ってもツアーしながら各作家が説明をするだけなんだけど、作品がインタラクティブなだけに質問と体験が一緒で、次第に人が拡散してしまい、僕に回ってくる頃にはもう個別にどうぞって感じになった。もうひとつの会場Nanoもオープン。寿司バーが隣にあって、ケータリングしたらしいけど、着いた頃には全部なくなってた。ひたすらワインを飲まされ、また夜の街に繰り出して飲んだ気がする。
トラムは24時間動いていて、結構深夜でも皆遊んでいる。4時になると警察が来て強制的に全ての店が明るくなるそうで、どんな悪そうな奴もちゃんとそれで帰るらしい。見てみたかった。

7日目

スンチザの家でホームパーティをしようということで、森田さんやウィルと一緒にマーケットで買い物。


魚市場もある。マグロとサバっぽいのとサンマっぽいのとニジマスっぽいのを買う。
寿司、サバっぽい味噌煮、サンマっぽい刺身、ニジマスっぽい塩焼きに決定。

昼頃に一旦解散して僕らはお土産を探したり。

クロアチアのデザイン協会。ギャラリーができたのは最近らしい。
HelveticaでHrvatica(クロアチアの女の子という意味)と書かれたTシャツと協会の年鑑を買う。おまけでTシャツをもう一着もらった。クロアチア語版のQuick brown foxみたいなやつ。

スンチザはいつも変わった服を着ていてお洒落なので、そう君がどこで買ってるのか聞いた。最初は一緒に買い物に行く予定だったけど忙しくて都合がつかず、ステファンが連れて来てくれた。彼も忙しいのですぐまた戻って行ったのだけど。


prostorというクロアチアで唯一のストリートスタイルの店で、取り扱ってるブランドや展示してる作品はほとんどクロアチアの作家によるもの。一周年記念で今まで展示した作家の作品を並べてるらしい。バッジを買う。ここもガイドには載ってなくて、中心地には近いけど普通には見つけられないところにある。流石にキュレーターはいいものを知っている。

会場近くでやってたサーカスを見て、スンチザの家へ。


彼女はラム肉を焼いてくれて、僕らは森田さんを中心に魚料理を作った。僕はほぼ洗い物係。学生時代もそうだったけど、できるアーティストは確実に料理がうまい。曰く「アーティストは味覚に敏感じゃないとね」。
おそらく味覚もそうだけど素材選びから調理の段取りから食べてる時の会話まで、やはりこういう場では問われるという印象。


猫抱きまくり。

8日目
滞在最後の日。午前中は散歩しつつお土産探したり。午後は会場で皆にお別れの挨拶して、カトリーナに車で空港まで送ってもらう。彼女はアニメーションが作りたいらしく、日本のアニメにも詳しかった。渋滞ですごく時間がかかって、ちょっと乗り遅れたら良いのにと思った。

本当にこれからって感じで、30歳くらいの人達に熱気があって、面白くなりそう。
森田さんも話していたのだけど、毎回成立するかしないかギリギリの感じだけど、意外と本質を突いているというか、「これでいいんじゃん」という驚きがあるらしい。何より熱意と勢い。そういうのに「やられてしまった」と。
普通展覧会を開くとしたらどこかの大学や美術館、ギャラリーに所属してとか、資格が必要だとか考えてしまいがちなものだけど、とにかくやってしまえばいいんじゃないかということ。

いつだって何かにやられてしまいたいし、後先考えずにやってしまいたい。勿論クロアチアと日本では状況も違っていて、クロアチアの場合はKONTEJNERが今まさに一番上の世代。日本にはもう既に色んなものができてしまっている。
人口も違うし、働き方も違う。山辺さんの作品が動いてなかった時に、日本時間で23時くらいだったにも関わらず普通に事務所につながったことに皆驚いていたらしいが、日本はそうでもしないと回らない仕組みになっている。普段働いている時にも無駄なこととか、こんな作業いらないのではと思ったりするけど、経済を循環させるという意味や、雇用を創出するという意味では仕方ないのかも知れないとも思う。でもおそらく皆もっと本質的なこととか、直接反応が返ってくるようなことを求めていて、サードプレイスみたいな発想が生まれてくるのだろう。

帰ってくる途中の飛行機のニュースでは子育て給付金や失業率がどうのという話題。放送された短い内容だけでは判断できないが、インタビューされている人は「給付金が出たら寿司を食べたい」と言ってたり、「政府には安定した雇用を作り出すよう努力して欲しい」みたいなことを言っていて、これでは駄目だろうなと思った。勿論こういうことが最低限保証されるのはいいことだとも思うし、泥沼から抜け出す第一歩のためのセーフティネットは必要だろう。けど、考え方から変えないといけない気がする。先日会社の先輩と温泉に行った時にご一緒した伊藤さんが考えてることとか、面白いと思う。彼は建築や食べられる野草にも詳しく、モンゴル武者修行ツアーを組んだり、パン教室を開いている。

だらだらしている間に27歳になってしまったが、しがらみとか失うものがない今がちょうどいい時期なのかも知れない。何となく考えていることを実行に移していきたい。

火曜日, 10月 06, 2009

レイヤーカンプからWeb用のJPEGに書き出すJavaScript

Webデザイン(ワイヤーフレームから絵を起こす作業)はPhotoshopで常人の理解を超える数のレイヤーを駆使して行われます。そしてそれをコーダーと呼ばれる人達に渡してブラウザで動くようにしてもらったり、クライアントに対してこのデザインでいいですかという確認をとるために、マウスオーバーでこうなって、ボタンを押すこうなる、みたいな流れがわかるようにJPEGでスクリーンショット的な画像を書き出します。このような場合に「レイヤーカンプ」という機能を使い、それぞれのシーンを作っておくと便利です。

で、いつもJPEGに書き出す際に「Webおよびデバイスに保存...」をしてるのですが、数が増えてくると面倒(一度本当に嫌な思いをしました)なので、レイヤーカンプから自動でシーン毎のJPEGを書き出してくれるスクリプトを書きました(その時に書けば良かったです)。
「別名で保存」と同じようなものは既にファイルメニューにありますが、Webおよび...のやつがなかったので(少し変えればPNGなどにも書き出せます)。
exportLayerComp.jsx

使い方:
1.上の.jsxファイルをどこでもいいので保存して下さい。
2.Macの場合はホーム(デスクトップではありません。家のアイコンの場所)に、Windows場合はC:直下にlayercompsという名前のフォルダを作ります。ここに画像ファイルが書き出されます。
3.Photoshopのメニューからファイル>スクリプト>参照...を選びます。
保存したexportLayerComp.jsxを「読み込み」でレイヤーカンプにつけた名前の通りのjpgが書き出されます。
ファイル名はレイヤーカンプと同じ名前になります。日本語だったり長過ぎるとうまくいかないかも知れないです。書き出されるフォルダの位置や名前を変えたい場合は、任意のテキストエディタでexportLayerComp.jsxを開き、
filePath = ""
の二重引用符内を好きなフォルダのパスに置き換えて下さい。
Windowsの場合は\(または¥)に注意して下さい。一つだと次の文字が特殊文字として扱われてしまうので、階層の区切りには2つ入ることになります。

デフォルトでの書き出しの設定は普通にWebおよび...をした時と同じにしてあります。
画質を変更したい場合は、
exp.quality = 70;
の値を0から100の範囲で指定して下さい。

exp.format = SaveDocumentType.JPEG;
のJPEGのところを変更すればCOMPUSERVEGIF, PNG-8, PNG-24, BMPで書き出しできます。ファイルの拡張子を追加している".jpg"のところも合わせて変えるのを忘れずに。

細かい設定などはAdobe Photoshop CS3/スクリプティングガイドフォルダ内にPhotoshop CS3 JavaScript Ref.pdfというのがあるので参照して下さい(106ページ)。ここからダウンロードもできます。

下記のサイトを参考にしました。
Adobe Photoshop CS3自動化作戦
PhotoShop JavaScript(ExtendScript):Note - ホコホコ hoko-hoko

書き出すファイルや画質の設定をGUIでできるようにしたいのだけど、それはまた次。
こういう感じで社内のワークフローを楽にしてくれる専門の人っていないのかな。

木曜日, 9月 03, 2009

openFrameworksでSndObjを使う

Programming Interactivityに載ってた。著者のJoshua NobleさんがofxSndObjを作ってるのですね。

前回ofxMSAPhysicsでものすごく面倒なやり方をしてましたが、これは僕がXcodeの使い方をわかってなかった。
XcodeのProjectメニューからAdd to Project...して追加したいaddonのsrcフォルダとlibフォルダを選べばいいだけのことでした。それでXcodeの画面で追加したsrcとlibsをaddonsというグループにまとめておくという流れ。XcodeのGroups & Filesは実際のフォルダ構成とは別物。合わせておくとわかりやすい場合もあるというだけ。

僕のopenFrameworks関係のフォルダ構成は
+of
-addons_contributed
+of_preRelease_v0.06_xcode_FAT
-addons
+apps
-addonsExamples
-examples
-sketch
-libs
-other
-samples

という風にしていて、標準で入っているaddonとそうでないものを分けています。ofxSndObjはaddons_contributedに入れてる。samplesはネットとかで拾ってきたコードを入れておくフォルダ。

以上を踏まえて新しいemptyExampleをsketch以下にコピーして名前を変えた後、ofxSndObjのsrcとlibsを追加し、testApp.hとtestApp.cppを以下のようにすればお約束の440Hzのサイン波が鳴るはず。

testApp.h
#ifndef _TEST_APP
#define _TEST_APP


#include "ofMain.h"
#include "ofxSndObj.h"
#include "AudioDefs.h"

class testApp : public ofBaseApp{

public:
void setup();
ofxSOTable t;
ofxSOOscillator o;
ofxSndObj sndobj;
};

#endif

testApp.cpp
#include "testApp.h"

void testApp::setup(){
sndobj.startOut(true, 1);
t.init(sndobj, 2500l, SINE, 1.f);
o.init(sndobj, t, 440.f, 10000.f);
sndobj.setOutput(o, OFXSNDOBJOSCILLATOR, 1);
sndobj.startProcessing();
}

土曜日, 8月 22, 2009

2009年8月22日

通常業務が忙しくなるタイミングとチームのメンバーが夏休みに入るタイミングが運悪く重なり、加えて重い新規案件で先週から働き詰め。ようやく今日完全に休みになったけど明日は出社して月曜日のプレゼンに備えなければならない。

9月末まではこれに付きっきりになりそうで、今月末にとる予定だった夏休みは先延ばし。(#^ω^)というところにメールが届いて、10月にクロアチアのザグレブで開かれるデバイスアートの展覧会にsonicodeを出品できることになった。渡航費と滞在費が出るということで、夏休みをそこに思いっきりぶつけることにした。こんな機会でもなければ行くこともなさそう。

ちょうど10月には別件で展示のお誘いがあったので両方に使える形でうまいことアップデートしたい。

などと考えつつBBOY PARKに行く気力もなく家でだらだらと勉強。
Programming Interactivity」はProcessingとArduinoとopenFrameworksでインタラクティブアートを作るための本。考え方や興味が近いので、デザイン方面からプログラミングに入った人には理解しやすいと思う。短期集中で一気に読みたい。一緒に買った「Beautiful Data」は美学寄りというか論文的な内容。こういうのが基本にあるかないかでアウトプットも違ってくるだろうな。Radioheadの「House of Cards」の制作背景についても載ってる。

あとは「かんたんプログラミングCGI/Perl」。Perlはネットで面白いことしてる人が結構Perl使いが多く、会社で使える便利スクリプト(スケジュール確認とか)を書いてる人もそうなので是非とも覚えたいところ。初めてCGIを動かす時に想定されるエラーや、その原因と対処法も書かれていて、丁寧で読みやすい。

pythonも好きなので「集合知プログラミング」に加えて「Think Python」というフリーの本を読んでいる。How to Think Like a Computer Scientistという副題がとてもそそる。インタラクティブアートに興味を持ったのはああいう発想がどういうところから出てくるのかがわからなかったから。そもそも現代美術に興味を持ったのもそうだった。調べていくにつれ、それぞれの分野にはそれぞれの文脈があり、突然それに出くわした人にはショックだったりするが作った本人にとっては割と当然の流れで作っていたりするものなのだと知った。そういうところでここ2、3年興味があるのはプログラマ(少し前だったら広告で何千万というお金を使ってどう面白いことをするか、みたいな発想に憧れてたけど、このご時世だし)。

この間試したEcho Nestとかもそうだけどデータの可視化、可聴化で何か面白いことをしたい。

プログラマの人達は本とか読まないでも色々できてしまうのかなと思っていたけど、実は逆というかものすごく本を読んでいる。だからこそ頭にも叩き込まれているんだろうなと思い、最近はできるだけ僕も買うようにしている。彼らが自宅作業を好むのも会社より資料が充実しているからのようだ。思えばうまいデザイナーもそうだった。やっぱりいいものを見ている。

火曜日, 8月 11, 2009

Processing IDEからEcho Nest APIを使う

Echo NestのJavaクライアントが出ていたのでProcessingで動かしてみた。
Echo Nestが何なのかよくわかってないけど、とりあえずネットと音という大好きな要素が混ざっている。
曲やレビュー、記事のリコメンドからテンポ、ビート等の音響解析にも使えるらしい。

まずはdeveloper用のサイトでEcho NestのAPI Accountを取得してAPI Keyを発行してもらう。
サイトも綺麗だしブラウザから実行例を見られるので勉強しやすい。APIキーとか入れといてくれてる。

Echo NestのJava APIをダウンロードする。

Javaのライブラリなので、OSXの場合"ユーザ名/Library/Java/Extensions"以下にEchoNestAPI.jarを置いて.bash_profileにCLASSPATHを書くのでもいいけど、Documents/Processing/librariesの中にEchoNestAPIというフォルダを作り、さらにlibraryフォルダを作って、その中にEchoNestAPI.jarを入れても動く。ProcessingのIDEから簡単にimportできる。

JavaのサンプルそのままだとProcessingのIDEの場合for文のところでエラーになってしまうので書き換えた。
import com.echonest.api.v3.artist.Artist;
import com.echonest.api.v3.artist.ArtistAPI;
import com.echonest.api.v3.artist.Audio;
import com.echonest.api.v3.EchoNestException;
import com.echonest.api.v3.artist.Scored;
import java.util.List;

String API_KEY = "自分のAPI KEY";
String ARTISTNAME = "weezer";

ArtistAPI artistAPI;

try {
artistAPI = new ArtistAPI(API_KEY);
List<Artist> artists = artistAPI.searchArtist(ARTISTNAME, false);
if(artists.size()>0) {
for(int i=0; i<artists.size(); i++) {
Artist artist = artists.get(i);
List<Scored<Artist>> similars = artistAPI.getSimilarArtists(artists, 0, 10);
println(" === Similar artists for " + artist.getName() + " ===");
for(int j=0;j<similars.size(); j++) {
Scored<Artist> simArtist = similars.get(j);
println(simArtist.getItem());
}
}
}
}
catch(EchoNestException e) {
System.err.println("Trouble: " + e);
}


実行結果
=== Similar artists for Weezer ===
The Smashing Pumpkins
Ozma
Biffy Clyro
The Breeders
Rivers Cuomo
Nerf Herder
Jimmy Eat World
Foo Fighters
Veruca Salt
The Flaming Lips
=== Similar artists for Weezer Tribute ===
The Smashing Pumpkins
Ozma
Biffy Clyro
The Breeders
Rivers Cuomo
Nerf Herder
Jimmy Eat World
Foo Fighters
Veruca Salt
The Flaming Lips
=== Similar artists for Matt Sharp (of Weezer, The Rentals) ===
The Smashing Pumpkins
Ozma
Biffy Clyro
The Breeders
Rivers Cuomo
Nerf Herder
Jimmy Eat World
Foo Fighters
Veruca Salt
The Flaming Lips


開発者の人のデモがここにある。eclipseで開発してる。

*2009年11月11日追記
EchoNestAPIを使用する場合はJavaのバージョンを1.6にする必要があります。
Applications/Utilities/Java Preferencesを起動して、GeneralタブのJava ApplicationsのJava SE 6を一番上にする。

で、いつの間にかechonestp5というものができてた。

日曜日, 7月 26, 2009

openframeworksでaddonを試す

FATで入ってるaddonはいいとして、他のaddonを使う時はどういう方法がいいのかなと思って試してみました。かなり愚直なやり方です。

ofxMSAPhysicsを使ってみる。
processingのtraer physics(いつの間にかソースが公開されている!)に似たAPI。

1.ダウンロード
svnがわかる人は
svn checkout http://ofxmsaof.googlecode.com/svn/trunk/ ofxmsaof-read-only

わからない人はミラーからダウンロードできます。
ofxPhysics以外にも色々入ってます。

2.プロジェクトを作る

apps/examples/emptyexamplesフォルダをコピーしてペースト。フォルダの名前をPhysicsTestとする。その中にaddonsというフォルダを作り、ダウンロードしたフォルダの中からofxMSAPhysicsとofxObjcPointerをコピーしてaddonsフォルダの中にペースト。srcフォルダ以外を消しておく。
ofxObjcPointerはメモリ管理に使っているらしい。

xcodeprojファイルを開いて、Finderからaddonsフォルダをドラッグして「Groups & Files」にドロップ。日本語環境だと「グループとファイル」。僕は調子こいて英語にしています。

ダイアログが出てくるので多分そのままOKすればいい。上の方にフォルダをコピーするかどうかチェックする項目があるけど、今回はプロジェクト内に既にコピーしてあるのでチェックは外しておく。ラジオボタンは「Recursively Create Groups for any added folders(追加したフォルダに再帰的にグループを作成する)」方で。src以外を消したのはここで変なことにならないため。

これで準備完了。

3.コードを書く
examplesの中身をコピーしてもいいですが、複雑なので使い方を覚える意味でも必要そうなところを抜き出して改変しました。マウスをクリックしたらボールが落ちてくるサンプルです。キーボードを押すと消えます。

ofxMSAPhysics physics;
でofxMSAPhysicsクラス型を宣言して、physics.makeParticle(x,y,z)でパーティクルの生成。
p->xとかが何なのかわからない場合はSBAW09の第11回目とかOF for Processing usersとかOoops!を参照。

ソースコードがうまく貼付けられなかったのでプロジェクトごとアップしました。
physicsTest.zip
---
*2.についてもう少しましなやり方を後日知った

月曜日, 7月 20, 2009

hysyskとかmrrychとかいい加減にしよう

myfye.net
丸尾君の新作。おんぶにだっこのだっこ担当(クライアントサイド)。おんぶ担当(サーバーサイド/normal version)はnajimi.jpのyamakk。

撮った写真がカメラからそのままネットにアップロードされ、撮影の間隔が12秒以内の場合、指定された濃度で自動的に乗算合成されて一枚になります。

このような仕組みが、どう撮るものに影響してくるのか楽しみです。

HTMLからSWFに値を渡す方法、スライダーなどのユーザーインターフェース、ビットマップの操作など色々勉強になりました。

最近読み始めた「ActionScript 3.0デザインパターン」の内容を習得できればもっと綺麗に書き直せそうです。
Foundation Actionscript 3.0 Image Effect」も買ったので今後のバージョンアップに活かせそうです。

金曜日, 7月 17, 2009

openframeworksの始め方

去年YCAMでのワークショップに参加したopenframeworksですが、その後iPhone版(ofxiphone, mobileframeworks)が出たり、多摩美の授業SBAW09が公開されてたしているので、再び勉強してみようと考えています。Mac OS10.5.7 Xcode3.1.3です。買ったばっかりのMacBook Proです。

openframeworksはここからダウンロードできます。FATというのはOpenCVなどがaddonとして組み込まれているバージョンです。通常はこちらをダウンロードして使えばいいと思います。

一番最初にopenframeworksに触れた時は、Xcodeの使い方がわからないこともあり、何からどうすればいいのか全くわかりませんでした。

普通のプログラム開発は、ライブラリなどを必要に応じて追加していくことが多いと思うのですが、openframeworksの場合は逆です。必要となる環境が予め用意されていて、高度なc++の知識なしにアプリケーションを作ることができます。

zipファイルを展開してできたof_preRelease_v0.06_xcode_FATフォルダ内に、appsというフォルダがあります。その中にexamplesフォルダとaddonsExamplesというフォルダがあり、名前の通りそれぞれのサンプルコードになっています。openFrameworks.xcodeprojというファイルを開き、Build and Go(ビルドして進行)でアプリケーションができ上がるはずです。

of_preRelease_v0.06_xcode_FATフォルダはどこにあってもいいですが、僕の場合はホーム以下にdevというフォルダを作り、言語毎に分けているので、ofというフォルダを作ってそこに入れてあります。
このようなファイルの管理方法も今後よく考えていく必要があります。

新しく自分でプログラムを書く時は、通常のものならばemptyExample、addonを使う場合はalladdonsExampleを複製して使います。apps以下に新しくフォルダを作り(僕はsketchというフォルダ名にしています)、複製したフォルダを格納します。apps以下のフォルダも、複製してできたフォルダも名前は何でもいいですが、libsフォルダやaddonsフォルダを読み込むため、階層構造はexamplesなどと同じにしておきます。.xcodeprojという拡張子のついたプロジェクトファイル名を変更する場合は.plistファイル名も変更し、中身の編集も必要です。方法はSBAW09の第五回に書いてあり、テンプレートも作って下さっています。僕は変更しないで作ってます。

よくネット上でサンプルコードが配られていたりしますが、これらの仕組みを知らなかったので動かし方がわかりませんでした。Xcodeのドキュメントなども読む必要がありますね。

processingなどに比べていいことは、速いのは勿論、ソースコードを辿りやすいということです。例えばofRectという四角を描画する関数は、libsフォルダの中のopenframeworks/graphics/ofGraphics.cppに書いてあります。これを読めばどのような処理を行っているかがわかります。なので勉強にもいいです(あまり良い書き方がされていないという声も聞きますが僕にはまだわかりません)。

日曜日, 5月 31, 2009

20090531

早いもので働き始めて明日でちょうど1年。あんだけ夜型だったのに今や完全に朝型。休日でさえ。

新人ということで、仕事は放っておいても上の人から降ってきて、ひたすら手を動かしていればよかったが、そろそろ直接担当者と話して、自分で受けたり他の人に回したり(これが実は結構疲れるらしい)をしていかなければならなくなってきた。

西村佳哲さんの「自分の仕事をつくる」が文庫で出たので読み直した。あとがきがとても良かった。インタビューされている人の名前やイメージにつられると、ロハス的ないい趣味の本に誤解されたり邪推されそうな雰囲気もあったが(本文だけでもちゃんと読めばそんなレベルの話をしているのではないということがわかるはず)、それに対する答えがしっかり書かれている。

今年は僕が働いている部署の年賀状を西村さんのところに送ったのだった。

学生時代が長かったので、そこでできた色んな人脈を通じて、会社の人や友達同士を引き会わせたりしていて、面白いことが起こりそうな予感がする。少なくとも僕にとっては理想的。人と会ったりご飯食べたりは大事。不況の影響はどう?とか。勿論僕がどうこうできる立場ではないけど、大きな流れみたいなものは感じられる。

世の中の仕組みは複雑で、頑張らなければならないのだけど頑張ってもしょうがないことが多々ある。結局政治が一番強かったりして、今僕が関わっている分野での「デザイン」ができることなんて本当に瑣末なことでしかない。かと言って腐ってしまっては本当に何もかも駄目になってしまうので、日々を耐え忍びつつ(嫌々やってる訳ではないけど)、たまに巡ってくる機会のために水面下で動いていなければならない。

木曜日, 4月 02, 2009

actionscript3でglitchする

glitchlena
参考にしたのはこのforum。
Processing 1.0 - glitch art

ヘッダになっているであろう位置をとばして適当な位置のデータを置き換える。
ヘッダの位置予想は適当。ヘッダがあれば、何でもできる。
バイナリのいじり方はflash oopを参考にした。

本当はhex editorみたいに全部展開してちゃんと狙ってglitchさせたいけど、イベント処理が重く分割させる必要がある。これもflash oopにイベントを分割してドラゴン曲線を描くライブラリの作り方が書かれているので参考にするつもり。


package {
import flash.display.Sprite;
import flash.display.Loader;
import flash.events.Event;
import flash.events.ProgressEvent;
import flash.net.URLRequest;
import flash.net.URLStream;
import flash.utils.ByteArray;

public class LoadBinaryURLStream extends Sprite {
private var stream :URLStream;
private var request:URLRequest;
private var data:ByteArray;
private var loader:Loader;
public function LoadBinaryURLStream(){
data = new ByteArray();
request = new URLRequest("img/pic.jpg");
loader = new Loader();
addChild(loader);

stream = new URLStream();
stream.addEventListener(Event.COMPLETE, onComplete);
stream.addEventListener(ProgressEvent.PROGRESS, onProgress);

stream.load(request);
}

private function onComplete(e:Event):void {
loader.loadBytes(data);
}

private function onProgress(e:ProgressEvent):void {
stream.readBytes(data, data.length);
if(data.length > 1024) {
data.position = Math.floor(Math.random()*data.length)-1;
if(data.position<1024) {
data.position += 1024;
}
data.writeByte(0);
}
}
}
}

金曜日, 3月 20, 2009

as3corelibのJSONクラスを使ってNew York TimesのAPIからデータを取得する2

JSONというのが何なのかというのが今回の話題。

詳しくは公式ドキュメントなりwikipediaなりを読むとして、とりあえずはXMLなどのようなデータフォーマットの一種であると。JavaScript Object Notationが正式名称だけど、JavaScriptのオブジェクトの表記をベースにしているというだけで、JavaScript以外でも使える。
"キー":値というシンプルな形。入れ子にもできる。
例:

{
"name":"hayashi",
"age":26,
"occupation":[
{"main":"designer"},
{"sub":"programmer"}
]
}


前回のプログラムで、loaderから読み取ったデータをそのまま出力してみる(loader.dataをtraceする)と、このような形式の文字列が出力されているはず。

で、あとはXMLと同じようにドットとキーで欲しい値にアクセスする。
前回のソースの27行目を下のように一旦オブジェクト型の変数に格納する形にして、
var o:Object = JSON.decode(loader.data);

o.tokensで何てキーワードで検索したかとか、o.totalで何件ひっかかったとかが取得できる。

o.resultsはリクエストに合致した記事のデータがそれぞれ配列になっていて、o.results[0].titleで1件目の記事のタイトルを取得したり、o.results[2].bylineで3件目の記事の筆者を取得したりできる。o.results.lengthで結果の総数を得てfor文と一緒に使うケースが多いと思う。

この辺のキーの与え方に関しては返ってきたデータ(loader.dataでtraceした結果)を見ながらの作業になる。

視覚化の方法についてはまた次回。

actionscript2とpapervision3D

papervisionXがどうとか騒がれている2009年の3月ですが、Flash Player8(もしかすると7)で3Dっぽいものを動作させなければならないのでpapervisionについて調べてる。
が、古い情報はなかなか見つからない。検索結果と見られるページ全部をある時期に戻せたらいいのに。メディアアートに文化財保存修復学科的なものがあればいいのに。

svnからpapervision3Dを全部check outすると、一応as2のsrcもあるのだけど、as3用のpritivesのようなSphereやCylinderがない。wikiにあるとの情報だったが、wikiもう見られない。

3Dに関しては全然知識がなく、ここ数日でわかったことは、立体を作るためには三角形をひたすら組み合わせるということ。

自分で書くのは大変そうなのでinternet archiveで探してサルベージ。

objectフォルダに入れておく。とりあえずSphereは動いた。
ファミコンで鉄拳2とか観て自分を奮い立てる。

import org.papervision3d.cameras.Camera3D;
import org.papervision3d.materials.WireframeMaterial;
import org.papervision3d.scenes.Scene3D;

import org.papervision3d.objects.Sphere;

var container:MovieClip;
var scene:Scene3D;
var camera:Camera3D;
var sphere:Sphere;

init3D();
this.onEnterFrame = loop3D;

function init3D():Void {
container = this.createEmptyMovieClip("container", this.getNextHighestDepth());
container._x = 275;
container._y = 200;

scene = new Scene3D(container);

camera = new Camera3D();
camera.z = -2000;
camera.zoom = 1;
camera.focus = 500;

var material:WireframeMaterial = new WireframeMaterial(0xffffff);

sphere = new Sphere(material, 400, 10, 10);

scene.push(sphere);
}

function loop3D():Void {
sphere.rotationY = container._xmouse / 2;
sphere.rotationX = container._ymouse / 2;

scene.renderCamera(camera);
}

土曜日, 3月 07, 2009

steering behaviorのメモ

seekがターゲットに向かう動き、fleeがターゲットから遠ざかる動き。まずこれを押さえる。
ここからflockするために、cohesion、separation、alignmentを加えるんだけど、

cohesionは仲間の平均の位置をseekすることで、separationは近づき過ぎた仲間からfleeすること、alignmentは仲間の平均の速度に合わせること。

基本はAdvanced ActionScript 3.0 Animationで勉強した。
最近また新しいサンプルが増えたnature of codeもよくわかる。
どちらも大元にあるのはcraig reynolds。
Steering Behaviors For Autonomous Characters

nature of codeは夏に本が出るらしい。
Nature of Code Book at daniel shiffman

早速メーリングリスト登録した。

火曜日, 3月 03, 2009

as3corelibのJSONクラスを使ってNew York TimesのAPIからデータを取得する

ProcessingでNew York TimesのAPIからデータを取ってきて視覚化するサンプルを参考に、ActionScript 3.0で実現してみます。
Processing, JSON & The New York Times | blprnt.blg

環境はMac OS 10.5.6、Flex SDK 3、Xcode 3.1です。

まずNew York TimesのDevelopper Networkにアクセスしてアカウントを作成し、API KEYを取得する必要があります。
Times Developer Network - Welcome

色々ありますが今回はThe Article Search APIを使います。
レスポンス形式はJSON。

ActionScriptでJSONを扱うには、as3corelibを使うのが良いと思います。
as3corelib - Google Code
ファイルをダウンロードして解凍したら、libというフォルダにas3corelib.swcというファイルがあるので、それをFlex SDKのframeworksフォルダに入っているlibsの中に入れます。

新しいプロジェクトを作って、NYTimesTestと名付けます。
2005年1月1日から2009年3月3日まででObamaという言葉がいくつあるかというプログラム。

NYTimesTest.as

package {
import com.adobe.serialization.json.JSON;

import flash.display.Sprite;
import flash.events.Event;
import flash.events.IOErrorEvent;
import flash.net.URLLoader;
import flash.net.URLRequest;

public class NYTimesTest extends Sprite {
private var baseURL:String = "http://api.nytimes.com/svc/search/v1/article";
private var apiKey:String = "取得したAPIキー";
private var word:String = "Obama";
private var beginDate:String = "20050101";
private var endDate:String = "20090303";

public function NYTimesTest() {
var loader:URLLoader = new URLLoader();

loader.load(new URLRequest(baseURL+"?query="+word+"&begin_date="+beginDate+"&end_date="+endDate+"&api-key="+apiKey));
loader.addEventListener(Event.COMPLETE, decodeJSON);
loader.addEventListener(IOErrorEvent.IO_ERROR, ioErrorHandler);
}

private function decodeJSON(e:Event):void {
var loader:URLLoader = URLLoader(e.target);
var totalArticles:uint = JSON.decode(loader.data).total;
trace("there were " + totalArticles + " occurences of the term " + word + " between " + beginDate + " and " + endDate);
}

private function ioErrorHandler(e:IOErrorEvent):void {
trace("ioErrorHandler: " + e);
}
}
}

Flash CSを持ってなくてFlex SDKで開発している場合、Flash Playerで普通に再生しても何も起こらないと思います。Flash Playerのdebugger versionsと、その他色々と設定が必要です。
Archived Flash Players available for testing purposes
flickr APIの時にやった色々設定(今気付いたけど01って何...続きないし)
hysysk:blog: using flickr api 01

フォルダはアカウントの権限とか環境によって変わるのかも。

今の僕の環境では

ユーザ名/ライブラリ/Preferences/Macromedia/FlashPlayer

の中に#Securityというフォルダがあり、その中にFlashPlayerTrustフォルダを置いて、mms.cfgを格納しています。ない場合は作って下さい。
最近は通信関係を開発しているフォルダはまとめてこのファイルで指定しています。

traceした結果はこのFlashPlayerフォルダの中のLogs/flashlog.txtに出力されています。これもない場合は作って下さい。
there were 9595 occurences of the term Obama between 20050101 and 20090303
と出れば成功。
次回(!)以降データの中身をもう少しみていくつもり。

あとこのblprintの人が書いてるActionScriptの本が面白そう。彼だけでなくJonathan HarrisとかAaron KoblinとかProcessingの強者達が書いてる。値段が変動してるな。
Amazon.co.jp: Best Practice: The Pros on Adobe Flash: Douglas Easterly: 洋書

土曜日, 2月 14, 2009

E15:oGFx

alpha版出た(Mac OS10.5のみ)。
http://ogfx.mitplw.com/
pythonベースで、processingとかnodeboxみたいな感じで書ける。
アニメーションを実行させながらコードを書き換えられるon the flyなスタイル。

今のところスクリプトの保存はwebに。
http://e15web.media.mit.edu/users/52
この仕組みいい。
見るためには登録しないといけないかも。

保存したらすぐスクリーンショットができてページが作られてる。
そういうところがどうなってるのか気になったり。

何かエラー出た後直してもちゃんと動かなかったり、deleteしたらポインタが変なとこに行ったりして不安定なところがある気がするけど、楽しい。新鮮。
あと止め方がわからない。

土曜日, 2月 07, 2009

mousine

前にjavaでこんなの書いた気がするけど、actionscriptでマウスの動きに合わせて
周波数と振幅変えるコードをwonderflに書いた。
mousine

普通にマウス位置を取得して周波数や音量に入れると波形が急激に変化してブツブツノイズが入ってしまうので、アニメーションを滑らかに動かすのと同じ要領で、波形を書き込む前にfreqとampの値を滑らかに変化させている。onEnterFrame()はsampleData()が実行された後で実行されるので、2048サンプル分ごとにマウスから値を取得し、新しい周波数と音量を設定していることになる。8192サンプルだと反応が遅いと感じる。この辺りは悩ましいところ。
Adobe - デベロッパーセンター : Flash Player 10で広がるFlashの音の世界
SampleDataEvent - ActionScript 3.0 言語およびコンポーネントリファレンス

滑らかな数値の変化のさせ方は結構面白くて、アニメーションで使われている手法を音にも適用してみたい。
CBCNET - 土日 Flash のススメ(4):動きをつけるということ(イージングについて考える)

日曜日, 1月 25, 2009

toxi audio!!!

以前フォルダだけはあるなーと思ってたtoxiのaudioutils、できてた。
toxiclibs - Google Code

JOALがバンドルされてて3次元音響が鳴らせる。
サンプル動かしてみ。
geomutilsとprefutilsも必要なので一緒にdownloadしてLibrariesフォルダに入れとく。

toxi rocks!