Processingでゆでたまごを作るレシピ!


パブロンです。
前回ProcessingでゆでたまごHello Worldしましたが、今回は約束通りレシピを。。。
前回もお見せしましたが完成版はコチラです。↓


準備するもの

🤖 パソコン (Windows/Linux/Macどれでも大丈夫です!)
🤖 Processing(SDK?) ↓こちらからDLして下さい!
https://processing.org/download/?processing

① 準備が出来たら、お弁当箱のサイズを指定してゆでたまご 🐔 を真ん中に置く準備をします。

[html toolbar=”false”]
void setup(){
size( 250, 350 ); // ⬅️ サイズを指定しています。(緑色の)
strokeWeight( 10 ); // ⬅️ ゆでたまごの白身の大きさです。数値を大きくすると白身の多いゆでたまごになります。
frameRate( 15 ); // ⬅️ ドクドクしているスピード 数値を大きくすると早めにドクドクします。
X = width / 2; // ⬅️ 最初に指定したサイズ(緑色)の横幅の半分
Y = height / 2; // ⬅️ 最初に指定したサイズ(緑色)の高さの半分 コレで真ん中にゆでたまごを描画できます
nX = X;
nY = Y;
}
[/html]

② お弁当箱の色とゆでたまご 🐔 の黄身の大きさ、白身の大きさ、を指定します。

ついでにドクドクのスピードを指定します。
[html toolbar=”false”]
void draw(){
radius = radius + sin( frameCount / 4 );
// 説明が難しいので。。。省略します。
X+=(nX-X)/delay;
Y+=(nY-Y)/delay;
background( 37,211,102 ); // ⬅️ 背景緑色
// たまごの黄身を描画
fill( 255,247,189 ); // ⬅️ たまごの黄身
// たまごの白身を描画
stroke(255); // ⬅️ 白身
// 卵を描画
ellipse( X, Y, radius, radius ); // ⬅️ マル
}
[/html]

③ 最後にマウス 🐭 にゆでたまご 🐔 がついてくる処理を書きます!

[html toolbar=”false”]
void mouseMoved(){
nX = mouseX;
nY = mouseY;
}
[/html]

🐣 まとめ🐣 

下のコードをコピーしてProcessingに貼るとゆでたまごができます。
クーラーの効いた部屋でゆでたまご存分にをお楽しみ下さい。

[html toolbar=”false”]
float radius = 50.0;
int X, Y;
int nX, nY;
int delay = 8;

void setup(){
size( 250, 350 );
strokeWeight( 10 ); 
frameRate( 15 ); 
X = width / 2;
Y = height / 2; 
nX = X;
nY = Y;
}

void draw(){
radius = radius + sin( frameCount / 4 );

X+=(nX-X)/delay;
Y+=(nY-Y)/delay;
background( 37,211,102 );
// たまごの黄身を描画
fill( 255,247,189 ); 
// たまごの白身を描画
stroke(255); 
// 卵を描画
ellipse( X, Y, radius, radius ); 
}

void mouseMoved(){
nX = mouseX;
nY = mouseY;
}
[/html]

次回はもっとインタラクティブなProcessingをお届けします!

関連記事