FREE MOTION

FREE MOTION
職人への道

Flash職人への道 初級編

Flash制作の第一歩としてアニメーションバナーを作ってみよう!
FREE MOTIONには素材やテンプレートがたくさん入ってるから、アニメーションバナーの制作もとっても簡単だよ☆

▲ 今回作るFlashはコレ! ▲

1.FREE MOTION を起動する

スクリーンショット
まずは、FREE MOTIONを起動します。続いてテンプレート選択画面が表示されるので、テンプレート一覧から[バナー]を選択し[OK]をクリックしましょう。

2.バナーの種類を選択する

スクリーンショット
プルダウンメニューからバナーが選択できるようになっています。ここからお好みのアニメーションバナーを選択し次に進みましょう。ここでは例として[トップ2]を選択します。

3.バナーの背景・サイズを調整する

スクリーンショット
テンプレートのデフォルト(初期状態)から、自分のイメージに合うように少しアレンジしてみましょう。
■背景の指定
スクリーンショット
ファイル名
スクリーンショット
背景に任意の画像を指定します。[参照]ボタンをクリックすると背景に使用する画像を指定することができます。お気に入りの画像を背景に指定してみましょう。
位置
指定した画像の位置を調整します。プルダウンメニューで、[中央]、[伸ばす]、[並べる]の3つから選択が可能です。指定した画像にあった位置調整を行いましょう。

参考画面ではレンガの画像を背景として選択しています。レンガの画像に注目してください。

[中央]を選択した場合
スクリーンショット
[伸ばす]を選択した場合
スクリーンショット
[並べる]を選択した場合
スクリーンショット

■バナーサイズ
スクリーンショット
幅・高さ
スクリーンショット
バナーの幅、高さを調整します。ホームページのサイズにあったバナーサイズを指定しましょう。

4.テキストオブジェクトの編集

スクリーンショット
バナー内に表示されるテキストオブジェクトの文章を変更することができます。ホームページの内容を説明する文章などに変更してみましょう。テンプレートによって表示されるオブジェクト数が異なります。今回選択している[トップ2]のテンプレートでは5つのオブジェクトが存在します。

5.URLの設定

スクリーンショット
バナーをクリックした際に表示されるWebページのURLと開き方を指定することができます。リンクしたいWebページのURLを入力しましょう。
■リンク先
バナーをクリックした時のリンク先URLです。
■ターゲット
バナーをクリックした時のリンク先ページの開き方を指定することができます。
[_self]
リンクと同じフレームまたはウィンドウに、リンク先ページをロードします。このターゲットはデフォルトであるため、通常指定する必要はありません。
[_parent]
リンクを含む親フレーム セットまたはフレームのウィンドウに、リンク先ページをロードします。該当のリンクを含むフレームがネストされていない場合、リンク先のファイルはブラウザ ウィンドウ全体にロードされます。
[_top]
すべてのフレームを削除して、リンク先ページをブラウザ ウィンドウ全体にロードします。
[_blank]
名前の付いていない新しいブラウザ ウィンドウに、リンク先ページをロードします。

6.プレビューで確認する

スクリーンショット
すべての編集を終えると、コンテンツの作成が開始されます。プレビューを再生して実際にどのように表示されるか確かめてみましょう。
スクリーンショット

お疲れさまでした。

「第一回 アニメーションバナーを作ろう!」はいかがだったかな?
『職人への道』では、これからもFREE MOTIONの面白い使い方を掲載していくので、次回も期待していてくれよ!