先日の大阪てらこで発表しようとして完成できなかったWiiリモコンのテルミンをちゃんと作りました。
機能は以下のとおり。
Aボタンを押し続けてる間、音が出ます。
前後に傾けると音程が変わり、左右に傾けるとリングモジュレーションというエフェクトがかかるようになっています。
Bボタンを押し続けてる間、音程とエフェクトの強さがロックされます。
Wiiリモコンの代わりにマウスで操作できるものも用意しました。
クリックすると音がでます。
マウスを上下に移動すると音程が変わり、左右に移動するとエフェクトのかかり具合が変わります。
おはようございます
先日ある開発でFlashVarsがnullになる現象に悩まされました。しかも、１０回に１回くらいはnullにならないという現象。これを調べても、参考になる記事があまりにも無く、無いなら書いちゃいます。という事で書きます。
その時の実装は
SWFObject version2.2
SWFAddress version2.3
で構築してましたが、IEでなぜかFlashVarsがnull！！たまに、unnull！！
なんで！？
調べてみても、誰も同じ現象がいなく、なんか変な事ソースに書いちゃった？と調べに調べた結果。
SWFAddressのバージョンを2.4にしたら、すんなり直りました。もう！時間返してって感じです。でも、なんで１０回に１回はnullじゃなかったんだろ。。。
ほんと気まぐれ。
追記：
FlashPlayerのバージョンは９で、症状が出たのはIE6、IE7でIE8は確認していません
おそらくIEすべてで出るかもしれないですね。。。
ちょっと前にBitmapクラスのsmoothingプロパティ（画像を拡大縮小／回転したときにギザギザにならないようにするための設定）がちゃんと動作しないと思って、ちょっと調べてみたけどあんまり情報がなかったのでメモしておきます。
スムージングが効かない例：
var bitmap:Bitmap = new Bitmap(); bitmap.smoothing = true; bitmap.bitmapData = someBitmapData;
これだとスムージングされない。new Bitmap( null, true );とかやっても同じくうまくいかない。そして、いろいろやってみた結果、smoothingをtrueにするタイミングがbitmapDataをセットした後にするとうまくいくようです。
いける例：
var bitmap:Bitmap = new Bitmap(); bitmap.bitmapData = someBitmapData; bitmap.smoothing = true;
分かってみたら簡単なことだけど、ドキュメントのsmoothingプロパティのとこに書いてなくてちょっと困った。
ちなみにMac版Flash CS4の場合です。
４日の土曜日に、いつも一緒にVJやってるメンバー２人と、ダンサーの人がコラボしてライブパフォーマンスをやっていました。
残念ながら参加できなかったのですが、かっこいいライブ映像をYoutubeに上げてくれてたので紹介します。
ステージ映っているパターンはWiiリモコンでリアルタイムで制御できるFlashで作ったVJツールです。wiiflashを使うと簡単にFlashとWiiリモコンを連携できていろいろできちゃいます。
今制作中のサイトで少し変わったナビゲーションを実現させるために、ActionScriptからJavaScriptをのFunctionを呼び出したり、逆にJavaScriptからActionScriptのFunctionを呼びだすというような処理を多用するものを作っています。
それを実現するためにはActionScriptのExternalInterfaceを使うのですが、それでかなりハマってネットで検索しても同様の情報がなかったのでメモしておきます。
症状
以下のようなコードで、Flash Playerのバージョン9.0.48以前＋IE 6/7の組み合わせの場合のみ、SWFを配置しただけでJavaScriptエラーが発生してExternalInterfaceの機能が全く動かなくなります。
ActionScript(2.0)例
//TextFieldを作る
var greetingText:TextField = this.createTextField("greeting",this.getNextHighestDepth(),0,0,100,100);
//JavaScriptから呼びだしてTextFieldの内容を変える
function changeText(t:String) {
greetingText:TextField.text = t;
}
//ActionScriptのFunctionをJavaScriptから呼びだせるように登録
ExternalInterface.addCallback("extChangeText", null, changeText);
フラッシャーなら気になっている人も多いと思いますが、Gainerを触ってみました。
FLASHムービーの書き出し「パブリッシュ」
パブリッシュは、FLASHで作ったムービーを実際にある形式に書き出すことをいいます。
【ファイル】>【パブリッシュ設定】
Flash Playerのバージョンを選択します。（2007年9月時点のFlash Playerバージョン毎の普及率は、Flash Player 7...99.5%、Flash Player 8...99.0%、Flash Player 9...93.7%）
画質の調整を行えます。デフォルト値が80ですが、100にすると最大限に綺麗な画像で出力されます。
出力する形式についてチェックをいれます。WEBで公開する場合はswf、htmlにチェックをいれておくと良いでしょう。
形式で「HTML」にチェックが入っている場合に、HTMLに関する細かい設定をすることができます。画像の読み込みと、パスの読み込み
さて、ステージで画像を作る際に、外部からの画像をもってきたり、パスデータを読み込みたい場合が出てくると思います。ここでは、外部からの画像やパスの取り込み方について説明していきます。
画像の読み込み方
FLASHには、jpgやgif、アルファチャンネルつきのPNG画像などが読み込めます。
画像の読み込みの手順としては...
パスデータの読み込み
イラストレーターでつくったパスデータをFLASHに読み込みたい場合の手順は...
パスデータを読み込む場合、イラストレータのデータが、ある条件を満たしているとうまくいかないことがあるので、下記に挙げます。
などです。イラストレータのパスデータは極力シンプルなものにし、グラデーション等はFLASH側に読み込んでから、FLASH側で再設定するのが無難です。
手頃なモーションタイポグラフィー
WEBサイトでFLASHを設置するとき、せっかくFLASHで制作するのだからキャッチコピーなどの文字を動かしてみたい...でも具体的にどんな動きにすれば良いのかわからない...
今回は、そんなときに手頃につかえるモーションタイポグラフィーをいくつか紹介します。
マスク機能について
イラストレーターやフォトショップにも「マスク」機能があるように、FLASHにも「マスク」機能があります。FLASHのマスク機能は、イラストレーターやフォトショップのように、マスクの対象が静止画だけではなく、動的なものにもかけることができたり、マスク自身を動的に動かしたりできるので面白いです。
マスク機能の使い方
マスク機能の使い方は、前回のモーションガイドの使い方とほぼ同じで、レイヤーを選択して【タイプ】を「マスク」、「マスクの対象」にそれぞれ設定するだけです。マスクは応用すれば、とても変わった表現が可能になるので覚えておくとよいでしょう。
空を飛ぶ鳥の軌跡を操る
以前は、「ハネを羽ばたかせた鳥が空を飛ぶムービー」の作り方について簡単に説明しました。さて、第1章の最後は「モーションガイド」についてのレクチャーとなります
「モーションガイド」って？
モーションガイドとは、トゥイーンを使用する際に、合わせて使えるトゥイーンの軌跡を設定できる機能です。
前回の、鳥の体をトゥイーンで動かすところを思い浮かべて下さい。この場合、トゥイーンで始点と終点を決め、直線に鳥を飛ばしてもなんだか無機質な感じがしますよね。
では直線ではなく、曲線で動かすとどうでしょう。少しはそれっぽくなりそうです。
シンボルのおさらい
FLASH WORKSHOP 1-05でシンボルについて少し触れましたが、覚えているでしょうか。
●おさらい●
ステージで作った部品をまとめてシンボル化（F8または、【修正】>【シンボルに変換】>名前をつけ、【ムービークリップ】を選択してから【OK】）してライブラリに格納（これは自動的に格納されます）すると、シンボル化したアイテムをライブラリからドラッグ＆ドロップで、大量に複製することが可能でした。
さらに、シンボルのひとつを改造すると、複製されたすべてのシンボルに、改造が適応されました。
前回までは、ボールにトゥイーンをかけて、アニメーションの補完を手伝ってもらいました。
トゥイーンには大きく分けて、二つのトゥイーンがあります。
前回までのボールを動かす機能は「モーショントゥイーン」とよばれるトゥイーンです。
イージング
ボールが落下するとき、車が青信号になって動きだしたとき、雪山のてっぺんからそりを走らせたとき。 動きは徐々に「加速」します。
ボールが跳ね上がるとき、丸太が水底から水面へ浮かび上がるとき、電車が駅に停車するとき。 動きは徐々に「減速」します。
前回、シンボル（ムービークリップ）の開始点と終了点の間にモーショントゥイーンという機能をかけ、等速の動きを再現しましたが、覚えていますでしょうか。
FLASHではなんと、モーショントゥイーンの設定を変更する事で、「加速」「減速」を簡単に表現することができるのです！
今回は、前回のボールの動きにこの「イージング」を適応させ、あたかもボールが飛び跳ねているかのような動作を作ってみましょう。
トゥイーン機能
「トゥイーン」機能。それはフレーム〜フレーム間のシンボルの動きを予想して、アニメーションを自動的に作成してくれる機能です。
前回まで、弾むボールを作る目的でアニメーションの作り方を考えてきましたが、
（ボールなど、）1つのシンボルの動きを操作するのに、このトゥイーン機能は非常によく使えます。
↓そんなさっくり言われても、イメージがよく湧かないよ。というあなたに・・・↓
前回の記事では、FLASHでボールの弾む動きを作ってみよう！というところで話が止まっていました。さて、実際に弾む動きをFLASHで表現するとしたら・・・？
ボールの弾む動きを１フレーム１フレーム描くのには、あまりに無理がありますよね。
ボールがただの円であれば、まだ100フレーム分くらいは乗り切れる気がする・・・けれど、これがサッカーボールだったら？
前回では、フレームと時間の概念についてお話ししました。
「１つのフレーム」は、ぱらぱら漫画でいう、「１ページ」に該当するもので、タイムラインに沿った「フレームの配置」は、ページをめくる「タイミングを決めること」に該当します。
さて、このぱらぱら漫画ですが、（実際に作ったことのある人は分かると思うのですが）、意外と思った通りにキャラクターや物が動いてくれなくて困ったという経験はなかったでしょうか。
タイムラインとフレーム
まずは下の画面を見て下さい。
これはタイムラインと呼ばれる物で、右へ進めば進む程、時間が経過していきます。
ここに、「フレーム」と呼ばれる枠を作っていき、アニメーション等を表示させるタイミングを決定します。
（つまり…私達がよく目にするアニメーションがあのように動いて見えるのは、ぱらぱら漫画のように、いくつもの静止画が連続的に流れているからで、FLASHでは、このフレームを何個も作り、ぱらぱらするタイミングをタイムラインに沿ったフレームの配置で決めていくのです。）
