PhotoshopやIllustratorと連携可能なWebアニメーションツール Adobe LiveMotion アドビシステムズ オープンプライス 3万7800円(Adobe Store価格) カスタマーインフォメーションセンター　03-5350-0407 http://www.adobe.co.jp/

アドビシステムズの「Adobe LiveMotion」は、Webページで利用するアニメーションやインタラクティブな素材を作成するためのソフトウェアだ。いわば、「Macromedia Flash」のライバルとも言うべき製品で、Webアニメーションの世界で事実上の標準となっている「SWF」(Shockwave Flash)形式への書き出しをサポートし、プロデザイナーに必携のツールである同社の「Photoshop」や「Illustrator」との強力な連携機能を持つのが大きな特徴だ。

再編集が容易な
オブジェクト単位でのアニメーション作成

	Adobe LiveMotionの全体画面。ツールボックスをはじめとして、同社の主力製品であるPhotoshopやIllustratorと共通化されている部分が多く、それらのアプリケーションを触ったことのあるユーザーならはじめてでも戸惑いは少ないだろう。

　LiveMotionのアニメーション作成機能のポイントは、“オブジェクト単位でアニメーションの変化を編集していく”という部分だ。読み込んだ画像やLiveMotion上のツールを使って作成した図形／文字は、それぞれ1つのオブジェクトとして扱えるので個々にアニメーションを設定できる。このオブジェクト単位で編集することのメリットは、たとえば「AとBという2つのキャラクターが上から落ちてくる」アニメーションを作成するときに、Bだけ早く落ちるように変更する場合には、Bの動きの設定のみを変えればいい、という具合だ。なおオブジェクトには「位置」「不透明度」「回転」「スケール(大きさ)」「色」などの属性があり、位置の値を変化させればそのオブジェクトは上下左右に移動し、スケールを変えれば大きさが変わるといったように、これらの値を変化させることでアニメーションを実現する。

	Adobe AfterEffectsのそれに近い操作感を持つ、LiveMotionのタイムラインウィンドウ。オブジェクトごとにさまざまな属性があり、その属性の値を変化させることでアニメーションを作成する。

　アニメーションを作成するとき、LiveMotionで重要な役割を担っているのが「タイムライン」ウィンドウだ。ユーザーはここで、アニメーションの全体の長さ、それぞれのオブジェクトの表示開始／終了時間、さらにどのオブジェクトに対して動作を設定するか、動作の開始キーフレームの設定などを行っていく。なお、基本的な操作は同社の映像編集ソフト「Adobe After Effects」に近く、これに慣れたユーザーならすんなりと入り込めるだろう(はじめて触る人でも、さほど難しくはない)。

　では、実際にアニメーションを作ってみよう。まずキャンバスの上に、テキスト描画ツールを使って「A」という文字を描く。するとそれがオブジェクトとして、「ブラック“A”」という名前でタイムラインウィンドウに登録される。続いて現在選択されている時間を示す「再生ヘッド」をアニメーション開始位置に合わせ、「ブラック“A”」−「変形」から「位置」属性を選び、左にあるストップウォッチアイコンをクリックし開始キーフレームを作成する。その状態のまま、再生ヘッドをアニメーション終了時間まで移動し、キャンバス上の「A」の文字を画面内の移動させたい場所までドラッグする。動かし終わると終了キーフレームが作成され、自動的にその中間も補間されてアニメーションが完成する。

　なお、属性はそれぞれ個別にも設定でき、それを組み合わせることで複雑なアニメーションを実現できる。先ほどの「A」のオブジェクトに対して回転属性でアニメーションの最後に「変形」パレットの角度の値を「360」に設定すれば、1回転しながら「A」が移動する、というアニメーションになる。同様に“不透明度”(背景を透過させる／させないの度合い、0ではオブジェクト自身が透明になり、100だと背景を透過しない不透明になる)を調整して徐々に現れながら移動する、あるいは色の属性を変化させて赤から青へと色を変えながら移動する文字、などバラエティに飛んだアニメーションが簡単に作成できる。嬉しいのは、こうして作成した“アニメーション”を別のオブジェクトにも簡単に適用(再利用)できるという点だ。異なるオブジェクトが同じ動きをするアニメーションを作る場合に、作業時間が大幅に短縮できる。

　テキストの扱いが非常に柔軟である部分は、LiveMotionを利用する大きなメリットとして特筆しておきたい。たとえば何らかの文章をアニメーションで動かすといった場合でも、まずテキストツールを使って文章を打ち込み、続いてオブジェクトメニューの「文字ごとに分割」を実行するだけですべての文字がバラバラのオブジェクトに変換される。これによって1つずつ文字を打ち込むなどといった作業は必要なく、スムースにテキストアニメーションを製作できる。また、アニメーションを作成している途中で文字あるいはフォントを変えるといったことも可能で、最初から作り直す手間が省けるのは大きい。

• 再編集が容易なオブジェクト単位でのアニメーション作成
• ペンツールからフィルタまで描画機能の充実にも注目