float r;  //赤の値
float rSpeed;  //赤の変化のスピード

//初期化
void setup() {
  size(300, 300);
  frameRate(30);  //再生速度を1秒30フレームに設定（初期値は1秒60フレーム）
  r = 0.0;  //赤の初期初期値は0.0
  rSpeed = 1.0;  //赤の変化するスピード
}

//プログラムが終了するまで、draw()の中は繰り返される
void draw() {

  r += rSpeed;    //rの値にrSpeedを足す
  //もし、rの値が255（最大値）より大きくなるか、0(最小値）より小さくなった場合、  
  if(r > 255) {
    rSpeed = -rSpeed;  //rSpeedの増える値を反転する
    //rの値が255を超えたまま画面表示されるとノイズが入るため、255以上にはならないように設定
    r = 255;
  }else if(r < 0) {
    rSpeed = -rSpeed;  //rSpeedの増える値を反転する
    r = 0;  //rを黒にする
  }
  
  background(r, 0, 0);  //赤の値だけ変化する
}