第1回 Flash Lite 勉強会に行ってきた

| コメント(0) | トラックバック(0)
ついこの間ケータイ向けゲームサイトでFlash合成部分を担当したので、もっと色々勉強しないとと思って行ってきた。
http://atnd.org/events/12534

会場を提供して頂きましたZynga Japan様、どうもありがとうございました。

以下、メモ書き(ほぼ原稿そのままなので読みにくいかも。すいません)

「『トレジャーアイランド』でのFlash Lite 1.1を用いた開発事例」

  • Zynga Japan emorinsさん

トレジャーアイランド

  • ガラケー向けのゲーム
  • 何か発掘したりとかして財宝とかゲット → 友達と楽しむ
  • ガラケー向けソーシャルゲームの開発なのでFlash liteを使った
    • Flash liteにはバージョンが色々ある

Flash lite のバージョン

  • 普及率を見てどのバージョンを採用するか決める
  • 古いヤツが1.0、ガラケーの最新版は3.1
  • できるだけ新しいバージョンを使いたいけど普及していないので、特定の機種でプレイ出来なくなる可能性がある
  • DoCoMoだとまだFlash Lite 1.1を使っている人がいる
  • 最新のFlash liteで開発しちゃうとプレイできないユーザーが出てくる
    • 低いバージョンを選ばざるを得なくなる
  • トレジャーアイランドでは1.1を採用

Flash Lite 1.1 / 2.0

  • 表現できる幅が狭まってしまう
  • 100kb制限、メモリ量も少ない → サーバーサイドで動的生成、.swf内の変数やビットマップ、ムービークリップなどを入れ替えて表現を広げる
    • ガラケー向けFlash Liteでは一般的な手法

どんな動的生成方法?

  • いろんな生成方法がある
    • swfmill
    • SWF Editor
    • バイナリの編集
  • やり方は、
    • ベースの.swfを作る
    • SWF Editorで編集したり、
    • swfmillで.xml ←→ .swfの変換
    • バイナリを直接編集して出力

動的生成しているところ

  • キャラクターの画像(アバター的なもの)
    • プレイヤーごとにキャラクターが異なるので、ユーザーごとに生成して出力分け
    • キャラクターのデータをFlashに全部入れてしまうと容量超えてしまうので
  • 背景画像
    • 島によって異なるので動的生成で入れ替えている
    • 何枚も.swfを用意する必要がなくなるので、管理も簡単

bitmapの入れ替え

  • ベースとなる.swfから SWF Editor を使って予め用意してあるbitmapに差し替える
    • http://pwiki.awm.jp/~yoya/?swfed ?

メモリ管理

  • 容量とは別にメモリの管理も頭を悩ませる課題
  • Flash liteにおけるメモリ容量はキャリアとか機種でだいぶ差異がある
    • メモリの容量が壁になって制作に支障がでる
    • bitmap とかムービークリップとか使うとどんどんメモリを食っていく
    • 効率的にメモリを使って開発する必要がある
  • Flash Liteにおけるメモリ管理
    • GC → マーク&スウィープ
      • Flash上で使ってるオブジェクトと使ってないオブジェクトを識別
      • 使ってないオブジェクトを開放、どんどんメモリ喰うのを防いで再生
    • ケータイのヒープは2種類
      • Static heap(静的ヒープ)
      • Dynamic heap(動的ヒープ)
      • Device Centralとか見ると書いてある
    • Static heap
      • Flash Playerに割り当てられた固定のヒープ
      • ムービークリップやビットマップを使うと、都度確保される
    • Dynamic heap
      • Static Heapを使い終わったら、ケータイのOSから動的に割り当てられる
      • ヒープチャンクが32kb。32kbづつ消費していく
      • Dynamic Heapが使えるのはFlash Lite 2.0以降なはず
      • 1.1で使える機種は無いか、少ない → Static heapを使っていくしかない
  • メモリ不足になるとどうなるか?
    • Flash Playerが動かなくなる
    • bitmapが赤くなる
    • Flashが再生できない
  • ビットマップデータは、Flashのステージ上に置くと無圧縮32bitに展開
    • 100px * 100px * 4バイト = 40kb (64kb)
    • Dynamic heapは32kb単位で確保なので、40kbのものを置こうとすると64kb使う
  • フラグメントがおきやすい
    • 大量の変数にnullを代入して参照を切ってもなかなかメモリがあいてくれない

どうやってメモリを効率的に使うか?

  • GCがあるので、参照を切れば開放される
    • nullを代入
    • ムービークリップをremoveMovieClip する
    • こまめに参照を切ってメモリの空き容量を増やしていくことが必要
  • スイープのタイミング
    • 60秒間隔
    • メモリ不足でエラーになった時
    • メモリ使用量が突然20%以上跳ね上がった場合(2.0以上のみ? 1.1では発動しなかった)
    • GCを起動する関数とかは用意されていないので、このタイミングでしかスイープしてくれない
      • 使い終わった変数にnullを入れておいても、すぐに容量が空くわけではない
  • できるだけメモリ食わないで開発する方法
    • 使うものはあらかじめステージ上においてしまう、後からロードしたりしない
      • メモリの使用量を抑えることができた
  • なんか効率のいいメモリ管理方法とか開発方法を知っていたら教えて下さいw

まとめ

  • トレジャーアイランドはmixiで絶賛稼働中なので、是非遊んで下さい

FlashLiteを用いた画像キャプチャー

Flash Liteの合成

  • @goodoo さん (白井さん)
  • ケータイゲームのFlash
  • Cyber X
  • Action Script の話です

swf撮る

  • swfミル、じゃなくて。。
  • PHPからコマンドラインでキャプチャしたいFlashを指定するとキャプチャできる

Ver < 0.1 の問題点

  • 重すぎた
  • 1枚生成するためにFlashプレイヤーの起動、停止を繰り返し

Ver 0.1

  • プログラム側で好きなswfを指定できるようになった
    • XMLで指定
  • Flashから画像データをPOSTするようになったので、簡単に保存できるようになった
    • それまでは標準出力に吐き出されていたのをPHPで拾ってた
  • 1枚生成するごとに都度起動していたのを、常時起動に変更。ある程度の速度を確保できた

Ver 1.0

  • ダメだった所を全面的に直した
    • Scriptが動くとか
      • 縮小機能とか、切り出しとか、画像フォーマットの指定が可能に

利用シーンの説明

  • Flash部分
    • アバターで着せ替えのアイテムを選択、確認する
  • 画像部分
    • 実際に着せ替えたアイテムを着ている「画像」が表示される
  • まだちょっと無駄が多い
    • "/" (Document Root)にアクセスが来てしまう

今後

  • もうちょっと拡張して、いつか公開できたら公開したい

Flash書き換え PHP Extention SWFEditor

  • @yoya さん
  • SWF Editor for PHP
  • swfのバイナリを眺めるのが趣味w PHPをいじるのが趣味w 趣味が高じてswfをPHPでいじった

動作サンプル

  • replaceJpegData() という関数を書くだけ。1行か2行でOK

開発の動機

  • Flash Lite 1.1の制限
    • 100kb制限
    • ボタンを押さないと通信できない
    • 実行時に引数を渡せない
  • .flaファイルがない
    • 作った人が逃げた
    • 手元にswfしかない。「画像だけ差し替えたらそのまま使えるよね?」みたいな要望・・・
  • mingというのがよく使われている
    • .swf の構造を理解していないとつかうのが難しい
    • 構造を理解してプログラミングしていく感じ
  • swfmillは素晴らしい
    • xmlという形式に一度変換する。少し重たい。
    • 負荷の高いサイトで使うのはちょっと無理がある

できること

  • 画像の取り出し
  • 画像の差し替え
  • テキストボックスとかの文字列を入れ替え
  • Action Scriptの変数を埋め込める
  • (さっきまで忘れてたけど).mldとかの差し替えもできる
  • 詳細はAPI一覧を見ればいいよ

画像を差し替える

  • さっき1行って行ったけど、実際には6行くらい

文字列を入れ替える

  • テキストツールを使えばOK

最近対応したこと

  • 違うサイズの画像の入れ替え
    • 今までは「同じサイズにしてください」って言ってたけど、対応した
    • 無理やり実現すると、左右に伸びちゃうだけ
    • 中央に配置して周囲に枠をつける、繰り返し大量表示する、、、などの方法がある
      • なので、モードを切り替えられる

インストール方法

  • PHP extensionの一般的な方法

使い方

  • 画像をサクっと入れ替えられるので、他人が作ったFlashをあたかも自分が作ったFlashのように・・
  • 僕、暇なのでw 要望があれば言ってくれれば1週間くらいで対応します
    • よほど無茶なものでなければw

超高速Flash合成エンジン Flamixer

  • Klab 稲田さん @methane
  • エキスパートPythonプログラミングの翻訳者

  • swfmillでFlash Lite1のswfを扱えるようにしてみた

    • patchは本家に取り込まれた

SWFの動的生成

  • swfmil
    • テキストに変換してくれるだけ
    • そのテキストを理解する必要があるし、xmlなので超遅い
  • ming
    • デザイナーさんが完成形を意識しながら作業できない

Flamixerの機能

  • PHPEditorと被ってる
  • 設定ファイルに色々記述できる(.yamlファイル)
    • ソーシャルゲームを作る仕組みを効率化しましょう、という動き
      • Flasherがflashを作ったら自動的にテンプレート化して合成の元にできるように
      • 画像のID調べるの面倒なので、ベタ塗り画像の色で置換先が指定できる
      • どのムービークリップを入れ替えるかはインスタンス名で指定可能
  • 呼び出すPHPコード側
    • 「テンプレートエンジンと同じ感覚で使えること」を目指している

KGD & Flasmixer

  • GD → PHPの画像ライブラリ
    • 遅い。WEBサーバーのメモリに乗り切らない。memcacheに置いたらnetworkが溢れる
    • 高速化したのがKGD
      • 高速読み込み
      • 高速アルファブレンディング
      • 高速リサイズ
      • 独自フィルタ
      • さらに直接Flashのデータ構造に変えることで、Flamixerと連携
      • swfmillで画像差し替えするよりも100倍以上早い

swfmillとの速度比較

  • 50msec -> 2msecとかでできちゃう
  • 合成がシンプルだったら1msec切ったりする
  • 1コアあたり200合成 / 秒
    • 4coreなら800/sec
  • swf合成時間 < HTML生成時間
  • これだけ早いと合成サーバーとかキャッシュサーバーとか要らない。WEBサーバーにインストールするだけでOK

どうやって?

  • 設定ファイルで合成対象を指定
    • 合成しない部分が判明する
    • 合成しない部分は最初からswfに(ただのバイト列)
    • message packっていう専用のフォーマットに変換してしまう
  • 画像合成処理
    • ロスレス画像を合成しようとすると、zlib の圧縮とか発生するので3msecくらいかかる
    • これを先にやっておくと3msec削れる
  • ポイント
    • 必要最小限の所を動的に生成、それ以外の所はバイナリを結合するだけ

実装

  • C++ & Python
  • 他の言語でも使える
    • Perlは作ってある
    • Rubyも社内のRubyistに作ってもらっている

僕と契約して!

  • DSAS for socialってのに契約するとオプションで付いてきます

トラックバック(0)

トラックバックURL: http://somethingnew2.com/cgi/b/mt-tb.cgi/1197

コメントする

この記事について

このページは、SATO Yozoが2011年2月24日 20:51に書いた記事です。

ひとつ前の記事は「ゲレンデでGPSロガーを使ってみた」です。

次の記事は「地震で電車が止まったので、大崎から自宅の西船橋まで歩いた」です。

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

月別 アーカイブ

ウェブページ

OpenID対応しています OpenIDについて
Powered by Movable Type 6.1.2