CyberX勉強会 #1に行ってきた


昨日
スマートフォン版のソーシャルアプリができるまで HTML5 + JavaScript
という、SmartPhone対応に関しての勉強会があるというので、行ってきました。

それに関してのメモです。
ラブホ街に一人で突っ込みかけたので、時間ギリギリでした。。


スマートフォン版のソーシャルアプリができるまで HTML5 + JavaScript
■発表者
 株式会社Cyber X CTO 白井 英さん

■SmartPhoneへの展開
 ・各Platform(mixi,モバゲ,GREE)の開設が始まっている
 ・今まではFeaturePhoneが圧倒的台数だったが、今後はSmartPhoneが主流になるはず
 ・FeaturePhoneで使用していたアプリのデータを引き継げるのを
  各PlatFormが推奨している
 ・FeaturePhone,SmartPhone共に同じアプリ上でコミュニケーションがとれる

■コーデマニアの例(サムザップ事例)
・Feature Phone版を最初に出した
・SmartPhoneに対応
 →FeaturePhoneとユーザデータは共有
・開発方針
 →FeaturePhoneを元にSmartPhone用のソースを一から記述
 →別々のソース管理(ほぼ力技)
・大変なのでは
 →やってみたら使い回せる所が多い
 →FeaturePhoneのイベント開始とほぼ同時にSmartPhone版も開始
同じイベント同時に楽しめる
・運用してわかった事
 →SmartPhoneユーザーは20代の女性が多い

■星空バータウンの例(CyberX事例)
・FeaturePhoneは対応している
・SmartPhoneに対応
 →ユーザーデータは共有
・開発方針
 →FeaturePhoneとSmartPhoneでソースを共通化
 →必要な部分だけ書き換え、使い分けを極小化して効率化を目指す
→FeaturePhoneの機能をうまく流用
→FlashLiteの部分は演出が多いのでぱらぱらアニメーションへ自動変換
→HTML5 + CSS3 + javaScript使用
・SmartPhoneでの問題。Flashに関して
 →FlashLiteで作成した部分の置き換え
 →Flashを画像に変換するツールを作成した。
→SWFをフレーム毎に画像キャプチャしてコマ送りで作成(プログラムで自動化)
→既存のFlashLiteの資産をそのまま流用できた
・ぱらぱらアニメーションってアニメgifでいいのでは
→レスポンスが端末依存。iPhoneだと遅かった
→javascriptで画像をjavascriptで切り替え表示
 →canvasでごりごり
・SmartPhoneでの問題。UIに関して
 →アイテムのインタラクティブな配置処理はjavaScriptで実装
  →ドラッグアンドドロップとかスワイプとかは重要だと思う
・javascriptのライブラリ
 →JQueryを使用

■その他
 ・FeaturePhone,SmartPhoneで共有できなかった部分は?
  →PHPフレームワーク使用。MVC準拠
  →モデルはそのまま使用。ビューはFeaturePhone,SmartPhoneで書き換え
  →コントローラーも流用したかったが、現実的には無理だった
   →必要なとこだけオーバーライドして書き換える
   →2〜3割書き換えれば済むと思っていたが見積もりが甘かった
   →主に画面遷移が変わるものは書き換えないといけなかった
 ・素材の使い回しに関して
  →SmartPhoneだと荒いのがばれてしまうので、画像アイコンなどは
   サイズを4倍にして書き出しなおした
 ・開発期間
  →現在3ヶ月目。製作中。


SmartPhoneでのアジャイル開発
■発表者
 株式会社CA Beat 小田 雄帆さん
■アジャイルとは
 「俊敏な」とか言う意味
■特徴
 ・プロセスツールよりもコミュニケーションを重視する
 ・既存の開発手法をマスターし尽くした達人向け
 ・ドキュメントよりも動作するソフトウェアを重視する
  →ドキュメントが残らないため責任の所在が不明確


ぱらぱらアニメーションってスプライトアニメーションの事かと。まんま聞いた内容をメモったのでぱらぱらアニメーションって書いてます。
ベタ移植程度なら時間はさほどかからないでしょうが、SmartPhoneならではのUIにどこまでこだわるかが開発期間に直結するって事ですかね。
ある意味予想通りでもあり、甘く見てると地獄を見そうでもあり、、

その後懇親会にも参加し、色んな方に興味深い話を聞かさせて頂きました。
アジャイルを試しに広めて行きたいなぁと思うこの頃。
テストは大事だよ!

Leave a Comment


NOTE - You can use these HTML tags and attributes:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> <img localsrc="" alt="">