Flashの演出方法について

質問

初めまして。
Flash初心者の者です。
まずここのフラッシュを見てもらいたいのですが
http://www.geocities.jp/riarumegumi/myweb11_010.htm
ここのFlashで、一番初めの「megumi部屋」と言う文字が消えるとき、上下に伸びるようなカッコイイ消え方をしているのです。
このやり方を知りたいのですが、どなたかご存知ではないでしょうか？

いろいろ調べたのですが、自力では分からず困っています。
よろしくお願いします。

回答No.2

noname#35109 · ベストアンサー

調べられてなかったのですか。
基本的すぎてないのかもしれません。
動き自体はFlashのバージョン1（1997年）からできます。だんだん消えるというアルファ(透明)はFlash3（1998年頃）からできます。
紹介されているURLのFlashは，全体的にそういうFlash本来の素朴なアニメーションです。
素朴な物はダメだと言っているわけではありません。
基本中の基本ですから，しっかり押さえておきましょう。

文字が仮に Ａ Ｂ Ｃ Ｄ の４文字であったとします。
この Ａ Ｂ Ｃ Ｄ は別々の動きをしますから，別々のオブジェクトにしなければなりません。
これは，今も昔も変わりません。
４文字を同時に説明したり同時に作業することは不可能ですから，
まず１文字だけを「縦に拡大＋だんだん消える」方法を書きます。

ドキュメントを新規作成して，
１つ目の文字 Ａ を「静止テキスト」で，ステージ上に書きます。
この時点でのタイムラインを図示すると以下のようになっていると思います。

　　　　　　　　　　　1
レイヤー１ 　筆・・|●|

この書いた静止テキストの Ａ を選択し
「右クリック」→「シンボルに変換」→グラフィックにチェックを入れ「ＯＫ」
で「グラフィックシンボル」にします。

タイムラインの２フレーム目を選択，右にドラッグして50フレームくらいまで選択，
「右クリック」→「フレームの挿入」でフレームを50フレームくらいにしてください。
この時点でのタイムラインを図示すると以下のようになっていると思います。

　　　　　　　　　　　1　　　　　　　　　　　　　　　　　　　　　　　　　50
レイヤー１ 　筆・・|●　　　　　　　　　　　　　　　　　　　　　　　　　[]|

次に「拡大＋消える」を始めたいフレームをキーフレームにします。
この説明では仮に20フレームとしておきます。

　　　　　　　　　　　1　　　　　　　　　20　　　　　　　　　　　　　　 50
レイヤー１ 　筆・・|●　　　　　　　　|●　　　　　　　　　　　　　　　[]|

次に「拡大＋消える」を終えたいフレームをキーフレームにします。
この説明では仮に30フレームとしておきます。

　　　　　　　　　　　1　　　　　　　　　20　　　　　30　　　　　　　　50
レイヤー１ 　筆・・|●　　　　　　　　|●　　　　　|●　　　　　　　　[]|

次に30フレームのこのグラフィックシンボルになった Ａ を選択，
「右クリック」→「自由変形」または「伸縮」でハンドルが出るので
縦向きに引き延ばして２～３倍の大きさにしてください。
同時に，30フレームの Ａ を選択した状態で，
下の「プロパティパネル」の右の「カラー」を「アルファ」にして右横のパーセンテージを0％にしてください。

タイムラインで「拡大＋消える」を始めたいフレーム，
つまり20フレームを選択→「右クリック」→「モーショントゥイーンを作成」を選択してください。
この時点でのタイムラインを図示すると以下のようになっていると思います。

　　　　　　　　　　　1　　　　　　　　　20　　　　　30　　　　　　　50
レイヤー１ 　筆・・|●　　　　　　　　|●>──→|●　　　　　　　[]|

この時点でSWFファイルをパブリッシュすれば，動作確認ができます。
もっとゆっくり消したい場合は，30フレームのキーフレームを35とか40あたりに移動させれば良いですし，
拡大が少ないと思えば，30フレーム目の透明で見えない A を選択してオブジェクトの枠をもっと引き延ばせば良いです。
いくらでも修正可能です。

Ｂ Ｃ Ｄ についても同様にすれば良いわけです。
でもモーショントゥイーンでオブジェクトを動かす場合，１オブジェクト１レイヤーと決まっていますので，
全ての文字は別々のレイヤーに作成してください。
全ての文字を作成した時点でのタイムラインを図示すると以下のようになると思います。

レイヤー４ 　・・・|●　　　　　　　　[]|●>──→|●　←Ｄのレイヤー
レイヤー３ 　・・・|●　　　　　　[]|●>──→|●　←Ｃのレイヤー
レイヤー２ 　・・・|●　　　　[]|●>──→|●　←Ｂのレイヤー
レイヤー１ 　・・・|●　　[]|●>──→|●　←Ａのレイヤー

スクリプトを何も書かないとループします。
もしループ再生するのが困る場合は，
新しいレイヤーをさらに作って，最終フレームをキーフレームにして，
タイムラインの最終フレームを選択して，下の「アクションパネル」の白いスクリプトを各部分に

-------------
stop();
-------------

と書いてください。これでループしません。

以上です。

=====================================================

最近は，ActionScriptで動かしたいと思われる方も多いのでActionScriptも一応書いておきます。
しかしこの場合は，ActionScriptは使わず，上記モーショントゥイーンでするのが一般的です。

～～～ActionScriptによる方法～～～～～～～～～

新規ドキュメントを作成します。
まずフレーム１には以下のように，設定値を設定するスクリプトを書いてください。

---フレーム1のスクリプト-------------

//伸びるスピード(大きさ)の設定
spd_ysc = 1.2;

//アルファが減少するスピードの設定
spd_alp = 8;
-------------------------------

静止テキストでステージ上　A　B　C　D　という文字をバラバラに書いてください。
ActionScriptの場合，レイヤーは１つでかまいません。
A と書いた静止テキストを選択し，
グラフィックオブジェクトではなく，「ムービークリップ」オブジェクトにします。

---ムービークリップAのスクリプト--------

//このMCが読み込まれたとき
onClipEvent (load) {

//カウンタ i を初期化
i = 0;

//１フレーム進む時間に１回，以下を計算。
this.onEnterFrame = function() {

//カウンタ i を１ずつプラス
i++;

//もし i が10以上になったら以下を実行※↓
if (i>=10) {

//このMCを縦にのばす
this._yscale *= _root.spd_ysc;

//このMCのアルファをマイナス
this._alpha -=_root.spd_alp;
}

//もしアルファが0になったら以上の計算終了
if (this._alpha<=0) {
this.onEnterFrame = null;
}
};
}
-------------------------------

※if (i>=10) の部分は B C D によってそれぞれ，
　12　14　16　などに変えてください。

ActionScriptによる方法は以上です。
～～～～～～～～～～～～～～～～～～～～～～～

掲示板などでは，ActionScriptで書く方がずっと説明がしやすいです。
ですから，動きはActionScriptでするべきものと勘違いされている質問者の方も多いですが，
実際，Flashはすごく主観的に，プログラムなしで，したいように自由にアニメーションが表現出来るソフトです。
でもたまには，ActionScriptでしかできない動きや，条件分岐などもあります。
その必要性があるときだけActionScriptを使って，
紹介されたHPのように普通にアニメーションが流れて行くだけの作品はモーショントゥイーンなど，昔からある基本的な方法を取る方が柔軟で生き生きした物になると思います。
どんなに素朴なものでも，
「play();」　「stop();」　「gotoAndPlay();」　「gotoAndStop();」　「getURL("");」と
ターゲットパスくらいは理解して使いこなせる必要がありますが。

最初の最初は，ネットでなくて本が良いですよ。
上のでも文字ばかりで理解しにくいでしょう。
本で順を追って基本を身につけて，それからネットを頼ると良いと思います。
本などで基本事項や専門用語，スクリプトを覚えると，ネットでもヒットしやすくなります。

ネットでは下記参考URLの　「3 モーショントゥイーンの効果」
あたりが今回質問されている内容に近いと思います。

参考URL：

http://1art.jp/le.htm

お礼

おぉ・・・わざわざこんな手間隙かかるものをありがとうございます！
ActionScriptの方はちょっと分からなかったのですが（勉強します）前者の方で無事できました！
本当にありがとうございました。

回答No.1

ma2hide

ActionScriptを使ってないなら普通にシェイプトゥイーンだと思います。
例）
１、文字を分解
２、フレームを適当に挿入
３、最後のフレームをキーフレームに変換
４、フレームの真ん中くらいで（どこでもいいけど）シェイプトゥイーンにする
５、キーフレームのとこで拡大＆アルファ0％
手抜きの回答ですけど、こんな感じ。

お礼

ありがとうございます。
おかげさまで思い通りの動きが作れました。