Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Scc2013 air

1,266 views

Published on

  • Be the first to comment

Scc2013 air

  1. 1. Adobe AIRで簡単スマホアプリ作成術 2013/08/10 サッポロクリエイティブキャンプ2013 Jun Futakawa 13年8月10日土曜日
  2. 2. • FaceBook:: Jun Futakawaで検索 • twitter:: J2kawa • ActionScript, PHP, MySQL,JS etc. • 音極道の中の人 • 勤務遍歴:富士通 クリプトンフューチャメディア インフィニットループ etc. • 株式会社アトラクト 代表取締役 自己紹介 13年8月10日土曜日
  3. 3. アジェンダ • Adobe AIR と競合プラットフォームの比較 • AIRを使用したアプリ開発手順 • AIRを使用したアプリ開発現場の実際 13年8月10日土曜日
  4. 4. Adobe AIR と競合プラットフォームの比較 13年8月10日土曜日
  5. 5. AIRのライバル達 • Unity • Cocos2D(-X) • Corona • Unreal Engine ゲームエンジン系 • Phone GAP(Cordova) • SenchaTouch WEBパッケージ系 個性派系 • Titanium Mobile • ngCore(for Mobage) • enchant Pro • Xamarin • openFrameworks • Apportable その他 13年8月10日土曜日
  6. 6. 開発環境を選ぶポイント • 開発したアプリの処理能力 • 開発効率(開発に必要な工数) • 開発に使用する言語 • 必要な機能を実現できるか(拡張性) • 日本語情報の充実 etc. 13年8月10日土曜日
  7. 7. 各評価ポイントごとに、推奨環境をピックアップ 併せてAdobe AIRを評価してみる 13年8月10日土曜日
  8. 8. アプリの処理能力からみて • 全般的にゲームエンジン系がやはり強い  ➡ ngCore, enchantPRO等も含まれる • 差が出る決め手は描画速度 ➡ GPU(OpenGL ES)対応がカギ 主な選択肢 • 3D系なら ➡ Unityが一番手、AIRもアリ(Away3D,Flare3D) Unreal Engineなど  • 2D系なら ➡ Cocos2D-X、AIR(Starling)、Unityもアリ        他のゲームエンジン系も条件によってアリ 13年8月10日土曜日
  9. 9. • PhoneGAP、SenchaTouch、AIR • UnityもGUIツールの充実等により開発効率は良い • 概ねどの開発環境も、Objective-C覚えるよりは開発効率が良い、と いう点はクリアしている感じ。 開発効率からみて • WEBパッケージ系が強い(WEB制作の知識のみで作れる)  ➡ 処理速度は期待できない、ファイルサイズがかなり増大 • AIRも極めて開発効率が高い(特にFlash経験者)  ➡ しかもWEBパッケージ系に比べ大きなデメリットが無い 主な選択肢 *特にノンプログラマーでも開発可能という意味ではこれらが突出 13年8月10日土曜日
  10. 10. 使用言語からみて • JavaScript  ➡ Titanium, ngCore, enchantPRO, Unity など • C#  ➡ Unity, Xamarin など • HTML5 + JavaScript ➡ PhoneGAP, SenchaTouch など • C++ ➡ Cocos2D-X, Unreal Engine, openFrameworks など • Lua ➡ Corona, Cocos2D-X など AIRの使用言語 ActionScript3 - ECMA Script262に準拠しており、文法的にはJavaScriptに         極めて近いが、Flash独特の概念やライブラリの知識が必要。         ECMA Script準拠の分学習コストは低い。 13年8月10日土曜日
  11. 11. 機能拡張性からみて ネイティブ拡張可能な開発環境一覧 開発環境 拡張方法 特記事項 Unity プラグイン方式 Pro版、有料モバイル版のみ Cocos2D-X Direct Call / JNI AIR ANE Titanium モジュール方式 Corona Native Extention エンタープライズ ライセンスが必要 PhoneGAP プラグイン方式 13年8月10日土曜日
  12. 12. 日本語ドキュメントの情報量からみて • Unity => 148,000件 • AIR => 403,000件 • Titanium => 99,000件 • Cocos2D => 65,600件 • phoneGAP => 65,500件 Google検索 “XXXX” +“アプリ開発” のヒット数から日本語の開発情報量を類推 • CORONA => 14,600件 • SenchaTouch => 19,300件 • Unreal => 159,000件 • ngCore => 2,560件 • enchant PRO => 1,350件 検索ノイズを考慮しても、AIRの情報量の多さがやや意外だった。あと、勢い的に UnityがUnrealを超えていると思った。 それ以外はだいたい肌間隔と同じ。 日本ではTitaniumユーザが根強いのと、Cocos2Dユーザが急速に増加中という印象。 13年8月10日土曜日
  13. 13. AIRの総合的評価 • ずば抜けた強みは無いが、あらゆる点で水準以上  ➡ AIRとその周辺技術(Starling等)をしっかり押さえておけば    あらゆるタイプのアプリが開発可能 • 開発効率も高いので、様々な種類のアプリを短期に開発可能  ➡ 特にアプリ受注開発型のビジネスで優位性が高い Flash経験者のみならず、これから新規に習得する場合 でも、AIRは極めて有力な選択肢として検討すべき 13年8月10日土曜日
  14. 14. AIR を使用したアプリ開発手順 13年8月10日土曜日
  15. 15. AIRを使ったアプリ開発スタイル 1. 任意のテキストエディタでコーディング flex SDKのコマンドラインコンパイラでビルド 2. サードベンダー製開発ツールにて開発 flex SDKでビルド 3. Flash Builderにて開発、flex SDKでビルド 4. Flash オーサリングツールにて開発 & ビルド *AIR SDKが予めインストール済であること 13年8月10日土曜日
  16. 16. AIRによるスマホアプリ開発ワークフロー Flash BuilderによるAndroidアプリ デバッグビルドの例 13年8月10日土曜日
  17. 17. Flash Builderを起動 13年8月10日土曜日
  18. 18. 『ファイル』➡『新規』➡『Flexモバイルプロジェクト』 13年8月10日土曜日
  19. 19. プロジェクト名入力、「次へ」クリック 13年8月10日土曜日
  20. 20. Apple iOSのチェックをはずし、Google Androidのみ選択 テンプレート『ビューベースアプリケーション』を選択 『終了』クリック 13年8月10日土曜日
  21. 21. ソース画面が表示されたら、HomeView.mxml の s:viewクローズタグ直前にラベルタグを記述 (<s:Label text=”Hello,world!!” x=”50” y=”50” />) 13年8月10日土曜日
  22. 22. 『実行』➡『デバッグの構成...』選択 13年8月10日土曜日
  23. 23. 左のリストから、『モバイルアプリケーション』選択 左上の『新規』ボタンクリック 13年8月10日土曜日
  24. 24. プロジェクト欄右の『参照』ボタンをクリックして、プロジェクト名を選択 ターゲットプラットフォームに”Google Android”選択 起動方法”AIRシミュレータ”選択 シミュレートするデバイスをデバイス欄から任意に選択 『デバッグ』ボタンクリック 13年8月10日土曜日
  25. 25. AIRシミュレータが表示され、その上でアプリが動作する 13年8月10日土曜日
  26. 26. AIRによるスマホアプリ開発ワークフロー FlashオーサリングツールによるiOSアプリ デバッグビルド&実機転送の例 13年8月10日土曜日
  27. 27. Flash オーサリングツールを起動 13年8月10日土曜日
  28. 28. 新規作成から”AIR for iOS”選択 13年8月10日土曜日
  29. 29. 右端のツールバーからテキストボックスをドラッグ&ドロップ 13年8月10日土曜日
  30. 30. テキストボックスに”Hello,world!!”と入力し、フォントサイズ、位置等調整 13年8月10日土曜日
  31. 31. 『ファイル』メニュー ➡ 『AIR for iOS 設定...』選択 13年8月10日土曜日
  32. 32. 出力ファイル、アプリケーション名を入力 解像度を『高』に設定(Retina対応) 13年8月10日土曜日
  33. 33. 上の『デプロイ』タブをクリック後、あらかじめ作成しておいた p12証明書ファイルと認証パスワード、プロビジョニングプロファイルを指定する。 デプロイタイプに”デバイスでのテスト”を指定、 “選択されたiOSデバイスにアプリケーションをインストール”にチェックを入れ 接続されているデバイス一覧が表示されるので必要な端末にチェックを入れる。 13年8月10日土曜日
  34. 34. 『ファイル』メニュー ➡ 『パブリッシュ』選択 13年8月10日土曜日
  35. 35. パブリッシュが開始するので、完了まで待つ (デバッグビルドの場合1分半程度) 13年8月10日土曜日
  36. 36. パブリッシュが完了すると、ipaファイルは自動転送され、 (アイコン画像を指定しなかったため) 真っ白いアイコンが追加されている。 13年8月10日土曜日
  37. 37. アプリを起動すると、”Hello,world!!”が表示される。 13年8月10日土曜日
  38. 38. AIR を使用したアプリ開発現場の実際 13年8月10日土曜日
  39. 39. 現在開発中のゲームアプリのご紹介 • Adobe AIR + Starling + Box2DFlash(物理演算エンジン) • 本格的アクションパズルゲーム • 有料アプリとしてリリース予定(今月末∼来月上旬) • 企画、ディレクション、プログラミング、音楽を すべて一人で担当。 • このセミナーの頃には世に出ている予定でしたが  未解決の問題があり、リリース遅れ中。 13年8月10日土曜日
  40. 40. 開発スタイル • Flash Develop (フリー、オープンソースのFlash特化型統合開発環境) + Flash オーサリングツール • Flash DevelopがWindowsのみのソフトウエアなので、 MBAのBootCamp環境にWin7 + Flash Developをインストール デバイス向けビルドのたびにWin / Macを切り替えている • そこまでしても苦じゃないくらいFlash Developが優秀 13年8月10日土曜日
  41. 41. 苦労した点 • Starlingを極限まで使い倒しているためか、表示周りで 原因不明の現象が多発 • Starlingの情報が少なすぎることもあり、中のソースを読み込んで解 決方法を見いだしたことも多数 ➡おかげでStarlingのノウハウはかなり高いレベルまで到達した  ちなみにStarlingはGitHubにてリポジトリが公開されており、かなり活発に日々 修正・改善が行われています • 物理演算(特に多重衝突系)は想像以上に高負荷 ➡ ゲームに登場する物体の形状を極限まで簡素化するために   物理演算上のモデリング定義を何度となく見直し 13年8月10日土曜日
  42. 42. Starlingの主な情報リソース • GitHUB https://github.com/PrimaryFeather/Starling-Framework • Official Manual http://wiki.starling-framework.org/manual/start • リファレンス http://doc.starling-framework.org/core/ 13年8月10日土曜日

×