xionchannel@software

cocos2dでパレットっぽいことをしてみたい

2012-01-14T15:54:00.009+09:00

　こんな感じに同じキャラなんだけど色違いのキャラをいっぱい出したい場合、2D表現が主流だった頃はパレットの色を変更することで実現するということがメジャーでした。しかし今の主流はテクスチャを使用した画像処理なためパレットの効果を入れるにはちょっと大変です。cocos2dもOpenGLベースなので条件は同じですね。ということで実現するには…と考えてみた。

●アイデア
１，テクスチャ書き換え
２，白い素材を用意し、マテリアル色指定
３，シェーダーでリアルタイム書き換え

　１と２の方法は「cocos2d for iPhone 1 Game Developer Cookbook」に処理の紹介がありますので、そちらがわかりやすいです。

１，テクスチャ書き換え
　肝はCCTexture2DMultableというテクスチャ書き換え機能のついたCCTexture2Dクラスを使うことですね。これはOpenGL側で管理しているテクスチャメモリを書き換える為のメソッドが追加されたCCTexture2Dだと思えば良いです。

　利点：元になるテクスチャが何色でもOK。

　欠点：色変更後のテクスチャはそれぞれ別にメモリに載るので不経済。テクスチャが共通じゃないのでCCSpriteBatchNodeが使えない。そのため描画が多少遅い。

２，白い素材を用意し、マテリアル色指定
　これは元の絵のなかの色を変えたい部分だけを切り分けた別レイヤーとして素材を用意し、白で描いておく。これを使ったCCSpriteを色指定することで色を載せるというもの。cocos2dの基本機能だけで実現できます。

　利点：テクスチャが共通化するのでCCSpriteBatchNodeが使え、描画が高速なはず。省メモリ。

　欠点：色を変えたい部分を分けた素材を用意するのが手間。

３，シェーダーでリアルタイム書き換え
　OpenGLES2以降であればピクセルシェーダが使えるので、描画時にリアルタイムに色変更して表示することができるはず。

　利点：テクスチャが共通なので省メモリ。

　欠点：僕はシェーダー作ったこと無い。OpenGLES2に対応したcocos2d2.0のベータ版を使わないとならない。描画が遅いかもしれない。シェーダーに渡すパラメータが色ごとに変化するので、CCSpriteBatchNodeで処理させるには難しいかも？

　以上が考えられるなぁと思いました。

　まずはお手軽なところからと、１の案をテストしたのが冒頭の画像です。iPhone4での表示ですが、１キャラあたり６レイヤーつかっていて、５０体表示という状態です。これで60FPS出ているので処理能力的には十分かもなぁという印象。ただし、MacBookPro上でシミュレーターでの実行結果は30FPSしか出ませんでした。CCSpriteBatchNodeは使ってません。
　cocos2dのcookbookで紹介されているままの方法では、色変更後のテクスチャはCCTextureCacheへ乗らず、同じ色変更を何度も指定すると同じテクスチャが量産されてしまうコードだったため、その部分は自前でキャッシュへ載せて共用するように直しました。

　次は２のアイデアを試そうと思ってます。そのためには絵素材を色別に分離して別々のテクスチャに分配する必要がありますが、手作業でやるのめんどい…。２の方が処理が速いのであれば、最終的には絵素材の分離ツールを作らないとだなぁとか思ったり。

●追記
　２のアイデアを実装して試したところ、CCSpriteBatchNodeの威力もあるだろうが１００人出しても60FPSラクラク回ってました。１レイヤー（というかCCSprite）には１色しか指定できないので、色分だけ枚数が増えてますがそんなの全く影響が見られないですね。下図は１キャラ１１レイヤー使ってます。ちなみに、CCSpriteのcolorプロパティで色を設定するとその色が乗算されるので黒の輪郭を色変更せずにそのまま残したいという場合は、どこかのカラーのスプライトに入れ込んでしまってもOKです。黒なので他の色を重ねても黒以外になりませんから。

coco2d Advent Calendar 2011 24日目: オーバートップレイヤーのすすめ

2011-12-25T22:47:00.006+09:00

あいかわらず後からの投稿になっちゃいますが、めげずにcocos2d Advent Calendar投稿します。
　今回は、以前さいたまiPhone勉強会で発表した内容からのピックアップで、オーバートップレイヤーというものを実装してみたという例のご紹介です。

＜中級編＞オーバートップレイヤーのすすめ

●まえがき
　ゲームでは、よく画面を覆う枠があったり、画面上部に体力やスコア表示などが分けて表示されていたりするような画面配置がありますよね。たとえば、以下のような感じです。
　Ysなどの往年の国産PCゲームでは、画面を覆う枠があり枠内がスクロールするゲーム画面。枠の下には体力などのパラメータ表示となっていました。たとえばこんな感じで検索するとヒットしますよ。
　また、ファミコンのゲームではよく画面を上下に区切って画面上部にアイテムやパラメータ表示をして、画面下部はスクロールするゲーム画面として使用するようなものもメジャーでした。たとえばグーニーズとか。ほら検索すると画面がヒットしますよ。

　こんな感じの表示を行う場合に、CCLayerを２つ用意して、１つは枠や画面上部のパラメータ表示用に使用し、もう１つはゲーム画面として使用するように作ると思います。しかし、ゲームの進行で別のマップへ移ったりする際にフェードアウト・フェードインして画面切り替えを行おうとするとcocos2dで普通に推奨されている方法で組むと、パラメータ表示用も含めてフェードがかかってしまい、あまりかっこ良く有りません。ちなみに、このcocos2dで推奨されている組み方はCCSceneにCCLayerを２つ子供にして別のCCSceneへ切り替えるというものです。
　そこで、今回ご紹介する方法が出てくるわけです。

●オーバートップレイヤーの仕組み

　仕組みはこんな感じとなります。通常cocos2dで用意されている画面遷移関数はCCSceneを入れ替えるものですが、この方法ではCCScene自体は基本的に入れ替わらず、ゲーム画面として使用しているCCLayerだけが入れ替わるという構造になります。もちろん、そんな便利なメソッドは用意されていないので、レイヤー入れ替え部分は自作しなければなりません。

　CCSceneの定義自体はこんな感じとなります。

+(MainScene*)sceneWithLayerTop:(CCLayer*)layerTop
　　　　　　　　　　　layerBelow:(CCLayer*)layerBelow
{
　　MainScene *scene = [MainScene node];

　　layerTop.tag = kLayerTop;
　　layerBelow.tag = kLayerBelow;

　　[scene addChild:layerBelow z:0];
　　[scene addChild:layerTop z:2];

　　return scene;
}

　で、画面遷移用にとりあえずこの２つのメソッドを用意してみました。メソッドの中のコードはサンプルコードを参照してください。transitionFadeWithLayerは黒フェードを用いてレイヤーの入れ替えを行うものです。transitionFlowerWithLayerはオマケ的なものですが、花で画面が埋め尽くされて花が画面上から去るとレイヤーが入れ替わっているというものです。

- (BOOL)transitionFadeWithLayer:(CCLayer*)layer
　　　　　　　　　　　duration:(ccTime)d;

- (BOOL)transitionFlowerWithLayer:(CCLayer*)layer
　　　　　　　　　　　duration:(ccTime)d;

●実装の注意点
　実装にあたって、以下の部分に注意しました。
・関係するレイヤーのタッチイベントの無効化だけでは余り効果を発揮しなかったので、画面遷移の重複が起きないように注意した。
・トランジション中フラグを用意して、トランジションメソッドが複数動作しないように制御した。
　と、こんな感じですが、荒削りなので実際に使用するにはもう少し改善の余地はありそうです。でも、夢が広がると思います。

●夢がひろがりんぐ
　もともとオーバートップレイヤーが欲しいなと思ったのは、GameCenterでのアチーブメント解除表示を行う際に画面上部などにアチーブメント情報を表示し始めたとしても、その後すぐに画面遷移が行われてしまった場合にアチーブメント表示が消えてしまうのをなんとかしたいと思ったところから発想しました。もちろん、ネットをググれば同様の問題の対処としてcocos2dのCCSpriteオブジェクトなどをcocos2d外のものに適用して表示させる方法があったりしましたが、なんだかスマートじゃないなと思っていたのです。どうせなら表示はすべてcocos2dの中で完結させたいと。
　オーバートップレイヤーがうまく動いてしまえば、往年のゲーム的な画面表示が簡単に行えるので、これはいいんじゃないでしょうか。おすすめですよ。

　ではでは、今回はこのへんで。

coco2d Advent Calendar 2011 22日目: Tiledの使い方講座

2011-12-22T23:40:00.002+09:00

cocos2d Advent Calendar 22日目としてさくっと書きました。
　cocos2dとはちょっとズレた話かもしれませんが、CCTMXTiledMapを活かそうと思ったら使うことになるTiledというマップ作成ツールの使い方について解説します。

＜初級編＞Tiledの使い方講座

●基本機能
　Tiledは正方形（トップビュー、サイドビュー）、平行四辺形（クォータービュー）、六角形（ヘックス）のスクロール可能なマップを作成するのに非常に便利なツールです。もともとはPythonのゲーム用に作られたこのツールですが、cocos2dのCCTMXTiledMapクラスでサポートされた形式tmx形式を出力可能なツールとなっています。というか、cocos2dの方がtmxに対応させたということになりますか。

　以下のスクリーンショットを見てもらえれば、どんなマップが作れるのかよく分かると思います。

　一番上のマップはHungryMasterで使用したもので、トップビューとなっています。真ん中はTiledのサンプルに用意されているもので、トップビューなのですが、左上に向かって上層がつながって表示されているややパースペクティブなもの。一番下の例はクォータービューとなっております。クォータービューのタイルチップはこちらのものを使用させてもらいました。
　マップはレイヤー構造を持てますので、それを利用することで、地面、建物、２階部分などをレイヤー分けして載せていくことができます。クォータービューのものを例に取りますと、地面レイヤーだけでは以下のようになります。

　これに建物レイヤーを重ねることで、次のようになります。

　さらに、オブジェクトレイヤーという範囲指定が行えるレイヤーを設定し、範囲指定を行うと以下のように設定が行えます。この範囲を何に使うかはゲーム部分で自由に利用すれば良いのですが、得られるの矩形の４点となります。

●実践してみましょう

　まず「ファイル＞新規ファイル」コマンドにて、どんな形状のマップを作成するか設定します。ここでは、平行四辺形の並んだクォータービューマップにしてみましょう。これって結構たいへんなんですよね。ここで指定する数値は平行四辺形の地面部分が収まるサイズのドットを指定します。使用するマップチップの画像はこれを使用してみましょう。

　こんな感じに空のマップが用意されます。さらに、使用するマップチップを登録して配置可能にしましょう。
　「マップ＞新しいタイルセット」コマンドを実行し、タイルセットとして登録します。

　この時に、指定するタイルの高さは透明部分も含めたサイズになりますので、地面部分の高さしないように注意しましょう。
　正しく登録できると、こんなふうにタイルを配置可能です。

　次は、壁を配置しましょう。新しいレイヤーが必要になります。「レイヤー＞タイル・レイヤーの追加」を実行すると、タイルレイヤーが１つ増えます。そのレイヤーをアクティブにしてタイルを配置すれば上のレイヤーに物が置けます。

　どんどん上層レイヤーを増やしていけば、２階、３階などどんどん増築できます。

　再度に範囲指定用のオブジェクトレイヤーを追加してみましょうか。
　「レイヤー＞オブジェクト・レイヤーの追加」を実行すると範囲指定用のレイヤーが生成されます。これをアクティブにして、「オブジェクトを追加」アイコンをアクティブにすると、範囲指定ができます。

　以上です。
　駆け足ですが、ざっと使い方についてのみ解説してみました。

coco2d Advent Calendar 2011 10日目: cocos2dキャラクタークラス設計の考察

2011-12-10T17:03:00.006+09:00

cocos2d Advent Calendar 10日目、２回目の投稿なのですけどすみません。まだまだ空きはあるので我こそはという方はどしどし参加してみてください。前回、12/9日目の記事は@mybさんのこの記事でした。「CCMenuでラベル付きボタン、長押しボタン」

　さて、今回はcocos2dでゲームを作る上で考え方の参考になるような記事を書ければと思ってこれを書いています。

＜初級編＞cocos2dキャラクタークラス設計の考察

●ゲームにおけるキャラクターに必要な要素
　ゲームには多くの場合キャラクターが登場します。プレイヤーキャラクター、エネミーキャラクター、アイテムなんかもキャラクターに含まれるかもしれません。落ち物パズルなどでも落ちてくるブロックのパーツはキャラクターのようなものと考えられます。ゲームキャラクターにはどんな要素が必要なのか、まずは考えてみましょう。

・横スクロールのジャンプアクションの場合（スーパーマリオブラザーズなど）
　A・キャラクターの絵
　B・動作によって変化する絵のパターン、場合によっては動く
　C・画面上の障害物によって移動制限がある
　D・何らかのアイテム効果によって変化することがある
　E・やられると画面から消える
　F・武器を発射することがある
　G・別のキャラクターを発生させることがある

・トップビューのアクションＲＰＧの場合（イースなど）
　A・キャラクターの絵
　B・動作によって変化する絵のパターン、場合によっては動く
　C・画面上の障害物によって移動制限がある
　C2・画面上の建造物などによって一時的に隠れて見えなくなることがある
　E・やられると画面から消える

・シューティングゲームの場合（ゼビウスなど）
　A・キャラクターの絵
　B・動作によって変化する絵のパターン、場合によっては動く
　E・やられると画面から消える
　F・武器を発射することがある
　G・別のキャラクターを発生させることがある

　ざっと思いつく限り書いてみましたが、よくあるゲームジャンルではこんなところが求められるでしょうか。パズルゲームは特殊なのでここでは省きますね。他のゲームよりも求められる要素は少ないはずです。あとで復習がてら考えてみてくださいね。
　では、代表的な要素であるA, B, Eを考えてみましょう。

●キャラクターの絵を扱う
　基本的なCCSpriteの扱いとそれほど変わりません。そのままCCSprite型をキャラクターとして扱って構わないことも多いでしょう。キャラクターの絵が変化する場合には少し要素が増えます。たとえば、絵が変わるたびに新たにCCSpriteを生成して割り当てるとすると以下のようになります。gmCharaという名前でクラス定義したとして仮に書いています。

@interface gmChara : CCNode（あるいはNSObject） {
　　CCSprite *sprite;　//キャラクター用スプライト
　　CGPoint accel;　//加速度
　　int vital;　//体力
　　...などなど
}

　あるいは、CCSpriteを継承して絵のフレーム自体を変更する場合は以下のようになるでしょう。

@interface gmChara : CCSprite {
　　CGPoint accel;　//加速度
　　int vital;　//体力
　　...などなど
}

　絵のフレームを変更するには、以下のようなコードで行うことができます。CCSpriteで使用しているテクスチャに必要な絵が全て入っていて、その一部を切り出して使用しているという状況が前提となりますが簡単に絵を変更できます。CCSpriteを再生成して割り当て直すよりも高速なはずです。CGRECT_FOR_NEWは新たに指定したい切り出し用のCGRectです。spriteはCCSprite型とします。

[sprite setTextureRect:CGRECT_FOR_NEW];

　さて、これらの例に移動用の加速度パラメータはあるのに、移動後の位置を格納するプロパティは用意されていません。そうです。CCSprite自体に位置を扱うプロパティが存在するので、そちらを使う方が無駄が少ないからですね。ゲームの要求として表示位置とは別に位置情報が必要になる場合は別途プロパティを用意するべきでしょう。サイズ用のプロパティが存在しないのも同様の理由ですが、サイズの場合は当たり判定の大きさが絵の大きさとは異なることも多いので、別途プロパティを用意したほうがいいかもしれません。

　実は、ElectroMasterやHungryMasterでは上記の方法でキャラクタークラスが構築されています。おそらく無駄が多いと思います。やっちまいましたね。

●やられると画面から消えるために
　敵などをやっつけると、画面上から姿が消えるのがゲームのお約束であることはみなさんもお分かりのはず。
　消すだけなら簡単です。絵を取り扱うCCSpriteを表示しなければ良いのですから。しかし、表示を消しただけではキャラクターの存在自体はメモリ上に残り続けてしまいます。ですから絵を消す代わりにキャラクターのオブジェクトを解放しちゃってもいいかもです。いいかもしれません。ゲームに登場するキャラが有限である場合はこれで十分でしょう。
　では、ゲームに登場するキャラが無限に発生する場合は困ったことになります。敵が発生するたびにキャラオブジェクトを生成してゲームへ追加していくのも手です。一度倒してしまったキャラオブジェクトを再利用して追加のキャラとして復活させることもいいかもです。

　A・キャラが有限の場合
　　ゲーム開始時にキャラオブジェクトを全て生成しておいて、倒すたびにクラス解放でいいでしょう。
　　倒せば倒すほど処理も軽くなりますね。

　B・キャラが無限に発生する場合
　　1. キャラが発生するたびにキャラオブジェクトを生成してゲームへ追加とする。普通にやるとオブジェクト生成時のオーバーヘッドが大きいかもです。次善の策としてはひな形オブジェクトを用意しておいて、そのコピーを追加する。（newChara = [[chara copy] autorelease];とすればコピーが生成できますね）

　　2. キャラオブジェクトを再利用する場合。一度に画面に登場するキャラ数は事前に生成しておいたキャラオブジェクト数に制限されますが、キャラを初期値に最設定するメソッドを用意しておけば高速に復活させられそうです。また、一度に取り扱うキャラ数限界も管理しやすいので、メモリや処理能力的にも優しいかもです。手前味噌ですが、ElectroMaster, HungryMasterではこの方法を取っています。

●動作する絵のパターンを取り扱う（パターンアニメーション）
　キャラクターが移動すると、歩いたり走ったり、ジャンプボタンでジャンプしたり。敵に触ったら痛がったりというようなキャラクターの動きに関するものです。これが無いと物足りないですよね。多くはキャラクターの絵を複数用意しておいて、場合によって絵を切り替えて動いているかのように見せています。パターンアニメーションですね。
　cocos2dの入門書ではパターンアニメーションについて扱っていて、そういう動作を割りと簡単に与えることができるように説明されています。単一のパターンアニメーションを指定するだけなら難しくありません。よく悩んでる人が多いのは、右に移動すると右向きの絵で歩く、左に移動すれば左向きで、上なら上向き、下なら下向きといったように場合に応じて使用されるパターンアニメーションが変化するときにどうするのがよいかということでしょう。

　パターンアニメーションの定義は以下のようにできます。これは入門書にも書かれていますね。下記の例では、512x64のテクスチャを用意してあって、横方向に8枚の絵が並んでいる状態を元に、64x64の絵が0.3秒毎に変化していくというパターンアニメーションとなります。生成されたパターンアニメーションはCCRepeatForever型（CCAction系列として取り扱える）として最終的に定義されます。TEXTURE_FILE_NAMEはスプライトに使用するテクスチャのファイル名です。

CCTexture2D *texture =
　　[[CCTextureCache sharedTextureCache]
　　　　addImage:TEXTURE_FILE_NAME];
NSMutableArray *animFrames = [NSMutableArray array];

for (int x=0; x<8; x++) {
　　CCSpriteFrame *frame =
　　　　[CCSpriteFrame frameWithTexture:texture
　　　　　　rectInPixels:CGRectMake(64*x, 0, 64, 64)
　　　　　　rotated:FALSE
　　　　　　offset:CGPointZero
　　　　　　originalSize:CGSizeMake(64, 64)];
　　[animFrames addObject:frame];
}

CCAnimation *animation =
　　[CCAnimation animationWithFrames:animFrames
　　　　delay:0.3f];
CCRepeatForever *action =
　　[CCRepeatForever actionWithAction:
　　　　[CCAnimate actionWithAnimation:animation
　　　　　　restoreOriginalFrame:NO]];

　これをCCSpriteへ適用してパターンアニメーションを実行するには、通常以下のようにします。

[sprite stopAllActions];
[sprite runAction:action];

　こんな手順を適用するパターンアニメーションが変化するたびに行えば、パターンアニメーションを変更することが可能ですが、stopAllActionsを実行するとそれまで適用されていたアクションが解放されてしまうので、次に同じアクションを最適用する場合でも、新たに定義しなおしたアクションを与えなければなりません。となると定義に必要な処理が無駄になってしまいます。（stopAllActionsではなくstopActionを使用して名指しで停止するアクションを指定してあげても良いですが、同じことです）

　では、パターンアニメーションのアクション再定義に必要な処理を軽くするためにはどうすれば良いでしょうか。キャラクターの絵について説明した部分でも書きましたが、１つの方法としては事前に定義しておいたアクションオブジェクトをコピーして与えてあげれば良いです。あらたにオブジェクトを初期化するよりも処理は軽いはずです。もう１つ考えられるとすれば、stopActionなどを行なっても解放されないようにretainしておくのも良いです。retainしておくにはCCArrayやNSArrayなどに格納しておくのが呼び出すのも楽なのでいいでしょう。

　コピーして与える場合は、こんな感じでしょうか。事前にactionとして定義しておいて、使用する際に随時コピーします。コピーして与える場合は、キャラ毎にパターンアニメーションを保持するのではなく、キャラの種類毎に保持するような運用の場合に活きてきます。というのも単一のアクションオブジェクトを複数のスプライトに対して適用するとタイマーがそれぞれのスプライトから更新されて動作がおかしくなるため、各スプライトへ別々のオブジェクトを与えなければならないためです。個々のスプライトでアクションを保持していた場合はその点ではコピーする必要が無いと思われます。

[sprite runAction:[[action copy] autorelease]];

　でも、actionをまとめて管理しておくにはやはりNSArrayやCCArrayに入れておくと思いますので、以下のようにしますよね。そうすると、CCArrayなどに格納した時点でretainされますので、アクション終了後に解放されなくなります。というわけで、メモリの占有率が変化しないこっちのほうがおすすめです。

@interface gmChara : CCSprite {
　　CCArray *actions;　//パターンアニメーション保持用
　　...などなど
}

　実際の適用はこちら。0番目に登録されているパターンアニメーションを適用させています。spriteはCCSprite型とします。

[sprite runAction:[actions objectAtIndex:0]];

　以上のような取り扱いでうまく制御ができると思います。

　ところで、ElectroMaster, HungryMasterでは、かなり無駄な組み方をしていたことに、この記事を書きながら気づいてしまいました。上記のようなCCArrayなどに予めパターンアニメーションを格納して管理していたところまでは一緒なのですが、CCRepeatForeverを噛まさずに入れておいてアニメーション適用時にいちいちCCRepeatForeverを生成して適用しておりました。なので、その部分がオーバーヘッドになってました。これには理由があって、毎回新たにCCRepeatForeverを生成しないと再生開始フレームが最初からにならないかもしれないって思っていたからです。しかし、実際にはそんなことはなく過去に再生済みのアクションであっても最適用すれば最初から再生されますので、要らぬ心配でした。それから、アクションをコピーしてから適用しておりました。これも無駄で、CCArrayなどに格納した時点でretainされいるためにアクション終了時に解放されないわけです。なので、解放を恐れてコピーすることも無かったということになります。以下はそのダメコードの例です。

id action = [[[actions objectAtIndex:0] copy] autorelease];
[sprite runAction:[CCRepeatForever actionWithAction:action]];

　今回の記事はここまでにしておきます。今回解説しなかった障害物判定については機会がありましたらまた説明できればと思っています。次は@Seasonsさんの予定と聞いております。楽しみー。ではー。

　追記：11日目の記事はこちら：@Seasonsさん「cocos2dパフォーマンスチューニングTips」

coco2d Advent Calendar 2011 2日目: cocos2dでオリジナルフォントクラスを作ろうぜ！

2011-12-02T21:15:00.006+09:00

@yoichinejiさんから連絡があって、なんでもcocos2dのAdvent Calendarをやるとのこと！なんだか楽しそうなので、１も２も無く参加してみましたー。というわけで、以前さいたまiPhone勉強会で発表した内容と同内容になりますが、詳しい解説を入れて再録させてもらいました。ネタはフォントクラスについて。一応中級編とさせてもらいます。内容的にはcocos2dを踏まえていますが、基本的なビットマップフォントの考え方みたいな感じになりますでしょうか。僕が勝手にこうだと思い込んでいるものなので、いろいろ間違ってたり、効率悪い点などご指摘いただけると幸いです。
　cocos2d advent calendarのatnd：http://atnd.org/events/22814
　以下本文ですー。

<中級編>cocos2dでオリジナルフォントクラスを作ろうぜ！

●フォントについてあれこれ

　ゲームではよく変わったフォントで文字が表示されることが多いですよね。特に昔のゲームなんかはゲームの世界観を表す上でかなり重要なポジションを担っていたと思います。iOSデバイスが出てからはそのスペックに適したゲームとしてレトロ風味のものも多数出ていますが、やはり時代性を表す上でドットで作られたフォントは美味しい要素です。
　以下の図は拙作のアプリからですが、上図が等幅フォント、下図はプロポーショナルフォントで日本語を取り扱っています。

　cocos2dにはTrueTypeフォントを直接展開してテクスチャ化し使用する文字スプライトクラス（CCLabelTTF）や、ツール（Hiero Bitmap Font ToolやBMFontなど）で事前にテクスチャ化して準備しておき、それを切り出して使用するためのフォントクラス（CCLabelAtlas, CCLabelBMFont）が元々用意されていますが、今のゲームのテイストの場合は良いですが、レトロ風味ということでいうと向いていません。
　なぜなら、公開されているツールを使用する場合だと、テクスチャにフォントがアンチエイリアス有りで展開されてしまったりするからですね。まあ、テクスチャの作り方にも依るので一概に向いていないとは言えませんが…。なお、上記の上画像の下の方に表示されている日本語の文章はCCLabelTTFを使用したもので、それ以外の文字はテクスチャからの切り出しです。
　あと、日本語のことを考えるともっと向いてない要素があります。基本的にキャラクターコードに従ってテクスチャへ展開するので、無駄な領域が多く必要になってしまうわけです。その点、自前でクラスから作る場合は、トリッキーなことも含めて自分の管理下にあるわけで、仕様から好きに決められて良いというところがあります。
　正攻法でいけば、cocos2dのフォントクラスに合うフォントファイルとテクスチャを用意すれば良いですが、それは別の機会にとっておきましょう。正直言うと調べて対応するより自分で作ってしまったほうが早いってのもあります。あと、どうせ作るならcocos2dのフォントプロトコル（CCLabelProtocol）に沿った作りにすればよかったのですが、それに気づいたのは作った後だったので、すみません。以下の例はかなり変則的です。

　と、そんな前提がありまして、自前でフォントクラスを用意してみてはどうですか？という例のご紹介です。
　サンプルコードはこちらからどうぞ：http://xionchannel.no-ip.org/advent_calendar_cocos2d_day2.zip

●等幅フォントクラスを作ってみよう！

　まずは、ドットを打って文字をデザインしていきます。要領はドット絵と同じですね。作りを簡単にするには等幅フォントがいいので、その場合は、格子状に文字を配置しながらデザインしていきます。

　フォント用のテクスチャができたら、それを切り出して使用するということになります。フォントクラスを簡単に設計するためには、文字コード順に文字が並んでいると良いです。途中必要ない部分があれば省いてしまっても良いです。省かれた部分のコードの取り扱いはフォントクラスの方で対処すれば良いです。

//指定のキャラクターのCGRectを返す
- (CGRect)getRectWithASCII:(char)ascii {
　　char c;
　　if (ascii>='0' && ascii<='9') {
　　　　c = ascii-'0';
　　}
　　else if (ascii>='A' && ascii<='Z') {
　　　　c = ascii-'A'+10;
　　}
　　else if (ascii=='!') {　　//!
　　　　c = ('Z'-'A'+10)+1;
　　}
　　＜中略＞
　　else {
　　　　c = ('Z'-'A'+10)+8;　　//スペースに置き換える
　　}
　　return CGRectMake(8*(c%8), 8*(c/8), 8, 8);
}

　こんな風に文字コードを元に切り出しCGRectを生成して、CCSpriteを作成するようにします。あとはスプライトを並べていけば文字列の表示が達成できるというものです。等幅フォントの肝はこんな感じになります。簡単ですね。切り出しはもっとスマートにやる方法もありそうですね。汚いソースですみません。

●プロポーショナルフォントクラスを作ってみよう！

　レトロ風味から少し高級な印象になりますが、プロポーショナルフォントは見た目に美しいので、それをつくろうとする場合はどうしましょうか。はい。それぞれの文字の幅が異なる可能性があるので、その情報をどこかに持たなければなりません。

　まずはフォント用のテクスチャを用意してみましょう。横書き前提とすると、文字の高さは変化せず幅のみ変化することになります。たとえば以下のような感じでテクスチャを作ることになります。なお、縦書き用プロポーショナルフォントとする場合は、幅が変化せず、高さが変化するような作りが良いでしょう。もちろん高さも幅も変化するように作ることも可能ですが、それについては自分で効率良い配置を考えてみてはどうでしょうか。

　さて、テクスチャは用意できたとして、切り出しサイズをまとめる必要があります。どのような形式でも良いですが、iOSっぽくplistにいれてみた場合、以下のような感じにできます。データの置き方は自分でわかれば良いので、ほかの並びでも良いと思います。

　このデータを元にフォントクラス側でテクスチャを切り出して文字を並べていくことになります。文字コードとの対応は等幅の場合と同じようにしても良いです。以下の例の場合、カタカナも扱いたかったため文字コードを意識しない構造にしました。切り出し情報の中に対応する文字を情報として入れておき、ソース文字列に合致する文字があった場合に切り出して文字を配置するという流れです。処理は文字コードを使用したものよりも重いでしょう。

　以下は切り出しの例ですが、先ほどのplistをcharactersというNSDictionaryオブジェクトに読み込んでおきます。キーに対応する文字情報を入れてあるので、キャラクターが入ったNSStringを与えてやれば切り出しサイズが得られるという寸法です。

//指定のキャラクターのCGRectを返す
- (CGRect)getRectWithString:(NSString*)s {
　　NSArray *rect = [characters objectForKey:s];
　　if (rect) {
　　　　float x = [[rect objectAtIndex:0] intValue];
　　　　float y = [[rect objectAtIndex:1] intValue];
　　　　float width = [[rect objectAtIndex:2] intValue];
　　　　float height = [[rect objectAtIndex:3] intValue];
　　　　return CGRectMake(x, y, width, height);
　　}
　　else {
　　　　return CGRectZero;
　　}
}

　以上のようにしてオリジナルフォントクラスの基本的な部分が出来ました。切り出し用plistを用意するのは面倒ですけど、その分、切り出し自体は簡単ですね。あとは、サイズに応じて並べるときにずらすドット数もあわせてやれば、プロポーショナルな文字を並べることができますね。

　なお、一番最初の例では、カタカナのみ日本語対応していますが、濁点や半濁点を別の文字としてまとめることでキャラクター数を減らしています。なので、表示する際に、濁点や半濁点がある場合は、内部で分割して２文字分として処理して表示するように調整を入れています。昔のファミコンゲームでよく使用している手法ですね。そのために、濁点・半濁点の対応表を作っておいて照らしあわせて処理するようにしています。

//文字スプライトの初期化(private)
- (CCSprite*) __makeCharacterSpriteFrame:(CCSpriteFrame*)f
　　　　　　　　　　　　　　　　string:(NSString*)c
　　　　　　　　　　　　　　　　position:(CGPoint*)pos
　　　　　　　　　　　　　　　　isShadow:(BOOL)isShadow
{
　　CCSprite *s = [CCSprite spriteWithSpriteFrame:f];
　　[s.texture setAliasTexParameters];
　　s.anchorPoint = ccp(0,0);
　　s.scale = 2.0f;
　　if (![c compare:@"゛"] || ![c compare:@"゜"]) { //濁点・半濁点
　　　　s.position = ccp(pos->x -4*2, pos->y +8*2);
　　}
　　else {
　　　　s.position = *pos;
　　　　if (!isShadow) pos->x += s.contentSize.width*2;
　　}
　　return s;
}

//カタカナの濁点等を分解する(private)
- (NSString*) __correctString:(NSString*)string {
　　NSMutableString *ret = [NSMutableString string];
　　for (int i=0; i < string.length; i++) {
　　　　NSString *c = [string substringWithRange:
　　　　　　　　　　　　NSMakeRange(i, 1)];
　　　　NSString *replace;
　　　　if ((replace = [self.dakuten objectForKey:c])) {
　　　　　　//濁点の差し替えがあれば差し替える
　　　　　　[ret appendString:replace];
　　　　}
　　　　else {
　　　　　　[ret appendString:c];
　　　　}
　　}
　　return ret;
}

●フォントクラス応用編

　さあ、ここからがおいしいところですよ。おまけですけど。ゲームに於いて文字で表示されたメニューをタップしたり、文字の内容を変更したり、文字の色が変わったり、一文を与えただけで途中改行されたりというようなよく使う機能があると思います。そのあたりをメソッドやマクロとして組み込んでおくとゲームに使う場合にかなり便利になります。下記はそんな例です。

　ここから先は僕も作ってはいませんが、こんなネタもあったらいいんではというものをご紹介。文字がバラバラになって飛んでいくとか、文字が一文字づつカードがめくれるように回転するとか、ピカっと光るとか、シャクトリムシのように伸び縮みするとか、どれもcocos2dの基本機能を使ってアニメーション登録すればいけますが、一文字一文字バラバラに制御する必要があるので、フォントクラスの外側から制御するよりも、フォントクラス内でアニメーションを与えるような作りの方がやりやすいと思います。みなさんもそんな効果をつけてみてはいかがですか？ひと味違った文字表現になって楽しいですよ！

　そんなこんなで、フォントについてはここまで！お付き合いありがとうございましたー。

　３日目は、@ZuQ9Nnさんです。「cocos2d Advent Calendar 2011 -3日目波紋のアニメーションやてみた。オッパイぷるるんもあるんだよ！」

IGFにエントリーしました！

2011-11-15T07:20:00.003+09:00

GDCと併設されて開催されるIGF（Independent Game Festival）にHungryMasterをエントリーしましたー。

ほらほら！
http://www.igf.com/php-bin/entry2012.php?id=71

cocos2d for iPhone レッスンノートレビュー

2011-09-23T23:27:00.004+09:00

@hkato193さんから献本いただきまして、じっくり読ませて頂きました。
ありがとうございます。非常に光栄です！

そうです。昨日発売になりましたcocos2d日本語本２冊目の「cocos2d for iPhone レッスンノート」です！
いいですよー。これ。読んで実践するには多少は基本的なObjective-Cに触れていることが必要かと思いますが、iOSアプリの開発経験はなくともcocos2dを利用したゲームやアプリの開発、それをAppStoreへ申請するまでの流れをひと通り学習できます。
というわけで入門者に向けた本ではあるのですが、iOSアプリの開発初心者もそうですが、ゲーム開発初心者にも役に立ちそうです。というのも、ゲームを作る上での基本的な考え方や組み方についても丁寧な解説がされているからですね。

さて、僕はというと、cocos2dで２本ほどゲームアプリを開発したことがあります。その上で恐縮ながらコメントさせていただくと、１本作った程度の経験の方はいろいろと目からウロコが落ちる部分があるかと思います。特に、昔国民機が流行った頃にゲームを作ったきりなんて方にはcocos2dが推奨する組み方が今ひとつ馴染めずに、メインのCCLayer内に作ったメインループで全オブジェクトの処理を回すということをしてしまうので、この本の中盤に解説されているシューティングゲーム作成の項はなかなか理解を助けます。
やはり、ゲーム全体のフレーム落ちを避ける等を考慮したり、あるいはcocos2dの特徴でもあるCCAction系を活かすとなると個々のオブジェクトに自律的な制御を入れて、イベント駆動的な扱いでゲームを構築する方法が推奨されていそうですから。とはいえ、僕はそういう作りでは情報の更新タイミングがつかみにくいと思ってメインループ方式で組んでしまったりしているわけですが…。

cocos2dの猛者のような方にも、巻末のAppendixは必見です。
列挙しますと、イージングを実現するアクション一覧、つまりEaseという名称が使われているCCAction群です。これがどのようなアニメーション変化を与えるのかについて図示されているため、非常に資料価値があります。これって探しても無いんですよね。
CCParticleSystemのパラメーター。そうです。パラメーターの意味が日本語で解説されているんですよ。いいでしょう。その他パーティクル関連の細かい情報がまとめられています。
CocosDenshionについて。これについては、高度な使い方を使用とするといずれはOpenALを触らざるを得なくなるので、上級者は特に読まなくてもいいかもしれませんが、どういう構造になっているのか見ておくのも良いかも。
それから、開発に必要な各種情報源がまとめられていますので、困ったときに紐解いてみるといいかも。でも、本当に困ったら@hkato193さんや@Seasonsさんに聞くのが良いかもですねｗ　てへｗ

以上が率直な感想です。
なので、入門者は買い！そして上級者はAppendixを見て買いたくなるよきっとｗ

と、ここまで書いてHungryMasterの開発について細かい記事を書きたくなって来ました。
おいおい発想から完成までを流れに沿って記事にしてみようかな。cocos2dにも触れるよ。
ではでは。

さいたまiPhone勉強会で発表しました！

2011-08-01T23:56:00.005+09:00

@yoichinejiさん主催で先日開かれた「さいたまiPhone勉強会」の第一回に発表者として参加してきました。当日の演目は以下のとおりですが、期せずして2Dゲーム系フレームワークが集まった形でかなり豪華な内容だったなぁと思います。僕の発表した内容はまぁ置いといてｗ
　会場は蕨（わらび）の駅から１０分くらいの商工会議所。なかなか広くて良い会場でしたよ。思ったよりも遠くて荷物多い人には大変だったかもですけど。

・@Seasonsさん：IMPACT入門
・@ajinotataki：cocos2d事例編 HungryMasterの実装から
・@corosuke_kさん：Coronaで始めるiPhoneアプリ開発
・@yoichinejiさん：○○○とおまけてきなもの

　発表リストはこんなでした。

●IMPACT（@Seasonsさんの発表より）
　javascriptとHTML5でゲームをつくろうっていうフレームワークは数あれど、iOSでの実行まで考慮したものはなかなか無いのが実情。IMPACTはiOSでは描画系関数がOpenGLESでの動作に置き換えられていることで高速に動作することが特徴ですね。一部の設定やメソッド変更でほぼそのままiOSで動作させられるという点はすごいの一言。
　ライセンスが$99買い切りで、iOS用の環境も手に入るってのはいいですねー。１本出せば元取れますね。レベルエディタもついてくるって言うからなかなかいい気がします。WEBのこと考えないならcocos2dには到底かないませんが良い選択肢になりそう。
　難点があるとすれば解説や資料が英語ですら極端に少ないことと、体験版が無いことのようですね。
　あとは、作者の方の更新スピードがちょっと最近芳しくないとか…。
当日のスライドは後日公開となるそうなのでここではお見せできません＞＜

●Corona（@corosuke_kさんの発表より）
　iOSとAndroidでの動作を目的に2Dゲームを作成するフレームワーク。体験版では最新バージョンで無いことと、ストア用のビルドができないことくらいで、テスト用に手持ちの実機への転送はできるようです。描画系はOpenGLで行われ、動作スピードは30〜60FPS出るのでスペック的に問題はないらしいですが、日本では食わず嫌いの人が多いとのこと。
　紹介を見るとなるべくソースを書かずにロジック部分に集中するために作られているそうで、Luaを使って記述します。なんと物理演算エンジンは非常に簡単に利用可能で、AngryBirdのクローンは２日で実装できたとか！まじか！
　ライセンスはiOS版は$199/年と少しお高い。Luaを覚えるっていうのもちょっと僕には敷居が高く感じてしまった。
当日のスライドはこちら

●yoichinejiさんの発表より
　いろいろと多岐に渡った発表をされてました。もはやiPhone勉強会というよりもスマートフォン勉強会！
こちらもスライドの公開はないのが残念ですが、cocos2dからはじまって、Windows Phone 7の開発環境の紹介、GameSaladまで！
　GameSaladは正直僕には馴染めそうもないのですが、文字でコーディングするのに抵抗がある方にはおすすめなのかも…。見た感じFlashというよりもMacromedia Directorに感覚は近いのかもしれませんね。しかもLingoで記述しなくてもコンポーネントを載っけて設定していけばロジックが組めるという。とはいえ、文字を使ってコーディングすることに慣れている人からすると回りくどく感じる部分もありそうなので、メンテやリファクタリングなどに難がありそうな…。このあたりはjavascriptなどのスクリプトを使用するフレームワークにも心配なところ。良いエディタや統合環境がないとうまくやれそうもないっす…。

●cocos2dとHungryMasterについて（私の発表より）
　私はというと、先日リリースしたHungryMasterを作った経験からcocos2dの使用の実例を紹介するようなものを行いました。前提をすっ飛ばしていきなり応用というか実例紹介だったので、cocos2dで多少なりとも何かを作ったことがある人じゃないとピンと来ない内容だったので、ついてこれなかった方すみません。誰得ですよね。
　cocos2dの理念的なものを理解するのに自分は少し時間がかかりまして、最初に作ったElectroMasterではかなり勘違いした使い方になっておりました。そのあたりは以前のスライドと見比べてもらえると良いかも？いやわからないかもですけど。
　cocos2dはメインループで配列を回して各オブジェクトに対して毎回何かを指示するという作り方ではなく、それぞれのオブジェクトに状態更新用のメソッドを登録しておいて、勝手に更新されることでゲームが進行していくという作り方をします。ってのに気づくのに時間がかかりました。この部分については以前西東京iPhone開発者勉強会で発表させてもらいました。
　今回はというと、そこから１歩進めて、cocos2dで開発する上で不満になる部分やこうやりたいよねという部分について自分なりの回答を紹介するようなものでしたので、cocos2dに不満がある方はぜひスライドを見てもらえると良いかと思います。サンプルコードも公開しておりますので、面白いかと。ではー。
　あ、そうそう。iCadeを手に入れましたので、そのあたりについても触れましたｗ現在配信中のHungryMaster ver1.13ではiCadeで操作することができますよ！
サンプルコードはこちら
当日のスライドはこちら

●まとめ
　当日のつぶやきのまとめがtogetterに作られておりますので、合わせて御覧ください。

HungryMaster 1.12

2011-07-21T01:49:00.003+09:00

本日HungryMasterのアップデートが通りまして、ver1.12が出ました。
当初予定していたアップデート内容ではiPad対応が含まれているつもりでしたが、一部設定をミスっておりまして、iPadでの起動が許可されていない状態になっておりました。ですので、iPad対応についてはもうしばらく次のアップデートをお待ち下さい。
それ以外の更新項目は以下のとおりです。

・30-40面の英訳を修正。（日本のユーザーさんには関係ないですね）
・「ハングリーマスター」というアチーブメントの桁を１桁下げた。（難しすぎましたので）
・難易度「オーバーイート」を追加。１００面クリアしていると難易度設定に出てきます。すごいコンボが繋がると思いますよ！
・ポーズボタン追加。画面上中央あたりにポーズボタンが追加されています。ポーズ解除とギブアップが選択できます。
・iCadeでの操作に対応。例の話題になった奴です。

以上です。
ほんと、すみませんでしたー。
iPadでプレイしたい方はあと１週間待っていただければきっと次のアップデートがでてるはず！

HungryMaster攻略情報、ブログ記事紹介等

2011-07-08T00:41:00.004+09:00

　先週リリースいたしましたHungryMasterですが、好評いただきましてありがとうございます。楽しんでもらえると幸いです！
公式サイトからダウンロードできる主題歌も聞いてね♪

　と、それはそうと。普通にゲームしてても分かりづらい部分があると思いますので、少し紹介します。
まずは操作方法について。

●操作方法
　このゲームにはOPTIONで切り替えられる操作方法が４種類あります。

１，デフォルトが「目的地指定」で、画面をタッチしたところにデリカちゃんが移動します。前作ElectroMasterがこの操作方法ですね。指でキャラが隠れちゃうよーとかおっしゃる方もいました。

２，そこでこの操作方法「可変十字キー」。画面をタッチした場所に十字キーが表示されて、そこを中心に指を動かした方向にデリカちゃんが移動します。いわゆる相対バーチャルパッドと言われるものです。

３，バーチャルパッドにはもう１種類あります。「固定十字キー」。これは画面左下に十字キーが表示されて、そこを中心に指が触った方向にデリカちゃんが移動します。ひょっとするとこれが一番スコアを稼ぎやすいかも？

４，４つ目はオマケみたいなもんですけど、本体を傾けると、傾けた方向にデリカちゃんが移動するというもので、激ムズです。

●ボーナス
　このゲームには３種類のボーナスが存在します。
「EXACT BONUS」「FULL BAG BONUS」「ALL KIND BONUS」の３種類ですね。
これの取得条件がちょっと分かりづらいと思いますので、解説します。

「EXACT BONUS」はそれぞれの家に初回に食べ物を持っていったときに、要求された数がぴったりで、食べ物の種類が１種類だけの場合です。このボーナスが取得できたらクリア時にハートが１つ回復しますよ。

「FULL BAG BONUS」は90個、つまり持てる最大量の食べ物を持って行くと取得できます。クリア時にはこのボーナス１つにつき1/4個のハートが回復しますよ。

「ALL KIND BONUS」はそのステージで出てくる食べ物を全種類持って行くと取得できます。１つのステージには８種類食べ物が出るので、うまく集めて持って行ってね。クリア時にはこのボーナス１つにつきハートが１つ回復するよ。

と、今回はここまでー。
みんな頑張ってね！

さて、ブログ記事の紹介です。
記事にしていただいたみなさんありがとうー。

●Gadget Girl
ついにリリース！ドット絵の可愛さとタッチの操作感がやみつきの"HungryMaster"
こちらの記事はガジェット通信さんにも掲載されましたよ。

●ガジェット通信
[iPhone]ついにリリース！ドット絵の可愛さとタッチの操作感がやみつきの”HungryMaster”

●ファミ通App
レトロ風アクションゲーム『Master』シリーズ第2弾『HungryMaster』が配信開始

●Dazarath (英語）
発売前のインプレッション的な記事
発売後の感想の記事

●touch arcade（英語）
フォーラムで感想とか書かれてました
こちらに投稿されているnyarlaさんはForget-Me-Notの作者さんですね。レトロゲー好きにはおすすめですよ。

以上です。
ありがとー。

HungryMasterリリース！

2011-07-02T16:35:00.003+09:00

やっと審査が通りましてリリースできました！
まさか朝５時ごろだとは思わず。起きてて良かったｗ

で、リリースしましたーってツイートしたら、
「ひとりぶろぐ」のmoyashiさんが速攻でレビュー書いてくれました。
すごいですね。短時間のプレイでここまで分析されるとは！
というわけで記事はこちら。

●ひとりぶろぐ：ElectroMasterの続編HungryMasterが発売！記念セールで115円

ちょっと仮眠をとってから起きたら、なんと！
キャラクターデザインとメインイラストを描いてくださった
羽仁倉雲さんがリリース記念イラストをアップされてました！
うわーい！すごくかわいいです！
気になるあなたは以下のtwitpicをチェキラ！

●twitpic：HungryMaster配信お祝い絵。…は、配信であってるよね…？

早速公式サイトも若干変えまして、
記念イラストをリンクさせて頂きました。
それから、リリースに合わせようと準備していたサントラ（主題歌付き）を
公式サイトからダウンロードできるようにしましたので、
合わせてお知らせしますー。
さあ、みんなで公式サイトへゴーだ！
歌ってくださっているのは、ゲームでデリカの声を担当されたゆかこさんです。

●HungryMaster公式サイト
●AppStore

では、みんな楽しんでね！

新作予告その２！HungryMaster

2011-07-01T00:16:00.003+09:00

今審査中なんでもうじきだと思うのですが…。
予告動画その２をアップしました。

今度は歌付きだよ！
とはいえ歌はゲームには含まれません。
あとで公式サイトでダウンロードできるようにします！
公式サイトはこちら：http://xionchannel.no-ip.org/hm/

あと数日だと思うので、しばしのお待ちを！
デリカ「絶対買いなさいよね！」
てへ。

pngSplitterビルド版アップしました

2011-06-25T04:19:00.005+09:00

　wxPythonのままだと実行するのが大変だと思うので、py2appでスタンドアローンにビルドしたものをアップしました。
これで、wxPythonを入れなくても使えるはずです。あと、マニュアルというか多少の解説付けました。
今回もソースとかついてます。

ダウンロード：25MBくらいあります

wxPythonのインストールに苦労した件

2011-06-22T10:35:00.003+09:00

新しいマシンにwxPythonをいれるのに相当手こずりました。
ウェブを探しまくってもかなりわからない状態。

結局のところwxが入っているパスへ一般ユーザーからのアクセス権が
なかったことでpackageが認識されないということだった模様。

さらにパスっ通っても今度はpy27-wxpythonは32bit起動しか
許可していないために初期化で失敗という。
これはウェブでも事例がいっぱいあるものですが、
VERSIONER_PYTHON_PREFER_32_BITとかdefaultsとかを
変えても反応しなかったので、使用するpythonを2.6に
戻すことで対応できたみたい。
環境変数が効いてるのは2.6の方だったのかなぁ…。

新作予告！HungryMaster

2011-06-21T23:21:00.004+09:00

マスターシリーズ第２弾として、ひっそりとつくっていたものが、
昨日発表となりましたー。

そして、ファミ通Appさんにも記事にしていただけてしまった！
●レトロ風アクションゲーム『Master』シリーズ第2弾『HungryMaster』を先行体験

すごくお褒めいただいて恐縮です！
もうちょっとだけ配信までお待ちくださいー。

公式情報サイトはこちら！
http://xionchannel.no-ip.org/hm/

動画はこちら！

ElectroMaster in REVIEWS ON THE RUN

2011-05-28T11:06:00.005+09:00

カナダのゲームレビュー番組「REVIEWS ON THE RUN」っていう番組のスタッフから、だいぶ前ですけど連絡があって「ElectroMasterを番組でとりあげたいんだけど、どうだい？」みたいなメールが来たんですよ。
そりゃぁ、一も二もなくオッケェです。
で、番組の映像はウェブにアップしてるらしいので、アップされたら連絡欲しいなー的な返事をしてたのですが、それから時間がかなりたっても全く連絡ないので没になったかなーと思ってたのですが、探したら5月19日分に入ってた！うひょー。

というわけで、転載しますね。

英語なので何言ってるのかわからないですけど。
そして、敵の数がかなり少ない映像なのであんまり面白そうに見えないｗ
た、たのむよー。スタッフさん！

ともかく、初のテレビデビューですよ！
ありがとうスタッフの人！

ElectroMasterの続編！？

2011-05-09T23:19:00.004+09:00

次回作、鋭意開発中です。

西東京iPhoneDev勉強会第５回に参加しました

2011-05-02T03:28:00.005+09:00

4/30西東京iPhoneDev勉強会第５回に参加しました。

前回に引き続き発表者になったわけですが、今回のネタはcocos2dです。
最近新作アプリを開発中で、それで作ってるうちにいろいろと分かったことがありましたので、そのあたりをまとめて発表という感じになりました。

題して「cocos2d実践編」
スライドはこちら。
サンプルコードはこちら。

主にゲームを作る上でこういうことやりたいよねって言う部分を実例で解説的な感じです。

会場での質問では「ゲームではよくタスクシステムが使われると思いますけど、cocos2dにはありますか？」てのが出ましたけど、基本的には無いという感じでしょうか。CCNodeにはscheduleメソッドで毎フレーム（あるいは指定間隔で）実行して欲しい関数を登録することが出来ますが、これは直接タスクシステムにはなりませんし。というか、そもそも自分がタスクシステムを使ったことがないので、ズバリどういうものがそれなのかわからないってのがアレですね。誰か教えてください。

今回は試験的にUStreamでの配信も行われたので、発表の映像とかが下記にアップされてます。回線状況が悪かったらしく一部途切れているそうですけど、興味が有る方は見て見てはいかがでしょうか。
●UStream
http://www.ustream.tv/recorded/14370281
http://www.ustream.tv/recorded/14370519
http://www.ustream.tv/recorded/14370967
http://www.ustream.tv/recorded/14370982
http://www.ustream.tv/recorded/14371244
http://www.ustream.tv/recorded/14372212
http://www.ustream.tv/recorded/14372851
http://www.ustream.tv/recorded/14373371

あと、当日ツイートまとめはtogetterでこちらにまとまってます。
●togetter - 2011/4/30 #wtidev 西東京iPhoneDev勉強会〜第5回〜

発表者は僕の他に、以下のとおりでした。

@yoichinejiさん
「openframeworksとおまけてきなもの」
　kinectとか色々面白かったです。

@tmokitaさん
「xAuthTwitterEngineとASIHTTPRequestを使ったTwitPic投稿」
　アプリからxAuth使うときに参考になると思いました。

@k_katsumiさん
「iPhoneで高速に全文検索」
　膨大なテキストでの検索が超スピードで帰ってきてびっくりでした。

以上ですー。

cocos2dでスクロールするレイヤーを作りました

2011-04-29T17:47:00.002+09:00

いわゆるUIScrollViewみたいなやつです。
でもメソッドの命名とかはかなり自分勝手にやってるから使いづらいかもですけど。

CCScrollLayer.zip←ここからダウンロードできます

これ単体で使うには、以下のようにします。

CCScrollLayer *layer = [CCScrollLayer node];
[layer setScrollAreaWithMinPosition:ccp(0,0) maxPosition:ccp(0,1024)];
[layer schedule:@selector(moveScroll)];

と、これでタッチイベントを検出してスクロールします。
上のソースでは縦に0から1024までの座標でスクロール可能です。

２行目を

[layer setScrollAreaWithMinPosition:ccp(0,0) maxPosition:ccp(1024,1024)];
[layer setHorizontalScrollEnable:YES];

のようにすれば縦横にスクロールします。

デフォルトでは縦スクロールが可能になるようにセットされているので、
横だけのスクロールにするんであれば、設定を変えてください。

[layer setScrollAreaWithMinPosition:ccp(0,0) maxPosition:ccp(1024,0)];
[layer setHorizontalScrollEnable:YES];
[layer setVerticalScrollEnable:NO];

とまあこんな感じです。

pngSplitter修正しました

2011-04-06T23:47:00.003+09:00

全角の要素名が対応してなかったので、バグ修正しました。
あと、ドラッグ＆ドロップとかに地味に対応。
アイコンの位置も使いやすいように位置を変更。
などなど。

ダウンロード：pngSplitter.zip (要wxPython）

pngSplitterを作りました

2011-04-06T02:22:00.005+09:00

cocos2dで複数のフレームを１枚のテクスチャに描いたりしてると、再配置したくなったり使用する際の切り出し座標を知りたくなったりなどいろいろ苦労すると思いますが、再配置はTexture Packerという便利なツールがあるのでいいんですけど、ドット絵を描く時は色とか揃えたりするのにそのキャラの全パターンが１枚になってたほうが便利だったりとかありますよね。

で、このツールなんですが、たとえばフォントテクスチャをプロポーショナルで作ったときの切り出し用のPLISTが欲しい時に使えます。

あと、キャラのパターンを１枚で描いてたけど最終的にTexture Packerでまとめ直したい場合にも使えます。これで切り出しの枠を設定しておいて、バラのPNGを吐き出せばOK。

てな感じのツールです。
pythonの勉強を兼ねて作りました。

使用するには、pythonとwxPythonが必要なので、インストールしてくださいな。
ではでは。

pngSplitterをダウンロードする（ソース付きだよ）

2Dの壁コリジョンをどうやって計算する？

2011-04-03T00:34:00.007+09:00

先日思いついた2Dゲームで壁との衝突判定をどうやって行うかについてまとめておきます。

スーパーマリオやチャレンジャーなどファミコン時代によく遊んだ2Dゲームで壁に衝突すると壁に潜ってしまう方向の移動要素以外は生きて横に移動するというような操作を覚えている人も多いかと思います。
これはそんな感じにするための衝突判定です。

例えば横にのびている壁に斜めにあたった場合に、縦の移動は阻害されるけど、横への移動は許可されるというようなことです。

以下の図を見てください。
青い四角はキャラクター。
緑の四角は壁、白い矢印はキャラクターの移動方向となります。

壁に衝突する際に、キャラクター移動後のA,B,Cの3点での潜りを調べます。
キャラクターの進行方向にしたがって調べるべきA,B,Cの位置は変化しますが、要は移動に関係する3点です。

まずは左上の図を元に説明すると、
１：A,B,Cのすべてが潜らなければ希望する移動は許可される。
２：1でいずれかが衝突する場合には縦横どちらか、あるいは両方の移動が阻害されるので３以降の判定を行う。
３：Cが潜らなければ横方向の移動を許可し、縦方向は阻害される。

左下の図の場合は、
４：Aが潜らなければ縦方向の移動を許可し、横方向は阻害される。

さらにL字の壁の隅に移動しようとした場合などが当てはまりますが、
５：C,Aの両方が潜る場合はすべての移動が阻害される。

とすることでうまいこと壁との衝突を調べることが出来ます。

なお、派生系として右上と右下の場合もキャラクターのサイズを考慮して壁の角との潜りを調べて対応できます。
（おかしな判定を行うと角ギリギリを攻めると半分埋まりながら移動可能になってしまったりしますからね）

てなわけで、壁との判定をまとめてみました。
ひょっとすると１での判定はBのみの潜りを調べることで済むかもしれませんが、どうなんでしょう。

cocos2dのvertexZパラメータでソートしたい

2011-04-02T23:52:00.005+09:00

cocos2dのCCSpriteを多数表示して、Y座標によって奥から手前へのソートを行うことで以下のような表示をする場合に、

簡単に行うには、CCSpriteクラスの中のupdateメソッドなどで現在のY座標を元にソートしなおすことを繰り返すと良いのですが。
たとえば、以下のようなコードですね。

-(void)update:(ccTime)delta {
　　[self.parent reorderChild:self z:-position.y];
}

これでは結構処理が無駄になるのではないかと心配になりますよね。
で、vertexZプロパティを使うとOpenGLのZバッファを参照して前後比較をして描画してもらえるので、それを使って処理を軽くしたいと思います。
こんな感じです。

-(void)update:(ccTime)delta {
　　self.vertexZ = -position.y;
}

こうすると、前後比較は正しくなるのですが、キャラクターの透明部分までZバッファに描かれてしまって四角い枠が見えるようなおかしな描画になってしまいます。
そこで、さらに以下のメソッドをオーバーライドといい感じになります。（ALPHA_TESTで透明部分はそもそも描画しないということを行ってキャラの絵が描かれている部分のみZ値を書きこむようにするということです）

-(void)draw {
　　glEnable(GL_ALPHA_TEST);
　　glAlphaFunc(GL_GREATER, 0.0f);
　　[super draw];
　　glDisable(GL_ALPHA_TEST);
}

これで万事解決ですね。
と思いますよね。
でも、さらに高速化しようとしてCCSpriteBatchNodeを使い始めると、上記のCCSpriteに設定したdrawメソッドが呼ばれなくなるために、せっかく設定したALPHA_TESTが無効化されてしまいます。
その場合は、CCSpriteBatchNodeの方のdrawをオーバーライドしましょう。
こんな感じです。（CCSpriteBatchNodeのdrawはDEPTH_TESTがデフォルトで無効になっているので、その設定も追加しています）

-(void)draw {
　　glEnable(GL_DEPTH_TEST);

　　glEnable(GL_ALPHA_TEST);
　　glAlphaFunc(GL_GREATER, 0.0f);
　　[super draw];
　　glDisable(GL_ALPHA_TEST);

　　glDisable(GL_DEPTH_TEST);
}

以上で楽しいcocos2dライフを送りましょうー。

cocos2dでマルチタッチを取得するには

2011-04-02T23:42:00.005+09:00

cocos2dで用意されているCCLayerには以下のようなタッチイベントを有効化するためのメソッドが用意されていますが、マルチタッチをビューに対して有効にするか否かの設定はこれでは行えません。

[self setIsTouchEnabled:YES];

そんなわけで、以下のようにcocos2dのEAGLViewが乗っているウインドウかビューに対して、マルチタッチ有効化を宣言する必要があります。

[window setMultipleTouchEnabled:YES];
あるいは
[glView setMultipleTouchEnabled:YES];
などです。

これで、ccTouchesBeganなどでマルチタッチを取得できるようになりますが、この後少し注意が必要です。
たとえばタイトル画面や他の画面などで画面をタッチすると次のシーンへ移行するというような仕組みになっていた場合に、シングルタッチの場合は速度的に連打してもシーンの移り変わりの再コール行われた場合にほぼ問題なく次のシーンへ移行できるのですが、マルチタッチの場合は連打の間隔が極端に短く取得されることもありえますので、シーン移行中の場合は再コールされても応答しないようなコードを追加しておかないとシーンの移行が正しく終わらないうちに次への移行が呼ばれたりして落ちる場合があります。

バグ修正報告

2011-03-29T10:14:00.002+09:00

・ElectroMaster
　OpenFeintでプレイしていた方がElectroMasterをアップデートした際に、すでにOpenFeintで達成済みの実績がGame Center側で解除されないと言う件についてのバグ修正をしました。

・Solid Dots, Solid Dots Free
　レビューにも報告されていたiPod touch 2Gにての起動ができなくなっていた件について修正いたしました。

以上です。
よろしくお願いいたします。

ElectroMasterで実績解除されない方は…

2011-03-19T14:27:00.002+09:00

本日アップデートしたGame Center対応のElectroMasterで以前OpenFeintで獲得した実績がGame Center側に反映されない方は、以下の手順を試してみてください。

1. OpenFeintからログアウト
2. 上記の状態のままゲームをしてゲームオーバーとなる
3. この時点でGame Centerへ実績が反映してるはずです。Game Centerで確認してみてください。
4. 3で問題なければOpenFeintにログインし直しても以後問題ありません

ご迷惑をおかけいたして申し訳ありませんが、しばらくこのままで我慢していただきたく思います。なるべく早く修正版をアップデートできるように頑張ります。

cocos3dでモデル表示してみた

2011-03-02T00:01:00.005+09:00

先日の西東京勉強会で@yoichinejiさんがcocos3dの紹介をしてくれたので、触発されて触ってました。

cocos2dと同じようにらくらく3Dができるんだろうなーと思ってたのですが、出だしでつまづいてモデルの表示が出来ないという感じに…

結局原因はCollada形式の(.dae)ファイルをCollada2PODという変換ツールで変換する際のオプション設定に不備があったというもの。
これ非常に分かりづらいです。
なにせXCodeでビルドして実行してもデータ不備では無言で落ちてしまってエラーメッセージがでないと来てます。
というわけで、cocos3dに手を出す人は以下に注意。

Collada2PODの設定を完全にすること。
以下のページで紹介されておりますが、画像のとおりに設定すればOKです。
でも、うっかりどこか忘れると予期せぬ結果になったり落ちたりいろいろめんどくさいです。
cocos3d Importing: Converting COLLADA to POD

で、先日ライブモデリングで作ったモデルを表示して回転とかさせてみました。
わーい。

味噌といいますか、マルチマテリアルになっているモデルはPOD形式に変換される際に複数のモデルに自動分割されるので、キャラ全体を回転させるのがちょっと面倒になります。
なので、CC3Nodeを１つ親として用意して、読み込んだPODから生成されたいくつかのモデルはすべてその親の子どもにすることでまとめて回せるようにしてみた感じです。
モデルデータを読んでくると使用されているテクスチャも勝手に読み込まれてノードが生成される。
それをCC3Worldの子供に付けてあげるだけで勝手に描画してくれるというcocos3dはなかなか今後が期待できるフレームワークだなーと思います。
OpenGLでいちいち設定していたことを全くしなくてOKですもんね。

西東京勉強会でライブモデリングしたよ

2011-03-01T23:00:00.005+09:00

ひさしぶりにメタセコイアをだしてきて、モデリングやりました。
普通仕事だと最低でも１週間くらいはかけてキャラモデルを作るのが当たり前かと思いますが、ライブなので３０分程度で終わることを目指して頑張りました。

事前に家で練習してみたけど、モデルだけで１時間位かかってしまった。
当然テクスチャなんかは時間がないので当日はやれないです。
という感じで、当日を迎えまして、だいたい４０〜５０分くらいで形状はできたのではないかと。

手順は以下のような感じで。

１，側面からみた輪郭程度のワイヤーは事前に用意（少しでも時間短縮のためにドーピングしました）
２，ワイヤーを元に面を貼ってシルエットのような面にして、内側に分割用の頂点を追加。
３，ミラーリング設定をしてX方向に引き伸ばして立体にしていく。
４，形状を整えれば完成。
５，腕や足なんかはミラーフリーズ後にさらにミラーにして、左右分複製し調整ということもやります。

途中のデータと完成品はこちらからダウンロードできるので、
適当に使ってください。
時間かけたデータじゃないのでへぼいとか言わないで＞＜

その他、バリエーションに富んだ発表はいろいろと西東京勉強会では行われたので、
そちらの模様は以下のtogetterからなんとなく感じ取れるかも。

●togetter - 西東京iPhone開発者勉強会第4回（2/27）

ElectroMasterのMacBookにしたよ！

2011-02-11T21:11:00.006+09:00

大変光栄なことにElectroMasterのファンでいらっしゃるという、はにくらさん（@hanikura）がイラストを描いてくださったので、すっかり気に入ってしまいまして、ステッカーにしてMacBookに貼ってもよいでしょうかとお願いしてつくってしまいました！

じゃじゃーん！

うーん。すばらしい。

今回は、システムグラフィさんにお願いしてステッカーを作成しました。失敗してもいいように、２枚分を配置してゴー。
余白はとりあえずElectroMasterのアイコンで埋めてみました。何かに使えるかな…。

それを切りだしてMacBookに貼りつければ完成！
ちょっと大きい面積なんで貼るのにコツがいりますね。
完全に空気を入れないで貼るのはかなり難しいです。
（ちょっとだけ残っちゃいました；）

よーしこれで、開発も頑張れる！
開発者勉強会などで自慢しようｗ

IGDA日本 SIG-TA 第一回部会に参加してきました

2011-02-07T22:50:00.011+09:00

日本ではまだテクニカルアーティストという役職は余り認知されておらず、去年のCEDECにて初のラウンドテーブル(前半、後半)が開かれたばかりという旬な職業であるテクニカルアーティストですが、年々大規模化するゲーム開発においては今後ますます重要となるお仕事です。

この度IGDA日本では、今後の業界発展などを願ってテクニカルアーティストを世間一般に認知してもらうべくSIGが作成されたそうです。その会合第一回が昨日行われました。
http://www.igda.jp/modules/bulletin/index.php?page=article&storyid=423←詳細はこちら

テクニカルアーティストはデザイナとプログラマの中間に位置して、双方無駄がないように仕事がこなせるように両方のことを理解してベストな環境を提案するようなお仕事です。残念ながらまだ日本ではテクニカルアーティストという役職はかなりレアな存在で、しかしながらそういう業務を自発的に行なっている人は潜在的にかなりいるのではという感じ。
アメリカではすでに数年まえからテクニカルアーティストという業務は認知され、正式な役職として成り立ち、近年はさらに業務内容が細分化されより決めの細かい効率化を行うような状態にあるそうです。
最近の海外の大規模ゲームの素晴らしい出来の影にはそういうテクニカルアーティストの存在が大きく関係しているんだろうなーなんて思います。

当日は以下のような内容で、勉強したり話しあったり、情報共有したりという感じでした。
参加された方も学生からベテラン、ジャーナリスト等々幅広い参加者で内容の濃い会合だったと思います。

●IGDA日本とSIG-TAの紹介
●データフロー自動化ツールの考え方:麓一博
●海外TA事情から日本のTA像について考えてみる(仮題): 長舩龍太郎
●ラウンドテーブル「プログラマとデザイナの間での板挟みの話」
　　みんながハッピーになれる為に出来ること
　　(東京福岡同時開催／モデレータ東京:大内慎一、福岡:中村大介)
●各会場でどんな意見が出たか情報交換
●休憩
●物理ベースの絵作りのための基礎知識:鈴木雅幸
●デザイナーショック外伝
　　DCCツール別リアルタイムシェーダの環境:麓一博
●ラウンドテーブル「TAのプログラムとのつきあい方」
　　プログラムがかけるようになる必要があるか論も含め
　　Python,mel,maxscript,vbs等スクリプト言語含め、RTShaderまで。
　　 (東京福岡同時開催／モデレータ東京:麓一博、福岡:中村大介)
●各会場でどんな意見が出たか情報交換
●懇親会(希望者のみ)

後日議事録がIGDA日本の方で公開されると思いますが、当日の内容をなるべく実況しましたｗまた他の参加者の方も熱いツイートをされておりましたので、それらをまとめましたので、すごい長文ですが、ご興味のある方は見るべし！

●togetter - 【IGDA日本SIG-TA】第１回テクニカルアーティスト部会（2011.2.6）つぶやきまとめ

※追記
INSIDEで記事になったようです。素晴らしい記事なのでこちらは必見。
●INSIDE - ゲーム開発で重要性を増すテクニカルアーティストとは? IGDA SIG-TA第一回勉強会

WebGL勉強会に参加してきました

2011-02-07T22:32:00.006+09:00

先日、第５回WebGL勉強会が行われましたので、参加してきました。まえまえから気になっていたのですがタイミングが合わず参加できてなかったもんで…。

http://atnd.org/events/11693←詳細はこちら。

bullet.jsという物理エンジンの紹介、blenderからexportしたデータをWebGLにて表示するまでのプレゼン（主にエキスポーター周り）や、期待していたKinect+WebGLのデモ！それから、WebGLの入門講座など盛りだくさんの一日でした。
後日まとめがWebGL勉強会ページに発表されると思いますが、当日実況のようにつぶやきまくったり、周りの方のつぶやきなんかをまとめたので、気になる方は以下を見てはどうでしょうか。

●togger - WebGL勉強会第五回つぶやきまとめ

また、参加者の方々も資料をアップされたりしておりますので、要チェック！

●強火で進め - [WebGL]WebGL勉強会第5回で発表して来ました
●Scalaとlift　のはずだった　・・・ - WebGL勉強会第5回で発表して来ました
●空が狭い - 第５回WebGL勉強会に行ってきた

最近はcanvas 2dを3d的に扱うフレームワーク(pre3d)を触ってばっかりだったのですが、動作も重かったりUVの扱いが特殊だったりと苦労してましたが、WebGLはOpenGLES2.0を元にしてあるだけあって、見た感じOpenGLそのままって感じがしますので、OpenGL経験者にはとっつきやすそうだなという印象でした。
早くモバイルデバイスで表示できるようになってほしい！そうなればやりがいも出るってもの。

ではでは。

hidev出張版の勉強会にいってきました

2010-12-12T00:53:00.006+09:00

「これから始める人のためのiPhone,iPadアプリ開発勉強会」
https://groups.google.com/group/hakkaku_idev?hl=ja
というものが、毎月第1、第3日曜日に秋葉原（御茶ノ水）からちょっといったところの八角研究所にて開催されています。今回はそのなかのメンバーの@kclabさんが派生の勉強会をやりましょうということで、cocos2d, OpenGLなどのゲーム系、描画系にしぼった題材で勉強会をやることになりましたので、余りわかってない中恐縮ですが、OpenGLについてしゃべらせてもらいました。

いやぁ、難しいです。
シンプルに伝えたいと思ってたのにグダグダになってしまって。
聞いていただいた方に伝わっていると嬉しいです。

iPhoneで使えるOpenGLにはOpenGL ES1とES2がありまして、僕は1の方しかやったことがないのでそっちのみに絞ったのですが、2は最新のゲーム機でつかえるようなシェーダーも対応しているのでいずれはと思います。
このあたりの話をすっかりしないまま終わってしまった。

あと、問題点として、XCodeのテンプレートからOpenGLのアプリケーションプロジェクトを作成すると、デフォルトで入っているコードが2D向けの初期化になっているので、そのあたりに注意的なこともやればよかったのに抜けてました。

今回使ったコードはそういったこともあって、テンプレート的に使えればというような内容で作ったつもりです。
はずかしながら、以下にリンクを貼っておきます。

スライド
サンプルコード

次はもっとうまくやるぞ！

アプリのグッズを作りました！（まいがむ工房）

2010-11-28T11:45:00.006+09:00

今まで出したアプリのアイコンをあしらったガムです！

こないだこういうのを作れるサービスを見つけたので試しにつくってみました。この手のサービスはチロルチョコがやってるDECOチョコが有名ですが、マルカワフーセンガムでもやってたんですね。DECOチョコよりも一回り大きいサイズの箱で裏面にも指定の画像を付けられるのが特徴ですかね。
裏面には１枚しか指定ができないので、連絡先とか載せておけば名刺がわりになるかもですね。
ちなみに、画像の右端のが裏面に指定した物です。

難点があるとすれば、印刷の品質でしょうか。普通のインクジェットプリンタで普通紙に印刷したかのようなクオリティなので、ちょっと残念な出来になっています。この点で言えばDECOチョコのほうがちゃんとしたオフセットっぽいパリっとした感じなので素晴らしいですね。
手持ちのガムがなくなったら今度はチョコでつくってみようかな。

そうそう。ガムにした理由は裏面が指定できること以外にもう１つあって、チョコよりも持ちが良さそうだからですｗ　チョコだと溶けそうだしね。

ElectroMasterレビュー紹介第５弾

2010-11-03T03:05:00.008+09:00

ElectroMasterを紹介くださる人がポロポロいらっしゃって嬉しい限りです。

先日の狩られ道さんの電撃ゲームスの記事の元になったメールインタビューのまとめがascii.jpさんのところにも掲載されました。ascii.jpさんにはSolid Dotsもリリース直後に記事（立体ドット絵を作ろう！ iPhone「Solid Dots」）にしてもらって感謝感激です。

まずはそのascii.jpさんの記事からご紹介。
アプリのリンクとかいろいろ張っていただいてなかなか豪華な記事です。

ASCII.jp x MacPeople
●日本の個人・独立系iOSアプリ開発者【3】—xionchannel

それから、ググってたら見つけたユーザーさんのブログから。
GRAVITYが好みとはなかなか通ですね。狩られ道さんもその武器がお好きなようでした。

オススメ周辺機器でパソコンライフを楽しく♪便利なアイテムで快適に♪
●これは面白そう!!iPhoneアプリ｢ElectroMaster｣動画付き。

ElectroMasterよろしくお願いします。
iPad対応もしてます。２人であそぶと楽しいですよ。

そうそう。Solid Dotsですが、現在iPad対応を行っています。
いつごろリリースできるかわかりませんが、とりあえず以下のような感じです。

なかなか壮観でしょう。
解像度もあがって40x40x40まで行ける予定です。
高速化を施したのでそれなりにサクサク編集できます。
とはいえ、限界近いサイズではちょっと重いですけどね。
画面上にでてるパレットには特殊な色指定もできるようになります。
ピカピカ光ったりするブロックを作れますよ！

ではご期待くださいな。

ElectroMasterレビュー紹介第４弾

2010-10-09T22:57:00.010+09:00

ElectroMasterをご紹介いただいた記事を紹介して、もう４回目ですが、本当にみなさんありがとうございます。そろそろGameCenter対応しなくちゃなのかなーとか思いつつ、新しいOpenFeintの仕様とかも調べてない体たらくだったりします。すみません。でも、あれですよね、マイナーバージョンアップよりも新作作れってことですよね。そっちも手付かずで非常に申し訳ない…

さて、ご紹介の最初は狩られ道さんのブログからです。こちらは以前「電撃ゲームス」で記事にしていただいた内容のノーカット版をブログに掲載いただいた内容となっています。メールインタビューの返事を長文でお返ししすぎてしまいまして、雑誌の記事からはカットされた内容があったんですよ。雑誌を見ていただいた方もぜひご覧くださいな。

電撃iPhone KARAREMICHi Blog
●日本の個人、独立系開発者【3】xionchannel （1/3） #iPhonejp #iPadjp
●日本の個人、独立系開発者【3】xionchannel （2/3）
●日本の個人、独立系開発者【3】xionchannel （3/3）
●【ElectroMaster】ぶっといビームで撃つのは、やっぱり楽しい！ #iPhonejp #iPhone

それから、海外からです。「PODGAMER」というサイトで紹介されました。自動翻訳で内容を読ませてもらいましたらかなりのべた褒めで非常に恐縮です。AppStoreでは良質なゲームがすぐに流れてしまっていて非常にもったいない、たとえばこんなゲームは万人にお知らせしなくては的なことが書かれておりました。指で触っている間だけ溜めて指を離すと電撃を撃つだけのワンキーゲームですが、細かいゲーム的な調整を見ぬいて評価くださるとは制作者冥利につきるというものです。ありがたー。

PODGAMER
●Did You Miss Me?

それにしても、このスクリーンショットすごいな！自分でもこんな画面みたことないですよ。（下記の画像はPODGAMERさんの記事から拝借いたしました）

ElectroMaster iPad対応しました！

2010-07-22T01:33:00.006+09:00

ElectroMasterがver2.0となってiPadにも対応しました！
iPadで遊ぶと2P協力プレイや対戦プレイが遊べますよ。
2Pの時に２人のプレイヤーがぶつかると愛のスペシャル攻撃が出ます。
巨大なハートに敵が吹っ飛ばされるんですけど、ハートに嫉妬の炎を燃やして追いかけてくるので要注意！

他にも、従来の武器のバランスがあまりよくなかったので、弱かった武器の底上げや、全体的な処理落ちの解消、ヒント画面の追加などがされていますので、iPhoneやiPod touchで遊んでいた方もぜひアップデートしてみてくださいね！

それから、レビューの紹介も。

●りんご箱～Macの秘密基地～
レベル5になろう。電撃ビリビリゲーム「ElectroMaster」
http://d.hatena.ne.jp/Demon8573/20100626/1277581381

●Gadget Girl
ElectroMasterがiPadでも面白い！！
http://d.hatena.ne.jp/spring_mao/20100721/1279728760

ぜひ遊んでみてくださいねー。

ElectroMasterレビュー紹介第３弾

2010-06-26T04:30:00.013+09:00

またまたレビューとか見つけました。
うれしいな。

まずは海外から。
フォーラムがなかなか盛り上がってるみたいです。

touchArcade
http://forums.toucharcade.com/showthread.php?threadid=58428

それから国内。
MSXっぽいとのこと。ええ、MSXユーザーでしたからそういう匂いがにじみ出てしまっているのかも。

覚醒する？ @CDiP
http://www.donpy.net/standard-entry/app-dairy/10261.html

狩られ道さんにも書いていただきました。

KARAREMICHi iPhone Blog
●コツがわかってきた気がするのは気のせいかもしれませんが、おもしろい！
●でっかいやつはやっかい

みなさんの反応楽しく読ませていただいております。
iPad対応も着々と進んでおります。早いところサブミットしたいなぁ。
コンセプトはラブでしょうか。来たる2Pプレイでラブが生まれるといいな。
画像は開発中の2Pモードですね。

ElectroMasterレビュー紹介第２弾

2010-06-20T11:53:00.005+09:00

みなさんありがとうございます。
twitterでの発言くらいしかチェックできてませんが、楽しんでいただけているようでうれしいです。

ぐぐってたら、２つほどレビュー書いてくださっているのを見つけましたので、またご紹介。

海外から。ありがたいです。
アメリカでもぼちぼち数が出そうな雰囲気ですが、平日になったらまたぱったり止まるかなぁ。

1888FreeOnlineGames.com
http://www.1888freeonlinegames.com/iphonegames/electromaster-8130.html

それから、国内で。
「なにこのレールガンwwww」という反応。でへへ、やっちゃいましたｗ

萌えないゴミ
http://himechii.seesaa.net/article/153583469.html

今回は以上ですー。
近々、2P MODEのついたiPad対応を出したいところ。

ElectroMaster隠しコマンド

2010-06-19T01:01:00.004+09:00

ElectroMasterには隠しコマンドが仕込んであります。

タイトル画面でタップしまくると、裏ステージが遊べるのだ。
裏ステージとかいっても大して変わってませんが；
キャラのコスチュームが変わります！
で、全体的にスピードアップするので、スリルがアップしますよ！
ぜひお試しあれ！

ElectroMaster好評発売中！

2010-06-13T22:16:00.005+09:00

先週の金曜にリリースされました。ゲームは競争相手が多いのでランキングはそこそこですけど、なかなかみなさん楽しんでいただけているようで、良かったなーと思っています。

えー、Googleでいろいろ検索しておりましたら、以下のレビューを見つけましたので、ご紹介。
ありがとうございます！

iPhoneアプリ押忍スメ番付
「ElectroMaster」
可愛いドット絵ゲーム。ぶっ放す電撃が妙に迫力あり！

図書館の海辺
[iPhone][☆☆☆☆☆』ミクが超電磁砲で無双する『ElectroMaster』が神がかっている件

X-OSK
ElectroMaster(女の子ビーム、四方八方から迫り来る敵を倒せ)

いきなりみんな凄いスコアでびっくりですよ。上手だなー。
ではでは！

ElectroMaster紹介動画アップしました！

2010-05-31T23:48:00.004+09:00

審査終了までもう少し待ってね！

http://xionchannel.no-ip.org/~xionchannel/index_j.html

新作もうすぐ公開出来ます！

2010-05-27T02:20:00.005+09:00

ええそうです、ついに新作です！

レトロゲームのようですが、iPhone用電気ビリビリ爽快アクションゲーム！
その名も「ElectroMaster（エレクトロマスター）」です。

電気を溜めて電撃発射！敵を一掃だ！

乞うご期待！

定番アプリに選定されたよ！

2010-01-25T23:56:00.003+09:00

ASCII.jpさんところの記事「これが定番iPhoneアプリだ」の「クリエイター・マルチメディア編」の中に我が「Solid Dots」が選ばれました！わー！超嬉しい。
てなわけで、以下ご覧下さいね。

これが定番iPhoneアプリだ【クリエイター・マルチメディア編】

Solid Dots ver1.2を審査に提出

2009-10-31T14:41:00.006+09:00

←自動翻訳とかのメニュー

←黒い輪郭（このモデルよく出来てますよねー。作った人すごい、あ、作ったの僕じゃないです）

←半分色のついた輪郭

ver1.2の新機能は以下の通り。

- 機械翻訳機能（アップロードされたシーンやコメントをボタン一発で翻訳できます）
- 作者で検索機能
- 輪郭表示機能（輪郭なし、黒、茶、半分くらいの色が設定できます）
- メモリ効率の向上

画面をみると分かりやすいと思います。

Solid Dots Freeが本に載ってたよ！

2009-09-27T23:20:00.005+09:00

Solid Dots Freeが「iPhoneアプリPERFECT vol.2」という本に載ってるのを偶然発見しました。すかさずその本は購入。メディアに載るとうれしいですね。

iPhoneアプリPERFECT vol.2のAmazonリンク

記事はこんなでした！

Solid Dots 機能紹介ビデオ作ってみた

2009-09-27T11:46:00.005+09:00

なんだかんだ、やっぱり特殊な操作があるんで、ビデオを作ってみたです。これを見ればどんなことが出来るのか分かりやすいかなと思います。

フリー版のver1.15を提出！そしてAppBankさん感謝！

2009-09-26T04:54:00.004+09:00

フリー版のver1.15を審査に提出しました。
内容としては、ネット関連機能が有償版のver1.1とほぼ同機能になること。メインはマイリストが作れるようになることですね。

ver1.15
- マイリスト作成機能を追加（ハート破れボタンを押して、破れてないハートになったらマイリストに追加されたことになります）
- 自分で投稿したシーンへの人のコメントを削除できます
- 自分で投稿したシーンのタグの編集をロックすることができます

それから、AppBankさんのところで紹介記事を書いていただきました！
超うれしいです。あんなレビュー大手で紹介いただけるなんて。
というわけで、以下リンクご参照ください。

●Solid Dots Free -立体ドット絵モデラー-：ドット絵のモデルが作れるクリエイティブなアプリ！1325
http://www.appbank.net/2009/09/25/iphone-application/51329.php

Solid Dots ver1.1 リリースしました！

2009-09-19T00:23:00.009+09:00

ついにリリースできましたよ！新機能を象徴する画像を貼りまくります。

まずは、ファイルロードメニュー。ファイルが多くなってきて探せなくなった頃ですよね。だからほら、インデックスで飛ばせます。

そして、グリッド表示とかのオプションをアプリ起動中にも変更可能に！
アンドゥも従来のモデル外をタップと、アンドゥボタンをタップから選択できます。

ネット機能が充実しました。いろんなビューがあるので、並べ替えて使いやすくしてください。

タグ荒らし対策に、タグロック機能。鍵マークをタップするとロックと解除ができます。

マイリスト登録機能。ハートボタンを押すとマイリストに登録します。もっかい押すと解除ね。
いろいろな人のマイリストに登録されている数はハートの数で表示されます。

で、ほらね。ハートの表示が今までと変わってるでしょ。
ハートの数順表示は「人気順」です。

こんな感じです。
ほかにも細かくいろいろ追加されてますが、楽しんでもらえるといいな。
ではー。

Solid Dots ver1.1リジェクトされた！ので修正するじょ！

2009-09-07T01:55:00.003+09:00

なぜか有料版だけリジェクトされたので、ついでに機能アップとかもいれちゃおうと画策中。

・タグロック機能
・モデル投稿者は自分のモデルへのコメントを消せる機能
・マイリスト機能
・マイリスト登録数でモデルをソートする機能

といったところかな。

ちなみにリジェクトの理由は、ネットワークにつながっていない状態でネットワーク機能を使用した際に、つながってませんよというインフォを出しなさいっていうことでした。確かにそんなチェックしてませんでした。にゃん；

Solid Dots ver1.1審査中

2009-08-09T14:28:00.005+09:00

次バージョンを審査に出しました。
機能は以下の通り！

Solid Dots ver1.1
- 日本語対応
- ネットワーク関係でのクラッシュを修正
- 検索したあとのページ送りの不具合を修正
- 黒い色でも陰影がわかる程度に表示するようにしました
- ダウンロード画面のコメント等が長過ぎる場合でもちゃんと表示するように修正。
- 設定画面をアプリ内へ移行。グリッド表示切り替えも起動中に可能です。
- アンドゥをボタンでも操作できるようにしました。
- 一時ボタンの左利き対応。両利きにすると傾けて位置を変えられます。
- twitterへの投稿機能（モデルアップロード時、コメント時）

あと、要望いただいた画像の機能を追加。
ついでに、同じような選択部分に対して色を塗る機能も追加。

フリー版は以下の通り。
ちょっと制限が前よりきつくなってます。
なるべく多くの人にアップロードしてもらいたいなって思いは変わりませんが、あまりにも元データそのままで無加工の作品をアップする人が多いので、その辺りを鑑みてフリー版だけ上記に加えて以下の機能を追加。

- ダウンロードしたシーンの再アップロードをできなくしました

いじょ。

PCビューワーからのコメント投稿など

2009-07-24T13:24:00.003+09:00

先日作成したPCからSolid Dotsの作品を閲覧するビューワーですが、PCからのアクセスでもviewsカウンタが回るようにしました。もちろんクッキーでアクセス履歴を残しているのでリロードしてもガンガン回ることはありません。教えてくれたchishowに感謝！

　あと、コメントの投稿もPCからやりたいなーと思ってたので、荒らし対策にcatpchaをつけてコメント投稿できるようなフォームをつけた。これもphpからcatpchaを扱える関数があったので、さくさくっとできた。catpcha画像の表示がたまにうまく転送されないことがあるのが難点かな。

とりあえずこんなとこー。

ビューワーのリンクは以下です。
http://xionchannel.no-ip.org/~xionchannel/index_viewer.php

Solid Dots 新着投稿お知らせTwitterBot

2009-07-23T01:18:00.003+09:00

PC用ビューワーができたのをいいことに、
新着モデル投稿のお知らせをつぶやくTwitterBotを作りました。

日本語版と英語版がありますので、
ぜひよろしく〜

●日本語版お知らせBot
SolidDots : http://twitter.com/SolidDots

●英語版お知らせBot
SolidDotsEng：http://twitter.com/SolidDotsEng

英語でも書いておきましょうか。誰も見てないだろうけど。

Now, I prepared the Twitter Bot who twees newly uploaded model news.
Please follow this account!

●Upload News Bot in English
SolidDotsEng: http://twitter.com/SolidDotsEng

Solid Dots がWHAT'S HOT入り！

2009-07-22T02:41:00.005+09:00

AppStoreにある「WHAT'S HOT」にSolid Dotsが選ばれました！

じゃじゃーん。画像を見てちょ。記念にスクリーンショット撮ったよw
iTuneからいける方もリストに載ってますねー。うれしいー。

もっとDot仲間が増えるといいな。
最近のおすすめは「重機シリーズ」と「Girlシリーズ」ですね。
特にGirlの「イヌミミ」はいいですよー。

と、PC用のビューワーができたのでリンクも貼ってみました。
トップページはこちら。

Solid Dots PC用のビューワーを作成中

2009-07-21T00:02:00.003+09:00

いい作品をtwitterとかに貼付けられるように、PCから見られるビューワーを作成中。

何を使ってウェブ３Dを実現しようかと迷ったんだけど、結局のところFLASHが普及しているのでFLASH用に作ってます。とはいえFLASHのスクリプト言語ActionScriptなんて触ったこと無いので、すべてが初体験。

いろいろ調べたところ、FLASHのライブラリでpapervison3dというものがあるらしい。それを使うとそれなりに３Dを扱うことができるっぽいので、組んでみてたところ、どうもソフトウェアレンダリングでZソートというすごい代物だということが判明。時既に遅し、もう組んでしまってたので、高速化なんかほぼ望めず。シェーディングも普通にライト炊いたのでは無理。

シェーディングについては、各面別にマテリアルを用意して、マテリアルの方向別に６面分の光源計算をしてマテリアルの明度をリアルタイムに変えるというなんともレガシーな方法。パレットチェンジしているような気分です。ネタがドット絵だからむしろ良いのか？

とまあそんなこんなで、現状ここまでできました。
β版ページ

Solid Dots 操作方法のTIPS

2009-07-17T09:31:00.003+09:00

操作がいろいろありすぎてわからない人多いと思うので、こうするとやりやすいよという方法をご紹介。

Q1: 思ったところを削れない
A1: ナイフアイコンのときに、指を画面へのせた状態のままだと削られないので、その状態でしっかりと削りたいブロックにカーソルがあうようにして、それから指を離してください。これで狙ったところを削れますよ。

Q2: 思ったところに色を塗れない
A2: デフォルトだとパレット画面の塗り方設定が「Drag Painting」になっているので、連続的に塗れるのはいいですけど狙ったところを塗れない。そこで、「Drag Painting」ボタンを何回か押すとモードが変わります。「Pick Painting」にすると、１個づつですけどナイフアイコンのときのように指を離すまでは色が塗られなくなって、狙えるようになりますよ。

Q3: 狙ったところにブロックを盛れない
A3: Q1と同様に、指を離すまでは確定されないので、狙ったところにカーソルをあわせるようにしてみてくださいな。

Q4: アンドゥーはないの？
A4: モデル外の部分をタップするとアンドゥーできますよ。

Q5: 左下のコマンドアイコン「グローブ」「ルーペ」「スポイト」の使い方がわからない。
A5: 左下にある「グローブ」「ルーペ」「スポイト」などはそこに指が置かれているときだけ有効になる一時的な機能です。たとえばグローブは、ナイフで削っている作業の途中にモデルを一時的に回転させたい場合に使用します。そのときにはグローブに左親指をのせて、右手で画面をドラッグすると、ほらモデルが回りました。で、左手をコマンドアイコンから離すとナイフモードに戻りますのでサクサクモデルが作れます。同じくルーペも指をのせている間だけ拡大されます。スポイトも指をのせている間だけスポイトモードになるので、左手でスポイトを触りながら、右手で色を吸い取りたいブロックを触ってください。

まずはこんなところでしょうか。
公式サイトの方にもFAQとして今度載せておきますね。
次バージョンにはヘルプをアプリ内にいれるかなぁ。

Solid Dots レビュー記事紹介

2009-07-16T09:43:00.003+09:00

●white dev. の日記
「Solid Dots」
http://d.hatena.ne.jp/whitedev/20090714/1247541646#c

●iPhone 3G Wiki blog
「かわいい立体ドット絵ツクール」
http://blog.sohaya.com/2009/07/14/solid-dots/

●これがiPhoneクオリティ！
「「Solid Dots -立体ドット絵モデラー」自分でドット絵を作成できるアプリ。共有も可能！」
http://www.iphone-quality.com/apps/solid-dots/

●CreativeApplications.Net
「3966 Solid Dots [iPhone]」
http://www.creativeapplications.net/iphone/solid-dots-iphone/

現時点で以上のものをみつけましたー。
レビュー記事をこんなに書いてもらえるとはしあわせだ。

ASCII.jpで記事になったよ！

2009-07-14T21:57:00.004+09:00

なんか、いつのまにかASCII.jpで記事になってるー！
ぜんぜん気づかなかったのだけど、twitterでこの記事紹介してくれる方がいて発見。

うーん。なんだか感慨深い。
でもこういうのって勝手に記事になるもんなんだね。知らなかったw

みなさんに楽しんでもらえると良いなー♪

記事は以下のリンクから。
http://ascii.jp/elem/000/000/435/435677/

Solid Dots ver1.0

2009-07-14T07:26:00.006+09:00

立体ドット絵モデラーの審査が通りました！
フリー版もあるので、試してみてくださいな。

以下はアプリの説明ページ。
http://xionchannel.no-ip.org/~xionchannel/solid_dots/index_j.html

審査結果が出ません

2009-07-10T00:41:00.003+09:00

7/1にバグ報告がきて、翌日に修正版を提出。
それからいままで音沙汰無しです。

そろそろだと思うんだけどなぁ。
でも、その前に出したCubing Timer ver1.3は３週間くらいかかったんだよなぁ。

いい加減どうにかしてください。のんびりやさんのアップル。

Solid Dots審査に出しました

2009-06-29T02:43:00.003+09:00

立体ドット絵モデラーのアプリですが、本日審査に出しました。
早く公開できると良いなぁ。

Cubing Timer ver1.3

2009-06-29T02:40:00.005+09:00

Cubing TimerのiPhone OS3.0対応版の審査が通過しました。

新機能は以下の通り。

- OS3.0へ対応
- ユーザーインターフェース（Reset, DNS）を少しわかりやすく修正。

ま、ボタンの文字変えただけなんで、たいしたことないですけど、今までわかりにくかったのは確かなので。

完成間近

2009-06-24T02:35:00.006+09:00

　ようやく、ちゃんと形が作れるようになりました。ネットにもアップできるようになってますし、もうアプリも完成ですね。今はフリー版の対応を考えている感じです。アプリの紹介HPも作らなくちゃなと思ってます。

複数SDKはやっぱだめだった

2009-06-20T13:46:00.002+09:00

先日の複数SDKの件ですが、結局のところだめでした。XCodeが起動する際にどこのフォルダのXCodeが起動するかが不定になるようで、新しいSDKフォルダに切り替えても古いXCodeが起動したりしてなんだか安定しない。

　そうこうしているうちに、正式版の3.0SDKが出たので、すべて削除して、あらためてSDK１つだけ入れることにしました。現状これで3.0のiPhoneへアプリの転送ができてます。ver2.2アプリなどもそのまま転送できるのでテストできますね。

　さあ、もう一踏ん張り。もうすぐアプリ完成するぞー！（あと１週間程度でなんとかしたい。。。）

SDKチェンジ、微妙にうまくいかない

2009-06-08T23:33:00.003+09:00

シンボリックリンク張り替えでのSDKチェンジですが、shスクリプトあるいは、アップルスクリプトを使用してリンク張り替え後に自動的にXCodeを起動するようにしてみたところ、一見うまくいくけど、iPhoneシミュレータを起動させてデバッグしようとするとうまくいかない。どうやら内部パスが/Developerからのものではなく、本体のパスで記述されてしまうためにデバッガが正しく動作しないみたい。

　で、なぜかFinderから/Developer以下のXCodeを選択して起動させるとそういう不具合はない。なんなんでしょうね。Docへ登録した/Developer以下のXCode起動も問題ない。スクリプトから起動させるアプリだけが不具合を被る様子。あれか、アプリ起動コマンドのまえにシンボリックリンクの宛先の解決をしてしまうのかもしれんな。まいった。

　というわけで、ワンタッチでリンク張り替えてXCode起動はあきらめて、リンク張り替えとXCode起動の２タッチで我慢することにしましたとさ。

iPhoneSDK複数インストール

2009-06-07T23:19:00.004+09:00

iPhoneSDKのベータが出てたりするので、とりあえず旧バージョンを残したまま新バージョンもインストールできるような方法を探してました。で、別のフォルダにインストールしたり、別アカウントを作ってインストールしたりという書き込みをいろんなところで見るのですが、やり方わかんなかったので、以下の方法にしてみました。

１、旧バージョンの入っている/Developerを別の場所に退避。（例えば/iPhoneSDK221/Developerとか）
２、新バージョンを通常インストール。/Developerにインストールされます。
３、新バージョンを別の場所に退避。（例えば/iPhoneSDK30beta5/Developerとか）
４、退避したそれぞれから都合によって/Developerへシンボリックリンクを張る。

以上で好きなようにSDKバージョンを切り替えながら作業ができますね。
で、それをもう少し簡易にやるのに、２つほどシェルスクリプトを用意して、シンボリックリンクを削除して張り直すようなシェルスクリプトを各バージョン別に用意しました。

とまあこんな感じです。
betaがとれて、正式版になったらSDKを切り替えて使用する必要はなくなるのかもですね。
（現状は3.0から2.xへ実機用appがインストールできないみたいですね）

ダウンロードリスト

2009-05-18T02:01:00.003+09:00

とりあえず、リスト画面を作ってみた。
いろいろとバグの巣でなかなか大変でした。

まだまだいろいろ大変そうですが、がんばります。

アップロード機能できました

2009-05-07T01:51:00.003+09:00

このGW中にいろいろやって、ようやくアップロードの機能も実装できました。

iPhone -> Dynamic DNS -> 自宅サーバー -> php -> MySQL という流れでデータが流れます。

Ubuntuのマシンを新しく作成して、自前のサーバーにしました。phpを好き勝手使いつつ、容量もそれなりにないと困るので自前で用意してしまった方がいろいろ楽かと思ったので。最近はatom搭載のべアボーンキットがあるので、格安にサーバーが作れますね。25000円程度で組めました。

添付の画面はアップロード用画面。サムネール画像とタイトル、コメント、タグ設定をして投稿という感じを考えてます。まあ、ニコニコ動画みたいなもんですかね。

今日はここまで。
明日からはダウンロード機能の方の整備ですな。

セーブ画面できた

2009-05-04T00:56:00.004+09:00

セーブとロードができるようになったので、画面デザインやりました。
まだ、アップロードとダウンロードの機能は実装してませんが。ネット関連のメタファーに迷ったけど、こんなもんでしょう。

セーブデータに四苦八苦

2009-05-02T03:33:00.004+09:00

セーブデータの対応をしてます。

PNGにオリジナルチャンクを追加する方向で検討中。
PNGの仕様書をあさってみたり、エンディアンの変換で戸惑ってみたり。

とりあえずセーブできるところまで作った。ロードはこれからですが、ファイルサイズが200KBを超えるような感じ。ネットにアップロードすることを考えてるけど、このサイズで大丈夫かな。

さてさて、どうなることやら。

パレット改良

2009-04-27T02:40:00.002+09:00

テクスチャ選択画面と釣り合うようにクオリティアップさせました。機能は変わらず。

盛るぜ〜盛るぜ〜、超盛るぜ〜♪

2009-04-26T01:00:00.005+09:00

初期の固まりよりも大きく盛れるようにしてみた。それと同時に、固まりのサイズに応じて注視点とスケールが変わるようにした。これによってメモリ上は大きく確保しておいて、表示物だけ初期値を小さく作っても、のちのちの増殖に対応できるようにした形になります。

Space Deadbeef

2009-04-25T00:12:00.006+09:00

今日、業界の人との飲み会にいってまいりましたが、まさか昔僕の１つ上でいらした先輩がiPhoneゲーム作ってたとは！
　というわけで、ご紹介します。

　Space Deadbeefという横スクロールシューティグ。敵をフリックすることでロックオン、離せばミサイル発射！指をタッチしているところに向かって自機は進んでいくので、敵の攻撃をさけることもできるというゲームです。感覚的にはRayforceに近いですかね。まさかこんなゲームがiPhoneでできるとは。そして無料です。やっぱり先輩は違うなぁと思った次第です。

　みなさんもよろしければぜひ！

http://itunes.apple.com/WebObjects/MZStore.woa/wa/viewSoftware?id=297048779&mt=8

アイコンを整備しました

2009-04-24T00:06:00.003+09:00

テクスチャ選択の画面。なかなかよくできた。

でも、これがよくできすぎてて色選択のパレットがへぼく見える。
どうにかしないとな。

パレット自体をもっと年季の入ったやつにするか。あるいは、試験管に変えようか。

好きな写真を貼れるよ

2009-04-23T02:57:00.004+09:00

カメラを使ったりアルバムの写真を使ったりで、好きな写真を貼れるようにしました。
これでかなり遊べるんじゃないかなと。

そろそろセーブデータについて考えようかなという段階に近づいてきました。

テクスチャ投影

2009-04-21T02:05:00.006+09:00

　テクスチャの投影ができるようになりました。カメラから平行投影、あるいはパースペクティブに投影のようなことができます。とりあえず木のテクスチャ貼ってみたら木を崩しているような感じになりました。いやぁ、楽しいなあ。

　UV値は投影が指示された時点でその場で投影計算をして算出してます。3D空間上の頂点をフレームバッファへ投影し、その座標からテクスチャ上の2D座標へスケール調整するような感じですね。その際に、カメラ座標系にするか、スクリーン座標系にするかで奥行きに対してのつぶしが変わりますので、パースがかかったりかからないで平行投影になったりするということになります。

Cubing Timer ver1.2

2009-04-19T04:39:00.004+09:00

昨日ですが、ようやく審査が通りました。
新機能は以下になります。
お待たせしました。これでスクランブル後の色配置を見る以外はできあがって、練習用に使えるようになったかと思います。

JP
- 計測履歴をメールで転送できるようになりました。
- ローリング計測ができます。（１２回以上計測するとローリングアベレージ表示になります）
- 計測結果を消去して再計測ができるようになりました。
- OS2.0以降に対応。

ENG
- You can send the measurement history by mail.
- You can measure rolling average. (It is changed to the rolling average mode when measuring it more than 12 times. )
- You can delete the measurement result, and can measure it again.
- It can run in OS2.0 or later.

ズーム機能

2009-04-19T04:34:00.006+09:00

　ズーム機能を入れました。あと、カメラを回す機能もついでに。インターフェース的には左下のアイコンを触れているときだけ臨時で機能がオンになる仕様。これならiPhoneを左手で持ちながら一時的にズームにして、右手で色を塗ったり操作できるという感じになります。

　こないだのレイキャストによるコリジョン計算が、プロジェクションの逆マトリクスを使用して原点からカメラ座標へ逆変換するということをしてるのですが、この逆変換がどうやらカメラの移動に関しては効かない様子。カメラ座標を若干移動した分に関しては自前で逆変換しないとだめなようでした。

より正確なコリジョン計算を

2009-04-18T04:32:00.003+09:00

　なかなかいろいろな進展がありました。

　まずは、描画で、面と面の継ぎ目部分をつないでしまうと隣の面の側面が表面まで出てきてチラチラしてしまう問題がありましたが、それを完全に解消しました。隣のキューブの存在の有無を調べてそれに応じて面の表示をするかどうかを変えるようにしたところ、表示もきれいになったのは当然として（左の画像）、画面に描画されている無駄なポリゴンがなくなったことでだいぶ高速に動作するようになりました。いまでは20x20x20くらいでもヌルヌルです。

　そして、コリジョン関係をより丁寧なものに変更。見えている中での判別としたかったので、キューブが隣り合う面のどちらから見えているのかによってオブジェクトとしての法線を用意し、その法線とレイキャスト用のベクトルでキューブが見えているかどうかを判定するようにしました。それによって、すべてに対してレイキャスト計算をしないでよくなったため、若干の高速化も達成。高解像度キューブでの動作が多少快適になりました。

　あと、カメラ操作。ちょっとしたアイデアでしたが、画面端の方をフリックする際には視点座標系のZ軸を中心に回転するようなニュアンスにしました。普通の３Dツールだとそういうのはありませんが、これはこれでいい感じかと。

　そんなこんなで盛りだくさんな更新でした。そろそろ完成が見えてきたかな？

色塗れるぞ

2009-04-17T02:19:00.008+09:00

　パレットで選んで、ブロックに色を付けられるようになりました。ただ、塗る先の選択がなかなか思った通りにいかないので、座標の判定方法を変えてみました。
　以前は、３D空間上の座標をスクリーン座標系へ変換し、スクリーンをタップした座標を比較、あたったもののうち手前にあるものを優先で選択させるという方法をとってましたが、今回はカメラ座標からスクリーンをタップした座標を通過するベクトルが、３D座標上のブロック（球で判定してますが）にあたるかどうかを判別し、手前のものを優先するとしました。ま、ちょっとはましになったけど、やっぱ奥のものを選ぶのが難しい。混み合っているところを選択させるには、カメラのズームを入れないとだめかもですね。なにかいいズームのUI考えないとね。

パレット作成中...

2009-04-15T03:13:00.004+09:00

結構おしゃれにできてきたんではないかと。

これでカラー選択して、ボックスに塗っていければなと。

コマンドメニューつけてみた

2009-04-12T21:21:00.003+09:00

掘削の機能をいろいろ用意して、選ばせるメニューをつけてみた。武器とか並んでて楽しそうでしょw

・手袋：物体を回してみるモード
・短剣：１個づつブロックを消すモード
・モーニングスター：中心の１個とその周り上下前後左右を１個づつ消すモード
・長剣：なぞった部分を貫通しながらズバズバ消していくモード
・岩：ブロックを１個追加するモード

ってのをとりあえず実装。消すモードはいいんですけど、追加するモードの追加部分の選出がうまくいかないなぁ。一番手前でなおかつ隣り合うブロックが存在していることを条件にしているけど、それだと思った場所にブロックを置けないことがあるんですわ。見えてる中で一番奥ってのを割り出せるといいんですけどね。

・フラスコ：色をつける
・本：セーブとか

なんてのを考えてますが、当分先かな。

Cubing Timer またもリジェクト

2009-04-10T22:49:00.003+09:00

メール送信についてのUI設計に問題があるとのことです。これについては指摘はありませんでしたが、履歴の削除ボタンや全選択ボタンについても同様のことがいえますね。要は何かを行おうとした際に、条件を満たしていなくて実行できない状態であることをユーザーにわからせないといけない、あるいは、実行できない状況であれば、原因はともかく実行できないんだなと思わせるようなアフォーダンスが無いとならないわけですな。至極当たり前のことでした。チェック不足というか、自分本位になりすぎてたな。反省します。

現状は、履歴が１つも無い状態で削除ボタンやメールボタン、全選択ボタンを押しても何も起きない。全選択ボタンは反応がないだけでまだましだが、削除やメールについては「メール送信しますか」のようなダイアログを出して実行させた上で何も起きないので、たちが悪いですね。

本日訂正版を提出できそうなので、新バージョンはまた来週までお待ちください。

形が作れるようになったお！

2009-04-09T23:34:00.005+09:00

タップした場所のブロックを消せるようになりました。タップした座標（スクリーン座標）と３D空間上の座標を比較するのに結構手こずった。いろいろ調べたところ、以下のような変換が必要でした。

モデル自身の座標　→　モデルビュー座標系　→　プロジェクション座標系　→　ビューポート座標系　→　スクリーン座標系

ここで見落としがちなのが「プロジェクション座標系」から「ビューポート座標系」への変換ですね。てっきり、プロジェクション行列をかけた時点で奥行き情報がつぶれてスクリーン上の座標になるのかと思ってたので、得られた数値に定数を掛けたり割ったりで調整しようとして失敗してました。というわけで、プロジェクション変換後に奥行きに従って縦横に座標をつぶすような処理が必要だったわけですね。

詳細は、以下のページを参考にしたので、メモおいておきます。
capa's blog on JUGEM ワールド座標→スクリーン座標変換
MWsite オブジェクト座標系からウインドウ座標系までの変換(JOGL)

さて、先日の隠面消去問題ですが、手抜き対処で対応しました。要は表面よりも側面が弱くなればよいので、側面と表面の接続をあきらめて、隙間があいてしまっても表面を前に出しておけばチラつかないわけです。添付画面の前面と側面の際を見ると細い線が出てますが、これは隙間です。いや、そこを埋める処理もしてみたけど、描画がかなり重かったのでね。ポリゴン数も増えちゃうし。なので、これでいいことにします。

開発情報メモ

2009-04-08T03:34:00.002+09:00

日本人がつまずかないための
iPhone開発ポイント

http://www.atmarkit.co.jp/fwcr/design/benkyo/iphone01/01.html

基本的な内容でしたけど、上記の記事はなかなか参考になります。
有料公開のために、前もって手続きしておくかなぁ・・・。

かなり軽量化、そして隠面消去問題

2009-04-08T01:28:00.008+09:00

　まずはかなりの軽量化を達成。23x23x23程度まではすいすい動くようになりました。32x32x32でもなんとか動く感じ。そこまでいくとカクカクですが。
やはりモデル合成が効いてますね。頂点バッファに使用できる変数がunsigned short型なので65536個までの頂点しか保持できない。そこで、ぎりぎりまでを１モデルにして、以降を別モデルとするような合成ルーチンを作成。
　さて、そして２枚目の図の方ですが、いままでキューブの切れ目がわかるように若干間隔を開けて表示してましたが、ぴったり隣り合うようにしたら、見えない側面が表面とのZテストでちらちらでてきたしまった！さて、どうしようかという問題発生。あーうー。

多少軽くなりました

2009-04-06T08:42:00.003+09:00

いろいろとチューンナップして、多少軽くなりました。やった点は以下の通り。
・強引な１ストリップ化をやめて最小限の面でGL_TRIANGLESを使用（無駄なポリゴンが消えてフィルアップかと）
・見えないキューブは非表示に（すべての隣り合う面にキューブが存在している場合は自身を非表示に設定）
・カメラ操作の仕組みを変更（まずあたらしい回転変換、その後累積か移転変換をかける、合計の回転変換をバッファに記憶という流れ、glRotateを使ったらおかしいという問題ではなかった。ローカル/グローバル座標系に対しての理解が甘かっただけでした）

というわけで、添付画像は16x16x16個、合計4096個のキューブが出ているように見える状態です。ま、実際ドローされているのは外周だけなので1352個ですが。
これに加えて、前回のエントリーに書いたモデル合成を使用すればさらにいけるのではないかと考え中。

描画が重いです。。。

2009-04-05T15:57:00.003+09:00

テストで立方体を10 x 10 x 10の合計1000個表示していますが、とても重いです。フレームレートにして秒間１５〜２０フレームくらいでしょうか。高速化手段はVertex Buffer ObjectとかIndex Buffer Objectを使用してますが、焼け石に水ですね。やっぱりglDrawElementsの回数が多すぎるのかもです。なので、次は表示前にモデルを合成して見ようかなとか思ってます。

カメラ操作は指で動かした方向をとってきてglRotateでモデルビューを回転させてるので、たまにおかしな動きをします。このあたりもプロジェクションビューに切り替えて、カメラの回転もマトリクス使った方がいいような気がしてます。手探りなんでよくわかってませんが。

そんなこんなで、3Dは覚えること多すぎてなかなかすすまなーいw

3D勉強中

2009-04-02T21:31:00.003+09:00

OpenGLなんて触ったことないのですが、勉強中です。
とりあえずティーポットが指で回せるようになりました。

難しいねー。世の中のプログラマさんはすげーなと。

再申請となりました

2009-04-02T21:27:00.003+09:00

先週提出したver1.2にバグがあることが判明しましたので、再提出となりました。
バグ自体はすぐ解消したのですが、ビルド設定をうっかり削除してしまって、復旧するまで１日費やしてしまったw
本日修正版を提出したので、来週にはメール機能がついているバージョンを使用できるかと思います。

ルービックキューブ公式大会

2009-03-26T21:54:00.003+09:00

3/28にルービックキューブの公式大会「大阪大会」が行われますね。
僕は予定があって参加できませんが、参加されるみなさんがんばってください。応援してます。

日本ルービックキューブ協会オフィシャルサイト

審査待ち

2009-03-25T08:40:00.002+09:00

ver1.2審査待ちです。
機能は以下の通り。

- 計測履歴をメールで転送できるようになりました。
- ローリング計測ができます。（１２回以上計測するとローリングアベレージ表示になります）
- 計測結果を消去して再計測ができるようになりました。

残るはスクランブル結果の色表示ですね。
仕様検討中です。

メール送信機能！

2009-03-24T23:57:00.003+09:00

メールで記録を送信することができそうです。アプリは終了しちゃいますが、メールアプリに切り替わって好きなアドレスに送信できるという感じになります。いやぁ、意外に簡単だったw

機能追加ほぼ完了かな

2009-03-22T18:39:00.003+09:00

要望されていた、ローリングアベレージ対応が大きいですが作業ほぼ終了です。
記録をメールで出すってのは大掛かりなので保留にしておいて、あと対応すべきはスクランブル結果が色の配置で見れる機能ですかね。これについてはどういうレイアウトにするか考えないといけませんねー。

とりあえず現状の状態でver1.2として提出しようかなぁ。ふむぅ。

Cubing Timer ver1.1

2009-03-21T08:46:00.005+09:00

審査通りました。
新機能は以下のとおりです。

Cubing Timer ver1.1
・計測履歴表示
・5x5x5で60回スクランブルでも表示がちゃんとするように

下記リンクでiTune開きますー。
http://itunes.apple.com/WebObjects/MZStore.woa/wa/viewSoftware?id=306802722&mt=8

なかなか審査とおらないね

2009-03-20T18:10:00.003+09:00

日曜に提出したのでそろそろ審査通過するはずなのだが、今週は忙しいのだろうか。まだ審査通過の連絡きません。5x5x5で60回スクランブルを表示させる必要のある方もうしばらくお待ちくださいね。

関係ありませんが、開発に使用していたiPhoneのデータが飛びました(- -;
どうもPCへ同期したときのバックアップがおかしいなと思ってたら、バックアップファイル壊れてたようで、復帰した後の同期でデータが壊れてて戻せないっていうという仕打ち。とほー。旅行で撮った写真とか全滅ですわ。これからはこまめにバックアップされるように気を使います。特に開発に使用してると不意におかしくなることもありますからねー。要注意です。

次期バージョン改造中

2009-03-18T22:26:00.004+09:00

次に組み込む予定の機能は以下の通り。
基本的に、皆様にご指摘いただいた点を改良します。

ver1.1はすでに審査中ですが。
そっちは、以下。
・計測履歴表示
・5x5x5で60回スクランブルでも表示がちゃんとするように

ver1.2では以下を組み込もうかなと考察中。
・Rolling Average対応
連続して１２回以上どんどんすきなだけ回し続けて、その中から連続した１２回で一番早いものを表示する機能。

・DNF以外のタイム表示。POPとか、失敗したからノーカウントで今のタイム消去というもの。

あと何かありましたっけ。
あー。メールで送信とかか。そういうのは大掛かりになりそうなので、iPhone OS 3.0になってから対応しますね。コピペでメールに送れればよさそうですし。逆に、コピペで選手権用のスクランブル読み込み機能も欲しいかもです。

そんなこんなで、自分のキューブの練習が滞っているうちに、ライバルについに追い抜かれたー！！！先に３０秒切りの世界へ行ってしまわれた。とほー。俺もがんばらなくっちゃ。

iTune Connection設定不備でしたw

2009-03-18T22:24:00.003+09:00

iTune Connectionというサイトでアプリの公開設定ができるのですが、どの国にオープンにするかというような設定がいつのまにかクリアされてしまっており、それによってどの国にも公開されていない状態になってました。おかしいなぁ。というわけで、僕の設定不備でした。現在はもうAppStoreに復帰しています。いやーびっくりした。

削除された！？

2009-03-18T10:29:00.003+09:00

なんか、今日AppStoreみてみたら、Cubing Timerなくなってるー。なぜ？メンテ中ってことなのだろうか。うーむ。

アプリ登録きた！

2009-03-10T12:21:00.002+09:00

アップルストアに無事登録されました。
無料なので落としてみてください！！