takuma7's blog

2009/05/17

馬

馬にも簡単な描き方があるんですね。

本を読みながら適当に描いてみました。

本の通りに描くだけでそれっぽく見えるからスゴい・・・

2009/05/16

基礎のお勉強

なんだかんだ言っても、やっぱり基礎は大事だ。
レイアウトとか色とかの勉強は一通りしたつもりだけど、デッサンは未だ手つかずって感じでほったらかしにしてきてた。
練習してなかったから当然ヘタクソな訳で、でも上手になりたいなと思って勉強を始めてみた。

写真はJack Hamm著『動物の描き方』を読みながら描いた落書き。
超初心者な上に落書きなのでヘタクソなのは悪しからず。
ライオンの顔の簡単な描き方は目から鱗で、これからは5分でライオンの正面顔を描くことができます（笑
やっぱり描き方ってあるもんだなぁと思った。
まだ前半しか読んでないけど、とても勉強になる本だと思った。

2009/03/24

Hello World! on Processing

Hello World! on Processing from TaKUMA YOSHiTANi on Vimeo.

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

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

2009/03/23

bang !

この本はPure Dataの本なんだけど、
実は全部ネットで落とせる。

そこで、僕はこの本のpdfをダウンロードして、
学校で印刷した。

ちなみに、この本は170ページくらい。

そして、パンチで地道に穴をあけて紐で結んで苦労の末に（笑）１冊の本に仕上げた。

綴じてる紐が少しアレだけど、気にしない（笑

この本を買うと3447円の出費ですからね〜
普通の16歳にとって結構な痛手となりかねない（笑
苦労したけどタダで済ませれて良かった。。。

2009/03/15

2009/02/06

音楽系プログラミング

プログラムは幅が広いですね。
このブログでは主に、言っちゃえば「美術系」のプログラミングとかを紹介してきたわけです。
これからは「音楽系」にも手を出そうかなと思ってます。
音楽の知識は全くないのですが。
まあでもコレを見て下さい。

ChucK Programming: tap your PC from KZR on Vimeo.
これはChuckというやつを使っています。
音楽系のも調べてみると色々とあるみたいですね。
Chuck, PureData, Csoundなどなど。
有名どころではMax/Msp/Jitterとかかな。
でもそれは高いから手が出せない T_T
今日は眠いんでまた後日詳しく紹介していきたいと思います。

2009/01/21

school of Dolphin

あ、気づいたら10日くらい更新してない！

新しい作品です。

その名も「school of Dolphin」

「イルカの学校」ではないですよ。「イルカの群れ」。

school of Dolphin from TaKUMA YOSHiTANi on Vimeo

音無しバージョン

school of Dolphins from TaKUMA YOSHiTANi on Vimeo

イルカ単体

Dolphin from TaKUMA YOSHiTANi on Vimeo.

これはBlenderのparticleのboids systemで作りました。

boidsっていうのはbirdsの方言だそうです。

要するにに鳥の群れをシミュレーションするためにつくられたようなもんらしいです。

これは他の生物にももちろん使えて、例えば魚とかイルカとか。

3D的な群れを形成するものだけでなく、サーフェイス面を歩く2D的なものの作成にも使えます。だから、蟻とか群衆とかにも使えるのかな。

本当はもっと綺麗な映像なはずなんですよね。

でもiMovieで音付けてから出力するときになぜか全体的に白っぽくなってもうた・・・

2009/01/10

簡易ビジュアライザ

Build with Quartz Composerな作品です。

久しぶりにQuartz Composerを触りました。

簡単なビジュアライザです。

内蔵マイクから音を拾って音の高さごとの大きさをカメラからの映像の大きさに対応させています。

ダウンロードはこの下のオレンジの文字の上で右クリック→[リンク先のファイルを保存]で保存して下さい

Capturing Video Visualizer.qtz

ここからもダウンロードできます。

初めてのFluidシミュレーション

『物理シミュレーションBlender』を読みながら試してみたFluidシミュレーションです。

Blender Fluid simulation from TaKUMA YOSHiTANi on Vimeo

Blender触るの久しぶりですが、なんとか初めてFluidシミュレーションを使うことができました。

凄いなBlenderって。

ちゃんと流体に見える。

レンダリングには結構時間がかかりましたけど。

2009/01/06

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;
}

2008/12/28

学生って素晴らしい！

Flex Builderって知ってますか？？？

Adobe Flex Builder 3 Professional とはFlexの統合開発環境です。

WebアプリケーションやAIRのデスクトップアプリケーションを作れるようです。

Flashとは兄弟みたいな関係ですね。

Flexはプログラミング的な面から、Flashはビジュアル的な面からFlashムービーとかアプリとかを作るって感じらしい。

Flexを使って作ったサイトはここで紹介されている。

FlexはActionScriptとMXMLというマークアップ言語で記述するようです。

Flex SDKというもの自体は無償で提供されているけど、それだけだとGUIとかの開発がすごい面倒くさい。

そこで、Flex BuilderというEclipseベースの統合開発環境を使うというわけ。

簡単なものだけならドロップ＆ドロップだけでできちゃうみたいです。

さて、この統合開発環境Flex Builder 3 Professionalのお値段なんと

85,000円！！！

（税込みだとほぼ９万円！）

うわ、高い・・・・

しかし！

学生の人はなんと無償でライセンスがもらえる！らしいです。

早速申し込みました。

学生証をスキャンするなりケータイの写メで撮るなり何なりしてGIFかPDFで送るのです。

Adobe® Flex™ Builder 3 Pro for Education.

早速送りました。

学生証全部日本語だけど大丈夫かな・・・

これと同じ内容の日本語サイトもあるけど、そっちからは先生になんか書いてもらう必要があったりと色々面倒くさそうです。

うまく通れば２週間でシリアルナンバーが届くみたいです。

はやい人は4時間で届いたらしいです。

今はまあ年末・年始なんで時間がかかるかもしれませんね。

それまで60日のトライアルバージョンを使っとこ。

これで『ビジュアライジング・データ ―Processingによる情報視覚化手法
』で邦訳本だけ最後に載ってるActionScriptでのビジュアライジング・データも意味があるようになります（笑

2008/12/20

デザイニング・インターフェース

『デザイニング・インターフェース』という本を買ってもらいました。

オライリー本では珍しい（？）オールカラーの本です。というかこの本カラーじゃなかったら見にくいだろうな・・・

インターフェースの要素を理論的にパターン化してまとめている本です。

まだ全部読んでないけど面白そうなのでオススメです。

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

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

2008/12/01

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

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

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

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

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

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

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

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

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

2008/11/26

Processing 1.0

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

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

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

2008/11/25

Processing 1.0 リリース !!

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

Processing 1.0としてリリース。

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

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

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

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

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

混んでるのかな？

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

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

2008/11/21

Structure Synth

Structure SynthでBinary Kiteというサンプルをsunflowというレンダリングソフト用にエクスポートし、sunflowでレンダリングしてみました。

sunflowの使い方がよくわからなかったのと、エクスポートのときエラーが出まくったので少し手間取りましたが、なんとかレンダリング完了。

上の画像がStructure Synthでレンダリングしたやつで、下がsunflow。

色が抜けちゃってます。

カメラの位置がめっちゃ変なとこにあったので、それを修正するのも手間取りました。

本当はPOV-Rayにエクスポートしたかったんですけどね。

POV-RayってMac用の動かないんですよ。intel Macに対応してないのかな。

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

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

2008/11/12

POV-Ray

今日は学校のCGの授業での課題の作品として作ったものを貼ります。

CGの授業ではPOV-Rayをやっています。

最初は変数も使えないし、いちいち全部の座標などの数値を手入力しなきゃいけないしで「POV-Rayほんまダルい!!!」って感じでしたが、今はPOV-Rayでも変数とか関数とか使えると最近知ったのでちょっとPOV-Ray好きになりました。

課題の内容が、「中空のサイコロを使った作品」で、CSGを使えというものです。

「別にサイコロが主役でなくてもよい」とあったのですが、思いっきりサイコロ主役です。

というかサイコロって意識させないように作りました。

上が提出するもの、下はその旧バージョンです。

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

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

2008/11/07

Leaf

おもいっきり秋な今日このごろ。

葉っぱをつくってみました。

Leaf from TaKUMA YOSHiTANi on Vimeo.

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

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

2008/11/05

Context Free Art 文法

久しぶりの投稿です。

Context Free Artの文法よく分かってなかったので、Documentationとか見てちょっとだけ勉強したつもりです。

分かったこととか分かってたこととかをここに書いときます。

startshape ルール名

これはお決まりのものです。最初に書きます。

ちなみに、ルールを作るときは、

rule ルール名 {

//適当にルールを作る

}

みたいにします。

たとえば、円一つだけのものを作りたい時は

startshape en

rule en{
CIRCLE { }
}

これで円が描かれました。

では、円を動かしてみましょう。

startshape en{
CIRCLE { }
CIRCLE { x 1 }
}

どうですか。

もう一つ円が横に表示されたと思います。

ちなみに、基本図形が３つあって、

TRIANGLE { }

SQUARE { }

CIRCLE { }

の3つです。そのまんまですが、三角形、四角形、円です。

ではここからオプションについて解説します。

CIRCLE { }の括弧の中に入ってる x 1 とかのことです。

x ~ : x方向に~動かす
y ~ : y方向に~動かす
z ~ : z方向に~動かす（Context Free Artは２次元なので、z 方向というよりはレイヤーの上下と考えたらいいようです。）

r ~ : ~ だけ回転させる
flip ~ : ~度の角度で反転させる。flip 0でx軸に関して、flip 90でy軸に関して反転させます。

s ~ : サイズを~倍する。 s ~ ... でx方向に~、y方向に...倍する

hue ~ : 色相です。360までの範囲で色を指定。0が赤、値が大きくなるにつれて黄色、緑、青、紫、ピンクという風になっていきます。
sat ~ : 彩度です。 -1 ~ 1
b ~ : 明度です。-1 ~ 1

次に括弧の違いについて。

CIRCLE { }

と書くというのはさっき書いていますが、じつは

CIRCLE [ ]

と書くことも可能です。

この違いは何なのか。

{ }の方は、中身に書いたことをひとまとまりで解釈されます。

一方、[ ]は順番に解釈されます。

つまり、

CIRCLE [ x .5 s .5 x .5]

となっていると、「x方向に0.5動かして　サイズを半分にして　x方向に0.5動かす」

という意味になる、ということです。

あ、ちなみに小数は0を省略できます。

0.5なら.5ってな感じに。

次に、回数指定。

3*{...} SQUARE { ~~~ }

このように書くとどうなるのでしょう。

この意味は、「3回だけ{ ... }したSQUARE { ~~~ }というルールをやってくれ〜〜」という意味です。

startshape shape

rule shape{
3*{y 1} SQUARE { s .3 b 1 sat 1 h 230 }
6*{x 1 r 20}CIRCLE { s .8 b 1 sat 1 h 0 }
}

やってみて下さい。

回数指定した分だけ描かれていますね。

成功成功。^^

次はruleの応用です。

ruleは同じ名前のもの何個でも作れます。

あと、ruleは自分自身を自分の中で呼び出せます。

２つ目があるから面白いのが描けちゃうわけですね〜Context Free Artでは。

自分の中で自分を呼び出せるので、どんどん成長していく絵が描けるのです。

１つ目については、どうなるかというと、どれをやろうかというのをを確率で決めます。

rule ルール名数値 { }

こうすると、数値の分だけ確率的重みが付けられます。

rule A { }
rule A 0.2{ }
rule A 0.1 { }

仮に上記のように書いたとします。何も数値を指定しないと、自動的に1になります。

上からA1,A2,A3と呼ぶことにしましょう。

A1が実行される確率は、1/(1+0.2+0.1) = 1 /1.3 = 10 / 13

A2が実行される確率は、0.2/1.3 = 2 / 13

A3が実行される確率は、0.1/ 1.3 = 1 / 13

このようになります。13回に10回A1が実行されるが、13回に2回はA2、13回に1回はA3が実行される、ということになります。

コレは面白いですよね。

コレを使うと木のようなものを容易に作成できます。

startshape shape

rule shape{
CIRCLE { }
shape{ r 20 x 2 s .8 }
}

rule shape 0.2 {
shape { }
shape { flip 0 }
}

これで大体のものは作れるようになりました。

まだ僕自身よく分かってないとこもあるのですが、それは分かったらまた書こうかな〜と思ってます。。

Context Free Artをマスターしてすごい作品を作れるようになりたいですね。

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

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

登録: 投稿 (Atom)

takuma7's blog

Pages

2009/05/17

白馬

馬

2009/05/16

基礎のお勉強

2009/03/24

Hello World! on Processing

2009/03/23

bang !

2009/03/15

明石高専のポスター

2009/02/06

音楽系プログラミング

2009/01/21

school of Dolphin

2009/01/10

簡易ビジュアライザ

初めてのFluidシミュレーション

2009/01/06

Glow

2008/12/28

学生って素晴らしい！

2008/12/20

デザイニング・インターフェース

2008/12/01

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

2008/11/26

Processing 1.0

2008/11/25

Processing 1.0 リリース !!

2008/11/21

Structure Synth

2008/11/12

POV-Ray

2008/11/07

Leaf

2008/11/05

Context Free Art 文法