« 手軽にラフイメージを作る無料ソフト | トップページ | サイトの画像を簡単に保存させたくない場合 »

2008.09.12

Tweenerで動きの制御

モーショントゥイーンはActionScriptで制御せよ

Flashと言えば動き。
…で、昔はタイムライン上でモーショントゥイーン機能を使って拡大縮小やら移動やら、アルファ値などを変えていました。Flash8からはフィルタ機能も加わり、ブラーでぼかすのも定番になりました。
しかし、モーショントゥイーンをActionScriptで制御するような流れになり、プログラムの知識のない人達は、かなり試行錯誤してFlashを作らなければならない時代に突入しています。
そんな中、1つの救いになろうとしているのが、このブログでも幾度となく紹介している「Tweener」ライブラリです。

(前置きが長くなりましたが…)ちょっとしたFlashの仕事があり、本格的にTweenerを使って、動きの制御を試みてみました。Tweenerの良いトコロは、モーショントゥイーンに限らず、様々なプロパティをトゥイーンでき、何より記述の仕方が非常にシンプルになるというトコロ!
今までだったら、プログラムの知識がなくて力業でやっていた作業が、たった数行でできてしまう。やはりコレは、使わない訳にはいかないです。

サンプルはこちら。
(スタートするには画面をクリックして下さい)

↑このFlashデータをご希望の方は、お手数ですが、メールアドレスをご記入の上、この記事にコメントを付けてください。確認しだいお送りいたします。
(このサンプルとは、若干仕様が異なります)

Tweenerの記述の仕方は、Web Designing 2008年9月号に詳しく載っていますし、このブログでも下記の記事でサンプルを紹介しています。
ActionScriptライブラリ「Tweener」
auサイトのようなアコーディオンメニュー

また、exYzという文字の出現の仕方は、
「スクリプトで制御するタイポグラフィックス」という記事でサンプルを紹介していますので、参考にしてみてください。

もう1つ、各演出のタイミングをずらすタイマーが必要になるのですが、
setInterval();
を使うと、案外簡単だとも思います。(…ご参考まで)

|

« 手軽にラフイメージを作る無料ソフト | トップページ | サイトの画像を簡単に保存させたくない場合 »

コメント

いつも楽しく読ませていただいています(*^ω^*)ノ彡
使ってみたい技術を取り上げてくださるのでためになります。どうしても本でよむと実際の動きというものがわからないのでこうやって見られる教材だと助かります。
これからも頑張ってください!
※甘えちゃってもうしわけありませんがFlashデータいただけますでしょうか。

投稿: hiro | 2008.09.13 16:28

hiroさん、コメントありがとうございます。

では、Flashデータお送りいたしますが、若干仕様が異なります。
ブログでは、他に読み込む要素がたくさんあるので、初回が上手く再生されず、「スタート」ボタンを付けましたが、お送りするサンプルでは自動的に再生され、ループするようになっています。

※使用するActionScriptの関係上、Flash 8以上でないと開けませんので、ご注意ください。

投稿: exyz | 2008.09.13 18:23

はじめまして、こんにちは。
異なる記事へのコメントで大変失礼致します。
auのアコーディオンフラッシュ検索でこちらへ辿り着きました。
大変参考になる!と先ほどABCでウェブデザイニングの該当号も購入し、
早速作業を始めたのですが…如何せん、初心者の悲しさかサッパリの状態です。

是非ともサンプルファイルをダウンロードしたく思うのですが、
こちらの記事ではメール配布に切り替えられているとのこと、
現在では行なっていらっしゃらないのでしょうか。
もしよろしければ、auアコーディオンについてサンプルをご提供頂ければ
と思い、書き込ませて頂きました。よろしくお願い致します。

投稿: otsuka | 2008.09.26 18:42

otsukaさん、コメントありがとうございます。

サンプルをアップロードしているADriveがずっとメンテナンス中になっており、ご迷惑をおかけしております。

「Tweenerで動きの制御」も含め、tweener関連のサンプルをまとめてお送りいたしますので、ご確認ください。

投稿: exyz | 2008.09.26 23:56

はじめまして!tweener+AS3初心者です。

素敵なサンプルですね。

今まで力わざでやっていたアニメーションがたった数行でできてしまうなんてスゴイです!

これからも参考にさせて頂きます!

※お手数ですがデータお送り頂けると幸いです。

投稿: maki | 2009.02.05 19:45

makiさん、コメントありがとうございます。

Flash Player 8、AS2.0の環境で作っていますので、AS3.0でパブリッシュしようとすると、エラーが出ると思います。
その点、お気をつけ下さい。

では、ファイルをお送りしますが、ご不明な点など、なるべくご自分でお調べいただきたいと思います。
よろしくお願い致します。

投稿: exyz | 2009.02.05 21:54

こんにちは。
素敵なASファイルですね。
Tweenerの存在すら最近知ったばかりでこれから、もっとアクションスクリプトを勉強していきたいと考えています。
是非、サンプルのFLASHデータをいただければ幸いです。今後も色々と参考にさせていただきます。

投稿: yuta | 2009.02.16 02:00

yutaさん、コメントありがとうございます。

Flash Player 8、AS2.0の環境で作っていますので、その点、お気をつけ下さい。

ファイルをお送りしますが、ご不明な点など、なるべくご自分でお調べいただきたいと思います。
Tweenerを知る取っ掛かりくらいの位置づけでお願いします。

投稿: exyz | 2009.02.16 08:09

Tweener勉強中です。
ループのさせ方が判らず苦戦してます。是非、サンプルのFLASHデータをいただければ幸いです。宜しくお願い致します。

投稿: hiro | 2009.02.18 23:44

hiroさん、コメントありがとうございます。

Tweenerは、文字通り、タイムライン上に今まで手作業で行っていたトゥイーンアニメーションをスクリプトを使って制御できるというだけのモノです。
それ以上でもそれ以下でもありません。

ですので、どうやったらループできるか?というコトを考えれば、方法はいくらでもあると思います。

このサンプルの場合、タイマーを設置して、時間が来たら、メインフレームに対して処理をかけるコトで制御しています。

一応、データをお送り致しますが、ループの仕方だけでなく、演出方法などいろいろと考えてみて下さい。

投稿: exyz | 2009.02.19 12:36

とてもためになるエントリーをありがとうございます!
最近、Tweenerを必死に勉強中でして、どう制御すればいいのかわからなかったところです。
なので、よろしければデータのほうをお願いしたいのですが??よろしくお願いします!><

投稿: rurk | 2009.07.22 19:14

もしかしたら送れてないかもしれないのでもう一度?すいません

出来れば、データのほう送って頂けると嬉しいです><
何度もすいませんorz

投稿: rurk | 2009.07.23 00:06

rurkさん、コメントありがとうございます。

Flash Player 8、AS2.0の環境で作っていますので、その点、お気をつけ下さい。

ファイルをお送りしますが、ご不明な点など、なるべくご自分でお調べいただきたいと思います。
Tweenerを知る取っ掛かりくらいの位置づけでお願いします。


また、コメントはスパム防止のため、こちらが承認しないとアップされないようにしています。
その点、ご理解下さい。

投稿: exyz | 2009.07.23 07:29

はじめまして、こんな感じの動きが欲しかったのです。
もしよければサンプルいただけませんか?

投稿: eri | 2010.05.20 16:26

eriさん、コメントありがとうございます。

Flash Player 8、AS2.0の環境で作っていますので、その点、お気をつけ下さい。

ファイルをお送りしますが、ご不明な点など、なるべくご自分でお調べいただきたいと思います。

※Tweenerは開発終了している様ですので、その点もご注意ください。

投稿: exyz | 2010.05.21 08:45

ありがとうございます!
たすかります

投稿: eri | 2010.05.21 10:33

はじめまして。こんにちわ。
FLASHのTweenerの仕方を探していたらこちらの記事を見つけました。
よければFlashデータをいただけないでしょうか。
お手数をおかけいたしますがよろしくお願いいたします。

投稿: nao | 2011.08.04 18:18

naoさん、コメントありがとうございます。

Flash Player 8、AS2.0の環境で作っていますので、その点、お気をつけ下さい。

ファイルをお送りしますが、ご不明な点など、なるべくご自分でお調べいただきたいと思います。

※Tweenerは2009年に開発終了している様ですので、その点もご注意ください。

投稿: exyz | 2011.08.05 10:03

早速のご対応、ありがとうございます。

投稿: nao | 2011.08.05 12:13

コメントを書く



(ウェブ上には掲載しません)


コメントは記事投稿者が公開するまで表示されません。



トラックバック

この記事のトラックバックURL:
http://app.cocolog-nifty.com/t/trackback/35737/42426766

この記事へのトラックバック一覧です: Tweenerで動きの制御:

« 手軽にラフイメージを作る無料ソフト | トップページ | サイトの画像を簡単に保存させたくない場合 »