ベストアンサー

円を描くように動くアニメーションを作りたい

2007/07/15 12:01

作りたいもののイメージは http://www.jitenjiten.com/yasai/ にあります。最初は、ただモーションガイドレイヤーで円を書いてその上を動かすだけの簡単なアニメーションだと思っていたのですが、円の場合、普通のモーションガイドレイヤーのように、スタート地点と終着点の２点では動かないことに気づきました。仮に終着点の図を少し左にずらしても、一週回ってそこで止まるのではなく、ただちょこっと左に動くだけです。そこで（説明が難しいので時計の針で表現します）、中継点を入れて、スタート（１２時）、中継点（５時）、終着点（１０時）の３点で動かしたのですが、そうすると１２時から右回りに５時まで行って、１０時には行かず、来た道を通って１２時に戻ってしまいました。説明が長くてすいません。要するに円の上をキレイに動くアニメーションの作り方を教えてください。どうぞお願いします。

donkey18
お礼率36% (14/38)

Flash
回答数4
ありがとう数5

みんなの回答 （4）
専門家の回答

質問者が選んだベストアンサー

ベストアンサー

noname#35109

2007/07/15 14:19 回答No.3

>中継点を入れて、スタート（１２時）、中継点（５時）、 > 終着点（１０時）の３点で動かしたのですが、 12時３時６時９時 12時のようにもっと中継点を増やせばできると思いますが...。それだけで終わるのも何ですから，「私がするのならばこうする。」という方法を回答します。＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ Flash は発想次第です。また，ActionScript やモーショントゥイーンに限らず，ムービークリップを活用することです。ムービークリップを活用すれば Flash で並大抵のことができます。ムービークリップを活用できなければ，ActionScript やモーショントゥイーンをいくら頑張っても面白い物を簡単に作れません。私が思うに，「ムービークリップを制する者が Flashを制す。」です。ステージ上に「トマト」の絵を描いたとします。次にその「トマト」をムービークリップに変換します。ムービークリップに変換するときに，少し「基準点」に気をつけて見てください。ムービークリップに変換するとき「シンボルに変換」パネルが出てきますが，とりあえず基準点を「中央」にします。　---------------------- 　　　基準点(R)：□□□ 　　　　　　　　　　 □■□ 　　　　　　　　　　 □□□ 　---------------------- 本当はどこでも良いのですよ。注意して見るだけのことです。そして，そのムービークリップを選択すると，「トマト」の中央に＋印ができて，「ト＋ト」状態に見えます。これで，そのムービークリップの基準点は＋印の場所にあるということが確認できます。その「ト＋ト」状態のムービークリップをダブルクリックして，ムービークリップ内のタイムラインの編集に入ります。「ト＋ト」状態のムービークリップの中には「トマト」の絵があるわけですが，このトマトの絵全体を選択して，上の方に持っていきます。　------------------- 　　　　　「トマト」　　　　　　＋　←基準点　------------------- そして，「トマト」の絵以外の部分をダブルクリックして，ドキュメント（メインムービーのタイムライン）の編集に戻ります。そして，トマトのあるタイムラインのレイヤーの編集に移ります。「トマト」のあるレイヤーを例えば 31フレームにします。　　　　　　　　　　　　　　　　　　　　　　　　　　　　　31 　レイヤー筆・・|●//////////////////////[]| そのフレーム31 もキーフレームに変換します。　　　　　　　　　　　　　　　　　　　　　　　　　　　　　31 　レイヤー筆・・|●////////////////////[]|●| あと，フレーム11 とフレーム21 もキーフレームに変換します。　　　　　　　　　　　　　　　 11　　　　　21　　　　　 31 　レイヤー筆・・|●////[]|●////[]|●////[]|●| フレーム11 のトマトムービークリップを選択して，「修正」→「変形」→「伸縮と回転」を選択し，「伸縮と回転」パネルで　回転(R) を 120 度にして「OK」します。これで，基準点を中心に 120度右回りした位置にトマトが来ます。また，フレーム21 のトマトムービークリップを選択して，「修正」→「変形」→「伸縮と回転」を選択し，「伸縮と回転」パネルで　回転(R) を 240 度にして「OK」します。これで，基準点を中心に 240度右回りした位置にトマトが来ます。あとは，レイヤーのフレーム1 ～ 30 を選択し，モーショントゥイーンさせれば，トマトが基準点を中心にきれいに 360度回転します。このままでは， 0 度のトマトが，最初のフレームと最後のフレームで２回登場するため，ループさせたときにアニメーションがカクッとなります。そこで，上のようにモーショントゥイーンを付けた後にフレーム30 もキーフレームにします。　　　　　　　　　　　　　　　11　　　　21　　　　30 31 　レイヤー筆・・|●>--->●>--->|●>--->●|●| そして，フレーム30 を「フレームの削除」で削除します。　　　　　　　　　　　　　　　11　　　　21　　　　30 　レイヤー筆・・|●>--->●>--->|●>--->●| これでキレイに回るトマトができます。＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝別法です。面倒な場合は動かすのに ActionScript を使います。「トマト」をムービークリップに変換して，ムービークリップ内でトマトを上にずらすところまでは同じです。ここまでは同じ↓。　------------------- 　　　　　「トマト」　　　　　　＋　←基準点　------------------- このあと，ドキュメント（メインムービーのタイムライン）の編集に戻ります。そして，戻った状態で，トマトを選択し，つぎのようなスクリプトをトマト自体に書きます。 ---------------------------- onClipEvent (enterFrame) { this._rotation += 5; } ---------------------------- 上の 5 を変えると回転するスピードの調節ができます。上のスクリプトでは，１フレーム進む時間ごとに 5 度ずつ右回りをさせるというスクリプトです。モーショントゥイーンでもActionScriptでも，やることは同じですね。 ActionScriptの方が，作成が簡単なだけです。また，上の場合，トマトが大きく回転するとともに，トマトの絵自体も回転してしまいますね。トマトをずっと上向きにしたい場合などは，ムービークリップの中の「トマト」の絵をさらにムービークリップに変換します。ムービークリップの入れ子状態です。　_root 　　└ムービークリップ　　　　　　└ムービークリップ - トマトそして，大きくまわる外側のムービークリップの中のムービークリップを，反対方向に回転させれば，トマトの向きは変わりません。そういうことまでいろいろ考えると，ActionScript の方が簡単でしょうね。でも，原理は同じです。

質問者