メイン

2010年09月04日

ダイバージェンスメーター

某想定科学ADVの世界線変動率メーター(ダイバージェンスメーター)をガラケーの待受Flashにしてみました。
リンク先ページのQRコードからどうぞ。

世界線変動率メーター待受Flash


Twitterで先に公開告知ツイートしたのだけど、あまりにタイミング悪すぎたのか誰にも全く捕捉されなかったという体たらく。
たまたまフォロワーにゲームやってる人がいなかったかもしれないというオチも。
失敗した失敗した失敗した失敗した……

2010年03月17日

パーティクルでフィールドマップ

昨日のAdobe FLASH PLATFORM CAMPをUstreamで観ていて思い出したんですが
1年近く前に作ったまま正式公開せずに放置していたミニ作品(厳密にはTwitterでチラ見せしただけ)があったのでエントリとして投下しておきます。

500個のパーティクルでフィールドマップ

パーティクル祭りRANDOMAPの複合技です。
実際にどういう処理をしているかは、パーティクル祭りのソースとActionScript的超絶技巧発表会の資料から想像してみてください。


URLを弄ればパーティクル数を自由に変えられます(最大100000個)

2000個
http://www.voidelement.com/randomap/particle/2000

200個
http://www.voidelement.com/randomap/particle/200

10000個超えるともう岩山だらけですねw
むしろ3個とかの方がずっと見ていても面白いので、ただ数増やせばいいってもんじゃないというかなんというか。

2008年12月08日

指先ツール

こくばん.inで機能拡張用のアイテムを売るためのアイテムショップ(まだNOT課金)を始めたんだけど、指先ツールが何気に渾身の出来だった。
本家とは若干挙動が違うけれども、実際の黒板で試みることを想定したら黒板消しよりそれっぽいかもしれない。

参考作品


最近BitmapDataの人じゃなくなってきたので、そろそろリハビリも兼ねてPixelBender勉強しようかなと思う。
ただすごくクセがあるみたいなんで、思った通り扱えるようになるまで時間がかかりそう・・・
むしろiPhone開発が先かなー誰かエロい人教えて!

2008年05月22日

ぴたごらったー改良

twitterのcrossdomain設定が変更になって以来、全く機能しないまま放置していたぴたごらったーですが、自分のアカウントをこっそり拾ってくることもできなくなっているので、対応ついでに改良を加えてみました。

たとえば munegon がfollowしているユーザのアイコンを降らせたいなら
http://www.voidelement.com/pitagoratter/munegon

といった感じで、末尾にアカウントを付加することで任意のユーザの友だちアイコンが最大100個降り注ぎます。
特に何も付けない場合は公開タイムラインのアイコンになります。

それ以外は特に変わってません・・・機能追加しようにもBox2DFlashAS3がまたバージョンアップしちゃってるし・・・

2008年05月21日

ADCのこくばん記事

こくばん.inの技術記事がAdobeデベロッパーセンターに掲載されました。

こくばん.in:リアルな書き味と消し味を実現するテクニック


ビットマップデータのdraw時におけるmatrixの作り方についてかなり噛み砕いて説明したにも関わらず、これで中級!?なんて言われていますが上級はもっとすごいと思います。たとえばabcとか。


高速で描いたり消したりしているとものすごい勢いでブラー処理とdrawが行われるため、ペンタブレットだと描画の遅れを感じることがあります。
普通のお絵かきサイトよりもマウスで描きやすいという意見もあり、そんな逆転現象が起こっているのが興味深いですね。
今後FlashPlayerの描画性能が上がった時に「描きにくくなった」という意見が出そうで怖いw

2008年05月15日

FlashPlayer10のひどいバグ

FlashPlayer10のベータ版がAdobe Labsで公開されました。

が、入れてみるとお絵かき系サイトが軒並みひどいことになります。
左(上)へラインを引き続けると突然右(下)端に向かってラインが一気に引かれます。
こくばん.inも例に漏れず。

調べてみたところ、ドラッグ中にマウスの座標を負に持っていくとマイナス値にはならずに65535から減りはじめます。
おそらくint型で扱うべきところをuint型でやってしまってるのでしょうが、とにかく正常な値をとらないのでマウスに追随するオブジェクトもワープする始末。

とりあえずの処理として以下のようにしておけばいいとは思いますが、気持ち悪いですね・・・


x = ( mouseX > 32767 ) ? ( mouseX - 65536 ) : mouseX;
y = ( mouseY > 32767 ) ? ( mouseY - 65536 ) : mouseY;

すでにリリースされているサイトで心当たりのある開発者は要チェック。

2008年02月25日

こくばん.in β版リリース

先日のコリン・ムック迎撃イベントの発表資料で小ネタとして用いた黒板手書きエフェクトをサービスとして昇華リリースしました。


こくばん.in


見ての通り、黒板です。

チョークは6色のみ。
学校の先生もそれでやりくりしてるわけで、不便なんて言わせません。
一応マウスホイールor上下カーソルでチョークのサイズを変えられますが、エッジを使って細く書いたりするのを代用してるつもりで。

この手のサービスにありがちな、一手戻るだとか初期化とかも一切ありません。
リアルの黒板にそんな機能ないですよね。
ミスっても黒板消しで地道に消しましょう。
意外と楽しいかもしれないですよ?


β版ということで最低限の機能しかありませんが、ユーザ登録やコメントなどできれば追加していきたいなと思います。

2008年02月14日

バレンタインネタゲーム作ってみた

クリスマスネタゲーム作ってみたに引き続き、ネタゲームです。
見ての通り、ほとんど使い回しです。

バレンタインの惨劇!?


カップルをスナイプしたり、チョコレートをスナイプで弾き飛ばしたり、弾き飛ばされたチョコレートをスナイプで破壊したり。
クリスマスと違って、バレンタインにはテーマ曲らしいテーマ曲がないので無音の中もくもくとスナイプする地味なゲームになってしまいました。

例のごとくクリアやゲームオーバーなど全くありませんが、バレンタインなんてなくなればいいと思ってるそこの貴方、思う存分スナイプしませう。

2008年01月11日

Colin MoockとActionScriptな人々

今月15日にAdobe Presents コリン・ムックの「今から始める ActionScript 3.0 - WORLD WIDE TOUR 」が行われますが、その翌日16日に日本のActionScriptを見せつけてやるぜという名目の技術系イベントが開催されます。
まだ若干名リスナーとしてですが募集しているので、ActionScriptの濃ゆい質問をコリン・ムックにぶつけたいぜという人は下記の引用を読んで是非応募をば!

応募数が定員に達したため、参加申し込みは締め切られました。

当日はスピーカーとして参加します。
題目は「BitmapDataで面白エフェクト」ですが、面白くなければ変えるかもしれません(笑)
FlashはFlashらしく、見た目でも楽しめるものにする予定。

新年さっそく、ActionScript の"濃い"技術系イベント開催のご案内です。

AS3 エンジニア必携の書「Essential ActionScript 3.0」
http://www.amazon.co.jp/dp/0596526946
の著者の Colin Moock さんが来日されています。
ブログはこちら: http://moock.org/blog/

アドビのセミナー講師としてワールドツアーを回っているそうです。
http://www.event-web.net/as3/
この1月15日(火)の無料セミナーは既に満員御礼なのですが、このセミナーとは反対に、一線の日本人 ActionScripter から発表
し、Colin Moock を国内先端 ActinoScript で迎撃(歓迎)するイベントを追加開催することになりました。(ありがとう!
Adobe!)

●日時&場所
1月16日(水)18:30~20:40
アドビオフィス
東京都品川区大崎1-11-2 ゲートシティ大崎イーストタワー19F(兼、集合場所)

●当日のタイムテーブル
18:30 開場、事務局連絡、はじめに
18:40 Colin Moock 氏講演(30分)
19:10 日本人ActionScripters発表&ライトニングトーク&休憩(トータル70分程度)
20:20 Colin Moock にコレを聞きたい Q&A(20分)
20:40 終了。解散

●日本人ActionScripters発表&ライトニングトーク内容(予定)
・yossyさんhttp://www.be-interactive.org/
- SparkProject
・むらけんさんhttp://www.muraken.biz/ と teraさんhttp://www.trick7.com/blog/
- Gainer + AIR + Wiiリモコン + ヘルメット
・むねゴンさんhttp://void.heteml.jp/blog/
- BitmapData で面白エフェクト
・id:secondlifeさんhttp://d.hatena.ne.jp/secondlife/
- AS3/Flex で国際化アプリケーションを作る + その他いろいろ
・ワンパク 阿部さん
- ワンパク流ASフレームワーク
・小林悠さんhttp://d.hatena.ne.jp/yukoba/
- Flash でも Ruby つかえるよ

FLASHer 向けでなくて、ActionScripter 向けのイベントです。伝説のイベント『ActionScript 的超絶技巧発表会』
の AS クリエイタや、同じ ECMAScript 陣営の Shibuya.js からも出撃!濃い技術ネタにご期待ください♪

ただ、日程が急なこともあり、大きな会場が取れなかったそうなので、残念ながら、Adobe のサイトでの告知や、公式サイト等はございません。この告
知記事を見て、我こそはという AS ラヴな方、お知らせ下さい。

●参加エントリーについて
参加希望申し込みは以下のメールアドレスからお願いいたします。
宛先メールアドレス: colin-moock-20080116@googlegroups.com
メールには「参加希望です」というフレーズとあわせて:
・希望氏名&所属(必須)
・メールアドレス(必須)
・ご自分のサイトURL等(推奨)
・最近の ActionScript 作品orブログ記事 URL(推奨。あればAS3)
・コリンさんへの質問(必須)
をご記入ください。

既に現在、日本人発表者とコリンさんへの濃ゆい質問を事前打診した都合上、その方々にもご来場いただく事になっており、残り募集枠は限られております。
すいません!!おそらく11日中に定員に達するものと思われます。エントリーはお早めに!
申し込みは先着順にて決定いたしますが、運営者も人の子、ActionScript への愛を感じる申し込みや、コリンさんへのコアな質問や、質問内容
を英語でも用意してくださるような情熱的な ActionScript 愛好家さんからの申し込みを優先させていただくこともあるかと思います。ご容赦
くださいませ。

受講当選者には1月15日18時迄に受講決定メールをお届けします。

尚、当日は参加できない方も、「Q&A」コーナーに参加いただけます。
「どうやって書くのがクール?」とか「AS のここが不便だ」とか Colin Moock に投げかけたい技術的な質問・メッセージを募集中です。
どしどしご応募下さい。colin-moock-20080116@googlegroups.com

2008年01月01日

煩悩の鐘

あけましておめでとうございます。
今年もどうぞよろしくお願いします。


年明け直前に思い立って作ったネタ、さすがに間に合わなかったため年明け後に Twitter でこっそり投下するだけにとどめたのですが、1年後まで公開を見送ってもしょうがないので公開してしまいます。


煩悩の鐘

名前を入力して、鐘をクリックするだけ。
108個の煩悩が吹っ飛びます。
除夜の鐘で浄化できなかった貴方の煩悩、なんて位置付けはどうだろうw


脳内メーカーもどきなのは重々承知、というか明らかに劣化版ですね。
文字とかアイコンを大量に吹っ飛ばす実験作のひとつ、ということで;

2007年12月30日

今年1年振り返りつつ来年の抱負

今年は個人的に色々あった1年でした。

退職&独立。
の割にサイトを整理してなかったのと積極的な営業活動を行ってなかったので、お仕事の話は今手がけてるもの以外は皆無に近いです。
来年はもっと多くの人に会って刺激を受けたいし、与えられるならそうしたいと思います。
会社訪問もしよう、うん。


mixi日記にも書きましたが、良くも悪くもTwitterに影響を受けすぎたと思います。
多くの人に出会えたというのは大きいのですが、真剣に作業に打ち込みたいときは何があっても切り離すべきで、作業効率が大幅に変わります。
よく会話しているはずなのに一度も会ったことがない人がどんどん増えているので、会えそうな人にはどんどん会っていきたいですね。


今年作った趣味作品をまとめてみたら何気に多くて自分でビックリしました。
どれひとつとしてお金になってないのが悲しいw
サムネイルで一覧化するページ作らないとダメですね、もったいない。
来年はまずそれを作りたいと思います。


TwitterAPI
TwitterClock
TwitterConsole
Bulleter
ぴたごらったー

ゲーム
CHAIN DETONATION
クリスマスの惨劇!?

弾幕
弾幕ギャラリー
弾幕スクリーンセーバー
弾幕時計
弾幕時計ブログパーツ
弾幕レボリューション

FlashCS3機能拡張
EachTransformer
GradationAssist
AlignAssit
TraceFilter

BitmapDataだらけ
RANDOMAP
ライフゲームシミュレータ
かまいたちの夜カメラ
ハーフトーンカメラ

as3オープンソース
AS1MovieClip
DepthManager
BMPDecoder
PSDParser


どれとは言いませんが、その場の思いつきで作り始めて2時間かそこらで作り上げてしまった作品の方が一般受けしやすい気がしています。
その昔DTM活動をしていた時にも同じように感じた覚えがあり、最初にいいと感じた最小限の構成が重要というか、凝れば凝るほど余計な要素が入ってきてユーザが置いてけぼりになります。
時間をかけて完成度の高いものを作るには「削る」センスも問われるなとつくづく思いました。

あと、作ったものがFlashばかりってのがよくない。
HTMLベースで誰でも何度でも楽しめるようなサービス、それを容易に構築するための技術も会得していきたいと考えています。
ひとまずCakePHPから。。。
少なくともひとつくらいは、自分で使い続けたいと思えるサービスを作りたい。


ブログは今くらいのペースで書き続けれられればと思います。
Flash技術系エントリは需要が低迷してるのを実感したので控え目に。

2007年12月27日

ぴたごらったー

クリスマスの惨劇!?に引き続き、Box2DFlashAS3の習作第二弾です。

ぴたごらったー

Twitterにログインしている状態でアクセスすると、友達のアイコンが山のように降ってきます。
最終発言時刻に応じてアイコンの大きさが変わるので、アクティブユーザがなんとなく分かる感じ。

ステージをドラッグするとラインを描画、シフトキーを押しながらだと円を描画できます。ツールボタン群を用意しました。
パチンコっぽいものを作ったり、特定のアイコンを閉じ込めたり。
配置しなおしたい時は、オブジェクトをクリックで消し消し。

隠し機能的ですが、マウスホイールでFPS調整ができるのでスローモードでもお楽しみいただけます。
どうもFirefoxでは機能してないみたいなので、IE推奨ということで(IEの方がそもそも動作軽いし)

スピードメータを追加しました。クリックで変えられるのでお好みの速度でお楽しみください。

将来的にはオブジェクトごとに摩擦係数やはねかえり係数を設定できるようにする予定。
アイコンの色とかユーザの発言内容を反映させるのもありかなと。

2007年12月26日

1-click Award

お尻にマウスカーソルが突き刺さるおっさんで有名な今年の 1-click Award ですが、なんとなく応募してみたら予備審査に通過しました。
毎度おなじみ BitmapData 暴走作品です。


風呂場でみんなやったよね


コンセプトは「マウスをクリックする時と同じ感覚で指を動かした幼児体験」です。
上手くいったら顔にかかっちゃうのに無性に続けるという、なんだかよくわからない楽しさを上手く演出できたらなーと思って制作しました。
マウスを動かしながら、ワンクリックごとに違う軌跡を描く水滴をめいっぱい浴びてください。

タイトルがダサいのは、締め切り1分前で慌てて応募したため。
この手のやつは作品名も重要なのをすっかり忘れてましたよ。。。


ちょうど昨日から一般投票が始まっているので、他の応募作品も見つつ気に入ってくれたら是非投票してください。
というか、他の作品のクオリティが高すぎて涙目。

2007年12月24日

クリスマスネタゲーム作ってみた

クリスマスツリーとばしに触発されて、ネタゲームを作ってみた。
クリスマスではしゃいでるカップルなんて死ねばいいのにとか思ってる人は是非!?

クリスマスの惨劇!?


物理演算は Box2DFlashAS3 を使用しました。
マウスを押す時間に応じてプレゼント箱が大きくなるので、ゴロゴロ転がしていきましょう。

このままでも面白いんだけど、ゲームオーバーをどうしようか悩み中。


[追記]
エントリファイル名ミスった…もう何件かブクマされてるのでこのままでー

2007年12月15日

Twitter弾幕シューティング「Bulletter」作った

Twitterの発言を弾幕生成器としてあれこれしてみました。

Bulletter


やりすぎ感は否めません。
東方風に仕上げたので、操作周りもなんとなく踏襲。
カーソルキーで移動、Zで攻撃、Shiftで低速移動ができます。
やられても特にペナルティなし。


時間が確保できず、年内公開が危ぶまれたので完成度5割ながら公開することにしました。
生成パターンが少ないのは仕様ですが、ちょっとずつ増やしていきます。
理想としてはスペルカード名が発言に含まれていると……あくまで理想です。
ボムだとかスコアだとかそういうのは余裕ができたらつけると思います。


たまに緋蜂みたいなひどいのがくるので環境によっては激重になりますが、as3をもってしてもこの辺がflashの限界ラインかなと思います。

2007年10月31日

Adobe MAX 2007 Japan 参加セッション

いよいよ明日ですね。
参加セッションを書くのが流行ってるっぽいので書き出してみます。

[11/1]
D-1:ニコニコ動画と Flash
E-2:Flash による 3D 空間の創造とメカニズム
D-3:Flash Lite 3.0 で広がるモバイルコンテンツの世界
C-4:AS3 だけじゃない!まだまだいけるぞ AS1/2!
S-2:スペシャルイベント:Technology Sneak Peek

放課後:Adobe Community United


[11/2]
S-3:アドビシステムズが考える未来に向けたテクノロジーの可能性と日本市場に対しての展望
A-5:Adobe AIR API の使い方
C-6:インタラクションデザインの実際:アイデアの開発
D-7:ActionScript 3.0 とインタラクティブデザイン
D-8:Flex Builder で使いこなす、ActionScript3.0 ~ 最適化とプロファイリング
S-4:スペシャルイベント:スゴロクアワード 表彰式


スゴロクアワード表彰式については参加登録し忘れてたんですが、投稿した作品がノミネートされちゃったので舞台に上がる形で参加することになりました。
受賞できればいいんですけどね・・・ちっちゃなキューブがいっぱい蠢いているやつです。
どうせならもっと弾幕な作品にすればよかったっっっ!?


[追記]
Flash賞をいただきました。
CS3 WebPremium かぶってる状態なのでFlashゲームコンテストを勝手に開いて
優勝賞品にしてみるとか、なんかいい使い道ないか考えてます。
(あくまで案のひとつに過ぎないのであまり期待しないでくださいなw)

2007年10月24日

弾幕レボリューション

すっかり弾幕が板についてしまったので、もうひとつ新機軸かもしれない作品を公開。

弾幕レボリューション

なんの変哲もない3D弾幕ですが、表示されている弾幕全てに当たり判定があります。
3Dなのに2D。

ただそれだけだとなかなか避けられるものではないので、画面ドラッグで任意に空間を回転させられるようにしました。
回転中は時間が停止するとともに、無敵状態になります。
これにより、安全地帯を確保するための空間回転という避け方ができます。

この能力を敵が使ってきても面白いかもしれないですね、東方とかで。
余裕で避けられる弾幕が空間回転によって豹変するような。


ひたすらドラッグを繰り返しているとほぼ無敵なのでゲージ作ろうと思ったのですが、そこまでするほど弾幕の方を作り込んでいないので、まずは雰囲気を味わってもらおうと敢えてゲーム性を封印しました。


6年ほど前に適当に作ったループサウンドをはめてみたら割といい感じになったので、そのまま公開しています。
初音ミクでDTMブームが再燃してるので、また機材引っ張り出そうか・・・


スペック依存な作りなので、重いと感じたらブラウザのサイズを小さくしてください。
全画面でもお楽しみいただけます。

2007年10月15日

弾幕時計ブログパーツ改良

目がチカチカすることで巷で評判(?)の弾幕時計ですが、このたび窓の杜に紹介されました。
ただ、現状ではブログパーツとして使うにはあまりに目立ちすぎるので、設置者によって色をカスタマイズできるようにと改良を施してみました。

色を変更するにはFlash貼り付け時に、以下のようにFlashVarsパラメータを付加します。

h=RRGGBB&m=RRGGBB&s=RRGGBB&f=RRGGBB,RRGGBB,RRGGBB,RRGGBB

h:時針
m:分針
s:秒針
f:枠を構成する交差弾の色をカンマ区切りで(数は自由)


設定サンプル


<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0" width="160" height="240" id="bulletclock" align="middle">
<param name="movie" value="http://www.voidelement.com/bulletclock/blogparts.swf" />
<param name="bgcolor" value="#000000" />
<param name="wmode" value="opaque" />
<param name="FlashVars" value="h=cccc00&m=00cc99&s=ffffff&f=666666,cc0000,9933cc,cc66cc" />
<embed src="http://www.voidelement.com/bulletclock/blogparts.swf" FlashVars="h=cccc00&m=00cc99&s=ffffff&f=666666,cc0000,9933cc,cc66cc" bgcolor="#000000" width="160" height="240" name="bulletclock" align="middle" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>

2007年10月08日

ハーフトーンカメラ(カラー)

前回のエントリに引き続きハーフトーンカメラ処理、今度はカラー版です。
RGBそれぞれに対してハーフトーン処理を行うと、8色に減色できるようなのでこちらも作ってみました。








大部分はモノクロ版と同じですが、最後の変換を paletteMap で一括変換しています。
こちらも全ピクセルをなめる必要なし。
画像処理様様ですね。


ソースは以下。

続きを読む "ハーフトーンカメラ(カラー)" »

ハーフトーンカメラ(モノクロ)

Flash上でwebカメラにエフェクトかけて仮想カメラでキャプチャすれば、ustreamに加工映像を流せるようになるのでいろいろ試してみることにしました。

たとえばかまいたちフィルタ(PastClips参照)
http://ustream.tv/channel/munegons-show


他にどんなことができるかなと探していたらハーフトーン処理(ディザ法)なるものがあったので参考に作ってみました。








もちろん全ピクセルをひとつずつ見るようなことはせず、画像処理で一括変換してます。
これでustream配信しても面白そう。
こないだ衝動的に bitmapdata.jp のドメインを取ってしまったのもあるので、この手のエフェクトを集めてみるところから始めてみようかなと考えています。


ソースは以下。

続きを読む "ハーフトーンカメラ(モノクロ)" »

2007年10月05日

弾幕時計ブログパーツ

昨日公開した弾幕時計
せっかく時計という題材なのにブログパーツにしない手はないので、作って設置してみたらあまりの主張ぶりにふいたw

特にCGIとか外部のファイルを呼んでいるわけじゃないので、誰でも簡単に設置することはできます。
以下のコード貼り付ければOK。

<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0" width="160" height="240" id="bulletclock" align="middle">
<param name="movie" value="http://www.voidelement.com/bulletclock/blogparts.swf" />
<param name="bgcolor" value="#000000" />
<param name="wmode" value="opaque" />
<embed src="http://www.voidelement.com/bulletclock/blogparts.swf" bgcolor="#000000" width="160" height="240" name="bulletclock" align="middle" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>


見ての通り、あまりにやかましいので取り扱い注意!
でも何かしらの可能性はありそう……な気がする。


[2007/10/15 追記]
色をカスタマイズできるようにしました
弾幕時計ブログパーツ改良

2007年10月04日

弾幕時計 -BULLET CLOCK-

多分こういうのは今までなかったと思うので作ってみた。

弾幕時計 -BULLET CLOCK-

秒針は加速弾。
分針と時針は何の変哲もない低速弾。
針はそれぞれ角度が切り替わるたびにはじけます。

時計の枠をあしらっているのは交差弾。
他にも扇状弾とか趣向凝らそうと思ったんですが、くどくなるのでやめました。
残念ながら避け要素はありません。


ついでなのでスクリーンセーバーも作ってみました。
ディスプレイ解像度によって秒針の長さが激しく変わってしまいますがご愛嬌。


[追記]
ブログパーツも作りました
弾幕時計ブログパーツ
弾幕時計ブログパーツ改良

2007年10月02日

あーだこーだ考えるよりライブコーディング

こんなのエントリにする意味があるかどうかよく分からないのですが、先日のActionScript的超絶技巧発表会でライブコーディングもどきをやりました。

実はメンバーが全員揃ってさあ始めようというところで「順番どうする?」なんて単純かつ深刻な問題が発生したのですが、さすがに超絶技巧と謳ってるだけあるのか発表する順番によってかなりプレッシャーが生じるわけです。

そんなわけで思いつきで
「じゃあ、順番決めるactionscriptこの場で書こうぜ」
なんて言ってみたわけですが、言いだしっぺなのでとりあえず速度重視でas1で書いて、そのままそれで順番決める羽目になりましたwww

半ば飛び入り参加だった muraken さんがトップバッターを名乗り出たので、残り7人の順番をプログラムに決めさせた結果 swfassist なんていうとんでもない発表が2番目に来てしまい、自分も含め後に続く人たちみんな超絶プレッシャーだったと思いますwww
なんとなくごめんなさいorz


ちなみにその時書いたコードは以下に(さすがに2分とかからなかった気がする)
無意味にprototypeメソッド定義してるのは日頃のクセでございます。

arr = ["nitoyon", "zk33", "tera", "fladdict", "munegon", "beinteractive", "saqoosha"];

Array.prototype.shuffle = function(){
var len = this.length;
var n;
var temp;

for ( var i = 0; i < len; ++i ) {
n = i + random( len - i );
temp = this[ n ];
this[ n ] = this[ i ];
this[ i ] = temp;
}
}

arr.shuffle();
arr.unshift("muraken");
trace( arr.join("\n") );

2007年10月01日

ドキッ!変態だらけのActionScript的超絶技巧発表会

超絶技巧+発表必須というシビアな参加条件の「ActionScript的超絶技巧発表会」に参加してきました。
どんな感じだったのかはてっく煮ブログのエントリにまとめられているので、そちらをご覧ください。

まーみんな変態というか「こんなのにまじになっちゃってどーすんの」と言わんばかりのハックぶりでポカーンとしたりさせたり発表してる自分まで危うくポカーンとしかねない勉強会でしたが、何よりも刺激受けまくりでこれだからやめられないぜ!と再確認。

で、何を発表したかというと以前公開したフィールドマップジェネレータでさりげなく使っているアルゴリズムの説明。
ピクセル走査を一切行わず、画像処理だけで全部やっちゃうという無茶っぷりを晒してみましたが、あの説明と資料でその場で理解できた人がどれくらいいたのか正直気になるところ。


発表資料をそのまま公開しても全く理解できないこと請け合いなので、口頭で説明した部分を追記しました。

発表資料
(左右カーソルキーでページ送り)

ソースはもうしばらくお待ちください。
分からないところがあったらコメントやTwitterでどしどし受け付けます。

2007年09月13日

JSFLで塗りの回転ができない問題が若干解決

Flash のグラデーション拡張機能 GradationAssist をアップデート。
塗りの回転が数値指定できるようになりました。

GradationAssist

JSFLからは塗りの変形が反映されない仕様はどうしようもなかったので、塗られるシェイプの方を逆回転させて塗り直して元に戻すという逆転の発想ですw
シェイプの形によっては塗りがおかしくなるかもしれませんが、どこまで対応できるか分からないので自己責任でお使いください。
残念ながら、放射状グラデーションには対応していません。

詳しくはインスコ時に出てくるソースをご参照あれ。


関連エントリ:グラデーション拡張機能作ったよ

2007年08月24日

SCRAP AND BUILD

今まで作ってきた小ネタとかMXPとかそろそろアーカイブとしてまとめないと、エントリに分散されてる状況が激しくもったいないというか、やっぱこれがブログの弱点だよなあとしみじみ。
近い内に一覧化できるページを作ろうと考えています。

それに先駆けて、今から2年ほど前に書いていたブログで公開していた作品も一旦引き上げるか何かしてまとめたいと思います。
ブログ自体はもう更新はしないとは思いますが、せっかくFLASHでバカなことやってるのでこのままにするか移植するか考え中。

廃墟ブログ:二匹狼の遠吠え


当時の作品をまざまざと見返してみて、かまいたちの夜カメラなんかは ustream で使えたらめちゃくちゃ面白そうなんだけど送信前に弄れないからアウトー
一度処理してブラウザに表示されたものを別カメラで写すのもなんだかなあ。
でもせっかくだから今度やってみようっと。

DOTS EDITORは今となっては微妙なツールに成り下がり。
ピンの種類がたくさん出てるせいで、押さえようにもパレットがものすごいことになりそう。
なんとなく種類が少なかった頃の方が活気があった気がするのは、制限された環境の中でこそ真価を発揮する日本人の特性かもしれない。

びっくりしたのがIPドット絵共有キャンバスがまだ稼動してること。
これって月の初めにキャンバス初期化してるんだけど、ログ見てたら2年間に渡って地味に使われてる!
もったいないことした!
これ使ってなにかやろう!

 
 
よくよく考えたら mixi にしか書いてなかったんですが、先日退職&独立しました。
5年間ただがむしゃらにモノを作っていたら会社とともに成長していた、というと変な言い方ですがほんと他の会社にいたら到底できないような貴重な経験が今の自分を支えていることを思うと感謝しても足りないくらいです。

そんなわけでこれからの出会いをひとつひとつ大切にしていきたいと思います。
Twitterではいろんな人とやりとりはしているものの実際にまだ会ったことのない人が多くて、勉強会などでは刺激の嵐。
自分は誰かに刺激を与えることができているのかな、なんて思ったり思わなかったり。
とにかく、いろんな人のところへ遊びに行ってみたい。


それから一緒にFLASHゲーム作ってみたいなんて人がいたら是非声をかけていただければと。
マルチユーザゲームならなおよし。
ベタな対戦ゲームもいいけど、場がカオスになるようなものの方が好みです!

なんかgdgdなのでここらで締め。

2007年08月21日

シンボルをボタン一発で環状に整列する

先日公開した整列拡張MXP「AlignAssist」に、選択したシンボル群を一発で環状(円形)に整列する機能を追加しました。
残念ながら FlashCS3 対応です。
ナウローディングのアニメシンボル作成などに使えるんじゃないでしょうか。

AlignAssist


整列の中心座標と半径、オフセット角度を指定できます。
アンドゥ時に変形点がズレる現象が起こりますが、きっとJSFLの仕様。。。


たとえばこれが

ボタン一発でこうなります

回転もつけられます

2007年08月16日

フィルタ拡張機能 TraceFilter を作ってみた

FlashのIDEで設定したフィルタを ActionScript で処理したくなった時に、わざわざパラメータを確認しながらコードを書くのが煩わしいので、ボタン一発でコードを生成する拡張を作りました。

TraceFilter

Flash8対応です。
デフォルト引数によって記述が省略するかどうかを選択可能にしてあります。

なお、カラー調整フィルタ(ColorMatrixFilter)については自前計算のため、フィルタに渡す matrix の値が誤差の範囲内ですが若干ズレます。


そして驚愕の事実。
コントラストのスライダーの値と matrix の値の相関がひどすぎる。
正と負で全く違う上、折れ線グラフかいてみたらガタガタグラフw
しょうがないので -100 から 100 までのコントラスト値に応じた matrix のパラメータを全てハードコーディングしましたw
というか、パブリッシュ時にどういう処理してるんだこれは・・・


グラデーション拡張でもパラメータの出力機能をおまけで付けてみましたが、他にもシンボルの変形マトリックスなど ActionScript として出力できたら便利そうなものがまだまだあるので、そのうち出力系としてひとつにまとめてみたいと思います。

2007年08月13日

FlashCS3のPNG書き出しバグ?

こないだ出くわしたバグっぽい現象。
自分だけの現象なのか FlashCS3 のバグなのかよく分からず、他の人にも検証してもらいたいので手順を書き下してみます。


まず、FlashCS3 に PNG な画像ファイルを読み込み、そのままステージに配置します。
なんだかこの時点で不自然に画像が拡大されている気がするので情報&変形パネルを見てみると、100%と表示されているにも関わらず縦横サイズが大きくなっています。
ライブラリから画像のプロパティを見ると何故か正しいサイズ情報が表示されていますが、仕方がないので元のサイズに縮小して配置しました(仮に75%とします)

書き出してみると、ステージに配置したサイズで表示されました。
これなら別段、問題はないようです。

一応他のファイルでも再現性があるか調べていたら、特に何も起こらないファイルがあったり、逆に縮小されてしまうファイルもあったり。
条件が全く分かりません。

 
ところでここからが本題。
サイズがおかしくなった画像をスクリプトから弄ってみたいなと思い、クラスを割り当てることにしました。
基本クラスは flash.display.BitmapData でクラスは適当に Hoge とか付けてみましたが、asファイルを用意していないので定義がSWF書き出し時に自動生成されますとか言われました。
問題ないのでそのようにしておきます。

そうこうしてる内に画像を弄るスクリプトができたので書き出してみました。
・・・あれぇー?
ステージに配置していた画像が縮んでないかい?
計算してみたら、プロパティに表示されていた正しいサイズの75%になってるよ。

意味不明に拡大されてたから縮小したのに、クラス割り当てたらそれが解消されて縮小だけしっかり残ってやがんの。
それはないわー

2007年08月05日

整列拡張機能 AlignAssist を作ってみた

Flashで作業していて、整列パネルで並べなおす時に数値指定できたらいいなと思ったので勢いで作ってみた。

AlignAssist

FlashMX2004対応、使用方法は見たままです。
入力した数値に従って分布整列やスペース整列が可能となります。

ひとつ気になるのがJSFLによるシンボルの再配置や選択といった処理は1回につき1命令としてカウントされてしまうため、アンドゥ1発で元の状態に戻せないところです。
JSFLで行った処理をひとつひとつさかのぼってしまうのは今のところ避けられないので、試行錯誤するにはちょっと向いていないのかも。

2007年08月01日

LoadVarsとデータフォーマット

FlashでLoadVars+json.asを使ってJSONを読む時の注意を読んで、補足というか自分なりのまとめを書いておきたいと思います。

Flash で csv 読もうとして一度はぶち当たる壁なんですが、自前でパースが必要なデータを読み込む場合は必ず onData で処理する必要があります。
これって LoadVars に限らず XML でも同じで、自前でパースしたければ XML.onData で処理しなきゃなりません。
ただしそうすると onLoad が呼ばれなくなるので、onData の末尾で this.load( true ); と呼んであげます。

「あれ、本来 onLoad でやってた処理を onData に書けばいいんじゃないの?」

と思う人もいるかもしれませんが、onLoad を残しておくとパースに失敗した時に this.load( false ); を呼べばエラー処理を任せられるので、エラーチェックが多岐に渡る場合も想定して常日頃からそうしておいた方が無難です。

 
ところで as3 では URLLoader.dataFormat プロパティを用いて読み込んだデータの制御方法を指定できます。
指定できるのは以下の3種類

 URLLoaderDataFormat.TEXT : テキストとして
 URLLoaderDataFormat.BINARY : 生のバイナリデータとして
 URLLoaderDataFormat.VARIABLES : URLエンコードされた変数として

デフォルトでは URLLoaderDataFormat.TEXT が指定されているので、onData で処理するのと同じ状況になります。
as3に移行したばかりの人は逆にここでつまづきやすいので要注意です。
自動的にパースされた状態で受け取りたいなら、いちいち URLLoaderDataFormat.VARIABLES を指定しなきゃいけませんが、面倒なので TextLoader、BinaryLoader、VarsLoader といった拡張クラスを作ってしまうのもありです。

 
もうひとつ注意点として、CGIから返ってきたデータが「&a=1&b=2」といった感じで先頭に&がついていても LoadVars の自動パースでは無視してくれたんですが、URLLoader だと実行時エラーで怒られます。

 print("&a=%d", $a );
 print("&b=%d", $b );

みたいな感じで出力を列挙しちゃってると陥りやすい罠。

 
as3の汎用クラスとか裏技的なTipsも嬉しいけど、何よりもこういったエラーケースを共有しあうのが一番いいんじゃないかなと思い始めてきました。

2007年07月31日

グラデーション拡張機能作ったよ

グラデーションを等間隔にしたい時、マウスだとまず無理というかそんな微調整は誰もやりたくない&やらなくてもいいけどなんだか気になるっていうのがあるので、それならボタン一発で等間隔に配置できるような拡張を作ればいいじゃないかという流れで作りました。
特にコーダーな人にはうってつけなのでは。

GradationAssist

何気にFlashMX2004対応です。
機能は以下の3つ
・均等配置
・反転
・beginGradientFill に必要なグラデーション情報の出力(一部のみ)

どういうわけか、ステージに配置しているグラデーションなシェイプを選択状態にしないと機能しません。
それとできればグラデーションの変形(特に回転)を数値入力できるようにしたかったのですが、何故かJSFLからは塗りの変形が反映されないバグという名の仕様があるようで断念しました。

他にもこんな機能が欲しいっていうのがあればドシドシお寄せください。

2007年07月25日

ライフゲームシミュレータ

ライフゲームシミュレータ「LIFE SIMULATOR」を公開しました。

LIFE SIMULATOR


設定可能なルールは以下の3通りです

1: 確率に従って周囲8セルのどれかの状態をコピーする
2: 一般的なセル・オートマトンのルールに従った状態遷移、初期値は23/3
3: 周囲8セルが特定の状態の時に変化する(あまり影響がないかも)

各ルールはリアルタイムにON/OFF可能で、かつ適用順を入れ替えることができます。
組み合わせ方が絶妙なので最初の内はあっという間に全滅しますが、そんな時はRANDOMボタンでガンガン再生成してください。


ルールの一部はRANDOMAPからの使いまわしですが、組み合わせ次第で想像以上の変化が見られそうなのでルール制御を逆輸入しても面白そう。

pixelDissolveのバグ?

BitmapData.pixelDissolve を変な使い方しようと弄り倒している時に気づいたんですが、randomSeed や numOfPixels の値とは無関係に必ず左上のピクセル(sourceRectで指定した矩形の左上ポイント)が変化するという妙な現象が必ず起こります。

たとえば、10個のピクセルをディゾルブさせるように設定すると、左上のピクセル+残りのピクセルの中から10個の計11個のピクセルがディゾルブします。
n個指定だとn+1個のピクセルが変化。
0個指定だと、左上のピクセルのみが変化。


せっかくなので毎フレーム適当な色でディゾルブするようなサンプルを作ってみました。
左上のピクセルが見事にチカチカします。


これって明らかに仕様と違うのですがバグなんですかね?
ちなみに当方の FlashPlayer のバージョンは 9.0.60.120 です。
どうも最近のバージョンで起こってる気がしないでもない・・・

2007年07月24日

FlashCS3拡張 EachTransformer バージョンアップ

複数シンボルについて座標を固定したまま変形を適用する拡張機能 EachTransformer に、変形の基準点を中心点に設定する機能を追加しました。
パネルの右下にそれっぽいボタンを置いてあります。

ダウンロード

と、これだけじゃ意味が分かりづらいのですが要するにシンボルを選択したときに出てくる基準点マーク ○ をダブルクリックした時と同じ処理をボタン一発で、かつ選択中のシンボル全てに対して行う機能です。
地味ですがかなり役に立つ、と思います。

残念ながら拡張機能の仕様上 FlashCS3 限定。


[追記]
mxp生成時にエラーがあったのか、バグverをそのままアップしてたようです。
先ほどリリースverをアップしなおしたので、すでにダウンロードしてしまってた人は再度ダウンロードしてください。

2007年07月19日

弾幕スクリーンセーバー公開

弾幕ギャラリーに投稿されたデータをランダムに再生するスクリーンセーバーを公開しました。
ベースはas3で作ってるとはいえFlashなのであまり大量の弾を表示するとさすがに重くなります。


ダウンロードは弾幕ギャラリーのページ右下のボタンからどぞー


タイミング的に voo-doo-dolls に触発されたっぽい感じですが、普通に開発verを見せ合いながらどっちが公開早いか牽制しあってた気がしないでもなく。
食中毒で動けなくなってる間に先越されましたorz

この手の投稿型サービスはコツコツやっていくしかないんだけれど、それにしても公開してからまだほとんど投稿がないので、これで少しでも弾みがつけばいいなあ。

2007年07月15日

弾幕ギャラリーの今後について

弾幕ギャラリーの敷居が高さが改めて浮き彫りになったので、今後の改良+更新予定を書いておこうと思います。
書いておくことで多少モチベーションの維持につながることを願って。


1. 投稿データをランダムに再生するスクリーンセーバーを公開

これ実はほとんど完成してたりで、後はごくまれに起こるバグをつぶす段階。
キリがないかもしれないので数日中に公開予定。


2. パーマリンク導入

はてブコメントで要望があったので。
微妙に悩んでるのが、飛んできた時にどのページを見せるのか。
今はエディタ経由しないとプレビューできない・・・とはいえ、いきなりプレビューだとほんとに見るだけになってしまう・・・


3. 初心者向けの弾幕エディタを用意

弾幕エディタが事実上のBulletMLエディタになっているので、それはあくまで上級者向けと位置づけして新たに初心者向けの弾幕エディタを作ります。
今のところ考えているアイデアは以下の通り。

・【1秒後に】【全方向に】【30個弾を撃つ】といった感じの命令パーツ組み立てオモチャ
・命令パーツにはそれぞれジグソーパズルのように凹凸をつけてドラッグで自由自在に
・構造を意識せずに日本語だけで分かるようなものにする
・最終的にBulletMLに変換する
・BulletMLから命令パーツへの変換は複雑になるので余裕があったら


あーこれ、開発ブログを別にもった方がいいのかなあ。

2007年07月14日

地上マップの自動生成をFlashで作ってみた

地上マップの自動生成@ダンジョン自動生成スレを読んで、いてもたってもいられなくなってFlashに移植してみました。

といってもそのままじゃただのパクりなのでアレンジを加え、マップチップそのものがウネウネ動く見た目勝負で。

RANDOMAP


あまりでかいと重くなるので、64x64でやってます。
同じ理由で海岸線も入れてません。
そこまでできたらちょっと楽しそう。


ちなみに中身は結構えぐいことやってます。
これでもas1で書いてたり。
GPGPUもどきバンザイ。


[追記]
64x64から128x128に拡張し、海岸線も入れました。
思ったより軽くなりましたが、それでもやはりマシンスペックによっては相当重くなります。

それと IE の最新 FlashPlayer では画像処理の過程において何故か一部挙動が怪しくなっていますが、どうもプレイヤーのバグっぽいので Firefox 推奨としておきます。

[さらに追記]
軽量化のテクニックについて、ActionScript的超絶技巧発表会で発表しました。

2007年07月11日

GUIはユーザビリティが命

弾幕ギャラリーのブラッシュアップ。


公開直後に、同じデータの重複投稿を防ぐためのチェック機能を慌ててつけてみたらそれがセキュリティサンドボックスエラーを併発して、丸一日投稿できない状態が続いてたっぽい。
めちゃくちゃアホだorz
逃がしたユーザの数はどんだけー


気を取り直して、全方向弾と扇状弾を発射する行動を一発でセットするボタンをつけてみた。
これだけでずいぶん作りやすくなったように思う。
あとはひたすらボタンの追加だなあ。


それからギャラリーからGUIに飛んで、もう一度ギャラリーに戻ってきた時にページを保持するようにした。
こういう小さな修正が後々効いてくるのは重々承知なので、やれるところからガッツリ手をつけていこうと思う。


あとはギャラリーからいきなりプレビューできるようにしたいところ。
でもそうするとどうやってGUIに飛ばせるか悩みどころ。
写真クリックしたら一度拡大させるかなあ。

それと近々、今まで作った作品を一箇所にまとめてみようと思う。
昔のサイトとか一度閉鎖したサイトとか、作品散らばりすぎ。

2007年07月09日

弾幕をシューティングしようぜ

なんだかそろそろ表に出してしまわないと踏ん切りがつかないというか、いつまでたっても開発中になってしまうので公開してしまいます。
ヘルプも何もないけれど、後は野となれ山となれ。

弾幕ギャラリー


ギャラリーとは名ばかりで、その実はエディタです。
エディタ大好き。
GUI作るの楽しい。


弾幕データはBulletMLで定義しています。
実はずっと前にシミュレータとして作ったものの焼き直しだったり。
もっと誰でも簡単に使えるようなオモチャ風味にしてみたいところです。


無限ループなど不正データを除外するため投稿時に一度プレビューする仕組みをとっていますが、プレビュー中に弾幕を撮影することができます。
そんでもって、ここで撮影した画像がギャラリーに並びます。
これがほんとの弾幕シューティング、なんちゃって。


何気に一番苦労したのはギャラリーの写真の並び替えかもしれない。
リキッドレイアウトばんざい。
こんなところで使わずに、新しくとったドメインのTOPに採用すればよかったかもと微妙に後悔。


ちなみにプレビュー用のFlashだけActionScript3.0で記述しました。
でも計算速度よりも描画速度がネックなのは相変わらず。


[07/10 23:55 追記]
セキュリティサンドボックスに引っかかって投稿できない状態でした・・・今ものすごい勢いで後悔orz
修正したのでバンバン移植とかオリジナルとかばっちこーい!

2007年07月05日

EachTransformer公開

Flashの変形パネルで複数のシンボルをまとめて変形しようとすると、グループとして扱うのか妙な変形をして全く使えなかったので、ひとつひとつ処理できるような拡張機能を作りました。
具体的には各シンボルの座標を固定したまま変形を適用できるようになります。

ダウンロードはこちら

ただし、今のところFlashCS3対応です。
傾きや回転を直接変更できるプロパティがFlash8以前ではなかったので後回しにしましたが、普通に需要がありそうなのでFlash8でも動くように作り直す予定。

たとえば複数シンボルを選択した状態で縦横比 150.0%, 50.0% &傾斜 20.0°, 40.0°で変形をかけてみると

これが

こうなります


使用方法などは Extension Manager の説明欄に書いてあります。
特に難しくないので、是非使ってみてバグレポートをばw

2007年06月27日

自動宣言と手動宣言のコンフリクト

バッドノウハウ気味ですが誰も書いてないようなので、後続の人たちのためにもそろそろ書いておきます。


FlashCS3でスクリプトを外部asで書く人は必ずステージのインスタンスを自動宣言のチェックを外しましょう。
このチェックはパブリッシュ設定のActionScript3.0設定のところにあります。


オーサリングツール上でテキストやムービークリップを配置しておくとスクリプトで addChild する必要がなくなりますが、それ以外に何らかの制御をas側で行うには必ず宣言しておく必要があります。
ですが、上記のチェックを外し忘れているとas側で宣言しているにも関わらずFlashCS3側で勝手にフレームに宣言文を挿入するようで、コンフリクトが発生してコンパイルエラーから抜けられません。


これってどこにも説明がないので微妙にスクリプトかじり始めた人にはかなり危険な罠っぽい。

2007年06月21日

Adobe EDGE

Adobe EDGE ニュースレターにインタビュー記事が掲載されました。
写真は掲載されていませんが、開発担当として技術的なコメントをさせていただきました。


もともとショーケースに載るという話は聞いてたんですが、EDGE の方にも掲載されるということを失念したまま、Twitter でむらけんさんが Apoll(AIR) についてのコメント募集をしているのに乗っかってしまい、会社名義での本名とブログ名義でのハンドル名が両方 EDGE に載るという珍妙なことになりましたとさ。。。


コメントを寄せた Apollo(AIR) についての記事はこちらです。


すごいクサいこと言っちゃってますが、実際問題として世の中のデスクトップアプリ開発者に比べて WEB クリエイターのアドバンテージは魅せる演出力だと思っているので、それをどこまで発揮できるかが勝負どころではないかと思います。
ただ高機能なアプリを作るだけならやはりまだまだCやJavaの開発者に一日の長があるので、同じものを作るにしてもより多くのユーザに「使ってみたい」と思わせるだけのインパクトを与えられるアプリを作っていきたいですね。

そのためにはまず何ができるかを知っていく必要があるので、気がついたことがあったらブログにまとめていきたいと思います。

2007年05月11日

知識が欲しいのは何か作りたいからだよね?

結論から先に述べるとクリエイターはモノ作ってなんぼなので、作りたいモノのカテゴリごとに Tips を集積・共有する仕組みを用意してはどうかなという提案。


きっかけは、にとよんさんがまとめてくれた すごく楽しかった Flash 談義のログをまとめてみたよ のFlash談義です。
ちなみに一番盛り上がってる時にちょうど帰宅中で携帯からの参加だったため、あまり突っ込んだ発言ができずにすごく悔しい思いをしましたw


あれからいくらか動きがあったようで、Flashな国内ブログへのリンク集積だとか @fla の RSS な Pipes だとか、早速ノウハウ共有の第一歩といったところですが、ひとつ危惧しているのが集めたきりになってしまうこと。


ノウハウや知識はあくまでモノ作りのためということですね。
実際のモノ作りの現場を顧みると、Webに散らばっているノウハウは見たその場で使い物になったためしがほとんどなく、なんとなく必要に迫られた時には何処に書かれていたか思い出せずに慌ててググって探したりタグから参照するということがよくありました。
また、配布されているクラスライブラリについてもいきなり案件に組み込むものではなく、本当に使えるものなのか検討に検討を重ねた上で使ったり、一部だけが使えるのであればその部分だけ自作してしまうことが多々あります。


ということで最初に戻りますが、たとえば Flash でシューティングゲームを制作する際にはあのエントリの知識が必須であのエントリは見て置いて損はない、YouTubeクライアントを制作する際にはあのエントリとあのエントリが役に立つ、といった各製作過程における Tips を共有していけばビギナーからマニアまで幅広く役に立つと思うのですがどうでしょう?

やれることが多くなった分、必要な時に必要な知識だけを確実に取り出せないとひたすら時間に追われてしまいます。
みんな同じところで詰まったなんていう状況もよくあり、困って検索したらずっと前に同じところで詰まって書いた自分のブログが引っかかったなんていう笑い話も見たことがありましたw
タグで管理しようと思えばできることですが、必要な知識をブクマしてるとは限らない上にジャンルが多岐に渡るので、wikiなり使って一元管理したほうがよさそうです。


後で使えるかもしれないというより、後で使いたいという精神で。

2007年05月01日

drawする時はマスクにご用心

さっき悩まされた見つけたバグについて、情報共有のために紹介。
MovieClip.setMaskによってマスクされたシンボルをBitmapData.drawすると、マスクの位置がなぜかグローバル座標基準になった状態でマスクされたビットマップができあがり。

以下、図解(青:マスク、赤:シンボル、100x100のビットマップにシンボルをdraw)





左から順に、配置・理想・現実です。
シンボルは全て左上を原点合わせで、配置では円形マスクの相対座標を(0,0)、絶対座標を(20,20)としています。
理想ではくりぬかれた100x100のビットマップになるはずですが、実際には円形マスクが絶対座標にあるかのごとく振る舞います。

こんなの予想外。
最初as3のバグかと思っていたら、as1でもしっかり起こるし。
drawする場合はシンボル内部でマスクした方がよさそう。

2007年03月14日

デバイスフォントをアルファフェード

技術的にはちょっと古いネタなんですが、FlashPlayer8以降はデバイスフォントにアルファをかけることができます。
下記はそのサンプル、明度や着色によるフェードではないことを示すために背景に若干グラデーションかけています。








原理といっても、グラデーションマスクを応用しただけなんですけどね(--;
テキストをムービークリップで包んで、マスクもムービークリップにしておきます。
双方に cacheAsBitmap を有効。
そして setMask でマスクをかければグラデーションマスクの完成。
あとはマスクの方をアルファ操作すればデバイスフォントであろうがなんであろうが、マスクされたムービークリップ全体にアルファフェードがかかります。
ただし、cacheAsBitmap による再描画負荷がどれくらいかかるのかは度外視してるので多用は禁物かも。

2006年09月17日

遅延制御の作用・副作用

せっかくなので setTimeout や setInterval についてもうひとつ。
以下のコードを実行すると、どうなるでしょうか。
function hoge( str ){
	trace( str + " called by " + arguments.caller );
}
function callhoge(){
	setTimeout( hoge, 1000, "hello");
}
this.callhoge();

arguments.caller は自身を呼んだ関数を参照するので、callhoge を参照してるんだなと思ったら大間違いで、callhoge は1秒後に hoge を呼ぶように setTimeout で遅延処理を登録しただけなんですよね。
実際に呼んでいるのは、どこの誰とも分からないシステム中枢。

もうひとつ、騙されやすいのが以下のコード。
function hoge( str ){
	trace( this + ": " + str );
}
setTimeout( this.hoge, 1000, "hello");

1秒後にメソッドを呼んでいるんだなと思いがちで、実際その通りなんだけどスコープが違います。
この場合、メソッド hoge 内での this の参照先は存在せず undefined になりますが、以下のような呼び出し方をすれば問題ありません。
setTimeout( this, "hoge", 1000, "hello");

これはおそらく1秒後に内部的に
this["hoge"].apply( this, "hello");

と呼んでいるのでしょう。


たとえば、呼び出される前にメソッド hoge の内容を書き換えるとどうなるかというと
setTimeout( this.hoge, 1000, "hello");
this.hoge = function(){
	trace("hoge");
}
--> 書き換え前の hoge() が実行される

setTimeout( this, "hoge", 1000, "hello");
this.hoge = function(){
	trace("hoge");
}
--> 書き換え後の hoge() が実行される

前者はメソッドの参照を直接渡しているので実行に至るまで全く影響を受けませんが、後者はあくまで実行時にメソッドを参照するので影響受けまくリング。
むしろメソッドを未定義なままで遅延登録しても、実行時までに定義すればいいというちょっと便利な仕様。

これらの挙動を何かに応用できないかと考えてみたけれど、明らかにバグの温床になるようなところなので何もしない方がいいでしょう。合掌。

2006年09月13日

遅延委譲のお話

仕事でActionScriptごりごり書いてる時にちょっと必要に迫られて試してみたら、当たり前のようで当たり前じゃない盲点みたいな仕様はっけーん。

Function.apply, Function.call と setTimeout, setInterval が同時に使えない!

ユーティリティなメソッドで特定のムービーを遅延制御したかったんですが、あえなく撃沈。
Function.apply もれっきとしたメソッドだし、返り値を見ても setTimeout による登録が失敗したということではなさそうなのだけれど、内部的にスコープ処理がずれるのか一切実行されません。
たとえば以下のコード

function hoge( str1, str2 ){
	trace( this + ": " + str1 + "," + str2 );
}
setTimeout( hoge.apply, 1000, this, ["Hello", "world"] );

setTimeout によって1秒後に

hoge.apply( this, ["Hello", "world"] );

が実行されることを期待してしまうのですが、上記の通り動きません。
このままでは埒が明かないので、上記のコードに加えてプロキシ委譲メソッドを用意します。

function proxyapply( func, target, args ){
	func.apply( target, args );
}
setTimeout( proxyapply, 1000, hoge, this, ["Hello", "world"] );

こうすると、1秒後に

proxyapply( hoge, this, ["Hello", "world"] );

が実行され、結果
hoge.apply( this, ["Hello", "world"] );

が実行されます。

こうして遅延制御がうまくいきました、めでたしめでたしー
つか、これバグ? 仕様? バグという名の仕様?

2006年09月12日

CHRONO VIEWER

ウェブカム映像の時空間を歪めましょなFlash作品 CHRONO VIEWER を公開しました。
ウェブカム必須です。
といっても元ネタがあります。

Flashじゃ到底重くて話にならないと思ってたけど、昨夜糸口を見つけてスクリプトごりごり。
連続した時間のビットマップを保持しつつ、さらにそれをマスクで重ねるとかだと高負荷でファンが唸り出しますが、それを BitmapData.scrollと数回の BitmapData.copyPixels、さらに DisplacementMapFilter で一発処理することで劇的に軽くなりました。
それでも結構重いんですけどね・・・

ウェブカムの前で変顔してみたり、グーチョキパーしてみたりしながら時空間の歪みをグリグリ味わってみてください。
以下、技術的なこと。

続きを読む "CHRONO VIEWER" »

2006年09月04日

げしゅたると

特に何か大きな意味があるわけではないのですが、ビットマップデータの習作Flashを公開しました。

げしゅたると

「ゲシュタルト」はwikipediaによると「全体性を持ったまとまりのある構造」という意味なのですが、こういう演出に適用できるかどうかは分かりません。
むしろ「ゲシュタルト崩壊」からでっちあげた作品です。
DRAW COMPLEXITYも「複雑系」という言葉から適当にでっちあげてたし。
あまり深く考えてません。

どちらかというと立ち上げっぱなしにしておいて、スクリーンセーバー代わりにどうぞーみたいな感じかなあ。
むしろスクリーンセーバーとしてリリースした方がよかった?
つか、ひらがなのタイトルってものすごく萌えゲーの匂いがする・・・なぜだ。

一見すごく重い処理してそうに見えますが、思ったより全然軽いと思います。

2006年08月21日

カルポエディタ完成

カルネージハートポータブルのチップ設計補助ツール「カルポエディタ」がようやく完成ー
といっても基本的な入力インタフェース部分のみで、投稿機能はまだこれから。
ひとまずβ版ということでリリースします。


PSPより便利であろう点
・数値を直接テキスト入力できる
・チップをドラッグ移動できる(SHIFTキー押しながらクリックで掴めます)
・拡大縮小機能(ホイールぐりぐり)

実装したかったけど保留した点
・範囲選択コピー&移動
・進行先も含めたチップのランダム配置
・マクロ登録
・サブプログラム領域(忘れていただけという)


Flashでデータファイル解析するのはさすがに無理があるのと、それをやるためには ActionScript3.0 で組まざるを得なくなるため断念しました。
対戦データを投稿するだけで設計図が展開できれば最強なんだけどなあ・・・CGIでやるとか?
それにしてもデータ構造さっぱりなので誰かエロい人教えてくださいw


機能改善要望・バグ報告その他あればコメント欄までお願いします。


ちなみに開発中に気付いたこと。
動作判断チップの動作状態「被弾」のチップ上表記「STUMBLE」のSと、カウンタ入力チップの入力データ「**のX座標」「**のY座標」「**のZ座標」のチップ上表記「XPOS」「YPOS」「ZPOS」のSだけ何故か角が丸い。
あと、ターゲット動作判断チップの動作状態「アンロック」のチップ上表記「UNLOCK」のUとCだけ何故か角が丸くない。
なにこの微妙な違い。

2006年08月09日

カルポエディタ

前のエントリで開発宣言したカルネージハートポータブルのプログラムチップ設計Flashですが、語呂も考えてカルポエディタという名前にしてみました。
まだ開発中ですが全てのチップのデザインが大方終わったので、ひとまずサンプルお披露目。


カルポエディタ開発途上版


まだろくに動かせませんが、操作まわりはドラッグが中心となります。
右上の全体図にある表示領域をドラッグすることで設計図をスクロールすることができます。
また、各チップの進行先やSTART位置もドラッグで変えることができます。
チップ自体もSHIFT押しながらドラッグで移動できるようにしていますが、進行先のバッティングなどバグが残ってる状態です。

残るは地獄のパラメータ入力画面・・・

2006年08月08日

カルポの設計を補助したい

カルネージハートポータブルがあまりに面白すぎて、設計図を簡単にユーザ同士で公開・意見交換できるツールがどうしても欲しくなってしまったのでFlashで作ってみた。

carpo.jpg

とかいいながら、実はまだ開発中なのだけども。
ランダム配置させてるだけで中身はかなりスカスカ。
チップの数があまりに多すぎるので、それぞれのデザインおよびパラメータ入力画面を全部用意するのがシャレになりません。

画面のスクロールだとか進行方向の切り替えだとか、そのあたりのベース部分はなんとか組みあがったので、あとはひたすら残りのチップ制作とチップ選択画面、パラメータ入力画面・・・まだ終わりが見えないよ;
最初に書いたように、最終的には設計図を投稿できるようにしてさらに改良案などのコメントを付けられるようにしたいところ。
需要はものすごいあるはずなので、開発が頓挫しないように見守ってください。
もう少しマシになったらサンプルを公開します。

2006年07月20日

ビットマップエフェクター

随分前から作ってあったのだけれど、ActionScript3.0の勉強にかまけて放置気味になっていたので公開します。
なお、結構な負荷がかかります。

BITMAP EFFECTOR

最初の制作動機が、映像入力にフィルタを多重にかけるサンプルをFlashIDE上で作るのが激しく面倒くさいから簡単に実験できるツールが欲しい、といった感じだったのでウェブカメラ推奨です。
ActionScript3.0ではビットマップデータを画像データ化することが可能になっているので、最終的には nexImage みたいなものを目指したいなと・・・
ものすごく時間かかりそうなので不可能に近いのですが、夢はでっかく。

続きを読む "ビットマップエフェクター" »

2006年07月13日

強制バージョンアップ

サーバを介してリアルタイム対戦ゲームをFLASHで構築する際になるべく組み込んでおくべき機能、それは強制バージョンアップです。
これは重大な不具合を発見した場合やゲームバランスを大幅に変更したくなった場合に、ログイン中のユーザが極端に有利(不利)になるのを避けるために必要なのですが、ただサーバ側から再起動しただけでは修正前のファイルのキャッシュをそのまま読み込む可能性があります。

これらを解決するために、Flashとサーバプログラムの双方にバージョン番号をハードコーディングしておき、ログイン時に比較することで古いバージョンのファイルでログインしているユーザを遮断できます。
もちろんただ遮断するわけではなく、新しいバージョンがリリースされていることを通知できるように特別なエラーコードを返すようにします。
こうすることで全ユーザが同じバージョンのファイルでログインできるようになるわけです。

THE DAY OF SAGITTARIUSについては、管理ツールから再起動可能な10人対戦版には仕込んであります。


ソケット通信型なら強制ログアウトさせることができるのですが、単純なCGI通信型だと定期的にバージョンチェック用のクエリを投げない限りは難しくなります。
サーバ負荷も考えなくてはならず、バージョンの違いにより致命的な問題が発生しない限りは厳密にチェックしないor全くチェックしないのが妥当でしょうか。

2006年07月02日

どうみても不便です

Flash9インスコしてActionScript3.0でゴリゴリ書いてみたんですが、Flex2と比べると開発環境があまりにも不便すぎて涙が出そうになりました。
Flashで描いたシンボルを使えるってことぐらいじゃないのか。

これまでと違って下手なスクリプトを書いてると実行時エラーが頻発するので、書いたそばからチェックしてくれるIDEの方が圧倒的に便利なんですよね。
こりゃやっぱりFlex2.0購入するしか!
それでも実行時エラーを出してしまうわけだけど。

ドツボにはまりかけたのが、removeChild でインスタンスを削除する時にイベントハンドラもちゃんと消しておかないといけないということ。
Event.ENTER_FRAME を消し忘れてたので、削除後のnull代入が連発したw
こういった後始末に対する意識とかが既存のActionScript職人の弱いところなんだろうなと痛感しました。
ということで、ActionScript3.0の勉強日記なんてのもありかもしれない。

2006年06月28日

FlashPlayer9リリース

ついにきました、FlashPlayer9正式版リリース!
ActionScript3.0対応ということでFlash職人の多くが挫折する可能性が高いのですが、なんとかしがみついていきたいところです。

開発者用に ActionScript3.0 で組めるFlash Professional 9 ActionScript 3.0 Previewも同時リリースされています。
基本機能は Flash8 のままですが、ひとまず先行して ActionScript3.0 で開発できるようになっています。

これまでの作品も移植すれば格段に処理が速くなるのは分かっているんだけど、ものすごく大変・・・
でもやりたいこといっぱーい。

2006年06月22日

部分が全体 全体が部分

ほんのりアートな作品を公開しました。
DRAW COMPLEXITY

テーマは複雑系?
右上のパレットに描いた図形がそのままパーツとなって、さらにそれに各グリッドの色が乗算された形で左側のスクリーンに描画されます。
これが「部分が全体」に相当。

さらにスクリーンをクリックすると、そのクリックしたグリッドの部分がパレットに転写されます。
そして同時に転写されたパレットがパーツとなって、左側のスクリーンに反映されます。
これが「全体が部分」に相当。
転写の処理上の問題なのか、ちょっと色がおかしくなることがありますが原因不明。

まあ、理屈なんてどうでもいいのでてきとーに楽しくお絵描きしませう。
とはいえ構造上、ものすごく汚い絵になりやすいのだけどもw
描いた絵をアップできても楽しそうですね。
そのうち用意します。

2006年06月17日

さりげない機能強化

スクリプターな人たちの間では FlashPlayer8 の新機能としてビットマップばかりに目が行きがちですが、実はこっそりと機能強化されているメソッドがあります。

Array.sortOn

これは配列の要素同士を比較してソートするのではなく、配列の要素が持つ特定のプロパティ同士を比較してソートするのですが、これを使う時って他のプロパティ同士も比較してほしいことが多々あります。
たとえば、値段でソートをしたけれど同じ値段の場合はさらにサイズでソートされていてほしいとか。
FlashPlayer7 ではプロパティを配列で渡せば多段階ソートできたのですが、一方を昇順で他方を降順なんて都合のいいソートはできませんでした。

プロパティ price と size を持つオブジェクトを要素に持つ配列 arr に対して値段(price)の昇順でソートし、さらに同じ値段の場合にはサイズ(size)の降順でソートしたい場合は

arr.sortOn( ["price", "size"], [ Array.NUMERIC, Array.NUMERIC | Array.DESCENDING ] );

となります。
つまり、ソート条件も配列で渡せるようになっていると。

ヘルプにもしっかり書いてあるわけで今さら感はありますが、言及している人がいなかったので実はあまり知られていないんじゃないかと思いエントリにしてみましたー
探せば他にもこういうのあるかもしれない?

2006年06月15日

cacheAsBitmapの呪い?

mc.cacheAsBitmap = false;
mc.clear();
mc.lineTo() などで色々カキカキ
mc.cacheAsBitmap = true;

これらを1フレーム内で実行すると、描画が一切反映されないことがある。
等間隔で直線を引こうとして、間隔によって描画されたりされなかったりした。

mc.cacheAsBitmap = false; の前に mc.clear(); を呼んでおくと何故か大丈夫。
cacheAsBitmap の切り替えにフレームまたげば大丈夫。
mc.cacheAsBitmap = false; を実行しなければ大丈夫。

ということで。cacheAsBitmap の処理が呪いをかけているんだと思われ。
環境依存なのかそうでないのかはまだ分からな-い。

2006年06月08日

サウンドのループ回数

swf のファイルフォーマットを調べている時に、サウンドループ設定の「ループ」がどういう制御になっているのかが気になって、書き出した swf をバイナリエディタでチェックしてみた。

ループ回数に相当するビット列は ff 7f で、これはリトルエンディアンなので 0x7fff つまり 32767 回ということになる。
あれ、無限ループじゃなかったのねw
1秒の効果音でも9時間くらいかかるから問題ないのだけれど、どうせなら上限の 65535 回に設定すればいいのに。

オーサリングソフト上でサウンドループ設定を「繰り返し」にしてループ回数を 32767 に設定したら、自動的に「ループ」に変わったw
なにこの中途半端な親切設計。

2006年06月02日

外部ドメインの画像

調べりゃすぐに分かることなんだけど、FlashPlayer9 からは
外部ドメインの画像ファイルでも BitmapData.draw することが可能に。

ただし、crossdomain.xml でアクセス許可出してやらなきゃならない。
アクセスが許可されていなかったり、crossdomain.xml 自体が置かれてない
ドメイン上の画像については読み込むことすらできないという魔の仕様。

これにより、Amazon の画像ファイルを読みにいく Flash は全滅。
なぜなら images の方には crossdomain.xml が置かれてないから。
こりゃ参った。


こんなに仕様が変わってるとは露知らず、わざわざ URLLoader からバイナリ形式で
画像を読み込んで ByteArray に渡して画像を FlashPlayer で再生成してから
ビットマップ化してやろうと企んでいたのに、いざファイルをアップしてみたら
読み込み時にセキュリティ警告が。
そんなこんなで調べている内に、上記のことが判明したという。
いろんな意味で涙が出そうになった。

2006年06月01日

始動

ついに始動。
flashの習作や実験作を紹介していくつもり。

トップページもflashにしてみたけど、作品が出揃うまではちょっと寂しいね。
数が増えてきたらスクリーンを動かしてみよう、重いけど。

サイト名は void element で、ハンドルの void からとってみました。
で、その blog が void element blog なんていうひねりも何もない名前なので
他にいい名前がないか考えています。
void blog だとなんか中身がなさそうだw