frameCountを使った動きについて

前提・実現したいこと

180フレーム（３秒）ごとに半透明の円がランダムな箇所に流れて消えていくアニメーションを制作しています。
実行すると３秒ごとに円は表示されるのですが、流れる動きがつかず一瞬だけの処理になってしまいます。
どのようにすれば泡の動き（if内）が上手く動作するでしょうか？

該当のソースコード

Processing3.5.4を使用しています。

float y =2;//泡の動き
int tmi =100;//泡の透明度
float tki = random(50, 100);//泡の直径

void setup(){
size(1000, 1000, P2D);
frameRate(60);
}

void bg(){
noStroke();
beginShape();
fill(30, 40, 80);
vertex(0, 0);
vertex(1000, 0);
fill(0, 0, 0);
vertex(1000, 1000);
vertex(0, 1000);
endShape();
}

void draw(){
bg();
translate(500, 400);
rotate(radians(20));

ellipse(0,0, 50,50);

if (frameCount % 180 == 0) {

 y=y+2;//上昇する動き
 tmi=tmi-3;//消えていく動き
 noStroke();
 fill(200, 255, 255, 10+tmi);//徐々に消える泡
 ellipse(0+random(-400,400) , 0+random(-400,400)+y, tki, tki);

}

試したこと

https://note.com/deconbatch/n/nb1b1dc857fe8

frameCountの処理はこちらを参考にさせて頂きました。
frameCountの部分のみなので回答のご参考になるかは分かりませんが、記載させて頂きます。

行動規範の内容に同意します

回答1件

ベストアンサー

if (frameCount % 180 == 0)ということは、180フレーム中の1フレームしか入りません。
y=y+2;やellipseもその瞬間だけです。

180フレーム（３秒）ごとに半透明の円がランダムな箇所に流れて消えていくアニメーション

ということはy=y+2;やellipseは常に実行し、if内は位置のリセット等の処理が入るべきでしょう。

Processing
1float x = random(-400, 400); // 泡のX座標
2float y = random(-400, 400); // 泡のY座標
3int tmi = 100;
4float tki = random(50, 100);
5
6void setup() {
7  size(1000, 1000, P2D);
8}
9
10void bg() {
11  noStroke();
12  beginShape();
13  fill(30, 40, 80);
14  vertex(0, 0);
15  vertex(1000, 0);
16  fill(0, 0, 0);
17  vertex(1000, 1000);
18  vertex(0, 1000);
19  endShape();
20}
21
22void draw() { 
23  bg();
24  translate(500, 400);
25  rotate(radians(20));
26
27  circle(0, 0, 50);
28
29  y += 2;
30  tmi -= 3;
31  noStroke();
32  fill(200, 255, 255, 10 + tmi);
33  circle(x, y, tki);
34
35  if (frameCount % 180 == 0) {
36    x = random(-400, 400);
37    y = random(-400, 400);
38    tmi = 100;
39    tki = random(50, 100);
40  }
41}