2009年11月19日

改めて、Flashアニメーションの魅力にこんにちは!

Flashアニメーション

数年前の、フラッシュアニメーション全盛期が懐かしく感じられて仕方が無い今日この頃ですが、皆さんいかがお過ごしでしょうか。

最近のFlash(SWF)は、PC・携帯用のゲームであったり、動画を再生させるためのプレーヤーであったり、サイトの中の複雑な計算を実行させるためのインタラクティブな装置であったりして、半ばプログラムメインのアプリケーション制作ソフトと化しています。
AS3.0からはオブジェクト指向がどうのこうのとか言われても、デザイナーと呼ばれる人種には一切通じませんから!意味がわかりませんから!
携帯ゲームを作っている私が言うのもなんですが、
Flashはアプリケーションを作るソフトじゃないんです!
Flashはアニメーションを作るソフトなんです!

と声を大にして言いたいのです。

そこで、私がFlashで作ったアニメーションのサンプルを元に、Flashがどれだけアニメーション制作に適したソフトであるかを、今更ながら改めて考えてみたいと思います。

2000年から2006年頃までは、次々と個性的なFlashアニメーションが登場して、本当に感動していた記憶があるのですが、最近は回線速度の向上で、動画ファイルばかりが氾濫し、純粋なSWFファイルのアニメーションって、ほとんど見かけなくなりましたよね。
う〜ん、残念。
実際のFlashアニメーションの作り方に関しては、過去のいろいろなサイトで解説されているので、ここでは省略しますが、Flashでアニメーションを作る事によるメリットは、実はたくさんあるんですよね。
というわけで、難しい事はよくわからないけど、自分ひとりでアニメーションを作ってみたい!と考えている方は、ちょっとだけこの記事を読んでもらえませんか?

アニメーション制作におけるFlashの優位性


アニメーションを制作するためのソフトといえば、「AfterEffects」が最初に出てくるかもしれませんが、それはあくまで素材を加工するソフトであり、実際のイラスト素材は、紙に手描きしたものをスキャンしたり、「Photoshop」や「Painter」で描くなりして、連続した静止画の素材を準備しなければなりません。
さらに、合成した動画ファイルを「Premiere」などに読み込んで繋ぎ、トランジションやBGMを挿入して動画ファイルに書き出して…
といったように、普通にアニメーションを制作しようとすると、それなりに手間と時間がかかります。

それでは、これに対してFlashの場合はどうでしょうか…
クオリティに差が出るにせよ、上記の工程の全てが「Flash」というソフト単体で完結します。
特に、Flashは優れたドローツールでもあり、効率よくイラストを描くための工夫がされています。
また、描いたイラストをアニメーションさせるための便利な機能も充実しています。
このように、Flashの大きな魅力のひとつは、短時間でお手軽にアニメーションを作る事ができる!というところです。
おそらく、お手軽にアニメ制作ができるソフトとしては、最高峰のソフトだと思います。(参考資料:私的感情)

Flashで絵を動かすための仕組み


痒いところに手が届くような細かい機能自体はたくさんあるのですが、とりあえず絵を動かすための大まかな仕組みとしては、「フレームアニメーション」と「モーショントゥイーン」の2つが挙げられます。
それぞれの特徴をわかりやすくするために、以前作ったアニメーションの一部分を利用して、以下のようなサンプルをパブリッシュしてみました。

【サンプルA:フレームアニメーション】


【サンプルB:モーショントゥイーン】


以下、それぞれの仕組みについて考えてみます。

フレームアニメーションとは


サンプルAの方は、フレームアニメーションのみで動いているのですが、この仕組みはもう、教科書やノートの角に、誰もが1度は描いた事があると思います。
そう、あのパラパラアニメーションの事ですね。
学生の頃の私は、1学期の前半で既に全ての教科書とノートの角がパラパラアニメで埋まってしまったので、友達の教科書にも描かせてもらったりしてましたが、まさにこれこそがアニメーションの基本というか、原点の仕組みなのです。
教科書にパラパラアニメを描く場合は、下のページに描いたイラストがうっすらと透けて見えるので、それを基準にしながら少しずつ絵が移動するようなアニメーションを簡単に作る事ができました。
Flashの場合も全く同じで、「オニオンスキン」という機能を使えば、オニオン(玉ネギ)の薄皮を通して見たように、前後のフレームのイラストがうっすらと透けて見えるので、それを基準にしながらイラスト制作ができます。
また、透けて見えるフレームの範囲も自由にコントロールする事ができるので、2フレーム前まで透けさせると、自然な動きのアニメーションが作りやすくなります。
実際、このフレームアニメーションだけでも、十分お手軽にアニメーションを作る事ができると思います。

モーショントゥイーンとは


サンプルBの方は、モーショントゥイーンのみで動いています。
モーショントゥイーンとは、フレームアニメーションよりも楽にイラストを動かす事のできる仕組みで、始点と終点にだけイラストを配置すれば、その途中の移動するアニメーション部分は、Flashが自動で計算し、作成してくれるというものです。
これは、はっきり言ってチョー便利です。
ただ、自動で作成してくれるとは言っても、始点に「ガンダム」を配置し、終点に「ザク」を配置したからといって、その途中が滑らかに変化していくようなアニメーションになるわけではなく、あくまでも移動させる事ができるといった感覚です。
移動の仕方に関しては、始点と終点の間を、直線的に移動させる他、回転や反転や、加速・減速しながらの移動もできます。
また、移動する道筋を描けば、自由自在に移動させる事もできます。
このように、モーショントゥイーンは、Flashの代名詞のような機能といっても過言ではありませんね。
ただし、注意しなければならないのは、例えば「バグってハニー」というタイトルでも、主人公はあくまで「高橋名人」なのです。
例えがイマイチですが、タイトル(代名詞)になるほどの機能でも、やはり基本(主人公)はフレームアニメーションです。
フレームアニメーションを理解しないでモーショントゥイーンを多用すると、不自然な動きのアニメーションになる可能性がありますから、注意が必要です。

上記の2つの機能を駆使すれば、とりあえずお手軽アニメを作る事はできると思いますが、Flashの魅力はそれだけではありませんよ!
画像処理にベクター形式を採用する事により、1度描いたイラストを、とことん活用できたり、再生させる際の画像サイズを自由に変更させたりもできます。

ベクターデータによる恩恵


Flashの場合は、ベクターデータと呼ばれる画像形式を扱えるため、点の座標と線の属性をコンピュータが計算する事で数値をなんとかかんとか・・・で、とにかくFlashの中で描いたイラストは、画像の劣化が一切ありません。

例えば、通常の動画ファイルの場合、仮にSD画質(640px×480px)でアニメーションを制作すると、それ以下の解像度や、それ以上の解像度で再生させると、画質の劣化が起こります。
DVDをハイビジョンテレビで再生させるような感じですね。
これに対してFlashの場合は、フルハイビジョンテレビや、それ以上の解像度のモニターで全画面表示させても、一切画像が劣化する事なく再生させる事ができるのです。
例えば、今回のサンプルアニメを、拡大表示して見てみましょう。

サンプルAを拡大する>
サンプルBを拡大する>

いかがでしょうか、画像は全く劣化していません。
場合によっては滑らかに再生されていないかもしれませんが、それには理由があります。
Flashの場合は、通常の動画ファイルとは大きく異なり、リアルタイムでレンダリングしながら再生させているので、ファイルサイズは小さく(サンプルA→14.7kb、サンプルB→28.9kb)できますが、再生速度がパソコンの性能に大きく左右されてしまうといった面もあります。
ただ、常識的な範囲内のサイズで再生させるのであれば、特に問題は無いのではないかと思います。
今後、ハードの発展により、フルHDを超える超高解像度のテレビが登場しても、Flashでアニメーションを制作しておけば、常に最高品質の画質を(映像クオリティは別として)楽しむ事ができるというわけです。


といわけで、Flashでアニメーションを作る事のメリットはたくさんありますねー。
アニメーションを見るだけではなく、作る方にも興味があるゾーという方は、まずはお手軽なFlashでアニメーション制作の世界に飛び込んでみてはいかがでしょうか?
Flashアニメのクリエーターが、次々と登場してくる時代が、またいつか来ないかなぁ…。



関連するオススメ記事
ダイハツのウェブ漫画などなど。
ロトスコープで作画するメリット。
ARで動くキャラクターアニメーションを制作。
Flash CS5 で作る4Kアニメーション。
オープニングムービー制作の裏話。


この記事へのコメント
自分はプログラマーですが、ちょっとこの内容には引っかかったので。どこにかというと、

「Flashはアプリケーションを作るソフトじゃないんです! Flashはアニメーションを作るソフトなんです!」

のところです! まさしくその通りだと思います!!

なんかAS3でプログラマー色がさらに強くなり、昔の「絵>プログラム」から「絵<プログラム」に仕様自体がなりつつある気がします。

ある意味普通の言語ですよね。しかし普通の言語になってしまったFLASHのどこに魅力があるのでしょうか?

FLASHはだんだんとおかしな方向に進んでいるような気がして心配でならない思いだったので、この内容に思わずレスしてしまいました、笑

名前でわかるようにNaNaTreeの件から初めてブログに来たものです。報告ありがとうございました。これからも頑張ってください!
Posted by たか at 2009年12月07日 15:34
まさかまさかといった感じですが、プログラマーの方からアニメーション寄りのコメントをいただけるとは思っていませんでした(笑)
世の中がHTML5に移行していく中で、プログラムメインで作られるFlashコンテンツが生き残っていけるのかは不安な部分がありますが、お手軽なアニメーション作成ソフトとしては、まだまだ不動の地位にあると思います。
アニメ部分を強化するにしても、AS部分を強化するにしても、ぜひとも今後のAdobeにはがんばってもらいたいですね!
Posted by a2me at 2009年12月07日 21:48
コメントを書く
お名前:

メールアドレス:

ホームページアドレス:

コメント: [必須入力]


この記事へのトラックバック