Sponsored Link

7.トゥイーンで徐々に透明に変化させる方法2・拡大縮小・タイムラインの操作

Sponsored Link
前の記事
トゥイーンで徐々に透明に変化させる方法
の続きとして、見えなくしたものを再び表示させる方法を解説します。

解説図
20110117195217.png

前の記事で作ったファイルがない場合は
以下のファイルを右クリックしてファイルを保存して
使ってもらっても構いません。
test2.csf

また、タイムラインの便利な使い方も、少し掘り下げて解説します。


前回、次第に透明にする為に
50フレーム目でキーフレームを追加しましたが
今回は80フレーム目に新たにキーフレームを追加します。

********************************************************
その前に、タイムラインの目盛りが細かくて
操作が難しい方は、目盛りの幅を大きく変える方法があります。

下の図の、右下の赤い丸の部分にあるボタンをクリックします。
すると、「目盛り幅」という小窓が開くので、そこのスライダーを
左右に動かすと目盛りの幅を変更できます。

ちなみに、右上の「時間表示」にチェックを入れると
目盛りの数字が時間になるので、時間に合わせて
操作しながらFLASHを作ることも可能です。
ws00000330.png

********************************************************
前置きが長くなりましたが本題に入ります。
80フレーム目を右クリックし、キーフレームを追加を選びます。
ws00000334.png

今回は更に一工夫・徐々に拡大するように細工します。
D編集枠の「位置・変形」をクリックし
倍率(W)、倍率(H)共に3を入力します。
ws00000337.png

この80フレーム目に追加されたキーフレームは
どこかのキーフレームのコピーという訳ではありません。
下図のシンボルリスト欄から「レイヤーに追加」としてタイムラインに
追加された時と同じ属性状態です。

ws00000333.png

しかし、例えば50フレーム目のキーフレームを
右クリックしてコピーし、別のフレームに貼り付けて、使うことも可能です。


次に50フレーム目をクリックして
D編集枠のトゥイーン欄にチェックを入れます。
20110119212418.png

今回はこれで一応完成です。
50フレーム目から80フレーム目までピンク色になりました。
キーボードのF5キーを押して、プレビューを見てください。

一旦文字が消えて、その後拡大しながら再び見えるようになります。
20110123201748.png

今回覚えて欲しいのは、トゥイーンをうまく追加し工夫すれば
なめらかに動く作品を作っていけるということです。

名前を「test3.csf」として保存して下さい。
お疲れ様でした。



※記事内容は掲載時点での情報であり変更されている可能性もありますのでご了承下さい。事前に各施設などにお問い合わせください。

6.トゥイーンで徐々に透明に変化させる方法

Sponsored Link
トゥイーンを使って透明にする簡単な効果を解説します。
トゥイーンでは動きを与える以外に
徐々に透明にすることや色の変化など
様々なバリエーションの効果を演出できます。

前の記事
4.レイヤーに追加・文字を移動して動かしてみる(アニメーション・キーフレーム・トゥイーン)
で作ったファイルを開いて下さい。

また以下のファイルを右クリックしてファイルを保存して
使ってもらっても構いません。
test.csf

以下の解説図は、各部の番号と名称です。
20110117195217.png

●●●徐々に透明にして見えなくする●●●
再び1フレーム目から作業するので
30フレームを右クリックして「削除」を選びます。
20110123201121.png

ここで今度は50フレームのところで右クリックし
「キーフレーム追加」を選びます。
この段階でピンクの帯が出ていますが、これは
1フレーム目のトゥイーンが解除されていないためです。
このままで良いです。
20110123201748.png

Dの場所の「カラー」と書かれたタブをクリックし
不透明度のスライダーを左に動かして0にします。
20110123201625.png

これだけで透明に変化するトゥイーンが完成しました。
プレビューを見ます。
キーボードのF5キーを押して確認して下さい。

ちなみに、不透明度スライダーの上に輝度スライダーが
ありますが、輝度とは値が大きくなると
徐々に明るく(白く)なる効果です。
画像などで徐々に白さを増していく際などに使います。

次回はこの透明になったトゥイーンの続きとして
徐々に表示させる動くを追加しますので
名前を「test2.csf」として保存して下さい。

お疲れ様でした。6
※記事内容は掲載時点での情報であり変更されている可能性もありますのでご了承下さい。事前に各施設などにお問い合わせください。

5.Suzukaのキーフレームとトゥイーンを分かりやすく解説

Sponsored Link
前の記事
4.レイヤーに追加・文字を移動して動かしてみる(アニメーション・キーフレーム・トゥイーン)
では、文字が動くまでの一連の流れを解説ましたが
この記事では、キーフレームとトゥイーンを
もう少し詳しく説明います。

文字をレイヤーに追加した段階では
1フレーム目が青くなっていますが
この1フレーム目もいわばキーフレームです。

キーフレームを何処かのフレーム(例えば30フレーム)に
追加したらその前のキーフレーム(例えば1フレーム)が
コピーされた状態で複写されます。

しかし、30フレームのテキストなどは
1フレームとは独立しているので
自由に動かしたり変形が可能です。

何かしら変化をつけた状態で
再び1フレーム目をクリックし
トゥイーンを施せば
1フレームから30フレームまでの
変化をアニメーション化してくれます。

トゥイーンという、アイテム(テキストや画像)が
動いたり変化する事こそがSuzukaをはじめとする
Flashの最重要で基本的な機能です。

例えばトゥイーンを使えば動かせる以外にも
30フレームを透明にすれば徐々に消えていく
効果を演出することも可能です。

百聞は一見にしかず、上の記事を
解説図にしましたので参考にしてください。
名称未設定-1.png
※記事内容は掲載時点での情報であり変更されている可能性もありますのでご了承下さい。事前に各施設などにお問い合わせください。
Sponsored Link
×

この広告は180日以上新しい記事の投稿がないブログに表示されております。