第1回「ベクトルグラフィックスの不思議」[2002.4.22]

オンラインアップ情報:[講座ページを見る]

現在、[document]の「1.ベクトルグラフィックの不思議、1本線が持つ表現力」と「2.技法「ストロークバリエーション」(他ソフトとの連携)」がアップされています。

*

*

裏日記:

[2002.5.14 PM1:30]

movie]コンテンツ、ビットマップ画像のアニメーションとビデオ(ソレンソン圧縮)の併用というウルトラCを使うことにしました。かなり無謀な作業に思えますが、意外に効率良く進められそうです。

MX のビデオ機能というのは、こう使えばいいんだ‥というヒントも得られました。RealVideo やWindows Media の代用として捉えていたので、「あまり使えない‥」などと思っていたのですが、違うんですね。

「Web Designibg」今月号、95ページに米マクロメディア社・上級副社長ドミニック・ガレロ氏のインタビュー記事が掲載されていますが、『長編動画の再生は、既存のプレーヤーで十分』と言っています。既存のプレーヤーというのは、Real Player やWindows Media Player、QuickTime Player のことです。

つまり、Flash Player 6 とは競合しないと‥。逆な言い方をしますと、長いビデオ映像を扱うような仕様にはしていない、RealVideo やWindows Mediaを使ってください、ということですね。私はここを勘違いしていました。

しかも、Director にビデオ映像をリンクするような感じで捉えていたので、さらに混乱。‥やっと、MXの”ビデオ”は違うということがわかりました。

[2002.5.7 AM8:00]

かなり遅れている[movie]ですが、結局、ビットマップ画像を大量に使用するものは、LiveMotion 2.0でオーサリングしてみることになりました。Flash MX ですと、どうしても歪んだり、ズレたり、という症状が起きます。つまり、オーサリング画面ではぴったり合っているのに、パブリッシュすると1ピクセル分ズレていたりします。

この微調整作業(手作業で1ピクセル移動させる)がある限り、制作を自動化できないことになりますので‥。[movie]教材、もうちょっと、お時間を。

*

[2002.5.6 AM1:00]

結局、5/2〜5まで休暇になりました。(といっても半分は仕事。)明日も振替休日ですが、こちらの作業を進めます。今日は、29度という暑さでしたが湿度がないので、北海道の夏という感じで最後の休みを満喫。‥でも、ネタ帳はまた数ページ増えました。

講演などを頼まれると必ずネタ帳を引っ張り出します。ビジネス系のものが多いので、新しいニュースも仕入れながら、事業の成功例、失敗例などを絡めていきます。「FG2」はクリエイティブ系ですが、やはりネタ帳が生きています。下の写真は今日、書いた新しいテクニックのアイディアです。(構造化アニメーションのとき使おうと思っています。)

スターバックスでコーヒー飲みながら書く。なぜ可能かと言うと、頭の中にFlashがあるからです。ソフトを買って自分のパソコンにインストールしたら、1週間くらい徹底的に触ります。すると、頭の中にもFlashがインストールされて”イメージで操作”できるようになります。もちろん、実際に操作してみると誤差があってボツになるときもあります。

自分でも不思議なのですが、マニュアルはいらないんですね。メニューとかダイアログのキャプチャ画像があればいい。逆な言い方をすれば、これがないとイメージできない場合があります。でも、ヘンな作業です。メニューの画像見ながら、頭のなかでソフトを操作するのですから。

仕事の打ち合わせで「こんな事できる?」なんて聞かれて、瞬時に頭のなかでシミュレーションしたことはありませんか? 先方が喋っている間、頭のなかで試行錯誤する‥そんな状態でしょうか。

写真:講座のネタ帳

[2002.5.2 AM11:00]

今日は取材なので外へ出ます。[movie]1の最終調整は明日。ここまで延ばしているのだから、教材制作プロセスも”教材”として公開しないといけませんね。Flash を使ったストリーミング(音声部のみ)配信は、クセがありますから。それより、ビットマップ画像が歪んで(あるいはズレて)しまう症状、MXでも同様。ピクセル単位で修正すればいいんですけど、オーサリング画面でズレているのは、あまり気持ちよいものではありません。やはり、LiveMotion 併用となるのか‥。

*

[2002.5.1 PM9:45]

movie]1は、7分に短縮しましたが、まだFlash には辛い感じですね。次回からは、ほんとに分割した方がいいかもしれません。

音声ファイル(WAV)は「70.6MB」、MP3-64kで圧縮して「3.2MB」。音以外のデータは「450kb」くらいです。これはダウンロードにして、音声はストリーミングにします。

音声にシンクロさせたパンチライン・ムービーは90分くらいで作成。グラフィック素材の読み込み、レイアウトは120分〜180分。7分のムービーは、5時間程度の作業で完了。‥する予定だったのですが、音声ファイルの圧縮(つまりパブリッシュ)に予想外の時間がかかってしまいました。パブリッシュを繰り返すと、待ち時間が大きい。ただ、これはマシンCPUで解決しそう。(今、使用しているのはP2)

私、1人だと1日作業だが、プロのデザイナーだったら5時間くらいで終わってしまうと思う。週1回、新しいムービーを公開していくことはコスト面でもOK。問題は演出。見栄えについても、いろいろ試していかないと。

余談ですが、このムービーを制作会社に依頼すると、1本50万円を支払うことになります。フリーの方に頼んでも20万円は必要です。1ヵ月で8本公開しますので、制作費は160〜400万円になります。こちらで、スコアとパンチライン・ムービー、挿入素材を用意すると1/3くらいに下がります。もし、パンチライン・ムービー作成が自動化できれば、スケジュールが成り立ちます。

今は、私がやっていますから制作費はゼロです。ただ、私はデザイナーではありませんから、これを続けるわけにはいきません。(何より本業を圧迫してしまいます。)ただ、こうやって自分でやってみると、デザイナーさんと”会話”ができるようになりますので、とてもメリットがあるのです。

写真:パンチライン・ムービー作成

写真は、[movie]1のスコアとパンチライン・ムービー画面。絵コンテを書かなかったため、頭が混乱、作業効率が悪く、すごい時間がかかっている。まだ、調整しなければ。(ここで、きちんと反省点を記しておけば、2本目からは楽になります。)
これらの教材データ、スコアなども(受講者、聴講者の皆さん向けに)ダウンロードできるようにしようと思っています。

[2002.5.1 AM10:00]

やっと時間が確保できました。今日は夕方まで[movie]教材をやります。音声は7分に短縮しましたので、12,600フレーム。まずはパンチライン・ムービーを作ります。

[2002.4.30 AM9:00]

今日、[movie]教材の1つは終わらせたいと思います。なんとか、16,000フレーム以下にできそうです。(画面のキャプチャを多用するので、ビットマップの扱いに強い)LiveMotionでも試してみましたが、結局、SWFになりますので‥。Flash で完成させます。

[2002.4.28 PM2:00]

document]の「2.技法「ストロークバリエーション」(他ソフトとの連携)」が全てアップされました。

[2002.4.28 AM1:40]

document]の「2.技法「ストロークバリエーション」(他ソフトとの連携)」は、現在8ページまでアップしています。あと、1ページ残っています。最後のページのサンプルファイル(FLA)は、ダウンロードできるようにします。URLは、「FLASH GROOVE 2 news」NO.30 に記載いたします。[分解]など、いろいろ試してみてください。

*

[2002.4.27 PM5:30]

取材からもどってきました。とりあえず、サンプルの絵はアニメ調に決定。ポップなイラストやリアル画よりも理解しやすいでしょう。早速、最後のまとめに入ります。ちなみに、下のベクトルグラフィックは、32kbになりました。

*

[2002.4.27 AM1:15]

あまりの絵のヘタさに、無駄な試行錯誤が続く‥。(素人だから、しかたありませんが。)ストロークバリエーションのサンプルはかなり増えてきましたので、より理解しやすいものを選んで、解説図として使いたいと思います。やはり、明日か‥。

画像:ベクトル線のサンプル描き

[2002.4.26 PM7:20]

document]の「2.技法「ストロークバリエーション」(他ソフトとの連携)」は、現在4ページまでアップしています。これから打ち合わせがありますので、続きは夜からです。(もう‥夜ですが。)

[2002.4.26 PM2:30]

打ち合わせ終了。次の打ち合わせは夕方なので、[document]の2をなんとか終わらせたいと思います。今週中に[movie]2つもアップさせます。デザイナーさんに発注すれば、何なくアップできるのですが、教材開発マニュアルを書くため自ら実践しています‥。(実証実験レポートも私が書かなければ‥。)

document]の2では、あの伝説のCD-ROMをご紹介します。有機的なインターフェースが素晴らしい。Flash で、このような表現を実現するには、やはりストロークバリエーションが適しています。夕方にはアップ。

写真:[document]の2で紹介するCD-ROM

[2002.4.25 PM11:30]

document]の2をまとめています。Expression 2 との連携(ベクトルグラフィック描画)を解説します。Flash ワークに役立つノウハウを書き出していきます。

「Expression 2」の操作シーン

*

[2002.4.25 PM4:00]

movie]は後の作業にして、先にストロークバリエーションの解説画面を決めています。多分‥ポップなイラストより、漫画調の絵の方がわかりやすいと思いますので、そういうテイストを持ち込みたいと考えています。ベクトル線は、水彩タッチに変換されていますが、意外にデータサイズはコンパクト。[document]の2は、明日までにアップしたいと思っています。さて‥また会議があるので、しばらく出かけます。

写真:ストロークバリエーションの実験

[2002.4.25 AM3:00]

やはり、ダメでしたね。MXなら‥もしかして、と思ったのですが。16,000以上、フレームを動かせません。DVフォーマットに変換してDVDにするなど、想定されていませんから、しかたありません。今回は、音声の方を編集して短くすることにします。今後は、ファイルを分割する等、いろいろ考えないといけませんね。

写真:Flashは16,000フレームが限界

[2002.4.24 PM]

‥もどりました。これから、パンチライン・ムービーを作成します。総フレーム数は、17,400フレームです。(DVD同時制作なので、フレームレートを30fpsにしているため。)限界を超えてますが、一応試してみます。

その前に‥、来週の講義に必要な「Adobe LiveMotion 2.0」の準備です。パッケージには、ユーザーガイドとスクリプティングガイドの2冊が入っています。スクリプティングガイドは、ActionScript、ECMA標準JavaScriptとの比較で解説されています。

写真:Adobe LiveMotion 2.0のパッケージとマニュアル

「FLASH GROOVE 2 news」でご紹介したFlash MX 関連の書籍です。表紙の「MX対応」という記載が小さくて分かりにくい。(ちょっと、もったいないですね。)中は、すべてFlash MX の画面で解説されています。

写真:MX関連の書籍

[2002.4.24 AM]

今日は久々の晴天なので、取材に出ています。[movie]教材は、もう少し時間がかかります。([movie]教材制作は、完全に空き時間作業になっています‥。)昨日夜はパソコンが使えなかったので、お店でパンチラインを決めました。MD 聞きながら‥です。本日お昼には、パソコン上でフレーム数の計算をしました。取材からもどり次第、Flash でパンチラインムービーを作ります。Flashの限界は、16,000フレームと聞いていますが、すでに17,000フレームを超えています。さて、どうなるか‥。

[movie]教材の制作風景

トップにもどる


Copyright(C)2002. [ 学校法人阿佐ヶ谷学園/高度情報化研究所 eFace lab. ] All rights reserved.