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.

Monaca事例から学ぶHTML5モバイルアプリの活用ポイント

723 views

Published on

2016年8月26日開催の「モバイルアプリ開発ソリューションセミナー」での講演資料です

Published in: Technology
  • Be the first to comment

Monaca事例から学ぶHTML5モバイルアプリの活用ポイント

  1. 1. Bringing More People To Apps Monaca事例から学ぶ HTML5モバイルアプリの活用ポイント アシアル株式会社 塚田亮一
  2. 2. Bringing More People To Apps 本日のお話 1. まずはプロトタイピング! 2. サーバサイドはmBaaSで開発いらず! 肝心のアプリ開発はどうする???
  3. 3. Bringing More People To Apps アシアル株式会社 会社概要 • 創業:2002年 • 資本金:1000万円 • 事業所:東京(本社)、サンフランシスコ • 従業員数:約40名(8国籍) 事業内容 • 開発プラットフォーム事業:開発ツール、UIフレームワーク • 開発支援事業:アプリ開発、サーバーサイド(PHP)開発 • 教育事業:トレーニング、執筆
  4. 4. Bringing More People To Apps HTML5モバイルアプリ開発基 盤 Monaca HTML5、JavaScript でアプリ開発 セットアップ不要の クラウド開発環境 UIフレームワーク Onsen UI搭載 安心の日本語サポート
  5. 5. 日本で最も普及している モバイルアプリ開発環境の一つ 15万人
  6. 6. Bringing More People To Apps アプリビジネスから ビジネスのためのアプリへ 企業向け モバイルアプリ 消費者向け モバイルアプリ
  7. 7. Bringing More People To Apps モバイルアプリでビジネスを牽引  マーケティングや業務システムのアプリ化  アプリそのもので売上を得るものではない  業務やクライアントの理解が重要な分野  クロスプラットフォーム対応が必須  消費者の端末でサービスは変えられない  BYOD、プラットフォーム依存のリスク  主役は事業部門  市場環境の変化に対応する開発スピードが求められる
  8. 8. Bringing More People To Apps アプリ開発に取り組む上での 課題 iOS/Androidでことなる開発言語 UIデザインへの高い要求 エンジニアが圧倒的に不足 厳しいコスト要求
  9. 9. Bringing More People To Apps HTML5を活用した Cross-Platform開発
  10. 10. Bringing More People To Apps HTML5はモバイル開発No.1 出典: Developer Economics 2014 Q3 構築技術のなかで圧倒的に 高いマインドシェアを獲得
  11. 11. Bringing More People To Apps Cordovaとは ネイティブコード HTML コンテンツ アプリ本体はHTML5で実装 ネイティブアプリ形式で配布 ハードウェア機能を利用可能 Pluginでネイティブ機能を拡張
  12. 12. Bringing More People To Apps Cross Platformツールのシェア 61% 35% 31% 18% 15% 13% 12% 9% 4% 3% 0% 10% 20% 30% 40% 50% 60% 70% PhoneGap/Cordova Xamarin Unity Qt Adobe Air Appcelerator Corona Marmelade Codename One Live Code Using this tool Prioritize this tool Vision Mobile Analysis of Cross-Platform Development, July 2015
  13. 13. Bringing More People To Apps ビジネス向けではCordova ソリューションがリーダー Source: Gartner (June 2016)
  14. 14. Bringing More People To Apps でもこんなこと言ってる人 いましたね、、、 『HTML5に賭けたの は失敗』 2012年にHTML5から ネイティブ化へ
  15. 15. Bringing More People To Apps HTML5ハイブリッドアプリ が当時抱えていた課題 1. アプリに機能制限がでてしま うのではないか? 2. アプリのパフォーマンスが低 いのではないか?
  16. 16. Bringing More People To Apps PluginでネイティブAPI利用 Cordova公式 サイトで探す 自作する
  17. 17. Bringing More People To Apps 事例:タニタヘルスプラネット • 体組成計連携の健康管理アプリを2ヶ月で開発 • Bluetoothを使って専用の体組成計からデータを自動 で受け取ることが可能
  18. 18. Bringing More People To Apps 端末の大幅な進化 初代Xperia Xperia Z 5 発売日: 2010年4月 Android 1.6 (後に2.1) 1GHz シングルコアCPU 384MBメモリー ベンチマークスコア: 3361 発売日: 2016年6月 Android 6.0 2GHz クワッド(8)コアCPU 3GBメモリー ベンチマークスコア: 52084 5年間で20倍もの スピードアップ WebviewのChronium化 Crosswalkの登場
  19. 19. Bringing More People To Apps HTML5ハイブリッドアプリ向け UIフレームワークの登場
  20. 20. Onsen UI • OSに応じてUIを切り替え+ CSSで簡単カスタマイズ • ハイパフォーマンスなUIを実現 • JSフレームワークに非依存 • Apache License ▷ http://ja.onsen.io/
  21. 21. 完全なクロスプラットフォーム を実現 • Web技術でiOSとAndroidのUIを同時に開発 • ページ遷移アニメーションやエフェクトもOS毎に最適化
  22. 22. 豊富なUIコンポーネント を利用可能 • 各コンポーネントはタグで指定するだけで利用可能 • デザインのカスタマイズはCSSで
  23. 23. Bringing More People To Apps 事例:ジャパンネット銀行 残高確認アプリ • Onsen UIでネイティブと遜色ないUIを実現 • アセット暗号化プラグインでソースコードを隠蔽
  24. 24. Webサービス・既存システムの アプリ化事例
  25. 25. Bringing More People To Apps 事例:ニジボックス レシポ! • エンジニア1名実高数2週間程度でアプリを完成 • Monacaデバッガーを使ったユーザーテストでUI改善
  26. 26. Bringing More People To Apps 事例:長野銀行 NaganoBank Total Assist Book • システム検討から導入までわずか10ヶ月 • 当初はiPadだが、将来を見据えた戦略 印刷機能は別アプリ化することでメンテコスト削減
  27. 27. LOBからの要求による アプリ開発事例
  28. 28. Bringing More People To Apps 事例:プロルート丸光 • 老舗企業の営業部門主導のアプリ開発 • mBaaSを活用したビジネスチャットアプリ • 構想から5ヶ月でサービスイン
  29. 29. アプリのテンプレート化事例
  30. 30. Bringing More People To Apps 事例:神戸デジタルラボ様 店舗誘導 お知らせ機能 店舗在庫確認 レビュー機能 行動分析 クラウド (サービス共通基盤) ポイント カード 追加機能① WEB API 追加機能② 追加機能③スマホアプリ アンケート • セミオーダー型の店舗販促アプリをサービス展開 • 機能は組み合わせ、UIデザインは自由にカスタマイズ
  31. 31. Bringing More People To Apps HTML5モバイルアプリ開発 活用ポイント  iOS、Android同時開発  既存のシステム資産の活用  既存の開発チームでのアプリ開発  UIフレームワークや開発支援ツールを有 効活用 ビジネスの変化に合わせた スピード感あるアプリ開発を実現
  32. 32. Bringing More People To Apps まずは初めて見ましょう!
  33. 33. Bringing More People To Apps アプリ開発のご相談も 受付中
  34. 34. Bringing More People To Apps ご清聴ありがとうございまし た

×