セプキャン2010に参加してきた

1週間ほど前まで、セキュリティ＆プログラミングキャンプ2010（通称：セプキャン2010）というものに参加してた。
8/12〜8/16の間、千葉のOVTAという研修センターでプログラミングのお勉強をしてたわけです。

ブログに書くまでがキャンプだそうで。
でもかなり更新遅れてしまった＞＜

ちなみにセプキャンというのは、5日間、全国から22歳以下の学生が60人くらい集まってセキュリティやプログラミングについて勉強したり交流をしたりとかいう素晴らしい合宿で、IPAが主催してる。
IT系ハイレベルな人がいっぱい集まってくる夏のイベント。

まず凄いのは、なんとこれは交通費・食事代・宿泊費・授業料等全部タダ。国が負担してくれてる。
しかも講師の方々はIT業界で有名な方も多く、かなりハイレベルであります。

実は僕自身このキャンプの存在はネットからの情報により去年から知っていて、去年も応募してた。
まぁ去年は当初の予想通り落選。
倍率6倍とか聞いてorz となっていて、「とりあえず22歳までに一回でも行ければいいやー」と気長に構えていることにしていた。

てなわけで今年も懲りずに応募してみたのだけど、なんと通ってしまいビックリ。
キャンプ前、ラッキーラッキー良かった良かったって浮かれてた。


ところでセプキャンはセキュリティコースとプログラミングコースに分かれている。
下に示すようにコースの中でそれぞれ3つづつの組分けがあり、僕はこのうちプログラミングコースのプログラミング言語組に参加した。

• セキュリティコース
• ソフトウェアセキュリティ組
• Webセキュリティ組
• ネットワークセキュリティ組
• プログラミングコース
• OSを作ろう組
• プログラミング言語組←これ
• Linuxカーネル組

プログラミング言語組では何をするのか。

以下セプキャンホームページ内容の引用だけど：

言語組では、プログラミング言語Ruby、およびその言語処理系を題材に、座学と実習によって言語処理系の基本、ソフトウェア構成手法の基本、性能改善手法の基本を学び、Ruby開発コミュニティで活躍できるレベルを目指します。

とかいう感じ。
要するにRubyの処理系をいじったりいじったりいじったりするわけですね。

実際にしたこと：

• Rubyのバージョン番号を変えてみる
• Rubyのバグ取り体験→バグ取り競争
• Rubyの拡張ライブラリ作成体験
• Ruby関係の課題に取り組む

演習的なことを中心に挙げてみた。

もちろん座学もやった。gitのお話とか、ソフトウェアの高速化のお話とか、コミュニティのお話とか、Ruby処理系のお話とか。あとRubyではなくPythonなのだけど、PEPのお話とかも。

どれも面白く、タメになった。
同時に、自分はもっと勉強しなきゃダメだなとも思った。

演習では初めてのことが結構多く、多少手間取ってしまったのだけど良い経験になったと思う。

さて、先ほど「実際にしたこと」の中で「Ruby関係の課題に取り組む」と書いたけど、具体的に実際みんながやってた課題というのは以下の通り：

• 「Little Quilt言語の処理系実装とRuby binding」
• 「Ruby処理系の"見えるor聞こえる化"」
• 「Rubyのデバッグ」
• 「Rubyのボトルネック分析と高速化」
• 「Rubyに新しい文法の追加」

課題は色々案が用意されていて、その中から選択する、という形だった。

上の箇条書きはその案のうち実際に誰かが選んだもの。

この中で、僕は「Ruby処理系の"見えるor聞こえる化"」を選んだ。

実際にやったのはRubyの可視化。

もっと具体的に言うと「クラス定義時、メソッド定義時、インスタンス生成時にリアルタイムでそれらの関係性を視覚化」した。

これについてはまた別エントリを書こうと思うが、とりあえず完成したやつはこんな感じ：

Visualizing Ruby from TaKUMA YOSHiTANi on Vimeo.

細かい部分で思ったより手間取ってしまい、講師やチューターの方に助けられながらなんとか時間内に間に合わせることができた。
余裕があればGCで回収された時そのオブジェクトが断末魔の叫びをあげるようにしたかったんだけどなーw

さて、それはいいとして、キャンプのことに話を戻そう。

あ、そうだ、人生で初めて名刺交換をした。
キャンプが始まる少し前にキャンプマニュアルがpdfで公開されいたのだけど、そこには「名刺100枚くらい作っておいで」と書いてあった。Σ（°□°　）←ってなった。
結局40枚ほど余ってしまったのだけど、それでもたくさんの方と名刺交換することができ、なんかとても新鮮だった。
やはり名刺にも個性が出ていて、手書き名刺から、なかなか凝った名刺まで色々。
中でも良いなぁと思ったのは透明な名刺。センス良いし印象に残るし。
名刺一つとってもなかなか面白いなぁと感じた。

キャンプ中はいろんな人と交流できて有意義だった。いろんな人がいて面白いなと感じた。僕なんかにはワケワカランすげー人もいっぱいいて、刺激ビンビン受けまくり。

特別講義やBoFなどでも、色々新しい価値観だったりものの見方だったりを知る事ができたと思う。

では、キャンプ中に感じたことなどを素直に：

• へぇー
• ほぉー
• なるほどぉー
• なんか凄い
• 仮想の図書館（笑）
• Bコースにして満額の料理を食べるのか、Cコースにしてドリンクバーを付けるのか...
• 13歳なのにすごいなぁ。あれ、俺負けてるわ
• OVTAネット24時間500円ェ・・・
• セキュリティ組のCTF楽しそうだな
• プロパティ（笑）
• バグ・・・バグ・・・
• 16階談話室熱い。しかも暑い。
• 三点リーダェ・・・
• お土産多くてハッピー
• 技術書2冊+雑誌1冊全員にプレゼントとかすげぇ

これ以上書いてるときりが無いのでここらへんで。


まともな感想&まとめ：
世の中には凄い人がいっぱいいるんだなと実感でき、自分はこのままではいけないなと強く感じた。普段なかなかこういう人たちとは出会えないわけで、交流できて楽しかったし、とても良い刺激になった。
またキャンプで得た知識については、これから頑張れるとっかかりができたと思う。

最後に、このキャンプに関わった全ての方へ。
ありがとうございました!!!

あ、あと
＼爽快セキュリティ！／

TextMateでProcessing

最近またProcessingで遊ぼうかと思ってます。結構忘れてますが...
ところで、Processing標準のIDEでは、補完ができません。
そこで、Mac使いに人気のエディタ、TextMateを使おうと思いたちました。

早速、TextMate Free Trial版をインストールして、ネットで見つけた方法でProcessingのBundleを入れてみました。
ProcessingをTextMateでやる方法：

1. GetBundleをインストール
2. GetBundleからProcessingを探す
3. Bundle Editorで少しいじる

という感じです。

詳しくはこちら。

これで[command]+RでProcessing.appが立ち上がり、実行されます。

でも、僕はこの方法あんまり好きじゃありません。

理由は

1. いちいちProcessing.appが立ち上がるのを待たねばならない
2. TextMateで更新した内容が反映されない(?)

などです。

なんとなく面倒です。

そこで、なんか良いの無いかなぁーとGoogle先生に相談してみたところ、Processingコミュニティの掲示板で、「TextMateのBundleを作ったよ！」と言ってる人を見つけました。

こっちはいちいちProcessing.appが立ち上がらないし、良さげです！

ダウンロードはこちらから→Processing TextMate Bundle (v0.2)

基本何でもできそうだし、TextMate買おうかな...

Programming Interactivity

『Programming Interactivity: A Designer's Guide to Processing, Arduino, and Openframeworks』とかいう本があるらしい。

ちょっとこれ本気で欲しいな...

買おうかな。それとも、日本語版が出るのを待つか。

ちなみに、内容は以下のような感じです。

3D遊び

非常に簡単なプログラムです。
一応マウス位置のはデカくなるというインタラクション付きです。
ソースコードは以下。

int l=50;
int num;
Qube[] qube;

void setup(){
  size(800,500,OPENGL);
  //smooth();
  frameRate(30);
  colorMode(HSB,100);
  float x=l;
  float y=l;
  for(; x<width; x+=l){
    for(; y<height; y+=l) ;
  }
  num = int(x*y);
  
  qube = new Qube[num];
  for(int i=0; i<num; i++){
    qube[i] = new Qube(l,l,l); 
  }
}

void draw(){
  background(99);
  lights();
  directionalLight(99,0,99,0,0,-1);

  int count=0;
  for(float x=l; x<width; x+=l){
    for(float y=l; y<height; y+=l){
      pushMatrix();
      translate(x,y);
      rotateX(frameCount*PI/60 + x);
      rotateY(frameCount*PI/60 + y);
      float h = map(x,0,width,0,100);
      float s = map(y,0,height,0,100);
      float b = 99;
      fill(h,s,99,60);
      noStroke();
      qube[count].getDistance(x,y);
      qube[count].changeSize();
      qube[count].display();
      count++;
      popMatrix();
    }
  }
}

class Qube{
  int XL;
  int YL;
  int ZL;
  float xl;
  float yl;
  float zl;
  
  float range = 200;
  float distance=0;
  
  boolean isOver = false;
  
  Qube(){ }
  Qube(int XL, int YL, int ZL){
    this.XL = XL;
    this.YL = YL;
    this.ZL = ZL; 
  }
  
  void display(){
    box(xl,yl,zl);
  }
  
  void getDistance(float x,float y){
    distance=sqrt(sq(mouseX-x)+sq(mouseY-y));
    if(distance<range) isOver=true;
    else isOver=false; 
  }
  
  void changeSize(){
    if(isOver){
      float s=1;
      xl=XL+(range-distance)*s;
      yl=YL+(range-distance)*s;
      zl=ZL+(range-distance)*s;
    }else{
      xl=XL;
      yl=YL;
      zl=ZL;
    }
  }
}

ProcessingでGlow表現

Glow表現ってやっぱり華やかだし、それがあるだけでカッコよく見える。
今回はOpenGLを使ってGlow表現を試してみました。
参考にしたのはこのサイト。

• all manner of distractions >> Mini-tutorial: Additive Blending

スクリーンショットだと分かりにくいですが、星と煙（？）はガクガク揺れてます。

Z方向にバウンドする壁を設けていないので、時間が経つと↑こんな感じになります。

少しいじるとビジュアライザに応用できそう・・・

flight404は正方形を作ってそこにテクスチャとして画像を貼付けているようですが、僕は手抜きをしてProcessingにもとから付いてるimage()メソッドを使いました。

ソースコードは以下。何も考えずに書いていったので綺麗じゃないかもしれませんが・・・

（ここからzipファイルをダウンロードできます。こっちは画像が入ってます。）

/***********************************
 *
 * Opengl_glow.pde
 *
 ***********************************/

int STARS_NUM = 200;
int CORONA_NUM = 100;
float GRAVITY = 0.1;
float MAX_VELOCITY = 5;

Star[] stars = new Star[STARS_NUM];
Corona[] coronas = new Corona[CORONA_NUM];

void setup(){
  size(800,400,OPENGL);
  hint( ENABLE_OPENGL_4X_SMOOTH );
  background(0);

  PImage coronaImg=loadImage("corona.png");
  for(int i=0; i<CORONA_NUM; i++){
    float w=random(20,200);
    float h=w;
    Point pos = new Point(random(0+w,width-w), random(0+h,height-h));
    PVector vel = new PVector(random(-2,2), random(-2,2));
    coronas[i] = new Corona(coronaImg,pos,vel,w,h); 
  }

  PImage starImg = loadImage("star.png");
  for(int i=0; i<STARS_NUM; i++){
    float w=random(1,30);
    if(i%23==0) w=random(70,100);
    float h=w;
    Point pos = new Point(random(0+w,width-w), random(0+h,height-h));
    PVector vel = new PVector(random(-6,6), random(-6,6));
    stars[i]=new Star(starImg,pos,vel,w,h);
  }
}

void draw(){
  newFrame();
  glUtil();
  for(int i=0;i<CORONA_NUM; i++){
    coronas[i].move();
    coronas[i].bounce();
    coronas[i].display();
  }
  for(int i=0; i<STARS_NUM; i++){
    stars[i].move();
    stars[i].bounce();
    stars[i].display();
  }
}

void newFrame(){
  background(0,20);
}

/***********************************
 *
 * Point.pde
 *
 ***********************************/

class Point{
  float x;
  float y;
  float z;
  
  Point(){ }
  Point(float x,float y){
    this.x = x;
    this.y = y;
  }
  Point(float x,float y,float z){
    this(x,y);
    this.z = z;
  }
}

/***********************************
 *
 * Star.pde
 *
 ***********************************/

class Star{
  PImage starImg;
  
  Point pos = new Point();
  PVector vel = new PVector();
  
  float w;
  float h;
  
  Star(){ }
  Star(PImage starImg,Point pos,PVector vel,float w,float h){
    this.starImg=starImg;
    this.pos = pos;
    this.vel = vel;
    this.w = w;
    this.h = h;
  }
  
  void display(){
    pushMatrix();
    translate(0,0,pos.z);
    image(starImg,pos.x-w/2,pos.y-h/2,w,h);
    popMatrix();
  }
  
  void move(){
    pos.x+=random(-5,5);
    pos.y+=random(-5,5);
    pos.z+=random(-10,10);
  }
  
  void bounce(){
    if(pos.x+w/2>width || pos.x-w/2<0){
      vel.x*= -1;
      if(pos.x+w/2>width) pos.x=width-w/2;
      else pos.x=w/2;
    } 
    if(pos.y+h/2>height || pos.y-h/2<0){
      vel.y*= -1;
      if(pos.y+h/2>height) pos.y=height-h/2;
      else pos.y=h/2;
    }
  }
}

/***********************************
 *
 * Corona.pde
 *
 ***********************************/

class Corona extends Star{
  
  PImage coronaImg;

  Corona(){ }
  Corona(PImage coronaImg, Point pos, PVector vel, float w, float h){
    super(coronaImg, pos, vel, w, h);
  }
}

/***********************************
 *
 * Util.pde
 *
 ***********************************/

import processing.opengl.*;
import javax.media.opengl.*;


PGraphicsOpenGL pgl;
GL gl;

protected void glUtil() {
 pgl = (PGraphicsOpenGL) g;
 //gl = pgl.gl;
 //pgl.beginGL();
        gl=pgl.beginGL();
 gl.glDisable(GL.GL_DEPTH_TEST); // This fixes the overlap issue
 gl.glEnable(GL.GL_BLEND);// Turn on the blend mode
 gl.glBlendFunc(GL.GL_SRC_ALPHA,GL.GL_ONE); // Define the blend mode
 pgl.endGL();
}

public void capture(char str) {
 if(keyPressed && key == str) {
  saveFrame("data/img-####.png");
  
 }
} 

public void vertex(PVector p) {
 vertex(p.x, p.y, p.z);
}
/** Utility for PVector class
@param c1 control 1 of PVector class
@param c2 control 2 of PVector class
@param p point of PVector class
*/
public void bezierVertex(PVector c1, PVector c2, PVector p) {
 bezierVertex(c1.x, c1.y, c1.z, c2.x, c2.y, c2.z, p.x, p.y, p.z);
}
public void curveVertex(PVector p) {
 curveVertex(p.x, p.y, p.z);
}

カオス

アルゴリズムの本に載ってたんでProcessingで作ってみた。ストレンジアトラクタとかいう類のものなんだけど、僕はこういう数学的なの結構好きだ。
フラクタルとか面白いよね。

ちなみにこれは

p_{n+1}=p_n+kp_n(1-p_n)

という漸化式でn->無限大 にしたとき係数kの値によって収束したり、しなかったりするものです。
収束しないときはこれまた係数kによって何個かの値を交互に取ったり、もはや規則性が見えなくなってカオス状態になってしまったりというものです。
画像は横軸を係数、縦軸にpをとったもの。
以下ソースコード。

int i;
float k,p,dk,kmin,kmax,pmin,pmax;

kmin=1.5;
kmax=3.0;
pmin=0.0;
pmax=1.5;

size(600,400);
colorMode(HSB,100);
background(10);
smooth();

dk=(kmax-kmin)/(width-1);

for(k=kmin;k<=kmax;k+=dk){
p=0.3;
for(i=1;i<=1000;i++) p+=k*p*(1-p);
for(i=1001;i<=1400;i++){
 if(p>=pmin&&p<=pmax){
   float Pk=map(k,kmin,kmax,0,width);
   float Pp=map(p,pmin,pmax,0,height);
   //stroke(99);
   //point(Pk,height-Pp);
   noStroke();
   float r=random(0.1,1.5);
   fill(random(0,20),99,99);
   ellipse(Pk,height-Pp,r,r);
 }
 p+=k*p*(1-p);
}
}

Hello World! on Processing

Hello World! on Processing from TaKUMA YOSHiTANi on Vimeo.

英語が正しく書けているかチョット自信は無いですが、作ってみました。

Processingとかプログラムとか初めてやる人に向けて作った動画です。

Glow

今まで、どうやったらProcessingで輝く効果を作ることができるのか悩んでました。

Quartz Composerだったら簡単にBlendingを「Add」にすれば良かったのですが。

（一般的な画像編集ソフトでの「加算レイヤー」みたいな感じの効果）

Processingではできないのかな、とも思っていました。

でもFlight404の動画とかはちゃんと輝いてるし・・・

そういうのが今日解決しました。

Processingのリファレンスをちゃんと読んだら載ってるじゃないですか！

blend()というのがあったんですね！！

これを使うと様々な効果が得られるようです！！！

ソースコードも載せときます。

汚いし綺麗な動きじゃないですが、まあこの効果を確かめるために適当にやったので、もうちょっと綺麗なのを作れるように頑張ります。

PImage img = createImage(66,66,ARGB);
PImage img2 = createImage(66,66,ARGB);

void setup(){
size(400,400);
background(0);
imageMode(CENTER);
colorMode(HSB,100);
smooth();
frameRate(20);

//create CIRCLE

for(int y=0; y< img.height; y++){
for(int x=0; x< img.width; x++){
 int pos = (y*img.width) + x;

 img.pixels[pos] = color(0,0);
 img2.pixels[pos] = color(0,0);
 if(CIRCLE(img.width,img.height,x,y)){
   float Dist1 = dist(x,y,img.width/2,img.height/2);
   float Dist2 = dist(x,y,img2.width/2,img2.height/2);
   Dist1 = map(Dist1,0,33,0,99);
   Dist2 = map(Dist2,0,33,0,99);
   img.pixels[pos] = color(60,99,99,99-Dist1);
   img2.pixels[pos] = color(10,99,99,99-Dist2);
 }
}
}
}

float r = 100;

void draw(){
fill(0);
rect(0,0,width,height);
for(int i=0; i<100; i++){
blend(img,0,0,img.width,img.height,
     int(random(width)),int(random(height)),img.width,img.height,ADD);
blend(img2,0,0,img.width,img.height,
     int(random(width)),int(random(height)),img.width,img.height,ADD);
}

}

boolean CIRCLE(float W,float H,float X,float Y){
float a = H/2;
float b = W/2;

float oval = sq(X-a)/sq(a) + sq(Y-b)/sq(b);
if(oval <= 1){
return true;
}else return false;
}

ビジュアライジング・データ

日本語のProcessing関係の本はBuilt with Processingの１冊だけでしたが、Processing開発の主な人物の一人、Ben Fryによる『Visualizing Data』の邦訳『ビジュアライジング・データ』が発売されました。

情報の視覚化について研究しているみたいです。Ben Fryさんって。

Processingを使用して情報の視覚化を実践しよう！というのがこの本の主なところ。

方法などを紹介しているようです。

原書買おうかな、と思っていたところで邦訳が出て、ラッキーです。

面白そうなんで買おうかな（笑

----------------------------------------------

ここをクリックして下さい。お願いします。

Processing 1.0

さっきProcessing.orgのdownloadのページ見たらWindows、Windows（without Java）、Linuxも追加されてました。

----------------------------------------------

ここをクリックして下さい。お願いします。

Processing 1.0 リリース !!

ProcessingがBETAじゃなくなりました。

Processing 1.0としてリリース。

なんか雰囲気が変わりました。前は茶色系統でそろえてましたが、新しいのは青系です。

それにしたがってアイコンもちょっとかっこよくなったような気がします。

Macのバグのせいでメニューがうまく表示されない、という不具合があったらしく、それが直るまではメニューバーはProcessingのウィンドウの中にあります。

確かに前までのメニューはめっちゃ反応遅かったのは覚えてます。

あーそれにしてもProcessing.orgめっちゃ遅いよ〜

混んでるのかな？

----------------------------------------------

ここをクリックして下さい。お願いします。

Processingライクな開発環境たち

Processingに影響を受けて開発された制作環境たちです。

• openFrameworks
• NodeBox

です。

openFrameworksはWindows, Mac OS X, Linuxで動作するC++ベースのフレームワークらしいです。

NodeBoxはPytonでコードを書くMac OS X専用の制作環境。

面白そうなんでこういうのも触っていこうかな〜と思ってます。

----------------------------------------------

ここをクリックして下さい。お願いします。

reacTIVision

reacTableってご存知ですか？

これです。

どういう仕組みか分かりますか？

ビデオをよく見てみると、動かしてるものに変な模様というかマークがついていますね。こんなの。

このテーブルは半透明の板です。

仕掛けは意外と単純で、この天板の下にはカメラとプロジェクターが入っています。もしかしてコンピュータもついでにこの中に入れているかもしれません。

カメラで天板の様子を撮影します。それであの変なマークの位置、回転を検出するってわけです。

その映像をもとにコンピュータに送って、プログラムに通します。音などを出すようにしてるわけです。

で、プロジェクターで天板に映像を映し出して、ああいうことができるわけです。

う〜ん。仕掛けは単純だけど、すごいかっこいい。

このテーブル、プロジェクター、カメラ、天板、パソコンさえ（プロジェクターは高そうだけど）あれば誰でも簡単に作れるんです。

で、問題はプログラムの方ですよね。

どーやってあんなマークで回転とか位置とか検出するのか。

ここが一番面倒くさく、かつ難しい課題だと思います。

しかし、このプログラムは公開されているんです。

あとはProcessingなどでどういう反応をするかプログラミングするだけ。

この公開されているやつの名前がreacTIVision。

変なマークもダウンロードできます。

テーブルを作れなくても、カメラさえあればそれなりにマークに反応してくれるので、一度試してみてはいかが？

----------------------------------------------

ここをクリックして下さい。お願いします。

iTunesのビジュアライザ、きれいすぎる！！

Flight404, Flight404, Flight404........

最近知ったんですが、すごいですね〜

iTunes使っている人は、(iTunes 8)ビジュアライザって使ったことありますか？

Macの人は、

「command + T」

を押しちゃってください。

出てきますから。

Windowsのショートカットは知らないですけど、

表示>ビジュアライザを表示

みたいな感じで出せると思います。

僕はビジュアライザ使ったこと無かったんで知りませんでしたが、こんなにきれいだったとは！！

すごいきれいですよね。めちゃめちゃきれい。

実はこれ、開発はProcessingで行ったようです。

いやー作る人が作ったら凄いのができるんですねー。

いつかはこんなのが作れるようになりたいなーと思いました。

ちなみに、

「command + F」でフルスクリーンになります。

自動でパターンが切り替わりますが、それをoffにしたいなら「c」

自分で切り替えたいなら「m」

スピードは「+」「-」でお好みに調整、

光の強さは「a」「s」でお好みに調整

だそうです。

Flight404はProcessingの世界では超有名みたいですよ。

作品の動画はこちら

Flight404のブログはこちら

Processingとは

ProcessingとはCasey Reas と Benjamin Fryによるオープンソースプロジェクトで、以前はあのMIT Media Labで行われていました。

プログラミング言語、というよりはプログラミング環境です。

統合開発環境(IDE)っていうものらしいです。

何に使うかって言うと、電子アート、ビジュアルデザインなど。追加のライブラリを入れるとサウンドもできます。

実際どんなのを作れるのかというと、"Built with Processing"でググると世界中の人が作品を公開しているのでそれをみてみてください。

中には結構凄い作品もあるので、参考になるかも。

プログラミングの学習用にもつくられていることもあり、初心者にもとっつきやすいです。

とっつきやすいとは、複雑な設定がいい具合に端折られているから手軽に作成ができるからです。

そういうことから、コンピュータを使ったアート作品のプロトタイプ（試作品）作成なんかにも使われるみたい。

あと、色々な教育機関でも採用されているらしいです。例えば、工業系の大学のプログラミング入門とか、美術系の学校のコンピュータアートの授業とか。もちろん日本でも。

欠点は日本語の情報が少ないことです。

でも、逆に英語の勉強になるからいいかもって考えるとこの点はそこまで苦ではない。（笑

日本語の書籍は今は『Built with Processing　デザイン/アートのためのプログラミング入門[改訂版]』だけみたいですね。

この本は結構きれいでGoodです。オールカラーで、プログラミングの本とは思えない（いい意味で）。

Processingとはこんな感じのものです。

で、僕は最近これを見つけてハマっています。（笑

プログラミングもほとんど初心者って感じなんですけど、これは面白い。

Quartz ComposerとProcessingと。どんどんきわめていきたいです。