あけましておめでとうございます。

昨日東京へ戻ってまいりました。
どうやらProgression4のbeta1.3が公開になったようですね。
ざっと変更点、修正点を見てみましょう。
http://progression.jp/ja/download/4.0.1_pb1.3/
・・・・・・

とんでもない量です。

大きなポイントとしては
・オートアップデート機能の追加
・環境設定クラス(~Config)にライセンスがらみの引数追加
・コマンドのResourceまわりのプロパティの追加(resId、resGroup)、変更(groupの廃止)
・ResourcePrefetcherクラス追加(アイドル時に先読みしてくれるすごいやつ)
くらいでしょうか?
(他にも山ほどありますが)

とりあえずの注意点としてはインストール後、リリースビルドの書き出しはbeta1.3での書き出しとなるので、beta1.3準拠への修正が必要になると思われます。(Ver4.0.0であれば大丈夫ですがVer4.0.1のものが対象になります。つまりbeta1.2のものは要修正)

では一つづつ見て行きましょう。

・オートアップデート機能
まず待望のオートアップデート機能追加です。
プロジェクトパネルでプロジェクトを開いて、メニューアイコンの一番右にあるのがアップデートボタンです。
prog4update.jpg
これを押すと、ダイアログが出てアップデートの有無を聞かれます。
Ver3と同じですね。

・環境設定クラス(~Config)にライセンスがらみの引数追加
各~Configクラスの第一引数にactivatedLicenseTypeというStringタイプの引数が追加されています。
通常MITライセンスの場合は指定なしか"basicLibraryLicense"を指定してあげると良いです。
私は良くWebConfig(false,false,false)とやっていたので、アップデート後はとりあえずコンパイルエラーという状況でした。

・コマンドのResourceまわりのプロパティの追加、変更
画像等、外部ファイル読み込みの際に今まではURLをidとして、getResourceByIdを利用してきましたが、beta1.3よりresIdプロパティを指定する事によってresIdの値でgetResourceByIdを利用出来るようになりました。ちなみにresIdを指定しなかった場合は今まで同様にURLをidとして指定可能です。
また、複数ファイルの場合にgroupプロパティを指定していましたが、これが廃止となりresGroupプロパティに変更となりました。
こいつも多用していたものですから、アップデート後、リリースビルドでswf真っ白という状況が多発しました。

・ResourcePrefetcherクラス追加
すごいのが搭載されたと噂のResourcePrefetcherクラスです。
こいつは、Progressionがアイドル状態(何も操作しないでじっとしている)の時に、現在のシーンの位置を把握して、ファイルの先読みを行ってくれる代物です。
デモを作れれば良いのですが、こちらにデモと使い方が書いてありますのでとりあえず横着しますごめんなさい。
http://blog.progression.jp/memo
(このページはmemoという事ですのでいつ消えるかわかりません。あしからず)

Progression本体swfの読み込みがPreloader経由かどうかを判断出来るisPreloadedプロパティも追加されていますね。結構便利。

とりあえずバグ以外で、自分が気になったポイントはこのくらいかなあ。
間違ってる事もあるかもしれませんのでその際はご指摘お願いいたします。

それではいつかまた会いましょう。

時の経つのは早いものでProgression4のベータ版が世に出て2ヵ月になろうとしています。

様々な新機能がありますが、いかんせんドキュメントがASDocのみと(それだけでも凄い事なのですが)いう事もあり、意外と話題になっていないProgression4の凄い機能を紹介したいと思います。

Progression4のWebConfigで作成した場合、swfファイルをパブリッシュした際に以下メッセージが出力される事に気づかれる方も多いかと思います。
prog4html_1.jpg

Progression4ではWebConfigの第3引数、useHTMLInjectorをtrueにする事により(デフォルトでtrueになっています)HTMLファイルを読みにいきます。

簡単なサンプルを作成しましたのでまずはご覧下さい。

http://www.northprint.net/progression_test/HtmlData/

このサンプルをJavaScriptをOFFにしたブラウザで見てくださると分かるのですが、Progression側に読み込ませるデータをHTMLの方で設定しています。

さて、方法なのですが、まずHTMLの方です。(Index.html)
Progression4で書き出されたHTMLにも記述されています。id="htmlcontent"のブロック内に記述します。
※注意:シンタックスハイライターのせいでimgタグが閉じられていませんが、実際はきちんと閉じてください。

HtmlDataTest

このサイトについて

クマンバチ

Progression4ではHTMLの内容を取得する事が出来ます。

トンボ

非常に画期的な機能です。とりわけ、SEO対策に効果があります。

カマキリ

HTML側をルールに沿って作りこめば、JavaScriptOFF時にも同内容のコンテンツを見せる事が可能です。

以下、スクリプト側です。(ImageSceneクラス)

//HTMLデータ参照
if (WebDataHolder(dataHolder).html.toXMLString()) {
	//xml形式に変換
	var contentXml:XML = XML(WebDataHolder(dataHolder).html);
	//pタグの値は配列としてアクセス可能
	trace(contentXml.p[1]);
	_dispText.text = contentXml.p[1];
	//imgタグがあれば
	if (contentXml..img.length()!=0){
		addCommand(
			//画像をロードしBitmapDataとして取得します
			new LoadBitmapData(new URLRequest(contentXml..img[0].@src)),
			function():void {
				//ロードした画像を取得し、表示します
				_imageContainer.bitmapData = BitmapData(getResourceById(contentXml..img[0].@src).toBitmapData());
			}
		);
	}
}


プロジェクト生成時に設定したドキュメントクラスと同名のHTMLファイルを読みにいきます。
htmlcontentブロック内に、シーンパスと同じidのブロックを設定する事で当該シーンの際にシーンオブジェクトのdataHolderより取得出来ます。
そのままではデータとして認識出来ないので
WebDataHolder(dataHolder).htmlと、WebDataHolderクラスを使用してあげます。

詳しくはサンプルソースコードをじっくりご覧になって下さい。

さすがにHTMLからシーンを作成する(やれば出来る様な気もしますが)などという荒業は出来ないものの、xmlやjsonからデータを取得するのとほぼ同様にデータの取得が可能です。

サンプルプロジェクト一式はこちらからダウンロードして下さい。

この機能はProgression4のなかでも結構目玉となる機能なんじゃないかと思います。特に、デプロイしない状態でもFlashのプレビューで表示可能という点が凄い。凄すぎる。ばんざーい。

という事で、みなさんフォーラムもどんどん活用して下さいね。それではー。

昨日、カヤックさんのlevel0というブログにおいて、Flash制作に欠かせない3つのツールというお題で一斉エントリーがあったのに便乗して、私の使っているツールを紹介したいと思います。

3tool_1.jpg
1:FileZilla
フリーのFTPソフトウェアです。(寄付受付はしています)早速Flashとはあまり関係ないツールですが、コレが無いと全く仕事になりません。ってくらい使用頻度が高いソフトウェアです。むしろFlashよりもコレ立ち上げてる方が多いかもしれません。

コレがフリーで良いのかというくらいの高機能で、使用感も良く、1度使ったら手放せなくなると思います。



3tool_2.jpg
2:TeraPad
テキストエディタです。使用バージョンは0.89a。簡単なasファイルとか、xmlとか作る時は大抵これを使用します。昔はMIFESというソフトを愛用していたのですが、それほどテキストエディタでガリガリプログラムを書く事も減りましたのでコストパフォーマンス的な観点から乗り換えました。

asファイルは基本FlashDevelopで書きます。実はコレが一番欠かせないツールですが、既にあちこちで紹介されているので今回は割愛しました。



3tool_3.jpg
3:Progression4のプロジェクトパネル
なんでコレが出てないのかとても疑問に思っておりましたが、まだ出て日が浅いのと、ベータ版だからという理由があるからかもしれません。

Progression3から大幅に進化を遂げたProgression4のプロジェクトパネルですが、恐ろしく便利です。
作成したプロジェクトがリスト表示され、ダブルクリックで開きます。むしろFlashに標準搭載されていて欲しい。
また、外部ライブラリを簡単に導入出来る仕組みも搭載。これもFlashに標準搭載して欲しいくらい。(外部ライブラリ組み込み方法は前のエントリーで書いています)

意外と言及が少ないなと感じておりますが、Progression4での最大の進化がこのプロジェクトパネルなのではないかと思っております。

こんな感じです。
でもやっぱり一番はFlashDevelopなんですけどね。

またまたご無沙汰でした。

10月10日にProgressionの野良勉強会があったのですが、先約があった為スライドだけお披露目しました。前の日に突貫で作ったので酷い出来ですが、こういうスピード制作も出来るんだぜという悪い見本を晒します。

スライド

・PCの← →キーで動作します。
・ムービーが止まったら、別シーンに飛んで戻ってください。
・動かないな?と思ったら画面の中心をクリックして下さい。
・ムービーのフィルタは全部PixelBender Exchangeにあるやつです。
・一番右の白いボタンでフィルタをクリアします。

ソースコードはこちら
flaファイルを開く為にはFlash CS4が必要です。ピクセルベンダー使ったのでFlash10です。

内容は俺俺コマンド作ろうぜ!的な事ですね。
意外と俺俺コマンドの投稿が少ないので、みんなで作って共有しようよ。と言うのが主な趣旨です。

ちなみに後述したいと思いますが、ピクセルベンダーの使いどころって難しいですよね。。。
動作させてみると分かりますが、CPUが凄い事になります。GPU使ってくれないかなー。



本日、ちょっと席を離れていたすきにProgression4のパブリックベータが開始されておりました。
ベータ版という事ですが、ほぼ完成に近い形になっていると思います。

そこで、早速ですが、新機能となるProgression4 DevToolsの使い方を説明してしまいます。
とても便利な機能ですので、活用しましょう!
※注:DevToolsの利用にはFlashCS4が必要です。

さて、このDevToolsですが、2通りの機能を有しています。

・拡張プロジェクトを作る
・拡張ライブラリを作る

の2つです。
今回は
「拡張ライブラリを作る」の方にスポットを当てます。

例としてpapervision3dライブラリをProgression4で簡単に利用出来る様にしてみたいと思います。


まず、以下の様にProgressionで使用したいライブラリを設置します。 ※フォルダ名は任意です。 prog4dev_1.jpg




次にDevToolsを起動します。 コマンド→Progression DevTools→パッケージを作成するを実行して下さい。 prog4dev_2.jpg




フォルダ選択のダイアログが出ますので、先ほど作成したフォルダを選択します。 prog4dev_3.jpg




OKを押下すると以下ダイアログが現れますので、必要事項を記入します。※何かしらの文字を入力する必要がありますが、デフォルトのままでも作成は可能です。 prog4dev_4.jpg




OKを押下すると、pppackとmxiという2つのファイルが書き出されます。このファイルの位置関係は重要ですので、移動してはいけません。 prog4dev_5.jpg prog4dev_6.jpg




後はAdobe Extension Managerを起動して、ファイル→拡張機能の作成を実行し、先ほど生成されたmxiファイルを指定してmxpファイルを作成します。 prog4dev_8.jpg




そして完成したmxpファイルをインストールし、Progression4の新規プロジェクト作成パネルを見てみると。。。

見事、外部ライブラリに先ほど作成したライブラリが追加されています!
prog4dev_7.jpg



さて、いかがでしょうか?ライブラリを用いたプロジェクトを作成する際、非常に便利になるのがお分かりになるかと思います。

ちなみに作るのがめんどくさい方は、私の方で3つほど作成しましたのでご利用くださいませ。(BetweenAS3に関しましてはnium先生が作成したものをベースにしています。こちらは完成したpppackファイルにさらに手を入れる事によってプレイヤーのバージョン等に応じた書き出しにも対応しています。)
※現時点で最新のバージョンで作成しています。

sketchbook

papervision3d

BetweenAS3

こんにちは。

早いものでブログを放置して2ヶ月を大きく越えてしまいました。

そんなこんなしているうちに、Progression3がめでたく1周年を迎えています。
(本当の1周年は9月4日。作者でもないのにすいません)

そこで勝手に祝ってしまおうじゃないかと思いまして。。。
1周年のお誕生日祝い的な感覚で、100円でも1000円でも寄付したら良いんじゃないかなーと。
(出すぎた真似して本当にごめんなさい)

Progressionの寄付のページ

こんな事勝手にやって怒られるような気もしますが、もっともっと寄付されるべきなのではないかと常に思っています。
という自分もなかなか難しいんですよね。

せっかくの1周年なので皆でお祝いしましょう!


ちなみに技術的なハナシは近々再開しようと思ってます。

昨日、6月12日に"extends Progression 拡張機能コンテスト"の授賞式が行われたのですが、なんとWeb Designing賞を受賞させていただきました!!

受賞したと分かった時は本当に嬉しかったです。

残念ながら授賞式にには参加できず、授賞式自体はUstreamで視聴させていただいておりましたが、他の方の作品はそれは凄い作品ばかりで、驚きの連続でした。本当にあの場に居れなかった事が残念でなりません。

作品自体は他の方に比べると地味なものですが、コンポーネントベース、タイムラインベースであれば容易に導入出来、かつ効率のアップに繋がるのではないかと思っています。

作っていて感じたことは、Progressionは拡張機能を簡単に作成出来る様に作られているという事でした。(一回Progressionの拡張コンポーネント作れば分かると思います)

最近やるやる詐欺が酷い傾向にありますが、これを是正し、Progressionの更なる発展に今後もどんどん貢献していければと思っています。


追伸:勢いでD90を買ってしまいました。アホですね。

ブログを2ヶ月ほど放置していました。
色々やるようになってくると、完成度が気になってしまい、作り始める→やめるのループになってしまって。。。
もともとそんなに経験も無いので完成度を重視してもしょうがないですよね。。。

で、先日行われましたProgression拡張機能コンテスト。なんとか作品を提出させていただきました。

いつもボタンの作成がめんどくさいので、コンポーネントベースで使える様々なボタンをProgression3用のコンポーネントセットとして作ってみました。


提出したスライド
(Slidesライブラリです。右カーソルで動作)


コンポーネントのダウンロード(要Progression3)


作り方やソースコードは整理しながら徐々に公開していこうかと思いますが、実は中身は結構力技だったりして酷いです。制限もあります。
そして、もっと良いネーミング思いつかなかったのか。。という。。。

※スライドに書き忘れていますが、このコンポーネントでボタンをいい具合に見せるにはボタンのヒット範囲に透明MCを置く必要アリです。あと、このコンポーネントを使うボタンにタイムラインアニメーションをさせてはいけません。

ただ、このコンテストを通してコンポーネントの作り方を学べたのは非常に大きかった。Flashのスクリプターとデザイナーの分業、協業の方法が垣間見えた気がしました。ちなみにTweenerを最大限に利用しているので、作りも非常に簡単にできています。

コンポーネントベースで簡単に動きのあるボタンが作れますので、Progressionコンポーネントベース大好き派なあなた!是非使ってみてください。
自分で言うのもなんですが、ドラッグアンドドロップですぐ実装出来るので楽でいいですよ。


ちなみに最後にURLリンク機能追加予定とありますが、次バージョンになってから。。の予定です。


まだまだ精進せねばいけませんね。。

どうもこんにちは!近日公開するといったサンプルがまだ公開できないダメ人間でございます。

さて、絶好の花見日和になりましたが、本日jsfl勉強会なるものを開催させていただきました。(といってもきちんと進行の音頭を取るわけでもなく流れに任せていただけなのですが。。。)
参加されたみなさま本当にありがとうございました。一応全員なにかしら発表するという方式を取りましたが、なかなか良い勉強会になったのではないかと思います。

さて、どのような発表があったのか、軽く紹介したいと思います。

1.northprint
トップは私で、リファレンスに載っていないものの紹介というテーマです。
以下のようなFlashのパネルを作成し、押すとFlashDevelopとメモ帳×24とvimが起動するという一発ネタを披露しました。
jsflstudy_1.jpg

これはFLfile.runCommandLineというOSコマンドを実行できるjsflを利用しています。(Windowsだとコマンドプロンプトで実行するあれです)
Flash CS3からMacOSのコマンドも動作するようです。
このFLfile.runCommandLineを使うと、今回の様に外部プログラム起動等々色々な事が出来てしまいますので少し危険です。みなさんも怪しい拡張は使わないようにしましょう。。。という話でした。

他に
FLfile.getPlatform():OSのプラットフォームを取得出来る
FLfile.getSystemTempFolder():一時ファイルの格納先を取得出来る
というものも紹介させていただきました。

以下、他の方の発表内容をさらっとメモ書き程度に紹介します。(twitter IDで表記させていただいております)

2:fumixさん
jsflでテキストシェイプのアウトライン作成
テキストを分解してアウトラインを作成する場合があったのですが、すごく面倒なのでjsflで作りましたとの事。CS3ではきちんとしたアウトラインが取れなかったが実現出来なかったがCS4のjsflで実現可能に。

3:niumさん
COREXとProgressionの裏側
COREXがどのような仕組みになっているかという話とProgressionプロジェクトパネルの動作について詳しく説明いただきました。
実はこれ目当てでした。
この辺の中身は最近覗いていたので、さらなる理解に繋がりました。あまりの凄さに私を含めみなさん唖然とされておりました。。。

4:||_koba_||さん
jsflを実行する方法いろいろ
コマンドラインからjsfl実行したりemacsからjsfl実行したり
iphoneasを用いてiPhoneからFlashのパブリッシュをしたり
この仕組みを利用してiPhoneからFlashをいじれるiPhoneアプリを開発したいとの事!楽しみです。

5:taigaさん
SwitchBoard概要
Adobeのlabsで公開されているSwitchBoardを利用したデモ
SwitchBoardを利用を利用してAIRアプリからIllustratorやPhotoshop拡張機能を操作されておりました。
InDesign 自動処理実例集という本を紹介されておりました。
SwitchBoard結構おもしろそうです。触ってみようかな。

6:risayさん
自分用に作成したjsflの紹介
携帯電話のコンテンツ用に(携帯電話は機種によってサイズが違う為)ステージサイズを強制的に変更するjsfl等、自分用に作成したjsflを紹介されておりました。
ステージサイズの変更は非常に苦労するので、大変便利だと思います。

7:kaedeASさん
jsflでリアルタイムパブリッシュ
AIRとswfパネルをローカルコネクションで通信させて、リアルタイムパブリッシュを実現するというものを紹介して下さいました。
先日行われたDeskTopLive.asでの吉川さんのパフォーマンスにインスピレーションを受けて作成されたそうです。
近日SparkProjectにコミット予定との事!

8:xxxxMakotoさん
飛び入りで参加いただいた為、発表はありませんでしたが、同僚よりjsflの宿題をいただいたそうです。次回も是非よろしくおねがいします。

9:dokeさん
テキストファイルを読み込みと保存が出来るswfパネルの紹介と自分用に作成したjsflの紹介
リンケージ張替え、素材を全部MCに変える、連番で吐き出してシンボル化する等々、自分で業務の際に利用しているjsflを紹介して下さいました。
また、スクリプトで書くよりタイムラインアニメーションで作成した方が楽な場合のアプローチやその際使う「ステージMCの初期化コードを生成するjsfl」の紹介等でFlashの制作方法に関する話をしていただき、大変勉強になりました。

以上総勢9名による大変有意義な勉強会となりました。
jsflはFlashでの作業の効率化を図るのに最良の手段であると同時にAIRやiPhoneのようなものとFlashとを連携させる手段としてのアプローチもあるんだなあと。

次回開催は未定ですが、またネタが出てきたなと感じたら開催します。
jsflって面白いですね!それではみなさま良いjsflライフを!

実は結構前から話題には上っておりましたProgressionのget~系メソッドについて、少々書いてみようと思います。

というのもカヤックさんのエントリー(gihyoの記事の紹介をいただいております。ありがたい事です。)とflabakaさんのエントリーでget~系のメソッドが紹介され始めましたので、便乗してエントリーさせていただこうかなと。

今まではProgressionのScene間のデータの受け渡しに関して、「シングルトンでやる」みたいな意見もちらほら聞かれたのですが、今は圧倒的にget~系のメソッドを使っています!という声が多いですね。get~系のメソッドはProgressionに無くてはならない要素の一つだと思います。

さて、どんなメソッドがあるか見てみましょう。

Progressionインスタンスの参照用
getProgressionById(設定したidを持つProgressionインスタンスを取得)
getProgressionBySceneId(指定sceneIdのProgressionインスタンスを取得)
getProgressionsByGroup(設定したgroupを持つProgressionインスタンスを含む配列を取得)
getProgressionsByRegExp(設定したfieldName が条件と一致する Progression インスタンスを含む配列を取得)

Commandインスタンスの参照用
getCommandById(設定したidを持つCommandインスタンスを取得)
getCommandsByGroup(設定したgroupを持つCommandインスタンスを含む配列を取得)
getCommandsByRegExp (設定したfieldName が条件と一致する Commandインスタンスを含む配列を取得)

SceneObjectインスタンスの参照用
getSceneById(設定したidを持つSceneObjectインスタンスを取得)
getSceneByName(指定scenenameのSceneObjectインスタンスを取得)
getSceneBySceneId(指定sceneIdのSceneObjectインスタンスを取得)
getScenesByGroup(設定したgroupのSceneObjectインスタンスをを含む配列を取得)
getScenesByRegExp(設定したfieldName が条件と一致する SceneObjectインスタンスを含む配列を取得)

様々なオブジェクトのインスタンスの参照用(私は主にキャストオブジェクト参照用として使用しています)
getInstanceById(設定したidを持つオブジェクトのインスタンスを取得)
getInstanceByGroup
getInstancesByGroup(設定したgroupを持つオブジェクトのインスタンスを含む配列を取得)
getInstanceByRegExp
getInstancesByRegExp(設定したfieldName が条件と一致する オブジェクトのインスタンスを含む配列を取得)

>elmo様よりミスの指摘がありましたので修正しました。ありがとうございます!

私が把握しているのはこの辺りです。ものすごく充実していますね。まだあるのかな?

この中でも比較的大活躍をしてくれるのがカヤックさんのブログでも紹介されているgetInstanceByIdなのですが、さらに便利なのがgetInstanceByGroupといったGroup系です。

例えばなのですが、メニューボタンが並んでいる場合、このメニューボタンのセットを1つのグループにしておくとgetInstanceByGroupでメニューボタンの参照が配列で取得出来てしまいます。

使った事は無いのですが~ByRegExpもサーバーとの連携あたりで大活躍しそうですね。。(検索に引っ掛けるとか)
本当になんでも出来るフレームワークだなーと感心しながら今日も何かを作っています。

使い方の実例ですが、近々この辺を利用したサンプルを公開しますのでお待ちを。
出来はあまり期待しないでくださいね。
それではー。

www.flickr.com
This is a Flickr badge showing public photos and videos from northprint. Make your own badge here.

最近のコメント

アイテム

  • prog4update.jpg
  • prog4html_1.jpg
  • 3tool_3.jpg
  • 3tool_2.jpg
  • 3tool_1.jpg
  • prog4dev_8.jpg
  • prog4dev_7.jpg
  • prog4dev_6.jpg
  • prog4dev_5.jpg
  • prog4dev_4.jpg

最近のコンテンツはインデックスページで見られます。過去に書かれたものはアーカイブのページで見られます。