(追記:2010/7/10) Rubyだけで画像を生成する方法を用意しました Rubyでスキャニメーションを作ろう!

ギャロップ!! (しかけえほん)」に触発されて ScanAnimationというサイトを作りました サイトでは馬が走る絵とカンガルーが跳ねる写真と 文字が動いて見えるページを用意しています

ScanAnimation

見ての通りこれは 複数枚の画像を重ねてできる一枚の合成画像に対して マスク画像を動かすことで動画を構成しています この合成画像とマスク画像を作れれば 誰でも先のようなサイトを作ることができます ここではこれらの画像の作り方を説明します

なお作成にはRubyおよびShoesのインストールが必要です インストールは各サイトから行えます ターミナルあるいはコンソールで Ruby -vおよびShoes -vとすれば インストールの有無が確認できます

オブジェクト指向スクリプト言語 Ruby

Shoes • Colorful programs for Mac OS X, Linux and Windows

合成画像の作り方

  1. 連続画像を用意し、0から始まる連番付きのファイル名とします(ex. horse0.png, horse1.png, horse2.png..)
  2. gist: 1981 - GitHubから拙作scan_animaker.rb,scan_animator.rb,animator.rbを入手します。他のファイルは無視してください
  3. 各スクリプトのNUM_IMGSに画像数をセットします。MASK_WIDTHで合成画像の粗さを変えることもできます
  4. Shoesでanimator.rbを起動してダイアログで先頭画像(0番)を選び、画像がうまく動画になるか確認します。スクリプトのanimateの数字を変えることで再生速度を調整できます
  5. 確認できたら次にShoesでscan_animaker.rbを開き、ダイアログで先頭画像を選ぶと合成画像とマスクが生成されます
  6. これらを個別にキャプチャして保存します(ex. horse.png, mask_horse.png)。MacではCommand+Shift+4でキャプチャできます
  7. Shoesでscan_animator.rbを開き、ダイアログで合成画像(ex. horse.png)を選んで動きを確認します。スクリプトのanimateの数字を変えることで再生速度を調整できます
  8. 画像処理ソフトでマスク画像の白色部分を透過させます。GIMPでは「色->色を透明度に」でできます

以上で終わりです

これらのソフトおよびスクリプトは無償・無保証です 素晴らしいです。私も前々からスキャニメーションを作りたいのですが、理解が乏しく未だ実現ならずです…。トライしてみます!> ガラムさん
コメントどうもです。ちょっとツールが使い辛くて申し訳ありませんが、トライしてみてください!ものすごく初歩的な質問してもよろしいでしょうか…!?
連続画像は描画ソフトなどで作成するのですか??すみません。> ガラムさん
僕は連続画像を書く技量がないので、ネットから拝借しそれをGIMPという画像処理ソフトで加工しました。それからデジカメで取った写真をベースにしました。度々すみませんでした。参考になります。



blog comments powered by Disqus
ruby_pack8

100円〜で好評発売中!
M'ELBORNE BOOKS