バグとの遭遇(格闘?)

 米国の裁判の判決でHTMLページにFlashコンテンツを埋め込むのが駄目になってしまったようで、とりあえず外部にJavaScriptファイルを用意して、それにタグを吐き出させるという苦肉の策で今後は乗り切らないといけないみたいです。まあ、どうなるか未来は不確定ですが。
 Flashで作成されたコンテンツは非常に多く見ますが、じゃあLive Motion 2で作られたコンテンツってあるの?という素朴な疑問・・・。まあ、探せばあるでしょう。以下のサイトのムービーはLive Motion 2で作成されたものです。

http://www.pokemon.co.jp/
(http://www.pokemon.co.jp/corporate/index.html)

 まあ、Live Motion 3が出る可能性は、ほぼないので(?)、コンテンツを作成する場合には永久に避けられないバグがあります。バージョンアップがなければ、バグは直らないので当然です。逆に言えばバグだと認知し、それを回避できれば、それはそれで良い手です。
 という事で上記サイトのムービー制作にあたって出会ったバグと回避方法などを書いておきます。

【1】Illustrator 10からのデータが正しく読めない
   向こうからやってきたのはIllustratorのグラデーションがかかったデータでした。ボールにグラデーションがかかっているのですが、これが大4つ+小4つ。まとめてLive Motion 2にドラッグドロップすると不思議な事に最初の1つだけは正しくグラデーションがかかったボールになりました。無事に読み込めた、と思ってswfにしました。すると1つだけがグラデーションがかかったボール、残りがグラデーションなしのボールに(汗)
   これが何度やっても駄目。個別にIllustratorからLive Motion 2にドラッグドロップしても、どうやってもswfにした途端にアウト。グラデーションがかかったボール1つだけを読み込ませてエイリアスで流用しようと試みたところ、これも駄目。で、よ〜く見てみると「ベクトルでなくビットマップ(JPEG)」になってました。時間的な問題もあったので、あきらめてLive Motion 2のツールを使って描きました。よ〜く見ると元データと違うけど、ぱっと見では分からないくらい。何のクレームもなかったし(^^;
   小4つのグラデーションボールも同様に処理。その代わりにロールオーバーの判定が怪しい状態に・・・。これはマスクを使ったために発生しているのですが、インチキしてリモートロールオーバーを使えば解決できたかなと思います。


【2】シルエット(複数のパス)の罠
   ピカチューをシルエットで、という事でIllustrator 10からピカチュウのパスをLive Motion 2に読み込み。これは正しくパスとして読み込むことができたのでラッキーと思っていたら、こんな所にも落とし穴が。Live Motion 2上での再生は期待通りなのにswfに変換するとシルエットがフェードイン/フェードアウトする場合に、何かおかしい。よ〜く見るとピカチュウは複数のパスで構成されているため、そのパスごとにフェードイン/フェードアウトの効果がかかってしまい、パスが重なっている所は50%, 50%濃度なら100%濃度になってしまうという状態になっていました。Live Motion 2のswf吐き出しとしては、まあプログラマとしては理解できるけど・・・。しかし、回避しなければいけないので結局Illustratorで1パスでピカチュウをトレースするという方法で処理しました。


【3】アウトライン文字の罠
   文字をアウトラインで大→小に縮小アニメーションさせてくれ、という事で(The Pokemon Companyの文字)例によってIllustratorからドラッグドロップで読み込み。しかし、この時点で文字が欠けてしまうという異常な状態。特に文字がアウトラインのため線が欠けてしまうのは致命的。何度かいろいろな文字をドラッグドロップしていると、どうもIllustratorで文字が、どこらへんに配置されているかによって文字が欠けたり欠けなかったりするという事が判明。おまけに新規にドキュメントを作って、そこにペーストしてから読み込ませると、うまく読み込むことができました。
   やっと全部の文字が読めた、という事で早速アニメーションを作ってswfにすると、何としたことか文字がビットマップになって拡大縮小されている! 仕方ないので何度かIllustratorからドラッグドロップしてやってみても駄目。翌日やっても結局駄目で、他の作業をしているうちにMacOS Xが落ちてしまい(完全なハングアップ)再起動する事に。そこで再度swf形式にはき出してみると、なぜかビットマップでなくベクトルデータ・・・。Live Motion 2では特に何もしていないので、多分MacOS Xが悪い感じです。多分空きメモリが少ない場合には何かしら不具合が発生していて、それで正しく処理できなかったのかもしれません。勝手な推測なので、実際の所は原因不明です。

【このバグ(線が欠ける)の解消方法をいただきました。こちらのページに解説しました。】


【4】JPEG画像(横線)の罠
   とりあえず少し進んだ、という事で次にロゴが出現する時の背景のストライプ。元はビットマップ画像(JPEG)なので、それを流用すればOK。のはずが、swfにはき出してみると、ちょうど画像の真ん中の横線が1本消えている・・・。1ピクセルごとのストライプなので、これが目立つ。画像を1ピクセル大きくすれば解決できるかと思ってやってみたけど、今度は2本線が・・・。仕方ないので、手抜きな解決方法としてIllustratorで1ライン描いてLive Motion 2に持ってくるという方法で解決。背景色を指定して線の色も指定すれば容量の節約にも。この場合にはスタイルを使うとか他にも方法はあったかなあ、とは思います
 同様にスタッフロールの部分など画像が入っている部分は、それとなく分からないように処理してあります。

【このバグの解消方法をいただきました。こちらのページに解説しました。】




 と、ここまでは実際に遭遇したバグでしたが、Live Motion 2だったので簡単だった部分も書いておきます。
 まず、「もっとロゴの表示速度を速くして」と一部分の速度調整の要求は非常に楽でした。タイムストレッチ機能があるため、optionキーを押したままバーをドラッグすればおしまい。
 動きの細かい調整もAfterEffectsと同じなので割と簡単。ただ、イーズイン/イーズアウトといった、最初は速く、最後は遅くなどの指定は実際には役立たずでした。
 今回は、そんなに高度な要求でなかったので、手軽にアニメーションさせるだけならばLive Motion 2でもバグを除けば問題ない、というのが実感。ただ、このバグが結構痛いところで出るのが難関。

 まあ、Live Motion 2の仕事は、もう来ないと思うけど、ブロードバンド環境でならLive Motion 2でも、いろいろアニメーション作れて良いかも。もっと、お金があるならば素直にAfter Effetcsを買って、プラグインも買ってムービーを作る方がハイクオリティなものができます。

 Live Motion 2のページは誰も見ていないかなあ、と思っていたら結構アクセスがあります。先月(2003年9月)は訪問者数が4888。ヒット数では79221。この数字は私のページにあるIllustrator 10のページのアクセス数よりも多いという状態です。不思議ですね〜

作成日時:2003年10月12日(日)午前1時36分
修正日時:2003年10月16日(木)午後10時35分