ボール増殖処理を組み込み。
[MOVE]と表示されている箇所の穴にボールが入ると画面内にボールが一つ追加されます。

実験として ボール増殖量には制限をかけておらず、一度ボールが増えると とてもにぎやかな画面になります。もはや何のゲームかわからないほどです。

また、今回より swf 表示倍率(100% or 200%)の設定をプレイヤーが任意に行えるようにしました。200% の表示倍率のものを ノート PC で確認してみたところ、表示がたいへんゆっくりしたものになってしまっていたからです。

■ 操作説明

swf 画面クリック後 以下のキーで操作を行います。

フリッパー操作 : 左右キー
画面振動 : 上キー
100%表示(画面動作が遅い方向け) : 1キー
200%表示 : 2キー

▽続きを読む

[ FLASH ] [ update ] 2012年01月30日 12:43 | コメント (4) | トラックバック

「ピンボールゲームの楽しさとは何たるか」を調査するために、無料で遊べるピンボールゲームを片っ端からプレイしてみました。結果 一番楽しめたのは、長いフリッパーで勢いよく次々とボールを弾きまくるピンボールゲームでした。ふんわり浮くボールが画面内で弾かれる様を長く眺めているよりも、自分で頻繁に弾いて操作するほうが遊んでいる感が強いのかもしれません。

というわけで今回のサンプルでは、ボール落下速度を上げフリッパーの長さを増加し、ゲームテンポの向上を行なってみました。

動作対象オブジェクトのすり抜け対策

ボール落下速度を上げてみると、ボールがフリッパーをすり抜けてしまうという問題が発生。
何か設定が足りないところはないか ネット上で「Box2D すり抜け」といった単語で調べてみたところ、以下の情報が見つかりました。

動作対象オブジェクト(b2Body)の b2BodyDef.bullet プロパティを true に設定すれば解決との事です。

bodyDef.bullet = true;

すり抜け対処のための衝突判定を continuous collision detection(CCD) と呼ぶ模様。Box2DFlash v2.1a 用のマニュアルではありませんが、以下の Box2D manual の Bullets の項目に説明がありました。

　Box2D v2.2.0 User Manual
　http://www.box2d.org/manual.html

ただし、この機能を利用すると負荷が増えるため、フレームレートが下がる原因となります。低スペックなPCほど影響がでてきます。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2012年01月16日 16:14 | コメント (0) | トラックバック

かぼちゃ風オブジェクト追加や得点表示拡大等、演出を少しずつ追加中。

▽続きを読む

[ FLASH ] [ update ] 2012年01月09日 19:00 | コメント (0) | トラックバック

団子一味のメインテーマをカジノ風にしてみた BGM に差し替えました。
その他、ゲーム画面内上部の扉を開けるとランプに火がつき、３つ全てのランプに火がつくと、得点が倍になるような処理を組み込んでいます。

また、今回より swf 画面を二倍に拡大して表示するようにしています。

▽続きを読む

[ FLASH ] [ update ] 2011年12月30日 18:46 | コメント (4) | トラックバック

少しずつ合間合間に手を加えています。
今回は「クリスマス風」になっているかどうかわかりませんが、それっぽい BGM (約 500KB)を作成し組み込んでみました。

　
　http://www.dango-itimi.com/blog/swf/147/preloader.swf

■ 操作説明

swf 画面クリック後 以下のキーで操作を行います。

フリッパー操作 : 左右キー
PAUSE : スペースキー
画面振動 : 上キー

[ FLASH ] [ update ] 2011年12月24日 17:32 | コメント (0) | トラックバック

Google App Engine(GAE)にて、以下の処理動作を行うサンプルアプリケーションを作成しました。

・swf 内データを Google アカウントを用いて GAE のデータストアに記録
・記録されたデータを元に Google アカウントユーザ毎の独自 URL の発行

サンプルアプリケーション URL
http://dango-itimi.appspot.com/crypto_test/

SCORE 欄 に最大 5桁の数値を入力し登録ボタンを押すと処理が開始します。使用しているブラウザで Google アカウントにログイン中の場合、GAE サーバ上に入力した数値が記録され、ログインしていない場合 ログインを促す画面が表示されます。

数値を登録した Google アカウントには アプリケーション上で ユニークID が割り振られ、http://dango-itimi.appspot.com/crypto_test/home/ユニークID/ という URL で、記録された数値を誰からも閲覧することができるようになります。

Google アカウント情報から取得可能な情報(ユーザID)はハッシュ化(暗号化)して利用しており、どの Google アカウントがこのサンプルアプリケーションを利用したのか等の情報は 管理人の私でもわからないようにしています。数値を登録するだけの大した内容ではありませんが、お気軽にご利用ください。

GAE と Google アカウント

GAE には Google アカウントと紐付けたアプリケーションの作成を比較的簡単に行うことができる仕組みがあります。何かユーザサービスを作成したい場合、GAE と Google アカウントを利用する事で、アプリケーション作成者はユーザのアカウント管理システムを作成する必要はなくなります。私のようなサーバ側の知識はほとんどない Flash 開発者にとっては、この仕組は非常に大きいです。アカウント管理は Google にまかせ、コンテンツ制作に力をそそぐことができます。

現在 Google アカウントを取得するには電話番号確認が必須となっています。(IP によっては電話番号は必須にならないケースもあるとの情報も見かけます)
Web サービスに Google アカウントを利用するメリットとして、ユーザの唯一性が保ちやすいという点が挙げられます。例えば何かの投票サービスを作成する場合、一人が多数のアカウントを利用してたくさんの投票を行う、という事態を避ける事ができます。
デメリットとしては、電話番号が必須のため アカウント作成にやや手間がかかるという点が挙げられます。サービスにログインしようとしたら、Google アカウントが必須な事がわかり、アカウントを取得するには電話番号が必須、となると「これはめんどうだ」という事で、ユーザを逃してしまう可能性がでてきます。簡単なゲーム等では、ログインはしなくても遊ぶことは可能で、スコア登録を行う場合のみログインが必要である、といった工夫が必要となりそうです。

暗号・難読化

Flash(swf) とサーバ(GAE)とで通信を行う箇所では、調査した以下の記事の内容を元に暗号化通信を行なっています。

・暗号化調査
・暗号化調査2 : as3crypto ←→ PyCrypto : DES, AES, RSA
・暗号化調査3 : Crypto.getCipher メソッドの利用 : DES, AES 修正版

また、secureSWF を導入し、swf の難読化を行なっています。(現在円高なので secureSWF は割とリーズナブルなお値段になっているかもしれません。)

python 側(PyCrypto)で RSA 暗号化したデータを as3 側(as3Crypto)で復号可能であれば もう少し安全な暗号化通信を行えそうなのですが、ここは残念なところです。

今回行なった通信内容のデータ改ざん対策の他、ゲーム等ではメモリ操作によるチート対策も必須となりそうです。

　参考 : Flashゲームのチート対策 | NJF
　http://njf.jp/?p=999

今後

複数の swf からでもデータ登録を可能にするシステムへ修正予定。汎用性をもたせたライブラリ化を図ります。

サーバ・ユーザアカウント管理問題や swf 解析問題により、今までは諦めてしまっていた事が多々ありました。「それを行うにはサーバ側を専門としている会社が必要」であったり「swf は解析されてしまうから、それを Flash で行うには避けたほうがよい」等々。
GAE の利用や、暗号・難読化により、これら問題は解決してきているのではないかと思います。

[ FLASH ] [ tips ] [ update ] 2011年12月02日 17:26 | コメント (0) | トラックバック

暗号化通信 並びに swf の暗号化についての調査を少しずつ開始。

暗号化通信

いくら暗号化通信を行おうとも swf 自体を解析されてしまえば意味が無い、といった認識がありました。ざっと調査した結果 その認識は変わらず。とはいえ暗号化しないと、誰でも簡単に不正なリクエストを行うことが可能となってしまうため、重要なデータを扱う swf では暗号化は必須となります。

swf は Google App Engine 上で動作させることを予定しており、AS3 ←→ Python 双方向に暗号化通信を可能にすることを第一の目標とします。

暗号化の方法を調べてみると、共通鍵暗号方式と公開鍵暗号方式、そして両者を組み合わせたハイブリッド暗号方式等が見つかります。以下はハイブリッド暗号方式に関しての参考 URL です。

　http://detail.chiebukuro.yahoo.co.jp/qa/question_detail/q1065429575
　http://itpro.nikkeibp.co.jp/article/COLUMN/20060620/241303/

共通鍵暗号化通信、公開鍵暗号化通信それぞれサンプルを制作した後、ハイブリッド暗号方式に挑戦してみようと思います。ハイブリッド式にするのは、上記 URL 内にあるような両者の利点をとるため、というのではなく、スクリプト難読化のため(不正なリクエストを送り難くするため)の対処といえます。

AS3, python 共に暗号化に関する情報は検索すると結構見つかります。MD5, RSA あたりがキーワードになるでしょうか。

Adobe のサイトでも少々解説がありました。

　より安全なSWF Webアプリケーションの作成
　http://www.adobe.com/jp/devnet/flashplayer/articles/secure_swf_apps_12.html

ただし、上記 URL の以下の文章は誤りではないでしょうか。

非対称暗号化方式を使用する場合は、SWFファイル内に公開鍵を格納しても、
脅威にさらされることはありません。

第三者がSWFファイルを逆コンパイルして鍵を盗んだとしても問題はありません。
攻撃者が不正な暗号化済みデータをサーバに送りつける可能性もありますが、
サーバ側で、暗号化が行われているかどうかにかかわらずデータの検証を行うよう対策を施していれば、
問題はありません。

サーバ側でデータの検証を行えばよい、とありますが、データを作る側のロジックは swf 内に存在するため、ロジックが解析されてしまえば不正なデータは作れてしまうような気がします。

swf 暗号化

まず、どれくらいの精度で解析可能なんだろうかと、世にある swf の解析ソフトを試用してみました。
swf バイナリ解析を勉強していた時、相当これはややこしいな、と感じていたため、解析ソフトも大した解析はできないのではないか？などと思っていましたが、いやはや実際に試用してみてびっくり。クラスパッケージ構造そのまま、ソースファイルの内容ほぼそのままに解析されました。あまりのそのままさに、ブーッと吹いてしまいました。暗号化通信対処を行なっても、その処理箇所がどうなっているのか知識のある人ならばすぐに見ることができてしまいます。

これは手詰まりか、と思いましたが、次に「swf 難読化ソフト」の試用を行って見ました。ソフト名は secureSWF です。試用してみた結果、解析ソフトで解析したとしてもソースファイルの内容は何が書かれているのか分からないような難読化が行われました。ディレクトリ構造やらクラス名やら何から何まで解析結果はめちゃめちゃな状態になり、これを解読するのは無理と言ってもいいような状況ではないでしょうか。

ただし、secureSWF によってクラス名等変更されているのが原因かどうか、外部 swf を読み込む箇所で動作が停止してしまう現象が発生しました。secureSWF の Identifiers Renaming タブに、クラス名や変数名等 rename 設定を任意に行うことができるような箇所があるので、その設定によってこの問題は解決するかもしれません。

secureSWF のデモダウンロードページを見てみると、FDT Plugin バージョンというものも用意されている模様。これはなんとか上記問題を解決し、導入を検討してみたいところです。

まとめ

暗号化通信並びに swf 暗号化、双方が問題なく可能になれば、サーバと swf とのデータのやりとりを行う処理にて、最低限の対策はとった と言うことができそうです。

[ FLASH ] [ tips ] [ update ] 2011年10月31日 16:23 | コメント (0) | トラックバック

過去制作していた素材データの組み込みが完了。
自力での物理演算処理組み込みにおいて難題だった「フリッパーがボールを跳ね返す動作」は、Box2DFlash によって見事なまでの跳ね返り具合を見せてくれるようになりました。

　http://www.dango-itimi.com/blog/swf/146/preloader.swf

画面クリック後、左右キーでフリッパーを操作することが可能です。スペースキーを押すと PAUSE となります。
また、ボールがどこか平坦な地で停止してしまった場合の対処として、上下キーで画面全体を揺らす事ができます。ボールがどこかに接地している場合のみ機能し、一度揺らしたら一定時間立たないと再度揺らすことはできません。

効果音はテストとしてフリッパーを操作した時のみ鳴るようにしています。また、現段階で得点はスロットがそろった時のみ入ります。

どのようにすれば Box2DFlash でピンボールゲームを作ることが可能かの調査は、今回のサンプル製作でほぼ完了しました。今後は、スロットのようなゲーム内イベントを少しずつ増やしていき、充実化を図りたいと思います。

[ FLASH ] [ update ] 2011年10月29日 13:36 | コメント (0) | トラックバック

過去 AS2 で製作し中途で止まっていたピンボールゲームを、Box2DFlash v2.1a にて動作させてみることに。

「Flash オーサリング環境上で製作したシェイプデータを Box2DFlash の物体として再現するライブラリ」の精錬化と、Box2D を用いてのゲームプログラミングの練習の意味も兼ねての制作となります。

過去製作したピンボールゲームの背景データと、Flash オーサリング上で背景用グラフィックスシンボルを配置したイメージは以下となります。

まだまだお粗末ですが Box2D debug モードでの動作は以下となります。

　http://www.dango-itimi.com/blog/swf/145/0/preloader.swf

画面クリック後、左右キーでフリッパーを操作することが可能です。ゲーム中スペースキーを押すと PAUSE となります。どこかくぼみにボールがはまるとゲームは停止してしまいます。

PAUSE 機能を実装してみて、Box2DFlash v2.1a では内部で何か独自のスレッドを持ってはいないことが確認できました。b2World.Step メソッドを実行することで 1フレーム分の処理が実行されるような内容になっているようです。

背景グラフィックスや、ボールとフリッパーのグラフィックスを合わせたものが以下となります。

　http://www.dango-itimi.com/blog/swf/145/1/preloader.swf

b2RevoluteJointDef 制限角度注意点

フリッパーの動作は b2RevoluteJointDef クラスのモーター機能を利用しています。

　参考サイト)
　http://flashjp.com/apiindex.php
　http://d.hatena.ne.jp/matsu4512/20090110/1231585208

b2RevoluteJointDef を利用してみた所、b2RevoluteJointDef.lowerAngle, b2RevoluteJointDef.upperAngle の値を設定したとしても、その値 丁度には停止してくれない、という点に気づきました。制限値に近い角度になっている状態で更に大きなチカラを加えたり モーターを回したりすると、一瞬大きく角度がはみ出てしまいます。よって、制限角度を超えたらそれ以上にチカラを加えたりモーターを回したりはしないようにするための制御を別途行うようにしています。

[ FLASH ] [ tips ] [ update ] 2011年10月13日 16:56 | コメント (0) | トラックバック

斜面を並行移動するプレイヤー(操作可能な箱)が、斜面を登り切った後 繋がる平面に対し、スムーズな平面並行移動に遷移するサンプルを作成しました。斜面を登り切るタイミングで Y軸方向の移動ピクセル量を調節し、平面から浮かないような処理を加えています。

　http://www.dango-itimi.com/blog/swf/144/preloader.swf

斜面を下り終えた後に繋がる平面への並行移動遷移処理は、今回の処理とは別となるため恐らく次回となります。

斜面を登り切った後 どうすれば平面並行移動にスムーズに遷移できるのか、胃袋が痛くなるまで悩みましたが、Box2D上におけるピクセル移動処理の方法が判明したため今回のサンプルを作成できました。

その他 悩ましかった点は、プレイヤー位置や移動量を決定する b2Body.SetPosition, b2Body.ApplyImpulse, b2Body.SetLinearVelocity メソッドがそれぞれ適用されるタイミングはいつなのか、プレイヤー位置操作後 プレイヤーが衝突している物質を取得できるタイミングはいつなのか、についてです。

結論としては、1フレーム内に 以下の順序で処理を行うことにより、問題は解決しています。

(1)プレイヤー移動
b2Body.SetPosition, b2Body.ApplyImpulse, b2Body.SetLinearVelocity 等を実行

(2)b2World.Step メソッド実行

(3)衝突物質の判定
b2World.GetContactList メソッドからの衝突物質データの取得

(4)衝突判定
プレイヤーが衝突している物質が何であるかを判定し、次のフレームでプレイヤーがどの行動を取るのかを設定

プレイヤー位置を設定するメソッド実行後、b2World.Step メソッドにより プレイヤーの位置が確定し、確定された位置から衝突物質が何であるのか判定できるようになる、といったところでしょうか。誤っていたらごめんなさい。

[ FLASH ] [ tips ] [ update ] 2011年08月18日 17:47 | コメント (0) | トラックバック

移動する物質を指定位置でぴったり停止させたい、という場合、任意で物質の移動速度を調節する必要があります。しかしどういう記述をすれば、ピクセル単位で物質を移動させることができるのか わからない状態でした。

検索してみたところ、丁度それらしき情報を発見。

　適当ブログ:物体を投げる処理(box2d c++)
　http://wt03.blog.fc2.com/blog-entry-42.html

上記サイトによると、以下の式から得られる値を b2Body.SerLinearVelocity に設定すればよいとのことです。

移動させたいピクセル数 * フレームレート / BOX2D_SCALE

例えば、フレームレート 30, BOX2D_SCALE の値を 10 として、横に 5 ピクセル移動させたい場合以下のような記述を行います。

var FRAME_RATE:uint = 30;
var BOX2D_SCALE:uint = 10;

body.SetLinearVelocity(new b2Vec2(5 * FRAME_RATE / BOX2D_SCALE, 0));

変数 body は操作したい物質の b2Body クラスインスタンスです。

上下左右キーで空中を 5 ピクセルずつ移動するだけのサンプル swf は以下となります。

　http://www.dango-itimi.com/blog/swf/143/preloader.swf

このサンプルでは前回の記事に記述した、操作対象となる物質に重力を無視する処理を組み込んでいます。

[ FLASH ] [ tips ] [ update ] 2011年08月17日 10:00 | コメント (0) | トラックバック

Box2D 上でプレイヤーに何か弾のようなものを撃たせたい場合に必要と思われる、「重力を無視して直進する物質」はどのようにすれば表現できるのかの調査を行ってみることに。

ネットで検索してみると以下のサイトに、重力を無視するにはどうすればよいかの説明がありました。(恐らくバージョンは Box2DFlash v2.0.2)

　Master of None
　http://d.hatena.ne.jp/o_healer/20080508

上記サイトでは、b2Math.MulFV というメソッドを用い、物質の質量と反対方向の重力数値を加工し、加工後取得可能な力を物質に加えているらしき事がわかります。

しかし v2.1a では b2Math クラスは無くなっており、v2.0.2 のリファレンスで b2Math.MulFV メソッドの項目を見てみるも何も説明がなく、MulFV メソッドによりどのような加工が行われるのかわからない状況です。

よって色々な方法を試し、なんとかそれっぽい動作になる形にしました。
重力を無視して物質を直進させるには以下の二行を毎フレーム呼び出す形となります。

body.SetLinearVelocity(new b2Vec2(x軸速度, y軸速度));
body.ApplyForce(new b2Vec2(0, body.GetMass() * -gravityY), body.GetPosition());

変数 body は直進させたい物質の b2Body クラスインスタンスとなります。
一行目 SetLinearVelocity は、今までの物質の速度を無視して、引数で指定した速度に強制的に変更します。二行目では重力を相殺しています。もっとスマートな方法はあるかもしれません。

物質を空中に留めたい場合は以下のように記述します。

body.SetLinearVelocity(new b2Vec2(0, 0));
body.ApplyForce(new b2Vec2(0, body.GetMass() * -gravityY), body.GetPosition());

今回作成したサンプルは以下のような記述を行い、弾が右方向に直進するようにしています。

body.SetLinearVelocity(new b2Vec2(10, 0));
body.ApplyForce(new b2Vec2(0, body.GetMass() * -gravityY), body.GetPosition());

サンプル swf は以下となります。スペースキーで弾が発射されます。(スペースキーを有効にするにはキーボード変換を半角英数モードにする必要があります)

　http://www.dango-itimi.com/blog/swf/142/preloader.swf

他参考にさせていただいたサイト

■ SetLinearVelocity 関連
http://www.haphands.com/sw_flash/tech/box2d/box2d_07.html

■ 衝突 する / しない のグループ分け関連
http://www40.atwiki.jp/spellbound/pages/647.html
http://hokori.net/2009/05/27/box2dflashas3_contact/

[ FLASH ] [ tips ] [ update ] 2011年08月07日 15:27 | コメント (0) | トラックバック

前回の記事「Box2DFlash v2.1a 調査2 : 斜面に対して平行に移動する箱」からの続きです。

二つの物質が衝突した際 得ることが可能な b2Manifold というクラスインスタンスがあります。b2Manifold クラスインスタンスのプロパティ値をどのように見れば「斜面に衝突したかどうか」「どの斜面に衝突したのか」を判別できるのかの調査を行いました。

調査用 サンプル swf

　http://www.dango-itimi.com/blog/swf/141/preloader.swf

上下左右キーで回転しない箱(以後プレイヤー)を操作する事ができます。斜面に接地時は、斜面に対して平行に移動します。
プレイヤーが背景オブジェクト(緑色の物質)に衝突すると、m_type と m_localPlaneNormal テキストフィールドに衝突時のデータが表示されます。

b2Manifold.m_type

まず、m_type プロパティの値に注目します。サンプルから以下のデータを得ることができます。

(1)
プレイヤーの上下左右の面が多角形(box or polygon)の背景オブジェクトにぶつかる
あるいはプレイヤーのどこかが円の背景オブジェクトにぶつかると
b2Manifold.m_type は 2 の値(b2Manifold.e_faceA) を返却する

(2)
プレイヤーの四隅が背景オブジェクトにぶつかると
b2Manifold.m_type は 4 の値(b2Manifold.e_faceB) を返却する

プレイヤーの角度は常に一定であり、プレイヤー上下左右の面が背景オブジェクトの斜面に衝突する事はありません。背景オブジェクト斜面に衝突するのはプレイヤーの四隅のみです。
よって、b2Manifold.m_type の値が 4 の時に、プレイヤーが斜面に衝突していることになります。

b2Manifold.m_localPlaneNormal

m_localPlaneNormal は「ローカル座標軸を元とした衝突面の単位法線ベクトル」といった意味でしょうか。b2Manifold.m_type プロパティと合わせて見ます。

(1)
m_type の値が 2 で プレイヤーが多角形(box or polygon)に衝突した場合
プレイヤー衝突面の単位法線ベクトルを返却する

(2)
m_type の値が 4 の場合
背景オブジェクトのローカル座標軸を元とした
背景オブジェクト衝突面の単位法線ベクトルを返却する

(3)
m_type の値が 2 で プレイヤーが円に衝突した場合は
今回の斜面衝突判定とは関係ないため説明略

ローカル座標軸を元としたデータの取得となるため、画面上に表示されている物質の角度がなんであれ、角度を 0 とした単位法線ベクトルが返却されます(多分)。box の角度が 15度、-30度の背景オブジェクトいずれも、上面にプレイヤーをぶつけると m_localPlaneNormal の値は (0, -1) となります。

これより今回のサンプルでは、以下の条件(a)～(c)いずれかの時 プレイヤーは斜面に衝突していることになります。

(a)
衝突した長方形(box)背景オブジェクトの角度が正で
m_localPlaneNormal の値が(-1, 0) または (0, -1)

(b)
衝突した長方形(box)背景オブジェクトの角度が負で
m_localPlaneNormal の値が(-1, 0) または (1, 0)

(c)
衝突した背景オブジェクトが多角形(polygon)で
m_localPlaneNormal の y 値が負

多角形(polygon)の角度が 0 ではない場合、斜面に衝突したかどうかの判定処理は複雑になりそうです。

参考)
Box2DFlash Documentation : b2Manifold
http://www.box2dflash.org/docs/2.1a/reference/Box2D/Collision/b2Manifold.html

Box2D 2.1a Tutorial – Part 4 (Collision Detection)
http://blog.allanbishop.com/box2d-2-1a-tutorial-–-part-4-collision-detection/

[ FLASH ] [ tips ] [ update ] 2011年08月05日 02:14 | コメント (0) | トラックバック

アクションゲームを作る場合に必要と思われる機能「斜面に対しての並行移動」は、Box2Dにて実現可能かどうかの調査を行ってみることに。

斜面に平行に移動するには、衝突した物資の斜面の角度が分かればよい事になります。

ネット上で調べてみると、物質衝突時得ることが可能な b2Manifold というクラスインスタンスがある、という情報が見つかります。しかし b2Manifold から得られる各値をどのように見れば、「衝突した斜面」と「斜面の角度」の判別を行うことが可能なのかの情報は見つかりませんでした。(特にv2.1aの日本語の情報は皆無)

よって あらゆる方向から物質をぶつけ、得られる数値から推測を行い、おそらくこうであろうと予測しつつ、なんとか形にする所まで進めました。

成果物は以下となります。画面クリック後、上下左右キーでプレイヤー(回転しない箱)を操作する事が可能です。

　http://www.dango-itimi.com/blog/swf/140/preloader.swf

通常はプレイヤーに対し上下左右キーでその方向に力が加わります。しかし長方形の固定物質の斜面にプレイヤーが接地(上から衝突)した場合のみ、左右キーはプレイヤーに対して 斜面に並行した力が加わるようにしています。
現在は多角形の斜面には対応しておらず、多角形に対応後、調査結果をまとめたものを記事にできればと思います。

[ FLASH ] [ tips ] [ update ] 2011年07月31日 19:30 | コメント (0) | トラックバック

世に公開されている物理エンジンライブラリを用いてのプログラミング法を学習すべく、Box2DFlash v2.1a を利用してみることに。

　Box2DFlash
　http://www.box2dflash.org/

Box2DFlash はバージョンごとに API が変化しているようで、最新の v2.1a に関しては以下のサイトが参考になります。

　Box2D 2.1a Tutorial - Part 1(英語)
　http://blog.allanbishop.com/box2d-2-1a-tutorial-part-1/

まずは Box2D の使用方法を学びつつ、Flash オーサリング環境上で制作したシェイプデータを、そのまま Box2DFlash の物体として再現するような処理を作成する事を第一目標としました。

成果物

以下のような 四角、丸、点(緑丸)の集合体、のムービークリップを Flash オーサリング上で用意します。

四角なら(box～)、丸なら(circle～)、多角形なら(polygon～)、といった具合にムービークリップ名には規則性を持たせ、ムービークリップ名称と形状・座標・角度に応じた Box2D の物質を生成するように処理を作ります。

例えば一番左上の紫色の四角形のムービークリップ名は box4_1_0_10 としており、数値の部分は以下の意味を持ちます。

　4 : id
　1 : 動作する物体であることを示す
　0 : 反発係数
　10 : 摩擦係数

反発係数と摩擦係数は処理内では 1/10 として計算されます。

処理作成後の再現結果は以下となります。

　http://www.dango-itimi.com/blog/swf/139/preloader.swf

ムービークリップの名称を変更すれば、ソースコードを変更する事なく各物体の振る舞いを変更する事が可能です。また、ムービークリップ群を配置しているクラスは dynamic に設定しており、ソースコードを変更する事なく、自由にムービークリップを追加・削除する事ができます。(dynamic なクラスはバグの温床ともなるため、使用の際は注意が必要)

以後の予定

反発係数や摩擦係数をムービークリップ名で設定できるようにはしましたが、その仕様は削除する事になるかもしれません。物体1から10までを同じ反発係数や摩擦係数にしたい、という場合、専用のクラスを用意し、そのクラスと結びつけるほうがよいからです。また、反発係数や摩擦係数以外の物体に設定可能なパラメータはまだまだたくさんあり、全てのパラメータをムービークリップ名で設定可能にする、というのは大変で現実的ではありません。

[ FLASH ] [ tips ] [ update ] 2011年07月25日 12:38 | コメント (0) | トラックバック

http://flaprinter.appspot.com/rpg_battle2/custom/

FLA.PRINTER フラプリ 第五弾 RPG BATTLE2 のカスタムモードを公開しました。
シンプルモードに対し色々と設定が可能になっております。お暇がありましたらどうぞご利用ください。

[ FLASH ] [ update ] 2011年07月17日 16:52 | コメント (0) | トラックバック

http://flaprinter.appspot.com/rpg_battle2/simple/

FLA.PRINTER フラプリ 第五弾 RPG BATTLE2 のシンプルモードを公開しました。
シンプルモードでは敵画像の差し替えを行うことが可能です。お暇がありましたらどうぞご利用ください。

仕様

・敵の画像サイズは最大で 幅 220px 高さ 115px

これより大きい表示サイズの画像を指定すると JPG 形式で縮小されます。

・JPG, PNG 以外の画像を指定すると JPG 形式に変換される

透過 GIF 画像は JPG に変換されてしまうため、透過 PNG で作成する事をお勧めします。

[ FLASH ] [ update ] 2011年07月15日 10:21 | コメント (0) | トラックバック

フラプリ第五弾、RPG BATTLE 2 のベースとなる swf を作成中。
以下よりサンプルをプレイできます。

▽続きを読む

[ FLASH ] [ update ] 2011年07月08日 10:48 | コメント (2) | トラックバック

キャラクターが出来上がるまでのラフ画

ゲーム画面

[ FLASH ] [ GRAPHIC ] [ update ] 2011年06月29日 11:06 | コメント (0) | トラックバック

http://flaprinter.appspot.com/shooter_cols/simple/
http://flaprinter.appspot.com/shooter_cols/custom/

FLA.PRINTER フラプリ 第四弾 縦シューティングゲームを公開しました。
内容は横シューティングをほぼそのまま縦バージョンにしただけとなります。
お暇がありましたらどうぞご利用ください。

[ FLASH ] [ update ] 2011年06月22日 00:00 | コメント (0) | トラックバック

http://flaprinter.appspot.com/rpg_battle1/custom/

FLA.PRINTER フラプリ 第三弾 RPG BATTLE1 のカスタムモードを公開しました。
シンプルモードに対し色々と設定が可能になっております。お暇がありましたらどうぞご利用ください。

サーバ側の処理や html, javascript の処理は、用意しておいたモジュールを組み合わせて作成しただけなので、ベースの swf が完成した後は公開までかなり早く済みました。一点、クッキーに日本語の文字列を保存しようとしたところ、python 独自?の Unicode の扱いが原因でエラーが発生し少々つまずくことに。対策法を別途記事にするかもしれません。

[ FLASH ] [ update ] 2011年05月29日 20:54 | コメント (2) | トラックバック

http://flaprinter.appspot.com/rpg_battle1/simple/

FLA.PRINTER フラプリ 第三弾 RPG BATTLE1 のシンプルモードを公開しました。
シンプルモードでは敵画像の差し替えを行うことが可能です。お暇がありましたらどうぞご利用ください。

仕様

・敵の画像サイズは最大で 幅 240px 高さ 115px

これより大きい表示サイズの画像を指定すると JPG 形式で縮小されます。

・JPG, PNG 以外の画像を指定すると JPG 形式に変換される

透過 GIF 画像は JPG に変換されてしまうため、透過 PNG で作成する事をお勧めします。

後日公開のカスタムモード 予定仕様

・敵画像は二枚まで指定可能
・背景画像設定可能
・プレイヤーや敵のパラメータ(HP, MP, 名前等)設定が可能
・デフォルトサウンド設定
・クリア後の URL 設定

[ FLASH ] [ update ] 2011年05月22日 14:04 | コメント (5) | トラックバック

フラプリ第三弾、RPG BATTLE のベースとなる swf の作成が概ね完了。
以下よりサンプルをプレイできます。

▽続きを読む

[ FLASH ] [ update ] 2011年05月20日 09:39 | コメント (0) | トラックバック

背景差し替えイメージ

敵表示イメージ

x2倍の敵表示イメージ

背景画像と表示サイズが合っていないため黒背景で

■ 予定事項

・敵画像は二枚まででアニメーション可に

・敵表示位置は自動的に画面中央になるようにするため
　縦位置調節を行う場合は透明ピクセルを設けてもらう？
　あるいは数値で指定できるようにする

・ドラクエタイプの他、FF タイプの戦闘画面も設定可能なモードも後に制作
　第五弾あたり

[ FLASH ] [ GRAPHIC ] [ update ] 2011年05月03日 14:12 | コメント (2) | トラックバック

http://flaprinter.appspot.com/shooter_rows/custom/

FLA.PRINTER フラプリ 第二弾 シューティングゲームのカスタムモードを公開しました。
カスタムモードでは敵機体画像、プレイヤー機体画像、背景画像、その他細かいパラメータ設定が可能です。どこか不具合等ありましたら、お気軽に申し付けください。

共通処理モジュール化

今回のカスタムモード制作に伴い、出来る限りの共通処理のモジュール化を実施。今後はFlash Lite 制作のみになるべく専念できるような形にしたつもりです。

モジュール化は頭を少々使いますが楽しい作業でもあります。
ただし、モジュールが出来上がった後はモジュールを組み立てるだけの作業が発生するため、モチベーションがどうも保ちにくい、という難点があります。

カスタムモード UI 変更

ブロック崩しのカスタムモード製作時 感じていましたが、テキストフィールドやラジオボタン等、画面上に input フォームがたくさん配置されていると、どうも乱雑で見た目がいまいちな感じがありました。

また、今回シューティングゲームでは結構多くの設定を行う事が可能なのですが、設定項目が多ければ多いほど input フォームも増え、見難さが増してしまいます。設定するつもりのない設定項目の input フォームが見えているのは邪魔かもしれません。

上記問題を解決するために、必要な設定項目以外はデフォルトでは閉じるようにしました。

項目タイトルをクリックすると開きます。

その他、作り直しが何度も行われるかもしれない事を考慮し、設定したデータがクッキーに記憶されている間は、カスタムページを開いた時 自動で設定項目が開くようにもしています。

[ FLASH ] [ tips ] [ update ] 2011年04月27日 20:27 | コメント (0) | トラックバック

http://flaprinter.appspot.com/shooter_rows/simple/

FLA.PRINTER フラプリ 第二弾 シューティングゲームのシンプルモードを公開しました。シンプルモードでは敵機体の画像の差し替えを行うことが可能です。
お暇がありましたらどうぞご利用ください。

追記)
ボス機体表示サイズは 幅x高さ 100 x 150 px ですが、それより小さい JPG, PNG 以外の画像を指定するとエラーが発生するかもしれないため、修正予定

追記2)
修正完了しました。カスタムモードで詳細を記述する予定ですが、現在の仕様を以下に記述しておきます。

・ボス機体表示サイズは最大で 幅 110 px, 高さ 150 px

これより大きい表示サイズの画像を指定すると JPG 形式で縮小されます。

・JPG, PNG 以外の画像を指定すると JPG 形式に変換される

透過 GIF 画像は JPG に変換されてしまうため 透過 PNG で作成する事をお勧めします。

[ FLASH ] [ update ] 2011年04月19日 19:22 | コメント (0) | トラックバック

ブロック崩し simple モードが正常に動作していなかった不具合を修正しました。
http://flaprinter.appspot.com/block/simple/

第二弾シューティングゲームは、fla ファイルをパブリッシュするための jsfl の開発が完了し、サーバ側(python)の処理制作にとりかかりました。まずはシンプルモードから作成を行い、ブロック崩しとの共通処理項目をまとめていきます。

[ FLASH ] [ update ] 2011年04月17日 19:15 | コメント (0) | トラックバック

フラプリ第二弾、横シューティングゲームのベースとなる swf を作成中。
もう少し弾避けが楽しい感じにもしてみたいところです。

▽続きを読む

[ FLASH ] [ update ] 2011年04月13日 10:37 | コメント (0) | トラックバック

■ 検討中の仕様メモ

昔の携帯端末を考慮すると 表示可能な弾数は 10 が限界
PC 版はふんだんに弾を表示する

ゲームは音があるとなしとではぐっと印象が変わるため、
PC 版はサウンドエフェクト ON/OFF 機能が欲しい
配布される事を考慮し SE は自作で

負荷がかかるが、背景画像も自由に差し替え可能にすることを検討

機体の当たり判定は画像幅 or 高さの 1/2 程度に自動設定
弾を発射する場所はピクセルで指定できるようにする

[ FLASH ] [ GRAPHIC ] [ update ] 2011年04月08日 20:20 | コメント (0) | トラックバック

2011年3月30日に Google APP Engine SDK 1.4.3 がリリースされたとのことです。気になった内容は Image API のあらゆる処理に画質設定が可能になったという点です。

　参考) python 練習帳 : Google App Engine SDK 1.4.3リリース文抄訳
　http://php6.jp/python/2011/04/02/google-app-engine-sdk-1-4-3/

試してみたところ、見事画質 100 のまま、画像の 変形・切り抜き・合成 までが可能となりました。

ちなみに GAE ドキュメント の日本語ページの内容は相当古いようで、Image API の画質設定を行える説明箇所がありません。右上の言語設定を英語にすると、比較的新しい内容となります。ただし現在はまだ 1.4.3 の内容には書き変わっていない模様。

http://code.google.com/intl/ja/appengine/docs/python/images/

画質設定はメソッドの最後の引数に 0～100 の値を設定すれば有効となりました。

画質100 で変形・切り抜き・合成 を行う記述例)

from google.appengine.api import images

images.resize(imageBytes, width, height, images.JPEG, 100)

images.crop(imageBytes, 
	leftX, topY, rightX, bottomY,
	images.JPEG, 100
)

images.composite(
	[(imageBytes, 0, 0, 1.0, images.CENTER_CENTER)], 
	width, height, 
	4294967295, #ffffff
	images.JPEG, 100
)

早速 FLA.PRINTER フラプリにて画質 100 設定をデフォルトにしようと考えました。しかし、生成される swf の容量が 100 KB を超えやすくなってしまうため、カスタムモードで ユーザが任意に画質を選択できるようにしたいと思います。

あと余談ですが、フラプリ ブロック崩しのサンプルでクリア後に表示される URL が誤っており、せっかくのボーナス画像が見ることができない状態になってしまっていたため修正しました。ごめんなさい。

追記 2011/4/7)
ブロック崩しカスタムモードにて画質設定可能になりました。

[ FLASH ] [ tips ] [ update ] 2011年04月04日 11:48 | コメント (0) | トラックバック

SWFバイナリ解析にて、表示サイズの異なるビットマップ画像を差し替える際に必要な DefineShape タグの解析が完了。以後、フラプリにて利用予定。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2011年04月03日 19:53 | コメント (0) | トラックバック

今年正月より調査を行っていた Google App Engine(以下GAE) にて、ゲーム・待ち受け Flash(swf) が簡単に作成できる Webツール「FLA.PRINTER フラプリ」を公開しました。

機能・コンセプト

画像一枚用意するだけでオリジナルの携帯向け Flash 製作を行えます。
結構古い携帯電話にも対応します。(vodafone 等)
簡単に作れるかわりに、Flash の内容もシンプルです。
カスタムモードを用いれば、ある程度 こった Flash を作ることが可能です。
携帯向けの他、PC向けに、マウス対応など 機能を拡張したファイルも同時に出力します。

何かものを作る際、形にするまでには多くの根気が必要となりますが、その根気の必要量をなるべく少なくすべく、シンプルモードはできるだけ簡単なステップで Flash(swf) を生成できるようにしています。生成後に表示される QR コードから、携帯電話で即表示確認・保存が可能となります。

ブロック崩し

現在フラプリでは、ブロック崩しのみが作成可能です。内容はとても単純なブロック崩しなので、ゲーム性は薄いです。バーの中心でボールを当てた際、ブロック貫通ボールになるようにする、等、まだ改良の余地はあるかもしれません。

個人的には、以下のようなムフフな感じでも利用してほしく思います。
サンプルギャラリー : block 3

---
以下少々技術的な余談

python による swf バイナリ解析処理実装

swf 内に任意のスクリプトの埋め込みと、画像データの入れ替えを行う処理を python にて実装しました。

はじめは PIL(Python Imaging Library) を利用して swf に画像を埋め込むための解析処理を作成していましたが、中途、PIL は GAE 上では利用できない事が判明しました。よって GAE 上では、PNG の画像解析に関しては pypng というモジュールを利用し、GIF の解析処理は断念することに。
最終的に、swf バイナリ解析処理は、PIL 利用版と pypng 利用版 を切り替えて利用出来るようにまとめました。

swf 埋め込み対象データはあらかじめ解析しデータストアに登録

ブロック崩しカスタムモードでは背景画像を選択することができます。この背景画像は PNG ファイルなのですが、PNG ファイルを swf 内に埋め込むための解析処理に結構な処理行数を必要としてしまいます。

ユーザからのリクエスト(生成処理呼び出し)のたびに PNG 解析処理を実行するのは よろしくないため、事前に swf 内に埋め込める形にバイナリ解析しデータストアに登録しておく、という方法を採りました。

ローカル PC 上のデータストアに設定したデータを、本サーバ上に登録する方法があるようですが、資料が少なくややこしそうだったため、Web 上からアップロードできる要パスワードの専用ページを別途作成することに。

様々な状況に応じた swf を出力するための fla ファイルと jsfl の作成

jsfl を用い、パブリッシュ時に ガイドレイヤーやプロファイラを動的に切り替えることで、一つの fla ファイル内に 携帯向け Flash Lite 1.1 用スクリプトと、PC向け Flash Player 7 用スクリプトの両立を行っています。

今回作成したブロック崩し用 fla ファイルでは jsfl を実行すると、以下のような swf (計16種類)がパブリッシュされます。

fla
├ シンプルモード用
│　├ ゲーム用
│　│　├ Flash Lite 1.1 用
│　│　│　├ jpg 画像用 swf
│　│　│　└ png 画像用 swf
│　│　└ Flash Player 7 用
│　│　　　├ jpg 画像用 swf
│　│　　　└ png 画像用 swf
│　└ 待ちうけ用
│　　　├ Flash Lite 1.1 用
│　　　│　├ jpg 画像用 swf
│　　　…　…
│
└ カスタムモード
　　├ ゲーム
　　…

ユーザがシンプルモードで投稿した画像が jpg だった場合、サーバ側では「シンプルモード」の「jpg 画像用 swf」4種類を取得し、それら swf 内に投稿 jpg の埋め込みを行います。

PC 向け Flash(swf) が Flash Player 7 である理由は、Flash Player 7 が Flash Lite 1.1 用スクリプトを判別可能な最大のバージョンであるからです。Flash Player 8 からは Flash Lite 1.1 のスクリプトはパブリッシュできません。

動作検証の手間

Google App Engine SDK でのローカル(Windows上)環境上では動作したものが、サーバにアップロードすると動作しない、といった箇所がいくつかありました(後述)。バグを完全に取り除いてから本サーバにアップロード、という手順は無理かもしれません。
また、Google App Engine Launcher からの「Deploy」コマンドによるファイルアップロードは 毎回 ID と パスワード入力を行わなくてはならないため、本サーバ上での動作確認はやや手間がかかります。

ローカルと本サーバとの動作の違い

urlopen によるファイル取得に関しまして、ローカルと本サーバ上とでは動作が異なる点に少々つまづきました。

Windows 上では、プロジェクトルートからの相対パスで静的ファイルが取得できるのに対し、本サーバ上では相対パスでの urlopen による静的ファイルの取得は不可。「http://～」というアドレス経由で Web 上から取得できる形にしておけば本サーバで取得可能。しかし、ローカル環境上では「http://localhost～」というアドレス経由では urlopen が機能せず？ファイル取得できず。

結局、ローカル環境上では相対パスで、本サーバ上では「http://～」経由でファイルを取得するような処理を作成することに。webapp のテンプレートファイルのファイルパス指定は相対パスでローカル本サーバどちらとも正常に機能するので、何かよい方法があるのかもしれません。

エラー後の表示は適当

ユーザが設定する画像のフォーマットエラーや容量オーバー時等に発生するエラーにて、「フォーマットエラーです」といったきちんと場合分けしたエラー表示処理は面倒なのでまだ行っていません。エラー発生時は強制的にホームに戻されるという、やや不親切設計です。

ブロック崩し 画像分割

古い携帯機種にも対応するために、ブロック画像を細かく分割するという作業を行っています。一つの大きな画像をブロックの数だけスクリプトで複製し、各ブロック内では画像の一部分を表示する、という方法が本来はセオリーであり、簡単で swf 容量も少なく済みます。しかしその簡単な方法ですと 昔の携帯機種ではブロック消去時に負荷がかかるようで、画面が一瞬止まってしまうという現象が発生します。事前に画像をわざわざ小さく分割するのは苦肉の作であります。

開発者向けおまけツール swfdumper

今後の開発用に、Web 上から swf 内ヘッダとタグを解析し表示するツールを作成しています。どのタグのデータを入れ替えれば良いのかを判別するために利用します。

http://flaprinter.appspot.com/swfdump/

解析結果は header, tagSet, tagMap の順で表示されます。

　header --- swf ヘッダ内のデータ
　tagSet --- 登場順タグ一覧
　tagMap --- タグ毎の 登場順に ID を割り振った一覧

サイト内表示している広告に関して

Amazon 商品の表示を行う予定でしたが、東北関東大震災により Amazon が正常に機能していない状況のため、現在は勝手に日本赤十字社へのリンクを貼らせていただいております。

以後の予定

■ swf バイナリ解析処理の拡張

画像表示領域(DefineShape)の動的変更

■ ゲーム第二弾製作

ブロック崩しの次のゲームを製作中。二作目まで製作できたら量産体系が整うことになりそうなので、以後は Flash Lite の製作のみに集中できそうです。

[ FLASH ] [ tips ] [ update ] [ web service ] 2011年03月26日 16:05 | コメント (0) | トラックバック

追記)
サービス終了しました。
遊んでくださった皆様ありがとうございました。

なんとびっくり、Mobage(モバゲータウン)にて 団子一味のゲームが遊べるようになりました！「団子一味の野望 mobile」という名称となります。

「団子一味の野望 mobile」は個人で頂いたお話の仕事となり、私は運営・開発共にほぼ関わっておりません。一部グラフィックスデータの提供とストーリーモードの台詞の監修を少々させていただいただけとなります。

内容は 「OH! DANGO! JAM」がベースとなり、そこにさまざまなソーシャル要素が加わって、携帯ゲームならではの楽しい仕組みがてんこ盛りとなっております。よろしければ是非一度お遊びください！

　■ モバゲータウン上の URL(携帯からしかアクセスできません)
　http://pf.mbga.jp/12001690

　■ QRコード
　

※ モバゲーという事で無料でも遊べますが、課金アイテム等もありますゆえ、お子様に遊んでいただく場合はご注意ください。

※ 「団子一味の野望 mobile」については、「団子一味の野望 mobile」の制作会社へお問い合わせください。

※ PC 版 OH! DANGO! JAM のゲストキャラクター(熊猫男性・ビーンズ・猫剣士等)は、「団子一味の野望 mobile」には登場しないのでご了承ください。

[ FLASH ] [ GRAPHIC ] [ info ] [ update ] [ web service ] 2011年02月24日 19:31 | コメント (4) | トラックバック

http://www.dango-itimi.com/blog/swf/112/

システム制作優先でグラフィックは現在あるものをほぼ使い回しています。
今回までの主な実装内容は以下のとおりです。

■ つかむ処理実装

相手の側に近寄ると相手をつかむ
つかんでから「斬る」キーで相手を斬る
三回まで斬る事が可能

■ つかみからの投げ

つかんだ後 マウスをプレイヤーから一定距離離してから「斬る」キーで相手を投げる
投げた相手に敵が触れると その敵は吹き飛ばされる

つかんだ後 「ジャンプ」キーでつかんだままジャンプ
つかみジャンプの後 つかみからの投げと同じ操作で相手を投げることが可能

---

【 キャラクター操作 】

　[マウス] --- ポインタ方向へ移動
　[スペース] --- ジャンプ
　[F] --- 斬る
　[A] --- 矢を放つ
　[D] --- 防御(キーを押し続けると状態を一定時間持続)

【 特殊操作・仕様 】

・技によっては攻撃モーション途中で ジャンプ or 防御 に移行可
・防御成功時 斬るボタンを押すことにより無敵状態でカウンターアタック可能
・技によっては一度の攻撃で複数回ヒット
・相手の側に近寄ることでつかむ
　つかみ状態から 攻撃・投げ・ジャンプ投げが可能

【 カメラ操作 】

　[マウスドラッグ] --- 回転
　[マウスドラッグ + Shift] --- 拡大縮小
　[マウスホイール] --- 拡大縮小
　[マウスドラッグ + Ctrl] --- 焦点位置変更

左手はホームポジションに添えるイメージで操作キーを割り振っています。
キー操作を有効にするためには一度画面をクリックする必要があります。

---

相手をつかんだ瞬間?ダメージを受けると、相手が空中に浮かんだままになってしまうバグあり
低空で投げると 相手のダメージ色が初期化されないバグあり

[ FLASH ] [ update ] 2011年01月04日 17:41 | コメント (0) | トラックバック

http://www.dango-itimi.com/blog/swf/111/

今回までの主な実装内容は以下のとおりです。

■ 防御処理実装

相手の攻撃を受け止めることが可能
防御キーを押し続けると 防御モーションをしばらく持続

■ 防御成功時からカウンター処理実装

相手の攻撃を防御キーで受け止めた後 無敵状態でカウンターアタックが可能
暫定として
防御成功時 「斬る」キーを押した場合 「斬る 二段目」が発動するように設定

■ 攻撃モーションをキャンセルして 防御 or ジャンプ 処理に遷移する処理実装

暫定として以下の攻撃を防御遷移可能技に設定

・「斬る 一段目」と「矢を放つ」

暫定として以下の攻撃をジャンプ遷移可能技に設定

・「斬る 二段目」と「矢を放つ」

■ 多重ヒット攻撃設定可能に

暫定として以下の攻撃を 2回ヒットする技として設定

・タケノコ「斬る 一段目」
・カバの地上攻撃

---

【 キャラクター操作 】

　[マウス] --- ポインタ方向へ移動
　[スペース] --- ジャンプ
　[F] --- 斬る
　[A] --- 矢を放つ
　[D] --- 防御(キーを押し続けると状態を一定時間持続)

【 特殊操作・仕様 】

・技によっては攻撃モーション途中で ジャンプ or 防御 に移行可
・防御成功時 斬るボタンを押すことにより無敵状態でカウンターアタック可能
・技によっては一度の攻撃で複数回ヒット

【 カメラ操作 】

　[マウスドラッグ] --- 回転
　[マウスドラッグ + Shift] --- 拡大縮小
　[マウスホイール] --- 拡大縮小
　[マウスドラッグ + Ctrl] --- 焦点位置変更

左手はホームポジションに添えるイメージで操作キーを割り振っています。
キー操作を有効にするためには一度画面をクリックする必要があります。

---
複数攻撃を一度に防御しようとするとエラーが発生して画面が停止するバグがあり、処理見直し中。

ノートPCで表示確認してみたところ、3D描画に負荷がかかってしまっているのか処理落ちがかなりある事がわかりました。3D背景は床と壁と木の柱があるだけにもかかわらず、これだけ処理落ちが起こってしまうとなると考えものです。

[ FLASH ] [ update ] 2010年12月25日 15:02 | コメント (0) | トラックバック

http://www.dango-itimi.com/blog/swf/110/

今回までの主な実装内容は以下のとおりです。

■ 吹き飛ばし攻撃処理実装

暫定として以下の攻撃を吹き飛ばし攻撃に設定

・タケノコの「斬る」二段目
・カバの空中攻撃

■ 吹き飛ばされた場合ダウン状態へ遷移

・一定時間でダウン状態解除
・プレイヤーキャラクターの場合
　一定時間経過の他 何かキーを押す事によりダウン状態解除
・ダウン状態でも攻撃を受ける

■ その他

吹き飛ばし処理実装に伴い 空中Y軸方向移動は自由落下するよう処理変更

---

【 キャラクター操作 】

　[マウス] --- ポインタ方向へ移動
　[スペース] --- ジャンプ
　[F] --- 斬る
　[A] --- 矢を放つ

【 カメラ操作 】

　[マウスドラッグ] --- 回転
　[マウスドラッグ + Shift] --- 拡大縮小
　[マウスホイール] --- 拡大縮小
　[マウスドラッグ + Ctrl] --- 焦点位置変更

左手はホームポジションに添えるイメージで操作キーを割り振っています。
キー操作を有効にするためには一度画面をクリックする必要があります。

[ FLASH ] [ update ] 2010年12月15日 10:45 | コメント (0) | トラックバック

できているところまで一旦アップロード。

　http://www.dango-itimi.com/blog/swf/109/

今回までの主な実装内容は以下のとおりです。

・空中ジャンプ処理追加

・飛び道具 表示範囲外で消去する処理追加
　→ 画面内青線位置で飛び道具消去

・移動可能範囲制御処理追加
　→ 床上のみ移動可能に
　→ 移動可能範囲はメタセコイア上で設定

・ヒットストップ(攻撃がヒットした場合の画面描画微量停止)処理追加
・攻撃エフェクト表示処理追加
・ダメージ中の色変化処理追加

【 キャラクター操作 】

　[マウス] --- ポインタ方向へ移動
　[スペース] --- ジャンプ
　[F] --- 斬る
　[A] --- 矢を放つ

【 カメラ操作 】

　[マウスドラッグ] --- 回転
　[マウスドラッグ + Shift] --- 拡大縮小
　[マウスホイール] --- 拡大縮小
　[マウスドラッグ + Ctrl] --- 焦点位置変更

左手はホームポジションに添えるイメージで操作キーを割り振っています。
キー操作を有効にするためには一度画面をクリックする必要があります。

[ FLASH ] [ update ] 2010年12月08日 10:49 | コメント (2) | トラックバック

まだまだハリボテ状態ですが 一旦アップロード。
3D描画・ゲーム用ライブラリ製作、大量のドット絵アニメーションオーサリング用 jsfl 作成、メタセコイアデータ表示 等々、じっくり足場を固めつつ当ゲーム製作に戻りました。

　http://www.dango-itimi.com/blog/swf/108/

【 キャラクター操作 】

　[マウス] --- ポインタ方向へ移動
　[スペース] --- ジャンプ
　[F] --- 斬る
　[A] --- 矢を放つ

【 カメラ操作 】

　[マウスドラッグ] --- 回転
　[マウスドラッグ + Shift] --- 拡大縮小
　[マウスホイール] --- 拡大縮小
　[マウスドラッグ + Ctrl] --- 焦点位置変更

ひとまず左手はホームポジションに添えるイメージで操作キーを割り振っています。
キー操作を有効にするためには一度画面をクリックする必要があります。

[ FLASH ] [ update ] 2010年12月01日 16:07 | コメント (0) | トラックバック

処理負荷軽減を考慮した 3D モデルの面分割数の削減 並びに、各オブジェクトを個々で操作しやすいような設定を行ないました。今回はタンスの扉と引き戸を開けたり閉めたりできるようにしています。

http://www.dango-itimi.com/blog/swf/107/mqo.swf

【 カメラ操作方法 】

　[マウスドラッグ] --- 回転
　[マウスドラッグ + Shift] --- 拡大縮小
　[マウスホイール] --- 拡大縮小
　[マウスドラッグ + Ctrl] --- 焦点位置変更

swf 画面内 各[OPEN/CLOSE]ボタンで、タンスの操作が可能です。

・メタセコイア上でのモデリング図

[ FLASH ] [ tips ] [ update ] 2010年10月22日 12:30 | コメント (0) | トラックバック

ここ最近 3D 表示関連の勉強をし始めた理由は、某ポケモン最新作のゲーム映像を見てからの事でした。ドット絵と 3D 表現の融合に、これは一度表現してみたい、と感じました。
現在までの 研究結果が以下の URL となります。

http://www.dango-itimi.com/blog/swf/106/mqo.swf

【 カメラ操作方法 】

　[マウスドラッグ] --- 回転
　[マウスドラッグ + Shift] --- 拡大縮小
　[マウスホイール] --- 拡大縮小
　[マウスドラッグ + Ctrl] --- 焦点位置変更

ビットマップ画像の重ねあわせの関係でカメラ回転角度には制限がかかっています。

表示はこれだけですが、かなり処理に負荷がかかりカメラ回転もややカクつきが発生してしまっています。PC のファンがうるさく鳴り出したらごめんなさい。

Zソート で面の表示順がおかしくならないようにするには、面を等間隔で細かく分割すればよい、と考えました。その結果、とても簡単なモデルなのに面数がとても多く処理負荷が高くなってしまっています。

もう少し単純な面で分割できるような形状にし、テクスチャで凹凸をごまかせば、面数が減り処理負荷も削減できそうです。

---
3D 表示において色々ネット上で調査をしておりましたら、今月に「Flash が 3D 対応する」といった旨の発表が「Adobe Max 2010」とやらで行われるようですね。これは Flash Player で Zバッファ を用いることができるようになるのですかなあ。なんとも期待したいところです。

[ FLASH ] [ tips ] [ update ] 2010年10月16日 17:05 | コメント (2) | トラックバック

1px 縁取り処理を再作成。
ベクターデータをビットマップデータに変換(Bitmap.draw)し、変換後のビットマップデータ内グラフィックス形状の外周に アルファ値を含むピクセルが存在している場合でも、縁取りを見た目綺麗に行えるようにしました。

ドット絵に適用

ベクターデータに適用

メタセコイアから取り込んだ 3D モデルに適用してみると以下のようになります。
http://www.dango-itimi.com/blog/swf/105/mqo.swf

【 カメラ操作方法 】

　[マウスドラッグ] --- 回転
　[マウスドラッグ + Shift] --- 拡大縮小
　[マウスドラッグ + Ctrl] --- 焦点位置変更

swf 内 左側の 3D モデルを元に、白く縁取り後 二倍表示を行なったものが右側の 3D モデルとなります。

カメラの角度のよっては 面と面との結合部がやや離れて表示されてしまう場合があり、その離れた隙間に対しても縁取りがされてしまいます。隙間を埋めるような面の形状にする等、工夫すればある程度は解決できそうです。

[ FLASH ] [ tips ] [ update ] 2010年10月09日 18:06 | コメント (0) | トラックバック

必要と思われる機能の実装とバグをもろもろなくし、メタセコイアで製作した 3D モデルを Flash にて表示を行うライブラリ製作はほぼ完了しました。

今回試しに以下のようなモデルを作成しました。

Flash 上で表示すると以下のようになります。
http://www.dango-itimi.com/blog/swf/104/mqo1.swf

鏡面表示例
http://www.dango-itimi.com/blog/swf/104/mqo2.swf

【 カメラ操作方法 】

　[マウスドラッグ] --- 回転
　[マウスドラッグ + Shift] --- 拡大縮小
　[マウスドラッグ + Ctrl] --- 焦点位置変更

マウスでカメラをくるくる操作してみると、角度によって一部面の描画順が変わる事があります。

どういう描画法を行なえば問題ないものになるのかを調べてみたところ、面作成方法を工夫すればある程度改善はできそうですが、Flash では完全な解決策はないとのこと。よって面の形状やカメラ角度等によって描画順が変わってしまうのは仕方無しとしました。

[ FLASH ] [ tips ] [ update ] 2010年09月29日 19:40 | コメント (8) | トラックバック

以前から課題にしていた、メタセコイアで製作した 3D モデルを Flash にて表示を行うライブラリ製作にとりかかりました。

世には Papervision3D 用にメタセコイアファイルを読み込むライブラリが公開されており、どのような解析を行うのか等を参考にさせてもらいつつ進めています。

　■ Papervision 3D 用 Metasequoia クラス
　http://www.libspark.org/wiki/rch850/Metasequoia
　http://www.libspark.org/svn/as3/Metasequoia/src/org/libspark/pv3d/Metasequoia.as

メタセコイアはシェアウェア版を用いて 3D モデルを製作することにしました。
シェアウェア版とはいえ、無料で利用可能な機能のみを用いています。
　http://www.metaseq.net/metaseq/index.html

メタセコイアファイル(mqo)はテキストファイルで開くことが可能で、ファイル内は以下のファイルフォーマット通りになっています。
　http://www.metaseq.net/metaseq/format.html
mqo ファイルは テキストファイルとして Flash から読み込むことが可能です。

mqo ファイル読み込み後はファイルフォーマットに従い、Material チャンクや Object チャンクといった内部の情報をそのままクラスファイルにし、その後、独自の 3D 表現ライブラリで使用できるように変換します。

3D 描画を行う際の難点として以下の(a)(b)がありました。

　(a)メタセコイアのY軸とZ軸の向きが Flash の座標軸と逆
　(b)メタセコイアと Flash とでは面表示規則(上面はどちらかの判定)が逆

ひとまずとして以下の対処で解決しました。

(aの対処)
　Flash 上では 各頂点座標を X軸を中心として 180 度回転させる
(bの対処)
　面にテクスチャを表示する際は TriangleCulling.NEGATIVE を用いて描画を行う

今回サンプルとしてメタセコイアで作成した簡単な 3D モデルのスクリーションショットが以下となります。

このメタセコイアファイルを Flash 上に読み込み表示を行ったものが以下となります。

http://www.dango-itimi.com/blog/swf/103/dpzl.swf

【 カメラ操作方法 】

　[マウスドラッグ] --- 回転
　[マウスドラッグ + Shift] --- 拡大縮小
　[マウスドラッグ + Ctrl] --- 焦点位置変更

どの面が手前にくるかのソート処理はまだ組み込んでいないため、常に三角面体が手前に表示されます。

[ FLASH ] [ tips ] [ update ] 2010年09月26日 19:34 | コメント (0) | トラックバック

透視投影と平行投影の切り替えを行うサンプルを作成しました。クォータービューのドット絵を合わせ、その他もろもろの処理を加えたものが以下となります。

http://www.dango-itimi.com/blog/swf/102/

画面 UI 等適当で、キャラクターアニメーションも抜けがあります。

【 UI 説明 】

・投影方法選択
PROJECTION
　├ PERSPECTIVE --- 透視投影
　└ PARALLEL --- 平行投影

・カメラ選択
CAMERA CONTROL
　├ AUTO --- 自動操作
　├ MANUAL --- マニュアル操作
　└ FIXED --- 固定

【 マニュアル選択時のカメラ操作方法 】

　[マウスドラッグ] --- 回転
　[マウスドラッグ + Shift] --- 拡大縮小
　[マウスドラッグ + Ctrl] --- 焦点位置変更

[ FLASH ] [ GRAPHIC ] [ tips ] [ update ] 2010年09月25日 13:46 | コメント (0) | トラックバック

もろもろ適当なベストスクロール処理実装。マウス方向にキャラクターが移動します。キャラクターはまだ奥の壁を突き抜けます。また、衝突判定確認用に立方体の表示を行っています。

　http://www.dango-itimi.com/blog/swf/98/

【 3Dカメラ操作方法 】

　・マウス
　[マウスドラッグ] --- Y軸を軸にした回転
　[マウスドラッグ + Shift] --- 拡大縮小
　[マウスドラッグ + Ctrl] --- 焦点位置変更

軸回転は微量行われるようにしています。ゲーム中演出としてY軸の微量回転もありかな、といったところです。

[ FLASH ] [ update ] 2010年04月11日 17:32 | コメント (2) | トラックバック

OH! DANGO JAM が起動しなくなってしまった、という報告を時たま受けていました。ネットワーク上に登録された おかしなデータの敵と戦うと、自分のデータもおかしいことになってしまい、起動しなくなってしまうというものです。

なので、データを一度リセットするためのツールを用意しました。
http://www.dango-itimi.com/jam/jamClear.html

大変申し訳ありませんが、上記ツールを用いてデータをリセットし、それでも宜しければ再び 1 から遊んでやってください。

敵の名前が「CPU」とつくものは戦っても安全な敵となっています。NaN と表示される敵と戦うと データが壊れてしまうという報告を受けていますのでご注意ください。

[ FLASH ] [ info ] [ update ] 2010年02月18日 02:14 | コメント (1) | トラックバック

今まで作成してきたドット絵キャラクターが3D表現上にどのように映るか一度確認したかったため、適当な背景画像を作成し、簡単なサンプルを作成しました。

　http://www.dango-itimi.com/blog/swf/97/

※要 最新の Flash Player 10
　豆粒のように小さく表示される場合は Flash Player 10 が最新のものではありません

【 3Dカメラ操作方法 】

　・キーボード
　[W] --- 上移動
　[S] --- 下移動
　[A] --- 左移動
　[D] --- 右移動

　・マウス
　[マウスドラッグ] --- Y軸を軸にした回転
　[マウスドラッグ + Shift] --- 拡大縮小
　[マウスドラッグ + Ctrl] --- 焦点位置変更

軸回転は微量行われるようにしています。

用意した背景画像はこちら

今度は 3D上の表示を確認しつつ描き込んで行く予定。

[ FLASH ] [ update ] 2010年02月17日 01:46 | コメント (3) | トラックバック

Flex SDK の mx.graphics.codec.PNGEncoder クラスを改造し、負荷が高くなる箇所を分割して処理を行う PNGEncoder クラスを作成しました。

すでに分割処理を行う PNGEncoder を作成されている方はいますが、私が改造したものは 指定した数値分処理を行ったら中途でループを抜けるものとなっています。イベント発行などは行わず、処理が終了したら 取得対象となる ByteArray インスタンスを返却します。

サンプルファイル一式

http://www.dango-itimi.com/blog/swf/90/sample.zip

使い方

サンプルファイルの一部を抜粋/見やすく修正

private var main:Function;
private var pngEncoder:PNGEncoder;

...

public function Sample() {

	...
	
	pngEncoder = new PNGEncoder(
		new TypeBitmapData32(bitmapData), //32bit PNG エンコード指定
		bitmapData.width, bitmapData.height,
		5000 //1フレーム内に実行するループ数を任意に設定	
	);
	main = encode;	
	addEventListener(Event.ENTER_FRAME, run);
}
private function run(event:Event):void{
	
	main();
}
private function encode():void{
	
	var pngBytes:ByteArray = pngEncoder.run();
	trace(pngEncoder.getProgress());
	if(pngBytes) main = stop;	
}
private function stop():void {}

PngEncoder.run メソッドを実行し、戻り値が null の場合はまだ処理が完了していません。ByteArray インスタンスが返却されると処理が完了したことを示します。PngEncoder.run メソッドを実行後 PngEncoder.getProgress メソッドを呼び出すことで現在の進行状況(0～100%)が確認できます。

mx.graphics.codec.PNGEncoder では、処理行数が多くなる for 文内で if 文があり、これはなくしたほうがよいのではと考え、コンストラクタの引数には あらかじめ一定の処理を行うためのインスタンスを渡すようにしました。しかし逆にこれでは処理が遅くなってしまうという場合はごめんなさい。

サンプルでは 32bit PNG エンコードを行いますが、アルファチャンネルなしの PNG エンコードを行いたい場合は、TypeBitmapData24 クラスのインスタンスを引数に指定します。

	pngEncoder = new PNGEncoder(
		new TypeBitmapData24(bitmapData),
		bitmapData.width, bitmapData.height,
		5000
	);

コンストラクタの第四引数に何も数値を指定しない(デフォルト数値 0を指定した)場合は、分割処理は行われません。PNGEncoder.run メソッド一度の実行で ByteArray インスタンスを取得できます。

その他改造点としまして、Array を Vector に変更しています。Flash Player 9 対応にする場合は Vector 記述箇所を Array に戻す必要があります。

mx.graphics.codec.PNGEncoder 内にある Adobe の著作権表示箇所やその他コメントは、そのまま残しておいたほうがよいのか、記述を何か変えるべきなのか、削除したほうがいいのか、どのように扱えばいいか判断がつかなかったため、改造後のソースには何も書いていません。何か問題がありましたらご指摘願います。

■ Flex SDK mx.graphics.codec.PNGEncoder
http://opensource.adobe.com/svn/opensource/flex/sdk/trunk/frameworks/projects/framework/src/mx/graphics/codec/PNGEncoder.as

[ FLASH ] [ tips ] [ update ] 2009年12月10日 19:07 | コメント (0) | トラックバック

習作として GridCutter という画像加工出力を行う Web ツールを製作しました。
各ピクセルデータを拡大して等間隔に配置し 32bit の PNG で出力を行います。

以下簡単な操作手順です。

・FILE から加工元となる画像ファイルを PC 上から選択
・各ピクセルデータを 四角か丸か どちらの模様で表示するかを TYPE から選択
・zoom (倍率)、margin(間隔ピクセル数) に数値を入力
・出力される 画像サイズ W(横幅)と H(縦幅)を確認
・VIEW ボタンを押して画像トレース開始
　→ 進行状況はツールバー最下部に表示
・画面に表示されたトレース画像で問題なければ SAVE ボタンで PC 上に保存

すべての処理はローカルPC上で行われます。「四角」あるいは「丸」の模様を配置するだけなので、画像加工処理自体は非常に簡単なものですが、何か機会がありましたらお気軽にご利用ください。

Opera で発生する問題

zoom あるいは margin のテキストフィールドそばにマウスカーソルがあると、各テキストフィールドに自動的にカーソルがあたり、ハイライトするようにしています。これにより、テキストフィールドをクリックすることなくキーボードから数値入力が可能となります。
しかし、以下の条件が合わさると、テキストフィールドの数値はハイライトされているのにキーボードから数値入力ができなくなる、という場合があります。

・ブラウザに Opera を用いている
・FILE または SAVE ボタン押下からファイル選択ダイアログ表示を行い
　ファイル選択あるいはキャンセルからダイアログを閉じた直後の状態

上記条件の場合、ユーザは swf 画面を一度クリックしないと 数値入力ができません。
Opera のみフォーカスの動作が少々異なるのかもしれません。

[ FLASH ] [ update ] [ web service ] 2009年12月06日 13:57 | コメント (0) | トラックバック

AS3 ライブラリ整理を一旦終了。ライブラリ内の一機能を用いたサンプルの紹介です。

まず、核となるスクロールバー機能があり、そのスクロールバー機能を用いて四角形の領域に縦方向と横方向にスクロールバー表示を行う BoxScroller というものを作成しました。

BoxScroller を用いることにより、ブラウザのデフォルト機能であるスクロールバー表示のような表現を行うことが可能となります。以下のサンプルを閲覧ください。表示には Flash Player 10 が必要です。

　→ サンプル1(表示領域の外側にスクロールバーを表示する例)
　→ サンプル2(表示領域の内側にスクロールバーを表示する例)

画面内に表示されるスクロールバーは Flash で実装しています。スクロールバー押下でのスクロール処理の他、マウスホイールによるスクロールや、各ページをドラッグ&ドロップすることでもスクロールする事が可能です。

画面右下の数値ボタンを押すことにより、表示されるページが変化します。ブラウザサイズを変更することにより、あるいはページを切り替える(PAGE1, PAGE2を切り替える)ことにより、スクロールバーの表示サイズや位置が適切に調整されます。また、ページの表示サイズに対しブラウザの表示サイズが大きい場合、スクロールバー表示は消去されます。

PAGE3 は BoxScroller を複数画面内に適用した例となります。BoxScroller が複数存在する場合、マウス位置により どの BoxScroller をマウス処理対象とするかの判定を行うかの機能を組みこんでいます。

[ FLASH ] [ tips ] [ update ] 2009年11月24日 11:11 | コメント (0) | トラックバック

■ Twice Me
http://www.dango-itimi.com/twiceme/

zoome で公開されている動画をアンチエイリアスなしで拡大して閲覧可能

個人用に製作。あれこれやってるので小さく宣伝。
最低限の機能のみ実装し UI グラフィックは適当です。
時間帯によっては API からまったく反応が返ってこないため使い物になりません。

[ FLASH ] [ info ] [ update ] [ web service ] 2009年08月31日 00:47 | トラックバック

Flash Player 10 にすると動作しなくなってしまうという欠陥ゲーム PICT PUZZLE の修正を行いました。サイトに設置してくださっていたみなさま、何ヶ月も放置してしまいまことに申し訳ございませんでした・・・！

　PICT PUZZLE 説明ページ
　http://www.dango-itimi.com/download/pictpuzzle/

　最新版ファイル一式 pict.zip ver1.03
　http://www.dango-itimi.com/download/pictpuzzle/pict.zip

過去のバージョンから ver1.03 へバージョンアップを行うには、pict.zip 内の pict.swf のみを差し替えてください。

▽続きを読む

[ FLASH ] [ update ] 2009年07月29日 02:17 | コメント (0) | トラックバック

スクロール対象コンテンツ長が一定時間ごとに変化する場合の スクロールバーコンポーネントの動作確認用 swf を作成しました。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2009年03月29日 16:00 | コメント (0) | トラックバック

スクロール対象のコンテンツの高さが変化する場合、スクロールバーの高さや表示位置を同時に変化させる必要があります。その動作確認を行なうための swf を作成しました。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2009年03月27日 20:44 | コメント (0) | トラックバック

必要になりそうなので、AS3 による定番のイーズ処理で滑らかに動作するスクロールバーコンポーネントの製作を行ないました。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2009年03月27日 11:29 | コメント (0) | トラックバック

ライブラリで用いる設定ファイルを扱うアプリケーションを Adobe AIR にて製作。

以下は自分用のメモ

サイト全体の設定ファイルとしてまず index.xml という XML ファイルを用意し、そこにサイト内で読み込む対象の設定項目を記述します。現在までの習作 の index.xml の内容は以下のようになっています。

　index.xml

この index.xml ファイルはデータ量が多くなるので直接 Flash からは読み込みません。コンテンツごとの複数の xml ファイルに分割し、各コンテンツ表示時に読み込むようにします。
ファイル分割を行なうには AIR を用います。index.xml を AIR で作成したアプリケーションで読み込み、index.xml の内容を解析し、定めたフォーマットに整形した後、コンテンツごとの xml ファイルを出力させます。

出力している xml ファイルは以下のとおりです。

　page.xml
　etc.xml

page ボタンで表示されるコンテンツと etc ボタンで表示されるコンテンツ用の xml ファイルです。読み込む 画像やswf ファイル名、表示するテキスト情報が主となります。

また、当ライブラリでの核となる scene.xml ファイルも index.xml を元に AIR で生成します。

　scene.xml

scene.xml には、各コンテンツシーンをいくつ生成する必要があるのかの情報が記述されます。scene.xml を元に全てのシーンインスタンスを生成し、id を割り振ったり、アドレスバーから指定された URL は存在するか、といったチェックを行なう事が可能となります。

今回作成した AIR アプリケーションのスクリーンショット

「選択」ボタンを押すことでファイル選択ダイアログが表示され、index.xml のディレクトリ位置指定が可能となります。
「書き出し実行」ボタンを押すことで、 index.xml を配置しているディレクトリを基準に scene.xml, page.xml, etc.xml が 指定のディレクトリに書き出されます。

xml 編集ソフトは XMLEditor.NET を用いています。

http://www.xmleditor.jp/

サイトの更新を行なう人は index.xml を編集し AIR にて xml ファイル書き出し処理を実行後、各更新ファイルをサーバにアップロードします。上記 xml 編集ソフトは Windows 用のものなので Mac の人は別途何かいい xml 編集ソフトを探す必要がありそうです。

[ FLASH ] [ tips ] [ update ] 2009年03月25日 11:02 | コメント (0) | トラックバック

自シーンでの外部データ読み込み中に 子孫シーンで外部データ読み込みが発生した場合、子孫シーンの読み込みが完了するまで 自シーンの読み込みを一旦停止し、子孫シーンの読み込み終了後、自シーンの読み込みを再開するための処理を実装しました。内容は以前のエントリーの通りです。子孫シーンとはしていますが、現在は子シーンのみの監視を行なうテストしか行なっておりません。

今回までの習作は以下の URL から確認できます。

http://www.dango-itimi.com/blog/swf/82/

page ボタンを押すと、サムネイル画像が複数読み込まれるページが表示されます。サムネイル画像を押下すると、大きな画像が画面下に読み込み表示されます。複数のサムネイル画像の読み込み途中で どれかサムネイル画像を押下すると、サムネイル画像の読み込みが一旦停止し、大きな画像を先に読み込んだ後、サムネイル画像の読み込みが再び開始されます。

その他実装内容として、ディレクトリの ID 表示に関して設定が可能となりました。以下はその仕様のルールとメモ。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2009年03月25日 03:45 | コメント (0) | トラックバック

Flash Player 10 から FileReference クラスによる ファイル入出力機能がサポートされたとのことで、簡易的な xml ファイル操作と xml 入出力アプリケーション製作をしてみようかと調査してみました。しかし FileReference クラスでは一括で複数のファイル出力を行なうといった事は無理なのですね。一度のユーザのボタン押下等のタイミングに対し、ひとつのファイル操作処理が可能、という仕様でした。

Flash でファイル入出力ができるようになったので、個人的な AIR の用途はますますなくなった、と思っていましたが見当違いでした。AS3 を用いて複数のファイル操作を行なうアプリケーションを作成するには AIR で、ということで。

[ FLASH ] [ update ] 2009年03月21日 14:40 | コメント (0) | トラックバック

Flash で製作された以下のような構造になっているページがあるとします。
page, btn, window はどれもムービークリップです。

page
├ btn1 --> window1
├ btn2 --> window2
├　…
└ btnN --> windowN

仕様は以下のようになっています。

・page 内に btn が複数(1～N)個ある
・各 btn を押すと 対応する window を開く
・各 window はブラウザで新規ウインドウで開くのではなく
　page 内の指定の位置(page前面、page右側等)にムービークリップとして表示する

更に外部データの扱いに関して以下のような仕様となっています。

・各 btn には外部から読み込んだ画像(サムネイル画像等)を表示
・window 内に表示するデータは btn が押された後に外部から読み込む

今までの私の AS2 での作りでは btn の画像が全て読み込み終了するまで btn は押せず window は開かないようにする、といったものにしていました。しかし btn に読み込む画像が多ければ多いほど各 window を開くまでの時間がかかってしまいます。

読み込み中断処理可能な AS3 からは次の仕様を考えていくことに。

・各 btn に表示する画像が読み込まれなくても各 btn は押下可能に
・各 btn 押下後は 全 btn の読み込みは中断し
　開く window 内で表示するデータを読み込む

ここでの考慮事項として、画像が表示されていない(読み込みが完了していない) btn は押せないようにしてほしい、という要望が挙がる場合もあるかもしれないので、画面遷移の仕様を決める段階でどうするか決めておいたほうがよさそうです。

更に次のような page 内処理で window の状態を監視する処理も考えていくことに。

・window 内のデータの読み込みが完了したら
　中断していた page 内の各 btn の画像読み込みを再び開始する

・window が閉じられ再び btn 選択 page 画面が表示されたら
　中断していた page 内の各 btn の画像読み込みを再び開始する

前者の方法ならば、window 内のデータを閲覧している間、バックグラウンドで全 btn のデータ読み込みを完了しておく、といったことが可能になります。
window から更に外部データを読み込む別ページを前面に表示する...といったいったものになってくると、後者のほうがいいかもしれません。

回線速度が上がっており、待機時間に関して考慮するのであるならば、まずは別の製作箇所優先 となっている今日ではありますが、よりよいテンポのいいページを製作するためにも、こういった工夫は随時行なっていけたらよいものです。

[ FLASH ] [ tips ] [ update ] 2009年03月16日 18:17 | コメント (0) | トラックバック

シーン外部 swf 対応と読み込み中断処理実装や、表示切替処理最適化などを行ないました。今回までの習作は以下の URL から確認できます。

http://www.dango-itimi.com/blog/swf/81/

画面一番右上のボタンが 外部 swf を読み込んで表示するとなっております。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2009年03月09日 18:32 | コメント (0) | トラックバック

Progression で構築されたサイトが増える中、今後の Flash サイト製作ではディープリンク機能は欠かせないものになりそうです。というわけで、ディープリンク機能を実現するための SWFAddress を用いてのサイト構築を行なうためのライブラリを作成中。

SWFAddress を用いると、ユーザは URL 指定によりコンテンツ表示切替を行なう命令を いつでも行なうことが可能となります。これは、どのような表示状態からでも 指定した URL に対応するコンテンツ表示を行なうことができるシステム構築が必要になることを意味します。

どのような表示状態からでもコンテンツ表示切替が可能、とはいえ、矛盾が生じないためにある程度決め事が必要となります。現在作成中のシステムでは以下のような決め事を行ないました。

1)コンテンツA表示切替中に コンテンツBへの表示切替命令が行なわれた場合
　コンテンツA表示切替が終了するまでコンテンツBへの表示切替は行なわれない

2)コンテンツA表示切替中に 他コンテンツへの表示切替命令が 複数 行なわれた場合
　コンテンツA表示切替終了後は
　最後にリクエストのあったコンテンツ表切り替え命令に対するコンテンツを表示する

画像やボタンや画面遷移がとっても適当な今回の習作はこちら
http://www.dango-itimi.com/blog/swf/80/

ブラウザの[戻る][進む]にも対応しています。

存在しない URL が指定された場合の対処はまだ行なっておらず、適当な URL をアドレスバーに入力すると 処理が停止し画面が止まります。

[ FLASH ] [ tips ] [ update ] 2009年03月01日 20:39 | コメント (0) | トラックバック

3Dで表示されるローグライクマップにスクロール機能を実装。
ひとまずよくある操作方法 [W][S][A][D]各キーで 上下左右に移動します。

今回は色々あって swf 直リンクではなく ページ埋め込みです。

▽続きを読む

[ FLASH ] [ update ] 2009年02月24日 00:08 | コメント (0) | トラックバック

AS2で作成していたローグライクマップ生成処理をAS3に移植し3D表示。
3Dカメラ機能も向上させ、マウスホイールがなくても拡大縮小・焦点位置の変更が可能になりました。

http://www.dango-itimi.com/blog/swf/78/automap3D.swf

※要 最新の Flash Player 10
　豆粒のように小さく表示される場合は Flash Player 10 が最新のものではありません

【 操作方法 】

　[マウスドラッグ] --- 回転
　[マウスドラッグ + Shift] --- 拡大縮小
　[マウスドラッグ + Ctrl] --- 焦点位置変更

　[マウスホイール] --- 拡大縮小
　[マウスホイール + Ctrl] --- 焦点位置変更

マップの一部を表示するようにしています。マップ移動はまだできません。
swf を表示するたびにマップ表示が切り替わります。ブラウザの再読み込みで swf の表示が更新されます。
表示画像が二種類しかなかったり等、見た目はまだまだいまいちです。

カメラをぐっと寄せれば、一人称視点の3Dダンジョン風ゲームも作れそうです。

[ FLASH ] [ update ] 2009年02月16日 00:41 | コメント (0) | トラックバック

ようやく3D空間上に2D絵を表示する際の表示サイズの取得方法がわかりました。いわゆる、3D空間上の とある一点の座標の表示サイズを求めるための方法です。一点の座標の表示サイズ、というのは変な話なのですかね。どのように求めればよいのかずっと悩んでいましたが、とても簡単な方法でできました…
今までの勉強内容のソースがまったくまとまっていないので、後日にまとめて記事にしたいところです。

http://www.dango-itimi.com/blog/swf/77/Test3D.swf

[ 操作方法 ]

・マウスドラッグ：回転
・マウスホイール操作：拡大縮小
・右クリック(Mac では Ctrl + クリック)でコンテキストメニューを表示
　→マウスホイールによるカメラ操作方法の変更が可能

Y軸を軸とした回転の他に X軸での回転も可能とし、常にフィールド(地面)をスクリーンに向けたまま回転するようにしています。

マウスホイールが無い PC の事を考え、Shift + マウスドラッグ等で拡大縮小等を行えるようにする予定。

[ FLASH ] [ update ] 2009年01月12日 21:55 | コメント (4) | トラックバック

http://www.dango-itimi.com/blog/swf/76/Test3D.swf

[ 操作方法 ]

・マウスドラッグ：回転
・マウスホイール操作：拡大縮小
・右クリック(Mac では Ctrl + クリック)でコンテキストメニューを表示
　→マウスホイールによるカメラ操作方法の変更が可能

2Dドット絵の表示サイズ拡大縮小処理に不整合が起きないよう、Y軸のみを用いて回転させています。青い四角のワイヤーフレーム表示は当たり判定を行う領域です。試験的に表示しています。
ドット絵周囲に一ピクセルの黒い線と白い線を描き込んでいますが、線につぶれた感がでてあまり綺麗には見えないですね。足元に影表示を行えば、少し地面から浮いている感が薄れるかもしれません。

今回用意した二つのドット絵

[ FLASH ] [ GRAPHIC ] [ update ] 2009年01月11日 13:22 | コメント (0) | トラックバック

マウスホイールで拡大縮小表示調節を行うだけではなく、スクリーンからの焦点位置？の変更を行えるようにしました。焦点位置を変更すると、3Dの奥行き感が変わります。
デフォルトではマウスホイールは3Dオブジェクトの拡大縮小を行いますが、右クリック(Mac では Ctrl + クリック)でコンテキストメニューを表示することで、マウスホイールの処理を変更することが可能です。

http://www.dango-itimi.com/blog/swf/75/Test3D.swf

※要 最新の Flash Player 10
　豆粒のように小さく表示される場合は Flash Player 10 が最新のものではありません

[ 操作方法 ]

・マウスドラッグ：カメラ回転
・右クリック(Mac では Ctrl + クリック)でコンテキストメニューを表示
　→マウスホイールによるカメラ操作方法の変更が可能

ブラウザ上にスクロールバーが表示されている場合、マウスホイールがブラウザのスクロールバーも同時に操作してしまうようなので swf 直リンクで表示させることにしました。

[ FLASH ] [ update ] 2009年01月04日 15:29 | コメント (0) | トラックバック

3Dカメラをマウスで操作する処理を実装。ドラッグすることでカメラが回転し、マウスホイールで拡大縮小します。
マウスにぴったりひっついてカクカクとカメラが動作するのもあまり面白くないので、イージング処理(イーズアウト/イーズイン)を加え、多少滑らかに動作させるようにしました。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2009年01月03日 13:47 | コメント (0) | トラックバック

正月も近づいている事なので和室っぽい簡易的な3Dの部屋を作成してみました。
各面に対する光源処理も追加し、斜面になると少し暗くなるようにしています。

▽続きを読む

[ FLASH ] [ update ] 2008年12月29日 22:38 | コメント (0) | トラックバック

ようやくできました、遠近法 + テクスチャ描画。いつかできるようになってやるんだ…！と意気込んでから長かった。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2008年12月27日 20:10 | コメント (0) | トラックバック

業務に必要になりそうなので再度透視投影について勉強。最近丁度 Flashによる透視投影方法について詳しく解説してある記事があったので参考にさせてもらいました。

　■てっく煮ブログ
　AS3.0 で 3D プログラミングを１から勉強する (1)
　AS3.0 で 3D プログラミングを１から勉強する (2) - 行列の導入
　AS3.0 で 3D プログラミングを１から勉強する (3) - 透視投影

なんともシンプルな式と方法で透視投影ができてしまうようで、今まで私が知っていた方法はなんだったのと言わんとぞばかりです。

試しとして以前作成したローグライクマップ自動生成処理と組み合わせてみました。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2008年07月09日 10:31 | コメント (4) | トラックバック

会社の携帯端末 docomo SO905i の Flash Lite 3.0 にてトレジャーボインゴの動作確認を行ってみました。そして見事動作させることができました。

---

■Flash Lite 3.0 搭載 携帯用アドレス

・サンプル5 直アドレス
　http://m.dango-itimi.com/trebo/test/5.swf

・携帯電話用 団子一味のアドレス
　http://m.dango-itimi.com/

・QRコード

携帯端末での操作方法は、「2」「8」「4」「6」キーでキャラクター移動＆攻撃となっております。

携帯用のトレジャーボインゴは、フレーム分割処理というものを組み込んでいるため、マップ生成からステージ表示まで20秒くらい時間を必要とします。携帯版ではマップ生成中は「マップ生成中...」といった表示を行う予定です。

---

Flash Lite 3.0 が搭載されている docomo 905i シリーズのワークメモリは以下のページによると 一律 3072KB とのこと。

http://www.nttdocomo.co.jp/service/imode/make/content/spec/flash/index.html

Adobe Device Central CS3 のエミュレータ上では、トレジャーボインゴのワークメモリ使用数は 2400～2600KB 程度となっているので、携帯端末上でも問題なく動作してくれました。

現状わかっている問題点として、フロア切り替え後、階段をすぐさま下り次のフロアへ移動すると メモリ解放が上手く行われない、といったことがあるようです。使用メモリが上がったままになってしまい どんどん 3000KB に近づいいってしまう、という現象が起こってしまいます。

端末の性能がアップしていることからか、Flash Lite 2.0 が搭載されていた au よりも処理速度は早く動作しています。キャラクター等の移動速度は PC に比べると遅いですが、au よりは早く動作するようになりました。

docomo 905i シリーズから画面領域がいままでの倍となったので swf表示サイズを当初の予定通り倍にしています。ドット感が出ていい感じです。

■PC版はこちら

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2008年01月14日 22:21 | コメント (0) | トラックバック

年の最後に今までに出来ているものまでをアップ。
ポップアップテキスト表示やステージ切り替え処理組み込みなどなど。

▽続きを読む

[ FLASH ] [ update ] 2007年12月27日 16:59 | コメント (1) | トラックバック

「処理フレーム分割」を行った事により、ローグライクマップ自動生成処理を携帯端末で動作させることに成功しました。しかし、生成処理の処理行数が多いためかメモリを結構消費してしまい、ゲーム本体であるトレジャーボインゴのメイン処理を続けて実行すると「FLERR: メモリ不足エラーです。」というエラーが発生。

　モバイルデバイスに適した Flash Lite アプリケーションメモリの管理

上記ヘルプページによると、メモリを解放するには使用していない変数に null を代入すればよいとのことなので、色々 null なり delete なり試してみましたが一向に解放される気配を見せてくれず。

Adobe Device Central CS3のエミュレータからメモリについて調べてみたところ、現状の au の FlashLite のヒープメモリ量では トレジャーボインゴを動作させることは困難かもしれません。後もう少しで動作する…！ というところでメモリが足りなくなってしまいます。vodafone は au よりもヒープメモリが高く設定されている(500KB程多い)ようで、動作するみたいです。

ローグライクマップ自動生成処理を AIR か何かで作成し、マップ情報をあらかじめたくさんの静的ファイルに書き出しておき、ゲーム実行時にそのファイルをランダムで読みに行く… といった対策が考えられますが、ローグライクマップ自動生成処理をAS3で作り直す気力は現在なし。

「処理フレーム分割」等、携帯用の対策を行っているだけで時間がかかり 先になかなか進めることができないため、しばらくは携帯で動作させる事はあきらめようと思います。当面は PC と Wii 用向けということで、今後 携帯端末の性能がもう少し上がってくれることを願います。

[ FLASH ] [ update ] 2007年11月18日 18:34 | コメント (0) | トラックバック

「OH! DANGO JAM」でも使用していた 数値や英字がポップアップして表示される テキスト表示処理をライブラリ化。トレジャーボインゴに用いる予定。
以前も作成したような気がしましたが、過去とコーディングスタイルが徐々に変わっており、現在のコーディングスタイルに合わせたものを作成し直しました。

▽続きを読む

[ FLASH ] [ update ] 2007年10月18日 20:53 | コメント (0) | トラックバック

先日より作成していたマップ自動生成処理をトレジャーボインゴに組み込み。しかし携帯端末で動作確認をしてみるとエラーが発生しswfが停止してしまいまいた。
単一フレーム内での処理行数が多すぎたためエラーが発生したと思われます。まずマップ自動生成処理とゲームメイン処理の合間にフレームを一つまたぐ必要がありそうです。それでも動作しない場合、マップ自動生成処理の各処理毎の合間合間にフレームをまたがせる必要がでてきます。

■PC上での動作確認はこちら

▽続きを読む

[ FLASH ] [ update ] 2007年08月05日 17:45 | コメント (2) | トラックバック

トレジャーボインゴで使用するゲーム画像を作成中

【 タイトル画像とゲーム中の主な画面構成 】

【 イベントシーン 】
ややこった家などを表示。

複数マップチップをまたぐグラフィックの背景パーツを配置するのは何かと難しいので、左図の家はイベント中のみに表示されます。

【 自動生成マップ背景用ブロック配置イメージ 】
クォータービューなので、キャラクターが隠れない程度の高さがよさげです。

【 アイテム 】
ハート、金塊、剣、盾、階段

【 操作方法確認画面 】
見難いのでおそらく作り直します。

[ FLASH ] [ GRAPHIC ] [ update ] 2007年06月18日 20:47 | コメント (6) | トラックバック

敵AI処理はほぼ完成。斜め移動のないローグライク(不思議のダンジョン系)ゲームの敵の動きにしてみました。画面外の敵の移動処理は重たくなる＆大変そうなので行っておりません。

敵は白玉軍団が襲ってきます。敵の方向へキーを押すとそちらへ攻撃を行います。携帯端末用でテンポの良さを重視したいので、プレイヤーの周囲全部の敵がいっせいに攻撃をおこなってきます。

携帯端末での操作方法は、2846キーでキャラクター移動＆攻撃です。

■FlashLite2.0搭載 携帯用アドレス

・サンプル4 直アドレス
　http://m.dango-itimi.com/trebo/test/4.swf

・携帯電話用 団子一味のアドレス
　http://m.dango-itimi.com/

・QRコード

PC版はこちら

▽続きを読む

[ FLASH ] [ update ] 2007年03月04日 22:43 | コメント (0) | トラックバック

キャラクター移動処理追加。敵キャラクターが画面内に登場すると、プレイヤー方向へ移動してきます。携帯端末でのfpsは12出ているか出ていないか程度。おおむね負荷のかかる処理は実装したので、これ以上速度が遅くなることはないと思われます。

携帯端末での操作方法は、2846キーでキャラクター移動です。敵キャラクターはまだグラフィックを作っていないのでプレイヤーと色違いのキャラクターを配置しています。ひとまず三体ほど登場するようにしています。

■FlashLite2.0搭載 携帯用アドレス

・サンプル3 直アドレス
　http://m.dango-itimi.com/trebo/test/3.swf

・携帯電話用 団子一味のアドレス
　http://m.dango-itimi.com/

・QRコード

▽続きを読む

[ FLASH ] [ update ] 2007年02月04日 19:04 | コメント (0) | トラックバック

任意の位置に背景パーツで作成できるように設計。
今後は不思議のダンジョン系の自動マップ生成に挑戦する予定。

サンプルでは14x14のマップチップを並べ、周囲に木を生やし一つの部屋を作っています。2846キーで上下左右にマップ全体が移動します。キャラクターは背景パーツの一つとなっており現在は移動しません。

携帯端末で動作確認してみると、処理(描画?)速度は以前のサンプルより遅くなってしまっています。16～18fpsくらいで移動し、1マス移動する毎にマップチップ+背景パーツ表示切替が行われ、そこでガクッと一瞬止まります。
現在の速度は及第点といったところでしょうか。これ以上早くするのは難しいです。今後、キャラクター移動処理など組み込むので更に遅くなるかもしれません。

■FlashLite2.0搭載 携帯用アドレス

・サンプル2 直アドレス
　http://m.dango-itimi.com/trebo/test/2.swf

・携帯電話用 団子一味のアドレス
　http://m.dango-itimi.com/

・QRコード

▽続きを読む

[ FLASH ] [ update ] 2007年01月13日 01:25 | コメント (0) | トラックバック

上下左右でマップチップが移動するだけのサンプルを作成。
FlashLite2.0を搭載してある携帯端末からも閲覧が可能です。
http://m.dango-itimi.com/trebo/test/1.swf
上下左右矢印キー または 2846番号キー のどれかで移動します。

fpsは24に設定していますが、携帯端末上では体感 fps18～20程度です。これから更に色々な処理が加わるので、処理速度はもっと遅くなると思われます。現在のところ処理速度は合格点です。

マップチップが消えたり登場するところで、綺麗に消えるようにエフェクトをかけるものも作成してみましたが、見た目がいまいちなのでひとまずボツに。

携帯電話用 団子一味のアドレスはこちら
http://m.dango-itimi.com/

QRコード

[ FLASH ] [ update ] 2007年01月08日 16:35 | コメント (0) | トラックバック

FlashLite2.0で何かクォータービューで動作する簡単なサンプルゲームでも一本作成してみようかなとイメージ画面を作成。タイトルは「トレジャーボインゴ」。
WiiのFlashPlayerは7相当ということで、そちらも視野に入れたいところです。

今まで作成してきたクォータービューものとは異なる点は、主人公キャラクターを常に画面中心に位置させ、移動時は主人公ではなく背景マップを移動させるという点。
昔のドラクエ1のようなマップチップ単位で移動させるのではなく、フレーム毎にピクセル単位で移動させます。

携帯FlashLite2.0でまっとうな処理速度で動作すれば、携帯電話のFlashPlayerよりも性能がいいであろうWiiでも動くのではないかと考えております。まっとうな処理速度を出すために、1フレーム間での処理行数を減らす事を最優先に、深度変更処理や背景パーツ移動処理の最適化を図ります。

WiiのFlashPlayerではどれくらいのことができるのか、Wii自体を持ってないのでまだほとんど調べておりません。ニンテンドーDSLiteが現在でもまだ品薄状態ということなので、Wiiも当面買えそうもない予感がします。

Wii FlashPlayer 調査予定項目
・SharedObjectの使用の可否
・読み込み可能なswfの容量
・サウンド周り

[ FLASH ] [ GRAPHIC ] [ update ] 2007年01月07日 15:50 | コメント (0) | トラックバック

マウスボタンを押しっぱなしでパワーをため、一定時間ためると円のエフェクトがキャラの後ろに表示され、マウスボタンを放すとタメ攻撃が発動します。

マウスクリックによる各通常攻撃中にタメを行うことで、それぞれ対応するタメ攻撃を出すことが可能です。通常攻撃四段目中にはタメてもタメ攻撃は出せません(スライディングになります)。パワーをタメている間でも移動が可能です。

WiiのOperaでFlashが再生できるとのことで、クリックのみで遊ぶ事ができるように作っている「タケノコと牛殿様」もWiiで遊べたらいいなあ と思っております。しかしおそらくWii OperaのFlashPlayerは7だったりして無理なのでしょうなあ。

▽続きを読む

[ FLASH ] [ GRAPHIC ] [ update ] 2006年12月14日 19:10 | コメント (0) | トラックバック

任意のタイミングで攻撃が可能になりました。また クリックし続けるとパワーをためるエフェクトが発生します。ためて出すことのできる技はまだ出せません。その他、簡単なキャラクターの残像表示も行うようにしました。キャラクターの残像は見ていて目が回るかもしれないので後でなくすかもしれません。

今回までの内容で、中身がなんだかすっきりしない設計とソースコードになっていたので二回くらいシステムを構築し直しています。タスクシステムたるゲームシステム設計法があるとネットに情報があったので、独自似非タスクシステムで構築し直しました。

クリックし続けたときに足元から出る光のエフェクトは、前々からこういう表現はどうやるんだろうなあ、と思っておりましたが、Blendmode.ADD と GlowFilter, BlurFilter を用いれば簡単に実現が可能なのですね。もっとモリモリ研究したいです。

▽続きを読む

[ FLASH ] [ update ] 2006年11月26日 17:47 | コメント (5) | トラックバック

一旦アップ。
サウンドと基本攻撃モーションの組み込み。

▽続きを読む

[ FLASH ] [ GRAPHIC ] [ update ] 2006年11月21日 19:25 | コメント (0) | トラックバック

基本移動グラフィックを作成し組み込み。
それと先日作成した白縁取りスクリプトを導入。

▽続きを読む

[ FLASH ] [ GRAPHIC ] [ update ] 2006年11月16日 19:05 | コメント (2) | トラックバック

AS3とビットマップエフェクトの習作として製作予定のゲーム。まずはキャラクターとゲーム画面イメージから。
手裏剣を投げ、その軌道をペカーッと光らせたりしたいので、背景は暗めに設定。

[ FLASH ] [ GRAPHIC ] [ update ] 2006年11月11日 15:44 | コメント (4) | トラックバック

やったー 回転できたヨ

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2006年08月31日 20:24 | コメント (0) | トラックバック

ボックス状に面を作り、そこにテクスチャをぺったんこ。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2006年08月28日 01:07 | コメント (0) | トラックバック

適当な面を作成し、そこにビットマップを貼り付け。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2006年08月27日 18:23 | コメント (0) | トラックバック

まずは、スクリプトで線を引くだけの軸測投影のサンプルを作成。
3D表現は計算量が多いからActionScript3ならば早く表示できるのではないかと考え、勉強がてらFlash9にて製作。
軸測投影は透視投影とは違い奥行きがありません。
クォータービューということもあり、今後団子一味のゲームに生かせそうです。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2006年08月27日 11:48 | コメント (0) | トラックバック

透視変換処理に高さの概念を追加。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2006年07月29日 18:51 | コメント (2) | トラックバック

1年くらい前に練習として制作した透視変換処理を再度見直しライブラリ化。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2006年07月27日 10:20 | コメント (2) | トラックバック

スロットが動作するようになりました。
キノコ台にぶつけるとスロットが開始します。その他、画面各パーツが動作するようになっております。

▽続きを読む

[ FLASH ] [ update ] 2006年07月17日 15:07 | コメント (1) | トラックバック

ドットで補正した背景画像を組み込み。
バーとボールはまだベクターデータのままです。
この箇所に衝突した際、この動作を行う、といった処理を可能にしました。現在はキノコ台にぶつけるとキノコがひょっこり表示するようになっています。

▽続きを読む

[ FLASH ] [ update ] 2006年07月08日 23:30 | コメント (0) | トラックバック

じっくり作成したゲーム「OH! DANGO! JAM」ですが、アクセス過多により転送量を遥かにオーバしてしまい、一時公開停止することとなりました。
ゲームのファイルサイズが大きいため、少しでも遊んでくださる人が増えると、転送量制限を越えてしまう状況です。再び公開するには、転送量の制限のかからないサーバに移行するしか方法がなさそうです。

只今、鯖移行の為に調査中。

[ ETC ] [ FLASH ] [ update ] 2006年06月22日 20:11 | コメント (8) | トラックバック

Illustratorで作成した背景画像をドットで補正+α。
もう少し描き込んでいきます。

[ FLASH ] [ GRAPHIC ] [ update ] 2006年06月18日 21:46 | コメント (0) | トラックバック

Illustratorで作成した背景画像をビットマップ化してFlashに組み込み。
きちんとピンボールゲームっぽい動作になるかどうかの確認です。簡単な音も鳴るようになっています。

▽続きを読む

[ FLASH ] [ update ] 2006年06月11日 15:04 | コメント (0) | トラックバック

ここ二週間ほどじっくりと背景画像を作成しているのですが、なかなか納得いくものができず一旦アップ。どうもまとまりがでないので、闇雲に作ったパーツを配置していくのではなく、もう少し既存の物(家具等)を元にパーツをデザインしたほうがいいのかもしれないと考え中。
画像はIllustratorで作成しているので線がややゆるめな感じですが、最終的にはビットマップ化してドットで描き直しメリハリをつける予定です。

[ FLASH ] [ GRAPHIC ] [ update ] 2006年06月06日 20:02 | コメント (2) | トラックバック

暫定的に複雑な地形の背景を組み込んでみました。
ピンボールゲームらしく動作するかどうかの検証用です。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2006年05月23日 23:24 | コメント (0) | トラックバック

ボール位置により、背景全体をスクロールするようにしました。
心配していた24fpsによるカクカク感もさほどないようです。

▽続きを読む

[ FLASH ] [ update ] 2006年05月21日 01:44 | コメント (0) | トラックバック

ラインオブジェクトの他に円オブジェクトを配置し、ピンボールっぽいものを作成。

▽続きを読む

[ FLASH ] [ update ] 2006年05月20日 16:43 | コメント (0) | トラックバック

レーザー状に反射を行う処理で 複数の衝突対象オブジェクトが一点で交わっており、その一点にボール軌道が重なった場合、いらぬ方向に跳ね返ってしまっていたバグを修正。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2006年05月14日 19:29 | コメント (0) | トラックバック

両バーを実装＆背景ラインオブジェクトを暫定的に配置。
背景ラインオブジェクトを配置してみてボールの自由落下との衝突処理を行ってみたところ、以前作成していたレーザ反射を行うためのライブラリにバグが見つかりました。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2006年05月08日 03:12 | コメント (0) | トラックバック

途中経過2。バグ修正と各反射に必要なパラメータ調整、並びに衝突反射処理の処理内容変更。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2006年05月06日 17:07 | コメント (0) | トラックバック

途中経過1。ようやくなんとか形になりました。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2006年05月04日 14:38 | コメント (0) | トラックバック

キャラクターのイエティを追加しました。ドーモ君っぽい。
昔のアクションRPGのゲームで背景に登場していたキャラクターです。スライム型団子スランゴをぷりんぷりん投げてきます。キャラが弱かったのでサンタの帽子をかぶせて取り繕いました。

そして！

遊画堂 りょうへいさんのキャラクター「猫剣士」が遂におだんごジャムに参戦！
団子達はその剣で竹串のごとく貫かれてしまうのか…！？
猫剣士の勇姿は是非ゲーム内でご確認ください。

どちらのキャラクターも準レアキャラなのでアイテムも比較的取りやすいキャラクターとなっております。

OH! DANGO! JAM
http://www.dango-itimi.com/jam/

[ FLASH ] [ GRAPHIC ] [ update ] 2006年03月05日 13:28 | トラックバック

レアキャラクター オバケボーイを追加しました。
男の子の帽子がとれたバージョンです。技はどれもかっこいいものにしました。その他のグラフィックはゲーム内でご確認ください。必殺技は団子ロボを召喚します。
おならプーたんと同じくらいの強さに設定しましたので、比較的倒しやすいのではないかと思います。

OH! DANGO! JAM
http://www.dango-itimi.com/jam/

[ FLASH ] [ GRAPHIC ] [ update ] 2006年02月26日 19:28 | コメント (7) | トラックバック

レアキャラのカバ天使を追加しました。他の画像はゲーム内にてご確認ください。
カバが多くてごめんなさい。描くのが楽なのです！

OH! DANGO! JAM
http://www.dango-itimi.com/jam/

[ FLASH ] [ GRAPHIC ] [ update ] 2006年02月18日 22:12 | コメント (2) | トラックバック

長らく作っていたJamGameがついに完成。
「OH! DANGO! JAM」というタイトルになります。

URLはこちらです。Flashギャラリーにそのうちリンクを貼ります。
http://www.dango-itimi.com/jam/

まだ大規模なテストは行っていないため、不具合が発生する場合があります。当面ベータ版ということでお願いします。致命的なバグが発生した場合、プレイデータを消去させていただく場合があります故、ご了承ください。
それと、完成とはしましたが引き続きキャラクターを何体か追加していく予定です。

未公開だったゲーム画面のスクリーンショット。モザイクは自主規制。
キャラクターの中には派手な必殺技を使用するレアキャラクターがおります。そのレアキャラクターの変身アイテム取得に是非挑戦してみてください。

製作・テストプレーにご協力いただいた方々へ、今まで長い間お付き合いいただきありがとうございました。

Special Thanks
拓さん
HACCANさん
りょうへいさん
竹さん

▽続きを読む

[ FLASH ] [ GRAPHIC ] [ update ] 2006年02月12日 15:56 | コメント (37) | トラックバック

ゲームで使用するカバとしらた丸の画像。
レアキャラ故、他のグラフィックはゲーム内でご確認ください。
必殺技はベラボーなものにしました。

[ FLASH ] [ GRAPHIC ] [ update ] 2006年02月05日 22:58 | コメント (0) | トラックバック

ゲームで使用するキノッパの画像。必殺技はＢダッシュ。仲間の犬の名前はトリュフといいます。
某所で書いたキノッパの簡単なキャラ設定を引用。

>・頭のお皿にキノコが生えてしまったが手が短くて取ることが出来ず
>・お皿に水をかけるとキノコが生長してしまうというジレンマが発生する
>・上記理由によりいつも不機嫌そうにゲーゲー鳴いている

目標にしていた通常キャラグラフィックがそろいましたので、この後は某所でJamGameのクローズドベータテストを行います。テスト中にレアキャラを二体ほど作成し完成です。

[ FLASH ] [ GRAPHIC ] [ update ] 2006年02月02日 19:30 | コメント (0) | トラックバック

ゲームで使用するバッテンズの画像。やや大きめで登場。
大きめなキャラクターとして団子ロボを登場させようかと考えましたが、動かすのが大変そうなのでやめました。
他、一番右はしらた丸の必殺技画像。

[ FLASH ] [ GRAPHIC ] [ update ] 2006年01月20日 22:13 | コメント (0) | トラックバック

ゲームに使用する女の子の画像。くるくる傘をまわしてたもれ。

[ FLASH ] [ GRAPHIC ] [ update ] 2006年01月15日 14:21 | コメント (0) | トラックバック

ヘルプ画面作成。インターフェース画面作成はこれでほぼ終了… 終了にしたいところ。
残りはゲーム中の背景グラフィックとキャラクターグラフィックの作成作業にございます。

ヘルプ画面だけを見る感じなんとなく面白そうに見えますね。実際はどうだかわかりませんが！
私の格ゲー好きな性格がもろシステムに現れております。

[ FLASH ] [ GRAPHIC ] [ update ] 2005年12月20日 19:00 | コメント (1) | トラックバック

山に篭りオープニングムービーを完成。
あまりこったものにする予定はなかったのですが、イメージが膨らみ結構手間と時間をかけてしまいました。新たにオープニング用の曲を作成したのでゲーム内で流れる音楽は三曲に。

只今の全体的な進捗具合は85%程でしょうか。年内の完成は無理そうなので、クリスマスあたりにオープニングだけでも公開しようと思います。

この作品は団子一味のサイトを始めてから今の今までの私の技術の集大成ともいえるものになっております。特に目新しいシステムであるわけでもなく、以前作ったゲームやムービーの似たりよったりな作品になってしまっているかもしれません。
しかし、今まで積み上げてきたゲーム製作やネットワーク処理の技術・ドット絵アニメーションのノウハウ等がこめられており、今までにはない高品質なものに仕上がっていると思います。

完成した暁には是非一度遊んでみてやってください～

[ FLASH ] [ GRAPHIC ] [ update ] 2005年12月12日 02:19 | コメント (2) | トラックバック

ゲームに使用する玉子王子画像。
玉子王子はシンプルな形ですが、この形状をドットで表すのがなかなかむつかしかです。

[ FLASH ] [ GRAPHIC ] [ update ] 2005年12月04日 02:10 | コメント (2) | トラックバック

ゲームに使用するこふき姫画像。こふき姫の投げられ役もいっしょに。

[ FLASH ] [ GRAPHIC ] [ update ] 2005年11月30日 00:13 | コメント (0) | トラックバック

ゲームに使用するプリンちゃん画像。プリプリ言います。

[ FLASH ] [ GRAPHIC ] [ update ] 2005年11月27日 13:07 | コメント (0) | トラックバック

ゲームに使用するカバ画像。
先に線画でアニメーションさせた後に着色します。

[ FLASH ] [ GRAPHIC ] [ update ] 2005年11月23日 12:42 | コメント (0) | トラックバック

SHOP画面。売値の倍率が0.25秒おきに変化し、タイミングよく売りたいアイテムを選択することにより0.1～5倍の値段でアイテムが売ることが可能です。

JamGameのシステム面は95%完成。かなりたくさんのクラス数になっております。ちょっと作る画面が多すぎましたね。全体の進捗度は75%程。
[ Classファイル一覧 ]

これよりゲームに使用するキャラクターグラフィック作成に入るので、今後しばらくX-LABOはドット絵ギャラリーへと遷移します。

[ FLASH ] [ GRAPHIC ] [ update ] 2005年11月21日 19:33 | コメント (0) | トラックバック

Flash8から利用できるBitmapDataクラス。
練習を兼ねて現在作成中のゲームに組み込んでいこうと思います。
ドット絵を何か効果的に表現できる使用法を研究していく予定。

▽続きを読む

[ FLASH ] [ GRAPHIC ] [ update ] 2005年11月10日 09:50 | コメント (2) | トラックバック

サウンド制御画面。曲の方は作成済み。
全体の進捗度は60%程。
結構できてきましたが、まだまだLABOに篭る事になりそうです。
Flash8の新機能についての研究はしばらくお預け。

[ FLASH ] [ GRAPHIC ] [ update ] 2005年11月04日 00:05 | コメント (0) | トラックバック

作成中のゲーム画像からお見せできるものを公開。
ドット打ちすぎてお目目がしょぼしょぼ祭りじゃあーーっ

[ FLASH ] [ GRAPHIC ] [ update ] 2005年09月20日 21:04 | コメント (2) | トラックバック

一年半年ほど前から極秘裏に作成しておりましたゲームがありました。
しかし途中何度も間が空いてしまい、内部システムも古くなってしまったので現在再構築作業中です。
腕は一年半年前より遥かにアップしたので、ガリガリ順調に進んでいます。

完成できるまであまり表に出さないようにするので、ちょいくらblogの書き込みが減るかもしれませんがご了承ください。

[ FLASH ] [ update ] 2005年08月26日 01:05 | コメント (0) | トラックバック

PICTPUZZLEのバージョンアップを行いました。
ランキングが20位まで表示されるようになります。その他、細かい修正を行いました。

ver1.02よりも過去のバージョンをお使いの方は以下の手順でバージョンアップを行ってください。

【 ランキングCGIを用いていない方 】

(1)pict.zip ver1.02をダウンロード
(2)pict.zipを解凍
(3)解凍されたpictフォルダ内のpict.swfを、サーバにアップしてあるpict.swfに上書きアップロードする

【 ランキングCGIを用いている方 】

(1)サーバにアップロードしてあるcgi/dat/rank.datを自分のＰＣへダウンロード
(2)pict.zip ver1.02をダウンロード
(3)pict.zipを解凍
(4)解凍されたpictフォルダ内の cgi/dat/rank.datをメモ帳で開く
(5)メモ帳で開いたrank.datの一行目から五行目までの内容を、1でダウンロードしたrank.datの一行目から五行目までの内容に書き換える
(6)書き換えたrank.datを、サーバにアップロードしてあるrank.datファイルに上書きアップロードする
(7)解凍されたpictフォルダ内のpict.swfを、サーバにアップしてあるpict.swfに上書きアップロードする

不明な点がありましたら、こちらのエントリーにコメント、またはメールをください。

[ FLASH ] [ update ] 2005年08月14日 18:36 | コメント (0) | トラックバック

左MENUに「DL(DOWNLOAD)」の項目を設けました。そこからPICTPUZZLEをダウンロードすることが可能です。
気に入ってくださった方はよろしかったら使用してみてください。背景画像・ブロック画像・音楽等 自由にカスタマイズ可能です。

他に、以前より処理を見直し 少しくっつく感じでブロックが出現するようになりました。ハイスピードになるまで遊べるようになったと思います。
また、何かゲーム内でヘンテコな不具合など見つかりましたらご報告ください。

→ダウンロードページへ

Ｃさん、拓さん 設置確認にお付き合いいただき大変ありがとうございました！

[ FLASH ] [ update ] 2005年08月05日 19:14 | コメント (0) | トラックバック

サイト微更新。

団子一味のTOPページ等最初に開いた時、MENU部分のFlashとTOPページのはてなBookmarkのFlash、AmazonWebService表示用のFlash三つの表示処理がバッティングして MENUのFlashがガタガタな表示になってしまっていました。
そこで、はてなBookmark用のFlashの表示処理を3秒後に、Amazon広告用のFlashの表示処理を5秒後に故意に遅延させて実行させることにより表示がガタガタになる問題を多少ですが解決できたと思います。

private var sID:Number;

//1000ミリ秒(一秒)後にメソッドfuncを実行
public function main():Void{
	this.sID = setInterval(
		function(sc){ clearInterval(sc.sID); sc.func(); }, 1000, this );
}

private function func():Void{
	trace( "実行" );
}

それと、最近AmazonWebServieceからカスタマーレビューが取得できなくなってしまっていましたが、正常に取得できるように戻ったようです。リスがまたしゃべれるようになりました。

[ FLASH ] [ update ] 2005年08月03日 01:33 | コメント (0) | トラックバック

MENUのROOMのテーブルをチェックすると書き込みができるメッセージボードですが、少し内部システムを変更しました。
今まで自作cgiにて書き込みシステムを作成していましたが、作りが甘いため どんな書き込みがあるのか いちいちMENUから確認しにいかなくてはなりませんでした。
このcgi部分をお絵描き掲示板のbbsnote.cgiに丸々変更し、RSSにて書き込み状況を監視できるようにしました。これでセキュリティ対処はばっちり行えます。

少し以前の書き込みは消えてしまいましたが、よろしければまたお気軽にお書き下さい～

[ FLASH ] [ update ] 2005年08月02日 20:13 | コメント (0) | トラックバック

PICTPUZZLEオープニング画像カスタマイズ例です。
もう少しでダウンロードページを公開します。

[ FLASH ] [ GRAPHIC ] [ update ] 2005年07月30日 23:12 | コメント (0) | トラックバック

ランキング処理組み込みとエラー処理周りを作成しました。
よろしければ遊んでみてデバッグにお付き合い下さい。

▽続きを読む

[ FLASH ] [ update ] 2005年07月23日 23:54 | コメント (0) | トラックバック

BGMの作成と、ブロック画像の改良を行いました。

▽続きを読む

[ FLASH ] [ update ] 2005年07月18日 22:00 | コメント (0) | トラックバック

ブロック画像やゲーム背景画像を組み込みました。ブロック画像はちょっとイマイチな感じがするのでもう少し色々考えて見ます。
メニュー部分はまだ仮の表示です。また、ランキングは機能していません。

▽続きを読む

[ FLASH ] [ update ] 2005年07月14日 01:26 | コメント (0) | トラックバック

さすらいのマウスクリッカー改めPICTPUZZLEデザイン作成中。

[ FLASH ] [ GRAPHIC ] [ update ] 2005年07月06日 01:47 | コメント (0) | トラックバック

グラフィック作成中。オチ画像1です。

[ FLASH ] [ GRAPHIC ] [ update ] 2005年07月03日 16:41 | コメント (0) | トラックバック

ゲームグラフィック作成中。恋愛シミュレーションゲームです。グラフィックは二倍に拡大して表示させる予定。
こふき姫がヒロインなのでもうオチは見えていますね☆

[ FLASH ] [ GRAPHIC ] [ update ] 2005年06月30日 01:29 | コメント (0) | トラックバック

ネタで終わるかも。
画像の回り込みで文章を書きたいのですが、DIV枠の横幅固定の指定をしておかないとIEで変な表示になってしまうバグがあるのですね。スカスカで縦長なエントリーになってしまうのでイメージ画像は横に寝そべらせました。

[ FLASH ] [ GRAPHIC ] [ update ] 2005年06月28日 21:35 | コメント (0) | トラックバック

その昔 大学のインターネットを利用した授業にて暇だった時 決まって遊んでいたブラウザゲーム「さすらいのマウスクリッカー」。JavaAppletで作成されいましたオチゲーで、中毒性はかなりのものでした。
最近仕事でオチゲーを作成する機会があり、昔に帰ってまた遊んでみようとネットでさがしてみたのですが、どうやらサイトが消滅してしまっているようで 今どこにあるのか見失ってしまう状態に。
遊びたくて仕方がなかった私は記憶を頼りにFlashにて似た感じのゲームを作成しました。今後は更にアレンジを加え独自のゲームにします。

というわけで よろしかったら是非お試し下さい～ ↓

▽続きを読む

[ FLASH ] [ update ] 2005年06月25日 23:20 | コメント (1) | トラックバック

複数キャラクターが動作するようになりました。

▽続きを読む

[ FLASH ] [ update ] 2005年06月22日 01:20 | コメント (0) | トラックバック

なんやわんやでカバが動的に動くようになりました。

▽続きを読む

[ FLASH ] [ update ] 2005年06月19日 18:43 | コメント (0) | トラックバック

人工無能RSSリーダのグラフィックに擬似3D空間でカバを動作させようと考えております。

▽続きを読む

[ FLASH ] [ update ] 2005年06月08日 12:03 | コメント (2) | トラックバック

TOPページ更新にあわせ 最近の気になった記事を5件表示するようにしました。記事にカーソルを合わせると私のその記事に対してのコメントが表示されます。コメントは別の場所に表示したほうが見やすいかもしれないですね…
この記事は、はてなブックマークの機能を利用させてもらっています。
始めはperlでRSSを読み込ませiframeを用いて表示させようと考えました。しかし読み込みがとても遅く、その読み込んでいる間 nowloading のような表示をさせたかったのですが上手い方法を見つけることが出来ず断念しました。perlというのは処理が最後まで全部終わらないと対象ページが表示されないのでしたっけ。結局Flashにて作成することに。XMLConnectorとDataSetのコンボの簡易作成です。はてなブックマークのRSSはPHP経由で読み込ませています。

[ FLASH ] [ update ] 2005年06月05日 01:23 | コメント (0) | トラックバック

TOPページにAmazonの広告を設置しました。マニアックな品物を紹介していく予定ですので、気が向きましたら私めのレビューでもご覧下さい。(まだ数点しか紹介しておりません。)TOPページのほか、Blogの個別記事等にも順次設置していく予定です。
リスレビューは最近作成していました人工無能の機能の一部を用い、AWSから引っ張ってきたデータを元に作成しています。またAmazonの商品画像データは外部サーバにあるためFlashから直接読み込むことが不可能なので、PHP経由で読み込ませています。
FlashMX2004ProのコンポーネントWebServiceConnectorを用いると簡単にAWSへ接続が可能です。
参考サイト
こちら側では紹介したい商品のASIN(商品番号)とその商品に対するレビューをExcel等で一覧にまとめておくだけで、他の必要なデータは全部AWSから自動で取得できます。Excelにまとめたデータはこのツールを用いてXMLに書き出しFlashで読み込ませています。
WebServiceConnectorから接続しているのはAWS3.0です。AWS4.0(Amazon-ECS)へはWebServiceConnectorから接続しようとしても、何故か繋ぐことが出来ないようです。但し、以前はAWS4.0へ接続しようとしただけでFlashアプリケーションごと強制終了をくらってしまっていたのですが、最近また試してみましたら 強制終了することはなくなったようです。ということは、問題があるのはAWS4.0側なのですかな…？

エラー時の処理をまだ組み込んでいないので、動作が怪しくなる場合があります。チカチカ変な動作をしてしまうので、その時はごめんなさい。

[ FLASH ] [ tips ] [ update ] 2005年06月04日 16:28 | コメント (0) | トラックバック

男の子の部屋を出た部屋にてSITE INFOページへ飛べるようになりました。団子一味の歴史が今あばかれる…！
昔の事を思い出して羅列させたのですが、曖昧な部分もあり少しいいかげん。管理人白玉の箇所には、後でもっと何かしっかり書こうと思います。

また、MENUのINFOをTOPに変更。次はTOPページを少し作り直します。
しっかりとしたイラストを描こうと思っているのですが どんな絵にしますかなあ。

[ FLASH ] [ update ] 2005年06月03日 23:30 | コメント (0) | トラックバック

なんだか作成中ばかりですね。いかんとです。
二つ目の部屋がなんだかものさびしかったので、SITE INFOページに飛べるようにします。新しく作るSITE INFOページにもう少し詳しい個人的な情報を載せる予定です。
MENUのINFOページにありますINFO画像はSITE INFOページへ移行します。そして変わりに最近完成したFlashを貼り付ける予定。

[ FLASH ] [ GRAPHIC ] [ update ] 2005年06月02日 19:58 | コメント (0) | トラックバック

他のゲーム用に作成していましたグラフィックなのですが、次の製作物へ流用のためにモノクロだったものを着色。

[ FLASH ] [ GRAPHIC ] [ update ] 2005年05月26日 21:39 | コメント (0) | トラックバック

ROOM用画像作成中。
階段を上った部屋から外に出たところのイメージ図です。おばけの国なので常に夜であります。夜の部屋からもれる明かりが好きなのですが自分で描くとなると難しいですなあ。
ここでは、静かな音楽流して、車をたまにブーブー走らせたいですね。上手くいくかどうか。

[ FLASH ] [ GRAPHIC ] [ update ] 2005年05月22日 22:25 | コメント (3) | トラックバック

コンピュータ関連用語は サーバー→サーバ、ユーザー→ユーザ といった感じで通常最後伸ばす単語は伸ばさないで記述する慣習があるので、RSSリーダーというよりRSSリーダといったほうがいいのですかな。

人工無能RSSリーダのサンプル第一弾を作成しました。人工無能と言いましても単純にRSSから読み取った文章を整形してランダムで表示するだけのお粗末なものです。現在はX-LABOのRSSを読み取りカバにしゃべらせています。

▽続きを読む

[ FLASH ] [ update ] 2005年05月20日 22:40 | コメント (2) | トラックバック

団子一味を用いて人工無能RSSリーダーを作成します。人工無能なので、ある程度まともに、後はでたらめな内容を表示します。
以下におおまかな仕様を公開。

▽続きを読む

[ FLASH ] [ update ] 2005年05月18日 20:28 | コメント (0) | トラックバック

FlashとImageMagickとの連携によるブロック崩し作成がようやく完了です。ROOMのベッドを早速チェック！

▽続きを読む

[ FLASH ] [ update ] 2005年05月13日 13:20 | コメント (2) | トラックバック

イヨーッ！とこふき姫がメインの ブロック崩しタイトル画面作成中。クリックすると拡大画像が表示されます。
大きな画面のFlashを作成するなら、ドット絵を等倍に拡大したものを利用して 味を出していきたいです。

[ FLASH ] [ GRAPHIC ] [ update ] 2005年05月11日 16:40 | コメント (0) | トラックバック

FlashとImageMagickの連携で作成しているブロック崩しの画面をデザイン。
ベッドを調べたら遊べるようにする予定です。

[ FLASH ] [ GRAPHIC ] [ update ] 2005年05月05日 20:06 | コメント (0) | トラックバック

ノート部分のミニムービーにエフェクトを追加しました。皆さん素敵なメッセージありがとうございます。

(5月4日13時)只今調整中に付きメッセージが見れません。

(追記)調整終了
名前・メッセージを入力せずに間違えて送信ボタンを押してしまった場合の対処をとりました。
UTF-8の他にUTF-8Nというものがあることを今回の修正にて知る。ローカルマシンのWindowsでは動作する自作cgiをUTF-8で保存してサーバにアップしてみたら何故か500エラーが発生してしまい どういうこったと調べておりましたら、UTF-8Nで保存すればいいような事が書いてありましたので早速UTF-8Nに保存して修正完了。文字コードの問題は難しいですなあ。
UTF-8のページの作り方

(追記2)
IEからみたらメッセージ書き込み部分が文字化けしていました… なので化けないよう修正しました。

[ FLASH ] [ GRAPHIC ] [ update ] 2005年05月04日 00:43 | コメント (0) | トラックバック

FlashとImageMagickの連携1の続きです。
1で作成したFlashにゴリゴリ処理を加え ブロック崩しゲームを作成しました。

▽続きを読む

[ FLASH ] [ update ] 2005年05月03日 22:08 | コメント (0) | トラックバック

ROOM Flashにてミニムービーが一つ見れるようになりました。男の子の部屋を出た所のテーブルの上のノートをCHECKしてみてください。曲にあわせてリスと白玉がリズムを取るだけの簡単なミニムービーです。(製作日数 約4日/グラフィック1.5日・プログラミング1日・曲2日)
メッセージボード表示機能を備えていますので、マナーを守って どなたでもお気軽に何か書き込みください～

(追記)
読み込み中にBACKを押して再びノートをチェックすると、テキスト表示がだぶってしまうというバグがあるようです。原因を調査し後に修正します。

(追記2)
修正完了しました。

[ FLASH ] [ update ] 2005年05月01日 16:31 | コメント (3) | トラックバック

perlから操作できるImageMagickという画像処理ツールがあります。ImageMagickがサーバにインストールされていれば、どなたでも簡単に利用することができます。
今回、次のゲーム製作のためにImageMagickを利用してみることにしました。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2005年04月28日 21:24 | コメント (0) | トラックバック

ようやくバグも取れ、ROOM用のFlashを左MENUに組み込みました。
昔作った「カバゴンクエスト」「わたしのおむすびおひとついかが」「団子談話室（チャット）」が遊べます。三つ目の部屋での階段はまだ上ることが出来ません。きちんと検証していないので、ゲームswf呼び出し周りにバグがあるかもしれません。それと、カバゴンクエストとおむすびゲームの記録ですが、swfを配置しているディレクトリ構造を変えていないのでまだ残っていると思うのですが、きれいさっぱり記録がなくなってしまっていたらまこと申し訳ないです…すみません、すみません。

(追記)
細かい部分で気になるところがいくつかありますが、大きなバグは修正できましたので後は少しずつ直していきます。ゲームデータ復帰を試みましたができませんでした… 大変申し訳ありません。

(現在までに気付いたバグ)
・チャット選択後、ROOMに戻るとクリックしていないのにキャラクターが動作してしまう
・OS内のゲーム詳細表示ウインドウが真っ白になる時がある
・OS内のゲーム終了後、OS画面上でキー操作を受け付けなくなる
・BLOG,P-BBS表示中にも後ろで男の子が動けてしまう

[ FLASH ] [ update ] 2005年04月24日 19:53 | コメント (6) | トラックバック

完成が近づいてきました。

▽続きを読む

[ FLASH ] [ update ] 2005年04月21日 17:33 | コメント (2) | トラックバック

部屋イメージ

1.PCチェック
2.PC起動中...Mac風
3.以前のMENUで遊べたGAMEアイコン表示

うっすら表示しているロゴはMT(まったり)OS。団子一味製ＯＳです。
ゴミ箱を押すとOS終了予定。

[ FLASH ] [ GRAPHIC ] [ update ] 2005年04月13日 00:20 | コメント (0) | トラックバック

ROOM Flash作成中。

▽続きを読む

[ FLASH ] [ update ] 2005年04月12日 01:13 | コメント (0) | トラックバック