proce55ing　プログラミングアート全般

**デフォルトの名無しさん** · 2007/08/06(月) 16:19:13

大自然描くのにサインコサインタンジェント
激しく遠回りで面倒なプログラミングアート制作について語ろう

環境てproce55ingぐらいしかマトモには知らないのだが、凄い重かった
ベクター生成とかはともかく、Javaでフル解像度リアルタイムピクセル処理はキツいな

ネイティブなら何を使うといいのだろう。
SDLとかだろうか。文系にはいきなり敷居が高くなる

物理シミュレートとか描画方法はゲーム系の豊富な資料が非常に参考になりそうだ
参考になるサイト等あれば教えてくれ

そんな話をしないか

**デフォルトの名無しさん** · 2008/10/25(土) 04:49:54

円を一つ下方に移動させるまではできたんだけど、複数の円を同時に画面に存在させるっていうのは、
その同時に存在する分void draw()内に ellipse(width/2,x,10,10);みたいな感じで
円の個数分、一個一個地道に命令していくしか道はないの？
なんか同じ円が同じ軌道を移動するならfor文とか繰り返しでなんとかならないのかなって思ったんだけど、
上手くできなかった、実際どうなんでしょ？
あと説明わかりにくかったりしたらごめんよ

**デフォルトの名無しさん** · 2008/10/25(土) 05:09:38

こういうイメージ?
setup()省略

int c = 200 / (10+10); // 円を書く個数：高さ / (直径+幅)

void draw(){
fadeToWhile();

x = x+1;

fill(255, 255, 255);
for(int i=0; i<c; i++) {
ellipse(width/2,x + 20*i,10,10);
}

if(x>20) x=0;
}

**デフォルトの名無しさん** · 2008/10/25(土) 05:11:25

切り替わるときがなんか微妙にぎこちないのでオフセットと個数を適当にいじってくれ。

**デフォルトの名無しさん** · 2008/10/25(土) 16:01:07

>>203
ありがとう

**デフォルトの名無しさん** · 2008/10/27(月) 15:20:22

float Cx, Cy;
float Angle;
int Length = 1000;
float[] X = new float[Length];
float[] Y = new float[Length];
float[] R = new float[Length];

void setup(){
size(400, 400);
colorMode(HSB, 100);
background(0);
stroke(100);
frameRate(30);

Cx=width/2;
Cy=height/2;
Angle=0;

**デフォルトの名無しさん** · 2008/10/27(月) 15:21:25

for(int i=0; i < Length; i++){
Angle += 1;
R[i] = random(400);
X[i] = Cx+(R[i]*sin(radians(Angle)));
Y[i] = Cy+(R[i]*cos(radians(Angle)));
}
}

void draw(){
background(0);

for(int i=0 ; i < Length ; i++){
Angle += 10;
line(X[i],Y[i],X[i],Y[i]);
X[i] += R[i]*sin(radians(Angle));
Y[i] += R[i]*cos(radians(Angle));

}
}

**デフォルトの名無しさん** · 2008/10/27(月) 15:25:18

ちょっと聞きたいんだけど、これ実行するとどう見える？
無数のドットが画面の中心を軸に円状にグルグル回ってるように見えるかな？
なんかもうちょっとハッキリ円状に回っているなってわかるようにできないかな？

**デフォルトの名無しさん** · 2008/10/28(火) 12:56:16

どの変数がどういう意味を持ってるかぐらいは説明するべきじゃね？
拾ってきたコード丸投げか？

**デフォルトの名無しさん** · 2008/10/29(水) 19:22:20

drawのangleの増分を0.01にすると円錐が中心点を中心にコマ回転しているような感じになる。
さらにangleの増加を外側に出すとこのコードの本質が見える、はず。

中心点を基準に平面を回転させたいだけなら、円の公式でも勉強しましょう。

**デフォルトの名無しさん** · 2008/11/01(土) 22:46:02

素朴な描画関数郡はN88BASICを思い出すな。

**デフォルトの名無しさん** · 2008/11/03(月) 01:30:06

>>205 こういうこと？
class cc {
float f,a,r,x,y;
cc() { f=random(360.0); a=random(0.1,12); r=random(400.0); }
void calc() {
if((f+=a)>=360) f-=360.0;
float v = radians(f);
ellipse(200+r*sin(v),200+r*cos(v),1,1);
}
}
cc c[] = new cc[2000];
void setup() {
size(400,400); stroke(0xFF);
for(int k=0; k<2000; ++k) c[k] = new cc();
}
void draw() {
background(0);
for(int k=0; k<2000; ++k) c[k].calc();
}

**デフォルトの名無しさん** · 2008/11/06(木) 23:34:01

minim使った作品の例ってありますか？

**デフォルトの名無しさん** · 2008/11/07(金) 05:40:08

>>212
例って、コードそれとも作品、どっち？

**デフォルトの名無しさん** · 2008/11/09(日) 17:07:24

＞＞213
とりあえずコードの例です。
参考になるサイトとか知りませんか？

**デフォルトの名無しさん** · 2008/11/12(水) 23:08:09

ttp://code.compartmental.net/minim/examples/

**デフォルトの名無しさん** · 2008/11/12(水) 23:37:07

>>214
スケッチブックにサンプルでついてるお

**デフォルトの名無しさん** · 2008/11/14(金) 23:39:00

>>212
Ruby-processingにvisualizationに使ったサンプルがあった。
Ruby自体は簡単だし、やってることはJavaで再現できるからprocessingでも使えると思うよ。

**989** · 2008/11/18(火) 21:30:42

２つのスケッチを同時に実行して、
スケッチ間でデータのやりとりをする方法はありますでしょうか？

**デフォルトの名無しさん** · 2008/11/19(水) 12:26:49

>>218
つ /examples/Libraries/Network/SharedCanvasServer/SharedCanvasServer.pde
つ /examples/Libraries/Network/SharedCanvasClient/SharedCanvasClient.pde

**デフォルトの名無しさん** · 2008/11/19(水) 22:22:47

>>219
おお…最初から入っていたとは…
ありがとうございました！

**デフォルトの名無しさん** · 2008/11/22(土) 23:18:17

オライリーから出るビジュアライジング・データってやつの目次を見て
processingに興味を持ってここに来たのだが・・・
話題にすらなってないのな

**デフォルトの名無しさん** · 2008/11/22(土) 23:44:47

オライリー本は今まで敬遠してたけど
これは欲しいな

**デフォルトの名無しさん** · 2008/11/23(日) 00:05:36

過疎スレだからねぇ

**デフォルトの名無しさん** · 2008/11/23(日) 00:06:48

>>221
俺もその本の目次で興味持って、今しがたProcessing.jsで初体験を済ませて来た所だ
いやあ、ランダムに透明感のある円を書いてるだけでオサレっぽくなってスゲエ楽しい

**デフォルトの名無しさん** · 2008/11/23(日) 01:33:30

オライリーのやつ、英語版持ってるけど翻訳版も欲しい。

p5は日本に統括的なフォーラムの場がないからなー。dev.processing.orgを見ててもいいけど英語がネックになる。
processing.jpは機能してないでしょ。

**デフォルトの名無しさん** · 2008/11/23(日) 02:05:07

なぜか本屋にオライリーの英語版がたくさん並んでたから英語版チラ見してんだが
やけに文章とコードが多かった気が・・・
いや、コードなきゃ始まらないのはわかるが
まあ、買ってお勉強するつもりですが・・・

**デフォルトの名無しさん** · 2008/11/23(日) 11:47:16

プログラミングアート全般なのにprocessingがメインみたいなスレタイだから。
とりあえずprocessing jitter vvvv gemあたりは入れたら。

**デフォルトの名無しさん** · 2008/11/23(日) 20:59:35

processingを冷遇して独立されると全般スレが落ちちゃうぞ！

**デフォルトの名無しさん** · 2008/11/25(火) 21:45:26

Processing 1.0 Launch

何か唐突にキタｗ

**デフォルトの名無しさん** · 2008/11/25(火) 21:50:33

糞重くね？

**デフォルトの名無しさん** · 2008/11/25(火) 22:52:09

わしょーい

**デフォルトの名無しさん** · 2008/11/26(水) 00:26:48

なんにしろ1.0になったのはめでたい。

**デフォルトの名無しさん** · 2008/11/26(水) 00:46:56

サイト重いねｗ
SVNになんて繋がりもしない

**デフォルトの名無しさん** · 2008/11/26(水) 08:12:41

processing = Java
vvvv = C#
の３年戦争勃発

**デフォルトの名無しさん** · 2008/11/28(金) 18:17:35

なぁ、1,0が出たってきいて
落としてみた。Linuxなんだけどもしつもん。

sketchっていうエディタで、サンプルを実行してみた。
んで、stopボタンを押してエディタに戻って、引数を
変えようとしたら、入力出来ないのだけどもどうしましょう。

**デフォルトの名無しさん** · 2008/11/28(金) 22:29:25

macだけどふつうに入力できるよ

**デフォルトの名無しさん** · 2008/11/28(金) 22:35:34

ども。調べて見ます。

**デフォルトの名無しさん** · 2008/12/01(月) 09:56:43

>235
自分もUbuntuで使ってるんですが、確かに入力出来ないです。
Linux版の仕様？

**デフォルトの名無しさん** · 2008/12/01(月) 12:12:15

>>238
centos5もだめ。だれかコミュニティに報告汁

**デフォルトの名無しさん** · 2008/12/01(月) 12:19:22

ちなみに出力出るとこダブルクリックしたら入力できるようになるから。

**238** · 2008/12/02(火) 02:01:32

>>240
ほんとだ、、、変な仕様、、、
だけどとりあえず助かった！！ありがとう！

**デフォルトの名無しさん** · 2008/12/02(火) 02:35:02

1.01がでてる

**デフォルトの名無しさん** · 2008/12/02(火) 20:22:29

正式にproce55ingに改名しないかしら

**デフォルトの名無しさん** · 2008/12/02(火) 21:16:01

>>243
壮大な勘違いをしてる様だ

**デフォルトの名無しさん** · 2008/12/05(金) 01:52:50

オライリーの本買った人いる？

**デフォルトの名無しさん** · 2008/12/05(金) 19:41:28

ノ

**デフォルトの名無しさん** · 2008/12/05(金) 20:29:51

>>246
もしよければどんな感じかｋｗｓｋ
Buile with ～より深く解説してる感じ？

**デフォルトの名無しさん** · 2008/12/05(金) 21:18:22

>>247
Built with processingはprocessingを始めた人が読むにはちょうどいい。
オライリーの方は、もっと技術的にprocessingを用いたい人が読む。
情報視覚化という分野の手引きとしても十分価値があると思う。

もしも、Built ～で満足していない、もっとprocessingを使いこなしたい
と思うなら買ったほうがいい。と個人的な感想を述べる。

**デフォルトの名無しさん** · 2008/12/05(金) 21:21:30

>>248
ありがとう、今度買ってくる
もちょい色々やってみたかったから、丁度ぴったりかもしれない

**デフォルトの名無しさん** · 2008/12/05(金) 22:36:12

1章が抽象的過ぎないか？あやうく投げ出しそうになったぜ
まだ6章までしか読んでないが視覚化とか完全に素人なので勉強になってます。
難点は著者自身もまえがきで書いてるが5章くらいからコードの割合が高すぎる気がする
まあ、オライリー本だからいいんだがｗ
あとは、俺がprocessingはちょっと遊んだ程度なので
説明なしでprocessingのAPIが使われていることがあってちょっと不便

**デフォルトの名無しさん** · 2008/12/05(金) 22:46:15

1章はprocessingというよりは情報視覚化についてだから、抽象的過ぎると言われても仕方がない。

でも逆に、1章に書かれていることは、他の言語にも当てはまることで、
情報視覚化に興味がある、やってみたい、という人は読んどいて損はない。

**デフォルトの名無しさん** · 2008/12/06(土) 18:57:55

processing.jpのヘッダーからリンクされているような、
すんごいビジュアライゼーションを作るための参考書籍ってない？

**デフォルトの名無しさん** · 2008/12/07(日) 19:19:27

オライリーの買ってきた。
基本が、Ben Fryの論文（たしか、彼のサイトからDLできたはず）だから、
単なる解説書ではないね。

情報視覚化の基本的な方法論をおさえてるので、色々と応用できそう。

>>252
ゲーム開発者のための数学・物理学入門とかそこらへん？
基本的な数学、物理の知識がないと作るの難しそうな。

**デフォルトの名無しさん** · 2008/12/08(月) 22:10:43

http://www.nicovideo.jp/watch/sm4968371

どうやったらこんなの作れるんだ・・・

**デフォルトの名無しさん** · 2008/12/09(火) 15:34:58

作るためのものはそろってるんだから根気とセンスさえあればできるんじゃね？
processingはゲームプログラムにはもってこいだと思うんだが。簡単だし。

**デフォルトの名無しさん** · 2008/12/09(火) 18:11:02

>>254
ここまでするならdirectXするだろjk
というか当たり判定で挫折するな、つくろうと思っても
ゲーム用ライブラリとかないよね？
proce55ingに

**デフォルトの名無しさん** · 2008/12/09(火) 18:13:26

マウスに追従するキャラクタを二つ用意して一つが当たり判定用、もう一つがグラフィック用って感じかな

**デフォルトの名無しさん** · 2008/12/09(火) 20:52:36

3Dじゃないんなら、素直にDXライブラリでも使ったほうがよいぞｗ
挫折したくなかったらｗ

**デフォルトの名無しさん** · 2008/12/11(木) 23:58:15

この頃3ＤはじめたんだがImageで表示したのをカメラで横から見るとペラペラに見えるんだが、
パーティクルみたいに常にカメラのほうを正面に表示するにはどうしたら良いんだ？
rotateあたりのでこちらを向くように自分で書かんといかんのか、これ

**デフォルトの名無しさん** · 2008/12/12(金) 02:49:18

パーティクルにもビルボードって書いてあるでしょ？
検索して自分で書いてください

**デフォルトの名無しさん** · 2008/12/12(金) 16:05:46

サンクス
ビルボードなんて知らなかった・・・

**デフォルトの名無しさん** · 2008/12/12(金) 21:24:06

ﾋﾞｼﾞｭｱﾗｲﾃﾞｰﾀ買ってきた。まぁ、高い本なんだよ。
切ないな。仕事に生かせるわけでもなし。

**デフォルトの名無しさん** · 2008/12/13(土) 19:01:49

>>262
高いといってもオライリ本では安い方じゃね？

**デフォルトの名無しさん** · 2008/12/20(土) 00:58:19

なんという過疎

**デフォルトの名無しさん** · 2008/12/20(土) 02:22:30

では話題ｐｌｚ

**デフォルトの名無しさん** · 2008/12/20(土) 03:33:12

クリスマスの予定は？

**デフォルトの名無しさん** · 2008/12/20(土) 10:58:58

processingをeclipseで書いてるんだけど、
MovieMakerがうまく動作させること出来ないんだよね。
QTJava.zipをうまく読みこめないポイんだが原因がわからない。

誰かうまくいってる人いない？

【吉】【1678円】 · 2009/01/01(木) 21:22:18

あけおめ！

**デフォルトの名無しさん** · 2009/01/14(水) 19:26:07

ことよろ！

なんかネタないかなー。

**デフォルトの名無しさん** · 2009/02/10(火) 02:44:24

新しいバージョンとか出て
新しいメソッドとか追加されるとネタになるのに。
なんもないな。

海外のフォーラムとか除くと新ライブラリの話題とかあっておもしろいよ。

**デフォルトの名無しさん** · 2009/02/10(火) 02:44:57

除くと→覗くと

**デフォルトの名無しさん** · 2009/02/11(水) 18:19:05

>>270
たとえば、どんなライブラリあった？

**デフォルトの名無しさん** · 2009/02/27(金) 14:46:57

過疎過ぎる
誰も見てないのか？

**デフォルトの名無しさん** · 2009/02/27(金) 15:35:23

見てるよ

**デフォルトの名無しさん** · 2009/02/27(金) 17:08:49

今っていうか、春休み前に授業習ってた
今まで出した課題の中でわからなかったやつ全部やらんと単位あげないってさ

**デフォルトの名無しさん** · 2009/02/27(金) 17:55:54

Ubuntuだと設定が大変だった
いまだにエディタのフォントにアンチエイリアスが掛かってない

**デフォルトの名無しさん** · 2009/03/01(日) 15:02:32

int Length = 10000;

float[] X = new float[Length];
float[] Y = new float[Length];
float[] Z = new float[Length];

void setup(){
size(400, 400, P3D);
colorMode(HSB, 100);
background(0);
stroke(100);
frameRate(30);

for(int i=0 ; i < Length ; i++){
X[i] = random(width);
Y[i] = random(height);
Z[i] = i * -1;
}
}

**デフォルトの名無しさん** · 2009/03/01(日) 15:04:37

void draw(){
background(0);

for(int i=0; i < Length; i++){

line(X[i], Y[i], Z[i], X[i], Y[i], Z[i]);
Z[i] += 20;//speed

if(Z[i] > 0){
X[i] = random(width);
Y[i] = random(height);
Z[i] = -1000;
}
}
}

すみませんが15秒ごとにドットの流れを逆行させたいのですがどなたか教えていただけませんか？
多分for文使うんだろうけど上手くできなす

**デフォルトの名無しさん** · 2009/03/01(日) 18:05:47

>>278
そういうときは時間をカウントすれば良いよ。

int time_count;
...
void draw(){
...
if(time_count < 450) {Z[i] += 20;}
else {Z[i] -= 20;}
...
time_count ++;
if(time_count > 900) {time_count = 0;}
}

**デフォルトの名無しさん** · 2009/03/04(水) 05:28:15

もう課題は提出したのかな。

279とは別人ですけど、少し補足をすると、450、900の数字は、
frameRateが30に設定されているためです。1秒間に30回draw()を繰り返すという設定なので。

**デフォルトの名無しさん** · 2009/03/04(水) 08:35:22

>>279 >>280
いえ、金曜日の夕方にだした課題全部提出しろって言ってたからまだです
というか思ってたより早く教えてくれて嬉しいです、ありがとうございます
質問なんですがif文のところで０秒から１５秒までドットがz軸のプラス方向に流れて１５秒以上経過してからマイナス方向に流れるときに
zの座標が０以上になってしまったドットが消えてしまってマイナス方向にドットが流れるんですけど
これって消えない方法ありますかね

**デフォルトの名無しさん** · 2009/03/10(火) 21:59:21

>>281
自分で考えろカス
2chなんかしてないでさ

**デフォルトの名無しさん** · 2009/03/11(水) 11:10:11

>>282
よく見ろ。提出期限過ぎてる。

**デフォルトの名無しさん** · 2009/03/13(金) 13:31:56

いまさらっていう

**デフォルトの名無しさん** · 2009/03/15(日) 06:55:00

論理ORの||ってキーボードのどのキーから打ち込めばよいのですか

**デフォルトの名無しさん** · 2009/03/15(日) 10:02:31

右のほうにある \ のキーを、シフト押しながら 2 回押す。

**デフォルトの名無しさん** · 2009/03/17(火) 15:47:58

rotate+pop-pushMatrixとかつかった再帰のなかで、座標系がrotateとかtranslateとかのせいで
いろんなのができちゃってるんですけど、を最初の座標系に簡単に落とす方法ってないですか？

**デフォルトの名無しさん** · 2009/03/24(火) 08:43:26

list()関数使った時に得られる配列は必ずソートされているのですか？

**デフォルトの名無しさん** · 2009/03/24(火) 17:13:58

マウスから遠いフォント名ほど色あせるスケッチを書いたつもりなんですが、
もっと遠いところと近いところの彩度の差をはっきりさせるには
どうすればいいですか？

PFont currentFontFace;
String currentFontFaceName;
String total, currentFont;
String[] fontList = PFont.list();
float[] fontX = new float[fontList.length];
float[] fontY = new float[fontList.length];
int[] fontAlpha = new int[fontList.length];
int[] fontSpeed = new int[fontList.length];

void setup() {
size( 800, 600 );
frameRate( 60 );
colorMode( HSB );
currentFontFace = createFont( fontList[0], 16, true);
textFont( currentFontFace );
currentFontFaceName = fontList[0];
for( int i = 0; i < fontList.length; i++ ) {
fontX[i] = random( -50, 800 );
fontY[i] = random( 600 );
fontAlpha[i] = int( random( 255 ) );
fontSpeed[i] = int( random( 5 ) );
}
total = "Total :" + nfs( fontList.length, 3 );
currentFont = "Current font : " + currentFontFaceName;
}

**デフォルトの名無しさん** · 2009/03/24(火) 17:19:34

void draw() {
background( 255 );
for( int i = 0; i < fontList.length; i++ ) {
fill( abs( fontX[i] ) / 3.14, 255 - dist( mouseX, mouseY, fontX[i] + textWidth( fontList[i] ) / 2, fontY[i] + ( textAscent() + textDescent() ) / 2 ) / 3.93, 255, fontAlpha[i] );
text( fontList[i], fontX[i], fontY[i] );
if( fontAlpha[i] + fontSpeed[i] > 255 || fontAlpha[i] + fontSpeed[i] < 0 )
fontSpeed[i] *= -1;
fontAlpha[i] += fontSpeed[i];
}
fill( 0 );
textSize( 32 );
text( total, width / 2 - textWidth( total ) / 2, height / 2 - ( textAscent() + textDescent() ) );
text( currentFont, width / 2 - textWidth( currentFont ) / 2, height / 2 );text( int( frameRate ) + "fps", 10, 32 );
textSize( 16 );
}
void mouseReleased() {
for( int i = fontList.length - 1; i >= 0; i-- ) {
if( mouseX >= fontX[i] && mouseX < fontX[i] + textWidth( fontList[i] ) && mouseY >= fontY[i] && mouseY < fontY[i] + ( textAscent() + textDescent() ) ) {
currentFontFace = createFont( fontList[i], 16, true );
textFont( currentFontFace );
currentFontFaceName = fontList[i];
currentFont = "Current font : " + currentFontFaceName;
break;
}
}
}

**デフォルトの名無しさん** · 2009/03/30(月) 22:22:53

みなさんエディタ何使ってます？
他の言語でIDEの補完に慣れきってると全部手打ちするのがきつくて・・・
Eclipseのプラグインとかあるすかね？
おすすめ環境があったら教えてください、できればWindows

**デフォルトの名無しさん** · 2009/04/02(木) 20:50:21

Eclipse使うと補完あるけど、少し文法を変えないといけない。

**291** · 2009/04/03(金) 20:33:47

>>292
あらーそうなんすか　そうするとP5の手軽さが失われちゃうのかな

例えば、補完のないただのエディタで書くプロセッシングと
リッチな補完エディタのあるActionScript 3.0とかだと
どっちがちょっとした作品の制作には向いてるんですかね～

**デフォルトの名無しさん** · 2009/04/04(土) 00:28:24

ASの補完って微妙じゃね？
Javaと比べると

**291** · 2009/04/04(土) 07:33:29

むむ、AS3だとFlashDevelopというIDEが有名なんですが、これって微妙なんですかね？
あのサクサク感（ソフトの軽さ、補完の早さなど）はEclipseより全然楽だと思ったんですけど

デバッグとかになると、かなりしょぼいからEclipseの方が断然↑だと思いますけどね

**デフォルトの名無しさん** · 2009/04/06(月) 20:40:58

プログラミングアートに用いられるものはProcessing以外だと何があるんでしょうか？
ざっとスレを読ませていただきましたが、あまり話題には上ってないようなので質問させていただきました

**デフォルトの名無しさん** · 2009/04/06(月) 22:50:28

>>296
Actionscript、C+、Max、QuartzComposer

**デフォルトの名無しさん** · 2009/04/09(木) 00:33:51

>>296
VVVV, HLSL

**デフォルトの名無しさん** · 2009/04/28(火) 19:57:12

保守

**デフォルトの名無しさん** · 2009/05/04(月) 12:03:45

保守