実験のために大量の単純な動画が必要になった。Flashなどで一つ一つ丁寧に作るという手はもちろんあった。今考えてみればそれほど時間はかからなかったかも知れないが、最近はもっぱらプログラミングに没頭する日々が多いせいかそういう単純労働をやる気になれない。やれやれ。どうしよう。多少恥ずかしい気分に襲われた。昔、僕ってMaxの名人と言われたことがなかったっけ？MaxとJitterなら出来ると言えば出来る。Maxを使いたいかというと、ふむ、まあ、特に使いたいと思わないのが本音だ。コードを書きたい。いや、コードを書くのが今の自分にとって自然なんだ。
ということで、Rubyでモーショングラッフィクス的な動画が作れないかと挑戦してみた。
この挑戦にとりあえず必要なツールは２つ。まず、描画はRCairoで行う。RCairoはCairoライブラリーのRubyバインディングだ。CairoはIllustratorなどのようにベクトル・グラフィックが描けるかなりパワフルなライブラリーだが、Rubyist Magazineにて日本語の紹介記事が読める。RCairoを使えば、静止画が簡単に書き出せるが動画は無理だから、RCairoで描いた絵をなんとか動画に変換する必要がある。いろいろ試した結果、結局短い動画ならフレームを１つ１つ画像ファイルに出力し、FFmpegでその画像たちを動画に仕上げるという戦略を選んだ。一見面倒な手法に見えるかも知れない。でも意外と楽で、画像を書き出した後、FFmpegでいろいろと圧縮設定を変えたりして動画を手軽に書き直すことができる。
では、まずFFmpegを入手する。便利なツールだからこんなプロジェクト以外にも役立つ。入手方法はいろいろあるが、OSXならHomebrewを使った方がおすすめ。
Homebrewそのもののインストール。ターミナルで以下のコマンドを実行する：
ruby -e "$(curl -fsSL https://raw.github.com/Homebrew/homebrew/go/install)"そしてHomebrewの初期処理を行う：
brew doctorFFmpegをインストールする：
brew install ffmpeg最後にRCairoもインストールする：
gem install cairoそれで下準備ができた。早速コードを書こう。とりあえず簡単な絵の画像を書き出してみよう。
require 'cairo'
width = 1280
height = 720
pixel_format = Cairo::FORMAT_ARGB32
surface = Cairo::ImageSurface.new(pixel_format, width, height)
context = Cairo::Context.new(surface)
context.set_source_rgb(0,0.1,0.333)
context.rectangle(0,0,width,height)
context.fill()
surface.write_to_png("test.png")上記のスクリプトを実行すれば… おおおおお！こんな奇麗な画像が出来上がった。
すばらしい。すばらしい。でも大したことはやっていない。Cairoで描画する前にサーフェイス（面）とコンテキストが必要。絵画で例えるとサーフェイスがキャンバスでコンテキストが筆だ。基本的にコンテキストを通して描画を行う。行７でサーフェイスを作る。その際、ピクセルのフォーマットと画像の幅と高さを指定する。ここで使うピクセルフォーマットは32ビットのRGBA（各チャンネルは8ビット）。
次はいよいよ描画だ。Contextのset_source_rgbメソッドで色を指定する。アルファチャンネルを使用するならset_source_rgbaを使う。ここは奇麗なブルーにする。次の行は長方形を描くように見える。しかし、長方形が描かれるのは次の行のcontext.fill()だ。そう。Illustratorを使っている人なら基礎中の基礎だが、ベクトル絵には「塗り」と「線」がある。英語では塗りのことを「fill」といい、線は「stroke」だ。つまり、ここで長方形を塗るという指示を出している。最後にサーフェイスのwrite_to_pngメソッドでPNGファイルを出力する。
では、何かを動かそう。
require 'cairo'
width = 1280
height = 720
pixel_format = Cairo::FORMAT_ARGB32
surface = Cairo::ImageSurface.new(pixel_format, width, height)
context = Cairo::Context.new(surface)
15.times do |frame_no|
y = height * 0.5 + height * 0.4 * Math::sin(2 * Math::PI * frame_no.to_f / 15.0)
context.set_source_rgb(0,0.1,0.333)
context.rectangle(0,0,width,height)
context.fill()
context.set_source_rgb(1,1,1)
context.arc(width * 0.5, y, 35, 0, 2 * Math::PI)
context.fill()
Dir.mkdir("cache") unless File.exists?("cache")
surface.write_to_png("cache/img#{frame_no}.png")
end
ちょっと長くなったが、最初のプログラムと大して変わったことはやっていない。大きな違いは１枚ではなく１５枚もの画像を出力していることだ。そして、下記のコードで白い正円を描いている。
context.set_source_rgb(1,1,1)
context.arc(width * 0.5, y, 35, 0, 2 * Math::PI)
context.fill()context.arcで正円を描く場合、x座標、y座標、半径を渡してからさらに弧の開始角度と終了角度が必要。円なら、0から2πにする。y座標はサイン派に乗って上下する。
y = height * 0.5 + height * 0.4 * Math::sin(2 * Math::PI * frame_no.to_f / 15.0)
「cache」フォルダーがなければ作ってから15枚の画像をそこに保存する。
Dir.mkdir("cache") unless File.exists?("cache")
surface.write_to_png("cache/img#{frame_no}.png")
後一歩。
FFmpegを使えば、その画像から動画が簡単に作れる。一旦Rubyをやめてターミナルに戻る。
ffmpeg -r 29.97 -i cache/img%d.png -vcodec mpeg4 -b:v 2M ball.mp4
「cache」フォルダーにあるimg<フレーム番号>.pngという形式のファイル名を持つ画像を入力にする。しかし、画像にはフレームレートがないので、読み込み前に「-r 29.97」でフレームレートを指定する。出力のフォーマットを「mpeg4」にして、「-b:v 2M」でビットレートを2 Mbpsにして「ball.mp4」に動画を保存する。こんな感じになる（ブラウザーによって再生できない場合がある）：
いいじゃないか。でもターミナルに戻るのはやはり面倒だ。運良く、Rubyで上記のコマンドが簡単に実行できる。おまけに、途中に生成したファイルを削除することもできる。でも冒頭に書いた通り、残すとターミナルで圧縮設定を変えて動画を書き直すことができる。
require 'cairo'
width = 1280
height = 720
pixel_format = Cairo::FORMAT_ARGB32
surface = Cairo::ImageSurface.new(pixel_format, width, height)
context = Cairo::Context.new(surface)
15.times do |frame_no|
y = height * 0.5 + height * 0.4 * Math::sin(2 * Math::PI * frame_no.to_f / 15.0)
context.set_source_rgb(0,0.1,0.333)
context.rectangle(0,0,width,height)
context.fill()
context.set_source_rgb(1,1,1)
context.arc(width * 0.5, y, 35, 0, 2 * Math::PI)
context.fill()
Dir.mkdir("cache") unless File.exists?("cache")
surface.write_to_png("cache/img#{frame_no}.png")
end
`ffmpeg -r 29.97 -i cache/img%d.png -vcodec mpeg4 -b:v 2M ball.mp4`
`rm -rf cache`
究極につまらない動画だが、同じ方法で究極に格好いいジェネレーティブ・アートも造れるので、一度試してみてください。
Leave a Reply