髭仙人の漫ろ歩き
Flash & Painter
............................ unworldly man go for a ramble in the internet world ...
メディアの作成 (Flashチュートリアル)  
 シンボルを作成


 Flash には、メディアを読み込む機能だけでなく、高品質のグラフィックとテキストを作成するための各種ツールが用意されています。 完成版のチュートリアルでは、選択した凧に関する背景情報を示すテキストが表示されます。 箱型凧の発明者についての説明を表示するためのシンボルを作成してみましょう。

メモ : チュートリアルの実行中に、行った変更を取り消せると便利な場合があります。 [環境設定] で設定した取り消しレベル数により回数は異なりますが、Flash は最近の変更のいくつかを取り消すことができます。 取り消すには、[編集]-[取り消し] を選択するか、Ctrl+Z (Windows) または Command+Z (Macintosh) を押します。 反対に、[編集]-[やり直し] を選択するか、Ctrl+Y (Windows) または Command+Y (Macintosh) を押して、取り消した内容をやり直すことも可能です。

1 [挿入]-[新規シンボル] を選択します。
2 [シンボルプロパティ] ダイアログボックスで、シンボルに「box TEXT」という名前を付けます。
3 [タイプ] については、[グラフィック] が選択されていることを確認し、[OK] をクリックします。
 シンボル編集モードに自動的に切り替わります。 編集中のシンボルの名前はウィンドウの左上に表示されます。 ウィンドウの背景色は、[ムービープロパティ] で選択したものと同じ階調のままです。
4 ツールボックスで、テキストツールを選択します。
5 文字パネルが開いていない場合は、[ウィンドウ]-[パネル]-[文字] を選択します。
6 文字パネルの [フォント] ポップアップメニューで、[_ゴシック] を選択します。
 この設定により、Flash ムービーは再生環境でインストールされているゴシック系フォント (MS UI Gothic や Osaka など) を使ってテキストを表示します。
7 フォントサイズのポップアップで、スライダを使用して [12] を選択します。
8 [ボールド] ボタンを選択します。
9 カラーボックスをクリックしてポップアップウィンドウを表示し、16 進値 # FFFFFF の白を選択します。
10 ステージの左側の任意の場所でテキストツールをクリックし、次のテキストを入力します。「箱型凧は、1983 年にオーストラリアの Lawrence Hargrave により発明されました。彼は、この凧を使用して天候測定器を空中に運びました。」
 テキストカラーに白を選択しても、編集中のテキストはグレーで表示されるため、白いテキストフィールドでも文字を識別できます。


11 テキストツールを選択したまま、テキストブロックの右上角にある小さな円のサイズ変更ハンドルをクリックし、そのハンドルを左側にドラッグすると、テキストは "オーストラリアの" という言葉の後ろあたりで改行されます。

 テキストは、数行に折り返しします。 サイズ変更ハンドルを移動すると、そのハンドルは円から正方形に変化して、タイプブロックが定義された幅になることを示します。

……………………………………………………………………………………………………………………

 テキストブロック基準点の変更


 各テキストブロックは、Flash 内のほかのエレメントと同様に、ステージ上にエレメントを配置する際に使用できる基準点があります。 各テキストブロックの基準点の位置を合わせることにより複数のテキストブロックをステージ上でぴったり整列させることができます。

1 ツールボックスで、矢印ツールを選択します。
ステージで、テキストブロックが選択されます。
2 [情報] パネルを開くには、[ウィンドウ]-[パネル] を選択するか、ランチャーバーの情報ボタンをクリックします。



3 [情報] パネルには、小さなグリッドと、基準点の位置を示す黒い正方形があります。 黒い正方形がグリッドの左上角にない場合は、左上の正方形をクリックして基準点をその位置まで移動します。

4 X 座標と Y 座標の両方に対して「0」を入力し、Enter キー (Windows) または Return キー (Macintosh) を押してから [情報] パネルを閉じます。


5 ウィンドウの左上角にある [シーン 1] をクリックし、ムービー編集モードに戻ります。

 Flash では、[挿入]-[シーン] コマンドを使用してさまざまなシーンを作成できます。 このチュートリアルでは、1 つのシーンしか使用しません。

……………………………………………………………………………………………………………………

 ムービーのプレビュー


 オーサリング中にはいつでも、ムービーが SWF ファイルとしてどのような表示状態で動作するかをプレビューすることができます。

1 ムービーを保存し、[制御]-[ムービープレビュー] を選択します。
ムービーの SWF コピーが書き出されます。
2 SWF ファイルで、"箱型凧" をクリックすると、想定していた箱型凧に関するテキストが表示されるのではなく、六角凧に関するテキストが表示されます。 そこで、今表示されている六角凧に関するテキストを、箱型凧に関する正しいテキストに置き換える必要があります。
3 SWF ファイルを閉じ、Flash オーサリング環境に戻ります。

 

……………………………………………………………………………………………………………………

 インスタンスの置換


 オーサリング中に、あるインスタンスを別のインスタンスと置き換えることはよくあります。特に、アートワークまたはテキストの変更を決定する場合です。 プロセスを単純化するには、元のインスタンスの属性を維持しながら、あるインスタンスを別のインスタンスと置き換えます。

1 タイムラインのラベルレイヤーで、"box red" (フレーム 21) の最初のフレームをクリックして、箱型凧に関する情報を表示するムービーのセクションに再生ヘッドを移動します。
 選択したフレーム番号は、タイムラインの下端にあるステータスディスプレイに表示されます。
2 矢印ツールを選択して、"六角凧は、日本の伝統的なけんか凧です..." というステージ上のテキストインスタンスをクリックします。
 これは、箱型凧に関して作成したテキストと置き換えるテキストです。
3 インスタンスパネルが表示されていない場合は、[ウィンドウ]-[パネル]-[インスタンス ] を選択します。
インスタンスパネルが表示されます。
4 インスタンスパネルで、[シンボルの入れ替え] ボタンをクリックします。


5 [シンボルの入れ替え] ダイアログボックスに表示されたシンボルのリストで "Box TEXT" をダブルクリックします。
 目的のシンボルを見つけるためにリストをスクロールする必要がある場合もあります。

 


ステージで、新しいシンボルが直前のシンボルと置き換えられます。 このとき、直前のシンボルのインスタンス属性が新しいシンボルに適用されます。

 

 

 

 
メディアの読み込み (Flashチュートリアル)  
 メディアの読み込み


 Flash で高品質のテキストとグラフィックを作成する以外に、各種メディアをムービーに読み込むことができます。 このサイトでは、顧客が "揚げてみよう!" ボタンをクリックしたときにサウンドが鳴るように設定してみましょう。 サウンドをボタンに関連付けるには、まず MP3 サウンドファイルを読み込みます。 この圧縮されたサウンド形式を使用すれば、ムービーのサイズが大幅に増えることを防げます。

1 [ファイル]-[読み込み] を選択します。
2 [読み込み] ダイアログボックスで Windows を使用している場合は、Flash アプリケーションフォルダ内の "チュートリアル\My_kite" までブラウズし、"wizz.mp3" をダブルクリックします。
 Macintosh を使用している場合は、Flash アプリケーションフォルダ内の "チュートリアル\My_kite" までブラウズします。 "wizz.mp3f" をダブルクリックし、次に [読み込み] をクリックします。
 [ライブラリ] ウィンドウにサウンドファイルが表示されます。 サウンドを聴くには、そのサウンドを選択し、[ライブラリ] ウィンドウの [再生] ボタンをクリックします。

 

 
ライブラリの整理  
 すべてのフォルダを閉じる


 一般に、ムービーのライブラリ内にフォルダを作成し、ファイルを整理すると便利です。 このチュートリアルでは多数のメディアファイルが必要なため、ファイルを整理することが重要です。 このセクションでは、"Text" フォルダにテキストファイルを移動し、サウンドファイル用のフォルダを作成し、次にすべてのサウンドファイルをそのフォルダに移動します。

1 ライブラリの [オプション] メニューで [すべてのフォルダを閉じる] を選択し、フォルダの外部のフォルダとアイテムだけを表示します。

2 "box TEXT" シンボルを選択し、"Text" フォルダにドラッグします。
3 "Text" フォルダをダブルクリックして閉じます。

 

 

 

……………………………………………………………………………………………………………………

 サウンドファイル用の新規フォルダの作成


1 ライブラリの [オプション] メニューで [新規フォルダ] を選択し、新しいフォルダに「Sound」という名前を付けます。
2 必要に応じて、[ライブラリ] ウィンドウのサイズを変更して "wizz.aif" と "Sound" フォルダの両方を表示します。
3 4 つのサウンドファイルをすべて選択するには、"chirp.mp3"、"squeak.mp3"、"switch2.mp3"、および "wizz.mp3" を Ctrl キーを押しながらクリック (Windows) するか、Command を押しながらクリック (Macintosh) します。 選択したファイルを "Sound" フォルダにドラッグします。

 
ボタンへのサウンドの追加 (Flashチュートリアル)  
 ボタンへのサウンドの追加


 ボタンシンボルを作成すると、Flash はマウスポインタに対応するさまざまなボタンの状態のキーフレームを作成します。 たとえば [オーバー] キーフレームは、ポインタがボタンの上にあるときにボタンがどのように表示されるかを示します。 このほかにも、[アップ]、[ダウン]、および [ヒット] などのボタンキーフレームがあります。 ボタンシンボルのキーフレームの詳細については、ボタンに関するレッスン ([ヘルプ]-[レッスン]-[ボタン] を選択します。) を参照してください。

 次に、ボタンの [ダウン] フレームにサウンドを追加します。つまり、ユーザーがボタンをクリックしたときにサウンドが再生されます。 この作業はシンボルのインスタンスに対してだけでなく、ライブラリ内のボタンシンボルに対してサウンドを追加するので、そのボタンシンボルのすべてのインスタンスがサウンド再生機能を持つことになります。

1 [ライブラリ] ウィンドウで、"Bottons" フォルダをダブルクリックして展開します。
2 "fly it BUTTON" シンボルを選択し、次にライブラリの [オプション] メニューから [編集] を選択します。 [ライブラリ] ウィンドウでシンボルのアイコンをダブルクリックして編集することもできます。
 シンボル編集モードに自動的に切り替わります。
3 [挿入]-[レイヤー] を選択し、新しいレイヤーに「Sound」という名前を付けます。
 レイヤー名をダブルクリックすると名前を変更できます。
4 空白のキーフレームを挿入するには、"Sound" レイヤーの [ダウン] フレーム (フレーム 3) を選択し、[挿入]-[キーフレーム] を選択します。
5 サウンドプロパティを定義するには、"Sound" レイヤーのフレーム 3 をダブルクリックします。
 [サウンド] パネル以外にも、別のパネルも表示されます。
6 [サウンド] パネルで、[サウンド] ポップアップメニューから [wizz.mp3] を選択します。 次に、パネルを閉じます。
7 [編集]-[ムービーを編集] を選択するか、ウィンドウの左上角にある [シーン1] をクリックし、シンボル編集モードからムービー編集モードに戻ります。

メモ : 作業内容は頻繁に保存するようにしてください。 また、[制御]-[ムービープレビュー] を選択して、SWF 内でサウンドがどのように再生されるかを確認することができます。

 

 

 
ステージとタイムラインの使用 (Flashチュートリアル)  


 メディアの作成、読み込み、変更が終了したので、ステージとタイムラインを使用してムービーを組み立てていきます。 ステージ上ではメディアを直接作成したり、個々のフレームに読み込んだメディアを配置することができます。ただし、ステージ上にメディアを直接作成した場合は、メディアをシンボルに変換しないとライブラリ内に表示されません。 タイムラインは、再生ヘッドがフレーム内を移動するときに、ムービー内でいつメディアが表示されるか決定します。

……………………………………………………………………………………………………………………

 ボタンの幅と高さの変更


 完成版ではステージ上に 3 つある凧のボタンのうちの 1 つが足りません。 ボタンのインスタンスを追加して、そのサイズを変更し、ステージ上に配置します。

 ムービーに追加するボタンシンボルはステージ上に既にあるボタンインスタンスよりも大きいので、[情報] パネルを使って新しいインスタンスのサイズを変更します。

1 [情報] パネルが開いていない場合は、[ウィンドウ]-[パネル]-[情報] を選択するか、ランチャーバーの情報ボタンをクリックします。


2 タイムラインで、"Pick a Kite Button" レイヤーのフレーム 1 をクリックします。
3 "rokkaku Kite Button" ボタンのインスタンスを [ライブラリ] ウィンドウからステージにドラッグし、ほかの 2 つの凧ボタンの間に配置します。 終了すると、ボタンは次のように表示されるはずです。

4 [情報] パネルで、幅 (W) を 54.2、高さ (H) を 50.0 に変更し、Enter キー (Windows) を押すか、または Return キー (Macintosh) を押します。

 

……………………………………………………………………………………………………………………

 ステージ上のオブジェクトの整列


 [整列] パネルを使用して、オブジェクトをほかのオブジェクトに対して整列することができます。 この機能を使用して 3 つの凧ボタンを整列してみましょう。

1 まずステージ上で、凧ボタンを 1 つ選択し、次に Shift キーをクリックしてほかの 2 つの凧ボタンを選択します。
 再生ヘッドは、まだタイムラインのフレーム 1 にあるはずです。
2 [整列] パネルが表示されていない場合は、[ウィンドウ]-[パネル]-[整列] を選択します。
3 [整列] パネルで、一番上の行の右から 3 番目の上揃えボタンをクリックして、基準点を基準にボタンを整列します。
4 中央の行の右から 3 番目の左分布ボタンをクリックして、ボタンを等間隔に配置します。
"rokkaku kite BUTTON" をどこに配置したかによって、3 つの凧ボタンの位置をさらに調整しなければならない場合があります。 ボタンを目的の場所に配置するように、[整列] パネルでほかの整列ボタンを選択することもできます。

 

……………………………………………………………………………………………………………………

 ボタンインスタンス用の簡単なナビゲーションアクションの作成


 Flash では、ムービーにアクションを追加してインタラクティブ機能を追加できます。 [アクション] パネルを使用すれば、Flash スクリプト言語の ActionScript を簡単に追加できます。 [アクション] パネルでは、アクションの表示、書き込み、編集を行ったり、シンボルまたはインスタンスにアクションを追加できます。

 次に、[アクション] パネルを使用して、ユーザーが "六角凧" ボタンをクリックしたときに六角凧が表示されるようにする簡単なナビゲーションアクションを作成します。

1 ステージで、"六角凧" ボタンを選択します。Shift キーを押し、ほかの 2 つの凧ボタンをクリックして選択解除します。
 3 つの凧ボタンの中央のボタンが選択されました。 [インスタンス] パネルを使用すると、インスタンスを名前で簡単に識別できます。
 再生ヘッドは、まだタイムラインのフレーム 1 内にあるはずです。
2 [ウィンドウ]-[アクション] を選択するか、ランチャーバーでアクションボタンをクリックします。

 [オブジェクトアクション] パネルが表示されます。

メモ : [アクション] パネルでオブジェクトに割り当てられたアクションを処理する場合、パネルには "オブジェクトアクション" というタイトルが付きます。 フレームに割り当てられたアクションを処理する場合は、"フレームアクション" と表示されます。

3 パネルの右上角の三角形をクリックして、ポップアップメニューを表示します。 エキスパートモードでなくノーマルモードが選択されていることを確認してください。
 エキスパートモードには、ActionScript の使用経験のあるユーザーに便利な機能が提供されています。 ノーマルモードでは、パラメータ領域とポップアップメニューやボタン類を使ってアクションを作成します。

 

 

 


必要に応じて、[オブジェクトアクション] パネルの右下の三角形をクリックしてパラメータを表示する領域を開き、ツールボックスリストとアクションリストの両方が表示されるまでウィンドウのサイズを変更します。

4 ツールボックスリストの [アクション] カテゴリを選択して、ツールボックスリストを下へスクロールして [goto] をダブルクリックします。
5 [タイプ] ポップアップメニューで、[フレームラベル] を選択します。
6 [フレーム] ポップアップメニューで、"rokkaku" を選択します。
 ユーザーが "六角凧"ボタンをクリックしたときに、再生ヘッドが rokkaku ラベル内の最初のフレームに移動するように指定します。


7 [オブジェクトアクション] パネルの下端の [Go to and Play] を選択解除し、パネルを閉じます。

 

 

 

……………………………………………………………………………………………………………………

 オブジェクトのロック


 ボタンの配置と変更を完了したので、ボタンをロックして、誰かが誤って整列されたボタンを移動したり、ボタンにその他の変更を行わないようにします。

1 タイムラインの "Pick a Kite Button" レイヤーで、錠前のアイコンが表示された列の黒いドットをクリックします。

 錠前のアイコンが表示されました。 レイヤーのロックを解除するには、錠前のアイコンをもう一度クリックします。

 

 

 


Design by unworldly man Teizo AMMA
Email amma@beach.ocn.ne.jp
URL http://www.t-amma.com/