gihyo.jp » WEB+DESIGN STAGE » 連載 » ビギナーのためのFlash CS4 Professional オブジェクトベースアニメーション » 第3回 モーションプリセットで自分だけのライブラリを作ろう!

ビギナーのためのFlash CS4 Professional オブジェクトベースアニメーション

第3回 モーションプリセットで自分だけのライブラリを作ろう!

Flash CS4に搭載された「モーションプリセット」は,“モーション(motion)”の“プリセット(preset)”ですから,前もってセットされている動きをステージ上のオブジェクトに適用できる機能,もしくは自分で設定した動きを記録・再利用できる機能のことです。

今回は,このモーションプリセットの活用方法について解説していきます。

モーションプリセットは,タイムラインエフェクトとは違う

Adobe社のサイトでFlash CS4の製品ページを見ると,「基本的なモーショントゥイーンをワンクリックで作成」「新しいアニメーションツール群で編集作業がさらに効率化」といった見出しが目につきます。

一押しの新機能として紹介されており,アニメーション作業の「効率化」が強調されています。「最適化されたアニメーションツール群」を見ると,以下の4つの新機能が列挙されています。

  • オブジェクトベースのアニメーション
  • モーションパス
  • モーションエディタ
  • モーションプリセット

「モーションプリセットって,“タイムラインエフェクト”みたいな機能でしょ」などと思っていませんか?

たしかに,タイムラインエフェクトもアニメーション作業を効率化するために搭載された機能でしたね(※タイムラインエフェクトはMX2004から搭載された機能。CS4では廃止されました。タイムラインの制御が重たくて,作業の効率化には貢献できなかった機能かもしれません)。

一見すると,モーションプリセットも同じような印象を持たれてしまいそうですが,大きく異なるのは(トゥイーンが,キーフレームではなくオブジェクト自体に適用される)オブジェクトベースのアニメーションに最適化されたツールになっていることです。これで,アニメーションワークの効率化につながるモーションの再利用が可能になったわけです。

以下のビデオは,MX2004を使っていた頃,タイムラインエフェクトを駆使して作るはずだったアニメーションです。いろいろ試行錯誤しましたが,あまりにもパフォーマンスが悪くて挫折してしまいました(結果的に,通常のモーショントゥイーンで作成しました)。

ビデオ1 Flashで作成したアニメーション(CS4でHDビデオに変換してYouTubeにアップしています)

このビデオのような長いアニメーションをデザインするとき,モーションプリセットが活用できないか考えてみました。複数のモーションの組み合わせで作られているため,基本となるモーションを登録しておけば再利用によって大幅に効率化されます。これは実際に試さなくても想像できる利点でした。

実は,もっと大きなメリットがあったのです。それは,「調整」の容易さです。複雑な設定をしたアニメーション・シーンを調整するときに,絶大な効果を発揮します。たとえば,トゥイーンスパンを短くして,動きの速さを部分的に調整したい場合,CS3までのモーショントゥイーンだと(中間のキーフレームも調整しなければならないため)大きな作業が発生してしまいますが,CS4だとドラッグするだけで終了します(プロパティキーフレーム間も自動調整してくれます)。

一発適用して完成!というわけにはいきません。こまかい調整を何度も繰り返して,作品のクオリティが上がっていきますから,エディティングのユーザビリティが高いというのは大きな利点だと言ってよいでしょう。

モーションプリセットの使い方

モーションプリセットの使い方はとても簡単です。すでに30種類のモーションが登録されていますので,実際に適用してみましょう。

それでは,「ウェーブ」をステージ上のオブジェクトに適用してみます(書籍のPart-2 Lesson-5 STEP02「モーションプリセット「ウェーブ」を適用する」と同じです)。

  1. ステージ上のオブジェクトをクリックして選択しておく
  2. モーションプリセットの「ウェーブ」を選択し[適用]ボタンをクリックする
  3. 適用されたオブジェクトの位置を調整する
  4. 適用されたオブジェクトの大きさを調整する
  5. 全体を見ながら,もう一度オブジェクトの位置を調整する

ビデオ2 モーションプリセット「ウェーブ」を適用する

※画面のテロップが読みにくい場合は、ビデオの画面内をクリックしてください(大きなサイズのビデオで確認できます)。

重要なポイントは,「適用後」の編集です。モーションプリセットを適用した後に,位置の変更や伸縮を実行してアニメーション全体を調整するとき,操作手順が多かったり,Flashの動作が重たくなるようでは作業に支障が出てしまいます。CS4のモーショントゥイーンではモーションパスが表示され,オブジェクトとは別に伸縮や回転などを実行することができるようになっています。この仕様によって,柔軟性や表現のバリエーションを容易につくり出すことが可能になっています。

著者プロフィール

境祐司(さかいゆうじ)

インストラクショナル・デザイナー[Instructional Designer]として学校,企業の講座プラン,教育マネジメント,講演,書籍執筆などの活動をおこなう。2000年より情報デザイン関連のオンライン学習実証実験を始める。現在,教育デザイナー育成を目的としたフォーラムを立ち上げるため準備中。著書に「速習Webデザイン Flash CS4」(技術評論社),「Webデザイン&スタイルシート逆引き実践ガイドブック」(ソシム)などがある。

URLhttp://admn.air-nifty.com/monkeyish_studio/

著書

  • 速習デザイン Flash CS4

    速習デザイン Flash CS4

コメント

コメントの記入

パスサポ

多数の情報処理技術者試験対策書籍の発行実績を誇る技術評論社がお届けする,資格試験合格サイト「めざせ! 情報処理試験 パスサポ」が開設されました。

ピックアップ

サクセスストーリーに続く,快適サーバー運用管理のヒント!

データの増大,煩雑な管理,システムダウン,セキュリティなど,迫りくる課題からシステム管理者の負担を軽くするポイントを解説します。

gihyo.jp インフラエンジニア情報局

ネットワークやITにかかわるあらゆる業種で必要とされるインフラエンジニアに向けた技術情報や心構え,その魅力について多角的に紹介。

テストエンジニア ステーション

いま,ITに関わるあらゆる開発業務で注目されつつあるテスト系エンジニアをターゲットにしたコンテンツサイトを展開します。

一行クイックアンケート

gihyo.jpで取り上げてほしいネタは?

※検索はページ右上の検索ボックスをご利用ください。

その他の連載

はじめMath! Javaでコンピュータ数学

プログラミング言語入門者向けに,知っていると役立つ数学的トピックスを紹介します。簡単な演習問題と解説で,即活用できる知識を目指します。

小型Linuxサーバの最高峰 OpenBlockS 600活用指南

搭載メモリの増加,CPUクロックの向上など,あらゆる面が強化された期待の新モデルOpenBlockS 600。この記事ではOpenBlockS 600の紹介から,活用するためのさまざまなノウハウを紹介していきます。

教科書には載っていない ネットワークエンジニアの実践技術

ネットワークエンジニア,インフラエンジニアのトラブル対応には,時には「教科書通りにいかない」テクニックが必要となります。資格試験では得られないこうした実践的な技術について,実例を元に紹介します。

Googleケータイ,世に現る

2008年9月,Googleが中心となって開発されている「Android」を採用した携帯電話「T-Mobile G1」が発表されました。本連載ではT-Mobile G1を中心にGoogleケータイに迫ります。

モバゲーオープンプラットフォームに挑戦!――面白法人カヤック流モバゲーオープンプラットフォーム企画と開発のイロハ

2010年1月にリリースとなったモバゲーオープンプラットフォーム。その制作企業であるカヤックが,アイデアを企画に落とし込み,開発までのノウハウを紹介します。

プロトタイピングツールSketchFlowを用いた,Silverlightアプリ開発

SketchFlowプロトタイプ作成からアプリケーション開発までをExpression Blend 3を使って実践的に解説します。

Ubuntu Weekly Recipe

Ubuntuの強力なデスクトップ機能を活用するための,いろいろなレシピをお届けします。

玩式草子─ソフトウェアとたわむれる日々

Plamo Linuxのメンテナンスの傍ら,Linuxやオープンソースソフトと日々を過ごす著者が,その魅力とつきあい方を,エッセイ風味でお届けします。

連載一覧

gihyo.jp

  • DEVELOPER STAGE
  • ADMINISTRATOR STAGE
  • WEB+DESIGN STAGE
  • LIFESTYLE STAGE
  • SCIENCE STAGE
  • NEWS & REPORT

書籍案内

  • 新刊書籍
  • 書籍ジャンル一覧
  • 書籍シリーズ一覧
  • 新刊ピックアップ
  • ロングセラー
  • 電脳会議

定期刊行物一覧

  • Software Design
  • WEB+DB PRESS
  • Web Site Expert
  • 組込みプレス

最近のコメント