この記事を書いた人
![](https://watataku-artist-katsuyaku.com/wp-content/uploads/2024/03/watataku-user-profile-illustrationi-light-blue.png)
- クリエイティブコーディングで制作した作品と、上達のためにやったこと・学習過程を発信
- コンセプトは「クリエイティブコーディング1万時間の歩き方」
- 2024年にProcessingの構文のアウトプットを終え、2025年から作品制作開始(クリエイティブコーディングで作成した作品集)
目次
作品の画像とコード
![【作品No.32】バネみたいな形で下がっていく【Processing 2025年2月8日】](https://watataku-artist-katsuyaku.com/wp-content/uploads/2025/02/work-32-descending-in-a-spring-like-shape-eye-catching-image-1024x1024.png)
アニメーション。
Ball[] balls = new Ball[300];
color[] colors = {#606c38, #283618, #fefae0, #dda15e, #bc6c25};
void setup() {
size(600, 600);
smooth();
noStroke();
frameRate(30);
for (int i = 0; i < 300; i++) {
balls[i] = new Ball(random(5, 10), width / 2, i * (height / 300), colors[i % colors.length], i * 0.1);
}
}
void draw() {
background(#fefae0); // 背景色を変更
for (int i = 0; i < 300; i++) {
balls[i].update();
}
}
class Ball {
float radi, posx, posy, angle;
color clr;
Ball (float r, float x, float y, color c, float a) {
radi = r;
posx = x;
posy = y;
clr = c;
angle = a;
}
void update() {
posx = width / 2 + cos(angle) * 200; // 水平方向の移動
posy = angle * 10 % height; // 垂直方向の移動をカバー
angle += 0.2;
fill(clr);
ellipse(posx, posy, radi * 2, radi * 2);
}
}
作った感想
約1週間ぶりくらいにに作成した作品。
また作品づくりをやっていこう。
![](https://watataku-artist-katsuyaku.com/wp-content/uploads/2024/03/watataku-hukidashi-light-blue.png)
それでは今日もレッツワクワクコーディング。