RubyKokubanの Image#map_pixels を使って書いた。こういうのはRubyKokubanが得意としている。

def setup
  set_window_size(520, 420)
  set_background(Color::Linen)
  @image = Image.load("red-flower.jpg")
  @rate = 0.0
  @frame = 0
  @image_gray = gray(@image, @rate)
end

def update
  @frame += 1
  @rate += 0.003
  @rate -= 1.0 if @rate > 1.0
  @image_gray = gray(@image, @rate) if @frame % 10 == 0

  # @sequence_shot = SequenceShot.new(10, 40) unless @sequence_shot
  # @sequence_shot.update
end

def draw
  x = 10; y = 30
  set_color(Color::White)
  @image_gray.draw(x, y, @image_gray.width * 2.5, @image_gray.height * 2.5)

  # debug info
  set_color(0, 0, 0)
  # text(DebugInfo.fps, 10, 15)
  text("gray rate: #{@rate}", 10, 15)
end

# ----------------------------------------------------------

def gray(image, rate)
  image.map_pixels do |x, y|
    c = image.color(x, y)
    b = c.brightness
    Color.new(c.r * (1.0 - rate) + b * rate,
              c.g * (1.0 - rate) + b * rate,
              c.b * (1.0 - rate) + b * rate,
              c.a)
  end
end

gifアニメの作り方

  # @sequence_shot = SequenceShot.new(10, 40) unless @sequence_shot
  # @sequence_shot.update

をコメントアウトを外して実行するとsequence_shot_xxx.pngという名前で連番画像が作られる。

その後でImageMagickを使ってgifアニメに変換する。

$ convert -layers optimize -loop 0 -delay 36 sequence_shot_*.png gray_anim.gif