製品情報

パン屑ナビゲーション

使い方入門

印刷ユーティリティ

PowerX KoolMovesを使ってみよう

第2章:ウィザードを使ってかんたんムービー作成
アニメーションバナーを作ろう / 基本編 初級

■ KoolMovesで簡単なバナーをデザインしよう
1. バナーを枠で囲む

れいな
じゃ、シンプルに背景枠を作りましょう。ツールバーの中から  「矩形の描画」をクリックして。


あゆみ
カーソルが十字に変わったよ。


れいな
バナーとなるムービーの中を、ふちを少し残すようにドラッグして長方形を描いてみて。


あゆみ
うわっ、はみ出しちゃった!


れいな
そんなときは、ツールバーから  「サイズのスケール」をクリックして、描いた長方形の端をドラッグすると修正できるわよ。



ページtopへ


2. バナーの枠線の色を変える

あゆみ
ちょっと、こんなお葬式みたいなバナーはいやよ!


れいな
あせらないでよ。今から色を変えるから。描いた四角形をダブルクリックすると、「形状S1」というプロパティウィンドウが表示されるでしょ。これは今描いた長方形(S1という名前が自動的につけられている)に関する情報を設定できるウィンドウなの。まずは「線色」をクリック。


あゆみ
「…」ってボタンが表示された。これをクリックしてみると…、「形状の塗りつぶし」ウィンドウが表示されたわ。今は線の色を決めてるのよね。ここから濃いピンクを選んじゃおう。


れいな
16進数を入力して色を設定することもできるのよ。


あゆみ
難しいこと言うなー!
「OK」をクリックするわ!きゃー!警告みたいなウィンドウが表示されちゃった!


れいな
ふふっ。シンボルについては、今回は説明しないでおくわ。機会があれば説明するから、しばらくはこの画面が表示されたら、「はい」をクリックしておいて。



ページtopへ


3. バナーの枠内の色を変える

あゆみ
枠の中もピンクにしたーい!


れいな
はいはい。プロパティウィンドウの「色/塗りつぶし」をクリックして、同じように設定してね。せっかくだからグラデーションをかけましょう。「形状の塗りつぶし」で「グラデーション色」をクリックして、すぐ下にある黒五角形をクリックして。


あゆみ
薄めのピンクを選んでみるね。
あっ、クリックしたらグラデーションの色味が変わったわ。でも、中央から外側に向かって、ぱーって広がるみたいなグラデーションがいいな。


れいな
「放射」をクリックするとグラデーションのかかり方が変わるわよ。「プレビュー」をクリックすると、どのように色が設定されるかをムービーフレームで確認できるわ。


あゆみ
ほほー。れいなもたまにはためになること言うじゃーん。


れいな
あんた、今、誰に教えてもらってんの!
ちゃんと「OK」をクリックするのを忘れないでね。



ページtopへ


4. バナーの文字を入力する

れいな
次はあゆみのブログのタイトルを作りましょう。左上のコンボボックスから「新規テキストエフェクト」を選択して。


あゆみ
テキストエフェクトウィザードが表示されたよ。「テキストをここに入力」に「あゆみのブログ」って入力すればいいのよね。


れいな
そうそう。フォントとフォントサイズを設定したら、左の一覧から何か選択してみて。そうね。「ブラインド」なんてよいかも。このとき「ループ」を「はい」に設定しておくと、繰り返し再生されるわ。


あゆみ
えー!文字が動いてるー!


ぼかし

カーソル入力


ぼかしとフェード

ドロップイン

シェイク

側転


星形

クロス

パンチウェーブ

スパークル

ページtopへ


5. バナーの文字を修正する

あゆみ
「OK」をクリック。
あれ?はみ出しちゃった。2段にすればよかったよー。それにテキストの色も変えたいなあ。テキストの色は、さっきと同じでOK?だとしたら、テキストをダブルクリックして、プロパティウィンドウで「色」を変更すればいいのね。


れいな
よくできました!
テキストを右クリックして「プロパティを表示」を選択してもプロパティウィンドウを表示できるわよ。


あゆみ

KoolMovesもあゆみ様にかかっちゃ、ちょろいもんよ!で、テキストの編集ってどうするの?


れいな
「ちょろいもん」じゃなかったの?テキストを選択して右クリックで「テキストの編集」を選ぶと、テキストを編集ができるわよ。プロパティダイアログで「タイプ」をクリックして編集してもOKよ。


あゆみ
おおー!プロパティダイアログってうざいって思ったけど、意外と便利かも。もしかして、さっき選択したエフェクトもここで変えられる?


れいな
すごいじゃない、あゆみ。そのとおりよ。「モーションスクリプト」をクリックすると、モーションスクリプトエフェクトウィンドウが表示されるからそこで設定できるわ。ムービーフレーム内でテキストの位置を調整してね。


ページtopへ


6. できあがりを確認する。

れいな
今作成しているバナーがWeb上でどのように表示されるかは、いつでも確認できるの。「再生」メニューから「ウェブブラウザで再生」を選択しましょう。


あゆみ
やったー!できあがり。アニメーションって自分で作れちゃうのねー。


れいな
でも、ブログやホームページで表示させるには、このままじゃだめなのよ。「閉じる」をクリックして、プレビュー画面は閉じておいてね。

前へ 前へ [1] [2] [3] 次へ 次へ

Contents

[第1章]
KoolMovesってどなんもの?(2007.07.06)
[第2章]
ウィザードを使ってかんたんムービー作成
アニメーションバナーを作ろう / 基本編 (2007.07.20) [1] [2] [3]
アニメーションバナーを作ろう / 応用編 (2007.08.03) [1] [2] [3]
スライドショーを作ろう (2007.08.24) [1] [2] [3]
[第3章]
FLASHムービーでブログ、ホームページを彩ろう(2007.09.07) [1] [2]
[第4章]
オープニングムービーを作ろう
ムービーのサイズと色を変えよう(2007.09.21) [1] [2]
てくてく歩くアニメーションを作ろう(2007.10.05) [1] [2] [3]
ムービークリップを使ってスマートなムービーを作ろう(2007.10.19) [1] [2]
くるくる回るアニメーションを作ろう(2007.11.02) [1] [2]
エフェクトでワンランクアップしたムービーを作ろう(2007.11.16) [1] [2]
立体の文字が動くアニメーションを作ろう(2007.11.30) [1] [2]
ボタンを付けてアクション!(2007.12.14) [1] [2] [3]

Contents END