SlideShare a Scribd company logo
スマートフォンアプリケーション開発の最新動向
Tsutomu Ogasawara
自己紹介(お仕事)
1996∼2004

  ⃝⃝⃝でソフトウェアエンジニア

2004∼2010

  ⃝⃝⃝/⃝⃝⃝で UI デザイン

2010∼2012

  ⃝⃝⃝⃝⃝⃝⃝⃝で Web ディレクター

2012∼

  ⃝⃝で HTML5 Project チーム
自己紹介(趣味)
PictTweet / PictTweet Plus!
    iPhone/iPad 向けお絵描き Twitter アプリ。2009年5月リリース。

icotile
    Twitter のフォロワー管理 Web アプリ。2011年リリース。

    第0回 HTML5プログラミング&クリエイティブ・コンテスト優秀作品賞受賞

その他

    野球リーグ成績管理 Web サービス(2006年)

    ⃝⃝⃝⃝⃝⃝    の Android への移植(2009年)

Twitter: @ogaoga
アジェンダ


アプリ開発手法の3つのタイプ

アプリケーションフレームワーク紹介

BaaS とは?
アプリ開発手法の
3つのタイプ
アプリ開発手法の3つのタイプ




  開発手法別アプリのタイプ


    ネイティブアプリ型

    Web アプリ型

    ハイブリッド型
アプリ開発手法の3つのタイプ




  開発手法別アプリのタイプ


    ネイティブアプリ型

    Web アプリ型

    ハイブリッド型
アプリ開発手法の3つのタイプ




  開発手法別アプリのタイプ


    ネイティブアプリ型

    Web アプリ型

    ハイブリッド型




                 http://apps.ft.com/
アプリ開発手法の3つのタイプ




  開発手法別アプリのタイプ


    ネイティブアプリ型

    Web アプリ型

    ハイブリッド型
アプリ開発手法の3つのタイプ




  開発手法別アプリのタイプ


    ネイティブアプリ型

    Web アプリ型
                 Native     Native
                          WebView
    ハイブリッド型
アプリ開発手法の3つのタイプ




  背景

    急激なスマートフォンへのシフト

     2011 後半から 2012 春にかけて、スマートフォン
     からのトラフィックが急増。

     Line の急成長。
アプリ開発手法の3つのタイプ




  背景

    アプリ開発リソースが不足

     サーバサイド、フロントエンドエンジニアはいるけ
     ど...

     Web ページのスマートフォン対応もあるし...

     iPhone と Android の両対応は...
アプリ開発手法の3つのタイプ




  背景

    一方、ユーザー獲得の観点では、

       検索エンジンからの流入

       ソーシャルメディアでの拡散による流入

                     が重要な獲得手段。
アプリ開発手法の3つのタイプ




  背景

    マネタイズの観点では、

       既存の会員基盤、決済手段を利用したい。

       Apple/Google に中間マージンを取られたくない。

     などの理由で、ネイティブアプリが困難なことも。
アプリ開発手法の3つのタイプ




  背景
    開発都合

     既存の開発リソースでアプリを開発したい。

     成果物を各種プラットフォームで共有したい。

    ビジネス都合

     既存のマネタイズ手段、顧客獲得手段を流用した
     い。
アプリ開発手法の3つのタイプ




  背景
    開発都合

     既存の開発リソースでアプリを開発したい。

     成果物を各種プラットフォームで共有したい。

    ビジネス都合

     既存のマネタイズ手段、顧客獲得手段を流用した
     い。
     → Web の技術、リソースをアプリに活かしたい
アプリ開発手法の3つのタイプ


                             Native                   Hybrid                       Web
   パフォーマンス                     ◎                         ⃝                           ⃝
  デバイスアクセス                     ◎                         ⃝                           △
   Push Notification            ⃝                         ⃝                           ×
   起動のしやすさ                     ⃝                         ⃝                           △
URL からのアクセス                    ×                          ×                          ⃝
       App Store /
      Market Place             ⃝                         ⃝                           ×
                                                                               独自の仕組みを
  独自のマネタイズ                     独自の仕組みを用意しなくてよい
                                                                                 利用できる
   コードの可搬性                     ×                         ⃝                           ◎
          即時更新                 ×                         ⃝                           ◎
                      パフォーマンスを要求される                                       既存の Web サービスの資産(開発
                                              Push Notification やストアでの販売
                      ゲームや、没入型の魅力的な                                       リソース、会員基盤、決済手段、
 最適なアプリの種類                                    を行いたいが、ネイティブアプリ
                      アプリ、デバイスの機能をフ                                       SEO 等)を活かしたアプリケー
                                              を開発するリソースが無い場合等。
                      ルに利用するアプリ等。                                         ション。
                                              フレームワーク依存のバグやパ
                      Apple や Google によって排除
                                              フォーマンスの低下、OS 対応の遅 バックグラウンド動作や Push
            リスク       される可能性がある。リリー
                                              れなど可能性と、ネイティブと同             Notification が出来ない。
                      ススケジュールも不確定。
                                              じリスクがある。
アプリケーションフレームワーク
紹介
アプリケーションフレームワーク紹介



  アプリケーションフレームワーク

    ネイティブアプリ型

     (普通に)ネイティブアプリ

     Titanium Mobile
    ハイブリッド型

     PhoneGap
     Sencha Touch 2
    Web アプリ型

     jQuery Mobile
     (普通に)HTML5/CSS3/JavaScript
アプリケーションフレームワーク紹介




  Titanium Mobile
アプリケーションフレームワーク紹介




  Titanium Mobile
    JavaScript で記述してネイティブアプリを生成(ネイティブアプリ型)。

    リアルタイム性の高いものや、3D などは厳しい。

      ネイティブコード(Objective-C)を呼び出すことも可能らしい。

    JavaScript なので、メモリ管理や配列の扱いなどが楽。

      その分パフォーマンスは落ちる。

    Titanium Studio という IDE が提供されている。

    Android への対応が不十分という話も?
アプリケーションフレームワーク紹介




  Titanium Mobile


    Titanium Studio でアプリをビルドするデモ
アプリケーションフレームワーク紹介




  Sencha Touch
アプリケーションフレームワーク紹介




  Sencha Touch
    ハイブリッド型。JavaScript で記述する MVC フレームワー
    ク。iOS と Android に対応。

    UI コンポーネントが提供されていて、JSON で UI を定義。

    サーバとモデル、モデルとビューのバインド機構がある。

    Sencha 独自の仕様を覚えなければならず、デザイナーには
    とっつきにくい。

    Sencha Architect2 という IDE がある。
アプリケーションフレームワーク紹介




  Sencha Touch


                    デモ
アプリケーションフレームワーク紹介




  PhoneGap
アプリケーションフレームワーク紹介




  PhoneGap
    ハイブリッド型。HTML/CSS/JavaScript からネイ
    ティブアプリを生成。

    ネイティブコードは「枠」だけで、中身は Web アプ
    リと同じ。既存の Web アプリの手法を利用可能。

    ほとんどのネイティブ機能を利用可能。

    アプリバイナリを生成する Web サービスも提供。
アプリケーションフレームワーク紹介




  PhoneGap


     Web サービスでアプリをビルドするデモ
アプリケーションフレームワーク紹介




  jQuery Mobile
アプリケーションフレームワーク紹介




  jQuery Mobile

    Web アプリ型。UI を構築するためのライブラリ。

    メジャーなライブラリである jQuery がベース。

    HTML に UI の役割を記述して動作を規定する。デザ
    イナー向け。
アプリケーションフレームワーク紹介




  jQuery Mobile


 デザインを Web サービスでカスタマイズするデモ
アプリケーションフレームワーク紹介


              Titanium        Sencha Touch 2         PhoneGap         jQuery Mobile

      タイプ     ネイティブ             ハイブリッド               ハイブリッド              Web アプリ


                                                                         The jQuery
     ベンダー    Appcelerator        Sencha Inc.            Adobe
                                                                         Foundation


                                                    HTML5 / CSS3 /     HTML5 / CSS3 /
   主な開発言語     JavaScript       主に JavaScript
                                                      JavaScript         JavaScript


       対応                                           iOS / Android /    iOS / Android /
             iOS / Android      iOS / Android      Windows Phone7 /   Windows Phone7 /
 プラットフォーム                                           Blackberry など      Blackberry など

            JavaScript でネイ    JavaScript の MVC      複数のプラット           画面遷移を HTML 上
       特徴
            ティブアプリ開発           フレームワーク               フォーム対応                で定義

                                                      デザイナー
  メインの対象者     エンジニア              エンジニア                                   デザイナー
                                                     /エンジニア

                                                   各プラットフォーム
     開発環境   Titanium Studio   Sencha Architect 2     の開発環境 /             codiqa 等
                                                    PhoneGap Build
BaaS とは?
BaaS とは?




   BaaS とは?
     Backend as a Service
     アプリケーションに必要なサーバサイドの処理を引き受けてく
     れるクラウドサービス。

           サーバの立ち上げ、DB 構築、API 設計、機能設計、コーディ
           ング、監視、スケーリング、etc...

     モバイル向けの SDK(もしくは API)とダッシュボードが提供
     されていて、サーバのことを全く意識することなく、素早く利
     用することが可能。
BaaS とは?




   さまざまな BaaS
BaaS とは?




   Parse
BaaS とは?




   Parse
     最小限の設定で、すぐに使い始められる。

     iOS と Android 向けのネイティブアプリ用 SDK と、Web
     アプリ向けの JavaScript SDK、サーバサイド向けの
     REST API が提供されている。

     サーバとの通信部分も隠      化された、使いやすいクラス
     ライブラリ。

     充実したドキュメント。
BaaS とは?




   Parse
BaaS とは?




   Parse
       Objective-C for iOS
       PFObject *post = [PFObject objectWithClassName:@"Post"];
       [post setObject:@"Hello World" forKey:@"title"];
       [post setObject:@"I got Parse working on iOS!"
                  forKey:@"content"];
       [post saveInBackground];
       Java for Android
       ParseObject post = new ParseObject("Post");
       post.put("title", "Hello World");
       post.put("content", "I got Parse working on Android!");
       post.saveInBackground();

       JavaScript
       var Post = Parse.Object.extend("Post");
       var post = new Post();
       post.set("title", "Hello World");
       post.set("content", "I got Parse working on Web App!");
       post.save(null, {success: function(){},
                          error: function(){} } );
BaaS とは?




   Parse


   プロジェクトの作成からデータの保存までのデモ
今日のおさらい
まとめ
アプリ開発手法の3つのタイプ

 開発リソースやビジネスモデルに応じて選択。

様々なフレームワーク

 開発言語やツールを選べる。

BaaS
 サーバサイドの開発をスキップできる。
まとめ


  で、⃝⃝⃝で使えるの???
Thank you!

More Related Content

What's hot

もっと良くなるHTMLアプリケーション設計と実装
もっと良くなるHTMLアプリケーション設計と実装もっと良くなるHTMLアプリケーション設計と実装
もっと良くなるHTMLアプリケーション設計と実装
Mitsue-Links
 
Api設計
Api設計Api設計
Api設計
Yuto Suzuki
 
Monacaでつくるハイブリッドアプリ
MonacaでつくるハイブリッドアプリMonacaでつくるハイブリッドアプリ
Monacaでつくるハイブリッドアプリ
Monaca
 
HTML5ハイブリッドアプリ開発のベストプラクティス
HTML5ハイブリッドアプリ開発のベストプラクティスHTML5ハイブリッドアプリ開発のベストプラクティス
HTML5ハイブリッドアプリ開発のベストプラクティス
アシアル株式会社
 
Cordovaの最近ホットな話題と地雷をまとめて紹介
Cordovaの最近ホットな話題と地雷をまとめて紹介Cordovaの最近ホットな話題と地雷をまとめて紹介
Cordovaの最近ホットな話題と地雷をまとめて紹介
アシアル株式会社
 
Cognitive serviceのすゝめ
Cognitive serviceのすゝめCognitive serviceのすゝめ
Cognitive serviceのすゝめ
Tsubasa Yoshino
 
脱RESTful API設計の提案
脱RESTful API設計の提案脱RESTful API設計の提案
脱RESTful API設計の提案
樽八 仲川
 
LINE お絵描きアプリハンズオン
LINE お絵描きアプリハンズオンLINE お絵描きアプリハンズオン
LINE お絵描きアプリハンズオン
K Kimura
 
ネイティブとHTML5を スマートに連携させる設計と 実装のノウハウについて
ネイティブとHTML5を スマートに連携させる設計と 実装のノウハウについてネイティブとHTML5を スマートに連携させる設計と 実装のノウハウについて
ネイティブとHTML5を スマートに連携させる設計と 実装のノウハウについて
Kazuaki Hidaka
 
Challenge PWA!! TRY PWA4WP!
Challenge PWA!! TRY PWA4WP!Challenge PWA!! TRY PWA4WP!
Challenge PWA!! TRY PWA4WP!
Ryu Shindo
 
Single-page application
Single-page applicationSingle-page application
Single-page applicationFumio SAGAWA
 
我が家のフロントエンド開発事情
我が家のフロントエンド開発事情我が家のフロントエンド開発事情
我が家のフロントエンド開発事情
Naoki Yamada
 
cordova/electronの構造を知る
cordova/electronの構造を知るcordova/electronの構造を知る
cordova/electronの構造を知る
Yasuharu Seki
 
Cordova を使って本気で商用ハイブリッドアプリ開発をやってみた
Cordova を使って本気で商用ハイブリッドアプリ開発をやってみたCordova を使って本気で商用ハイブリッドアプリ開発をやってみた
Cordova を使って本気で商用ハイブリッドアプリ開発をやってみた
Shin Ogata
 
中規模Androidアプリ開発の過程に生じた問題と対策の紹介
中規模Androidアプリ開発の過程に生じた問題と対策の紹介中規模Androidアプリ開発の過程に生じた問題と対策の紹介
中規模Androidアプリ開発の過程に生じた問題と対策の紹介NilOne Ltd.
 
ベトナム・ダナン オフショア開発記 by 中村健太(株式会社ビットエー/日本ディレクション協会)
ベトナム・ダナン オフショア開発記 by 中村健太(株式会社ビットエー/日本ディレクション協会)ベトナム・ダナン オフショア開発記 by 中村健太(株式会社ビットエー/日本ディレクション協会)
ベトナム・ダナン オフショア開発記 by 中村健太(株式会社ビットエー/日本ディレクション協会)
セカイラボ(Sekai Lab Pte. Ltd.)
 
Html5/JSモバイルアプリ最前線
Html5/JSモバイルアプリ最前線Html5/JSモバイルアプリ最前線
Html5/JSモバイルアプリ最前線
アシアル株式会社
 
Androidでもサクサク動くHTML5ハイブリッドアプリの作り⽅
Androidでもサクサク動くHTML5ハイブリッドアプリの作り⽅Androidでもサクサク動くHTML5ハイブリッドアプリの作り⽅
Androidでもサクサク動くHTML5ハイブリッドアプリの作り⽅
アシアル株式会社
 
最新UIフレームワーク Onsen UI2で カッコイイWordPress連携アプリを作る方法
最新UIフレームワーク Onsen UI2でカッコイイWordPress連携アプリを作る方法最新UIフレームワーク Onsen UI2でカッコイイWordPress連携アプリを作る方法
最新UIフレームワーク Onsen UI2で カッコイイWordPress連携アプリを作る方法
アシアル株式会社
 

What's hot (19)

もっと良くなるHTMLアプリケーション設計と実装
もっと良くなるHTMLアプリケーション設計と実装もっと良くなるHTMLアプリケーション設計と実装
もっと良くなるHTMLアプリケーション設計と実装
 
Api設計
Api設計Api設計
Api設計
 
Monacaでつくるハイブリッドアプリ
MonacaでつくるハイブリッドアプリMonacaでつくるハイブリッドアプリ
Monacaでつくるハイブリッドアプリ
 
HTML5ハイブリッドアプリ開発のベストプラクティス
HTML5ハイブリッドアプリ開発のベストプラクティスHTML5ハイブリッドアプリ開発のベストプラクティス
HTML5ハイブリッドアプリ開発のベストプラクティス
 
Cordovaの最近ホットな話題と地雷をまとめて紹介
Cordovaの最近ホットな話題と地雷をまとめて紹介Cordovaの最近ホットな話題と地雷をまとめて紹介
Cordovaの最近ホットな話題と地雷をまとめて紹介
 
Cognitive serviceのすゝめ
Cognitive serviceのすゝめCognitive serviceのすゝめ
Cognitive serviceのすゝめ
 
脱RESTful API設計の提案
脱RESTful API設計の提案脱RESTful API設計の提案
脱RESTful API設計の提案
 
LINE お絵描きアプリハンズオン
LINE お絵描きアプリハンズオンLINE お絵描きアプリハンズオン
LINE お絵描きアプリハンズオン
 
ネイティブとHTML5を スマートに連携させる設計と 実装のノウハウについて
ネイティブとHTML5を スマートに連携させる設計と 実装のノウハウについてネイティブとHTML5を スマートに連携させる設計と 実装のノウハウについて
ネイティブとHTML5を スマートに連携させる設計と 実装のノウハウについて
 
Challenge PWA!! TRY PWA4WP!
Challenge PWA!! TRY PWA4WP!Challenge PWA!! TRY PWA4WP!
Challenge PWA!! TRY PWA4WP!
 
Single-page application
Single-page applicationSingle-page application
Single-page application
 
我が家のフロントエンド開発事情
我が家のフロントエンド開発事情我が家のフロントエンド開発事情
我が家のフロントエンド開発事情
 
cordova/electronの構造を知る
cordova/electronの構造を知るcordova/electronの構造を知る
cordova/electronの構造を知る
 
Cordova を使って本気で商用ハイブリッドアプリ開発をやってみた
Cordova を使って本気で商用ハイブリッドアプリ開発をやってみたCordova を使って本気で商用ハイブリッドアプリ開発をやってみた
Cordova を使って本気で商用ハイブリッドアプリ開発をやってみた
 
中規模Androidアプリ開発の過程に生じた問題と対策の紹介
中規模Androidアプリ開発の過程に生じた問題と対策の紹介中規模Androidアプリ開発の過程に生じた問題と対策の紹介
中規模Androidアプリ開発の過程に生じた問題と対策の紹介
 
ベトナム・ダナン オフショア開発記 by 中村健太(株式会社ビットエー/日本ディレクション協会)
ベトナム・ダナン オフショア開発記 by 中村健太(株式会社ビットエー/日本ディレクション協会)ベトナム・ダナン オフショア開発記 by 中村健太(株式会社ビットエー/日本ディレクション協会)
ベトナム・ダナン オフショア開発記 by 中村健太(株式会社ビットエー/日本ディレクション協会)
 
Html5/JSモバイルアプリ最前線
Html5/JSモバイルアプリ最前線Html5/JSモバイルアプリ最前線
Html5/JSモバイルアプリ最前線
 
Androidでもサクサク動くHTML5ハイブリッドアプリの作り⽅
Androidでもサクサク動くHTML5ハイブリッドアプリの作り⽅Androidでもサクサク動くHTML5ハイブリッドアプリの作り⽅
Androidでもサクサク動くHTML5ハイブリッドアプリの作り⽅
 
最新UIフレームワーク Onsen UI2で カッコイイWordPress連携アプリを作る方法
最新UIフレームワーク Onsen UI2でカッコイイWordPress連携アプリを作る方法最新UIフレームワーク Onsen UI2でカッコイイWordPress連携アプリを作る方法
最新UIフレームワーク Onsen UI2で カッコイイWordPress連携アプリを作る方法
 

Similar to スマートフォンアプリケーション開発の最新動向

HTML5 クロスプラットフォームアプリ開発の現実解
HTML5 クロスプラットフォームアプリ開発の現実解HTML5 クロスプラットフォームアプリ開発の現実解
HTML5 クロスプラットフォームアプリ開発の現実解Monaca
 
Phone gap+javascriptスマホアプリ開発(入門編)
Phone gap+javascriptスマホアプリ開発(入門編)Phone gap+javascriptスマホアプリ開発(入門編)
Phone gap+javascriptスマホアプリ開発(入門編)
Monaca
 
これからのNOTESモバイルアプリはこう作れ
これからのNOTESモバイルアプリはこう作れこれからのNOTESモバイルアプリはこう作れ
これからのNOTESモバイルアプリはこう作れMitsuru Katoh
 
PhoneGapユーザー会@大阪 講演資料
PhoneGapユーザー会@大阪 講演資料PhoneGapユーザー会@大阪 講演資料
PhoneGapユーザー会@大阪 講演資料
Monaca
 
Force.com開発基礎
Force.com開発基礎Force.com開発基礎
Force.com開発基礎
Salesforce Developers Japan
 
NSA NB委員会セミナー「モバイルアプリ開発業務におけるmonacaの活用」
NSA NB委員会セミナー「モバイルアプリ開発業務におけるmonacaの活用」NSA NB委員会セミナー「モバイルアプリ開発業務におけるmonacaの活用」
NSA NB委員会セミナー「モバイルアプリ開発業務におけるmonacaの活用」
アシアル株式会社
 
Webエンジニアによるスマートフォンアプリ開発
Webエンジニアによるスマートフォンアプリ開発Webエンジニアによるスマートフォンアプリ開発
Webエンジニアによるスマートフォンアプリ開発takeuchi-tk
 
2011年マイクロソフト テクノロジー振り返り~開発編~
2011年マイクロソフト テクノロジー振り返り~開発編~2011年マイクロソフト テクノロジー振り返り~開発編~
2011年マイクロソフト テクノロジー振り返り~開発編~
Takeshi Shinmura
 
次期Office製品群の新しい開発モデルの解説
次期Office製品群の新しい開発モデルの解説次期Office製品群の新しい開発モデルの解説
次期Office製品群の新しい開発モデルの解説kumo2010
 
ネットワーク分散型フレームワークConView
ネットワーク分散型フレームワークConViewネットワーク分散型フレームワークConView
ネットワーク分散型フレームワークConView
Rakuten Group, Inc.
 
PhoneGapでWebアプリをスマホアプリ化
PhoneGapでWebアプリをスマホアプリ化PhoneGapでWebアプリをスマホアプリ化
PhoneGapでWebアプリをスマホアプリ化
Takashi Okamoto
 
【17-D-6】.NETアセンブリの宿命
【17-D-6】.NETアセンブリの宿命【17-D-6】.NETアセンブリの宿命
【17-D-6】.NETアセンブリの宿命Developers Summit
 
【デブサミ関西2014】Web技術で作るエンタープライズアプリ
【デブサミ関西2014】Web技術で作るエンタープライズアプリ【デブサミ関西2014】Web技術で作るエンタープライズアプリ
【デブサミ関西2014】Web技術で作るエンタープライズアプリ
アシアル株式会社
 
20120413 nestakabaneworkshop
20120413 nestakabaneworkshop20120413 nestakabaneworkshop
20120413 nestakabaneworkshopYoichiro Sakurai
 
クロスプラットフォーム開発入門
クロスプラットフォーム開発入門クロスプラットフォーム開発入門
クロスプラットフォーム開発入門
minazou67
 
Sharoid Service Menu
Sharoid Service MenuSharoid Service Menu
Sharoid Service Menusharoid
 
Ignite UI 2012 最新情報 jQuery Mobile 編
Ignite UI 2012 最新情報 jQuery Mobile 編Ignite UI 2012 最新情報 jQuery Mobile 編
Ignite UI 2012 最新情報 jQuery Mobile 編
インフラジスティックス・ジャパン株式会社
 
ハイブリッドアプリ開発最前線から見たHtml5の理想と現実
ハイブリッドアプリ開発最前線から見たHtml5の理想と現実ハイブリッドアプリ開発最前線から見たHtml5の理想と現実
ハイブリッドアプリ開発最前線から見たHtml5の理想と現実
Monaca
 
Web Intents入門
Web Intents入門Web Intents入門
Web Intents入門
Shumpei Shiraishi
 
One ASP.NET ~ 今、ASP.NET に何が起こっているのか? ~
One ASP.NET ~ 今、ASP.NET に何が起こっているのか? ~One ASP.NET ~ 今、ASP.NET に何が起こっているのか? ~
One ASP.NET ~ 今、ASP.NET に何が起こっているのか? ~Akira Inoue
 

Similar to スマートフォンアプリケーション開発の最新動向 (20)

HTML5 クロスプラットフォームアプリ開発の現実解
HTML5 クロスプラットフォームアプリ開発の現実解HTML5 クロスプラットフォームアプリ開発の現実解
HTML5 クロスプラットフォームアプリ開発の現実解
 
Phone gap+javascriptスマホアプリ開発(入門編)
Phone gap+javascriptスマホアプリ開発(入門編)Phone gap+javascriptスマホアプリ開発(入門編)
Phone gap+javascriptスマホアプリ開発(入門編)
 
これからのNOTESモバイルアプリはこう作れ
これからのNOTESモバイルアプリはこう作れこれからのNOTESモバイルアプリはこう作れ
これからのNOTESモバイルアプリはこう作れ
 
PhoneGapユーザー会@大阪 講演資料
PhoneGapユーザー会@大阪 講演資料PhoneGapユーザー会@大阪 講演資料
PhoneGapユーザー会@大阪 講演資料
 
Force.com開発基礎
Force.com開発基礎Force.com開発基礎
Force.com開発基礎
 
NSA NB委員会セミナー「モバイルアプリ開発業務におけるmonacaの活用」
NSA NB委員会セミナー「モバイルアプリ開発業務におけるmonacaの活用」NSA NB委員会セミナー「モバイルアプリ開発業務におけるmonacaの活用」
NSA NB委員会セミナー「モバイルアプリ開発業務におけるmonacaの活用」
 
Webエンジニアによるスマートフォンアプリ開発
Webエンジニアによるスマートフォンアプリ開発Webエンジニアによるスマートフォンアプリ開発
Webエンジニアによるスマートフォンアプリ開発
 
2011年マイクロソフト テクノロジー振り返り~開発編~
2011年マイクロソフト テクノロジー振り返り~開発編~2011年マイクロソフト テクノロジー振り返り~開発編~
2011年マイクロソフト テクノロジー振り返り~開発編~
 
次期Office製品群の新しい開発モデルの解説
次期Office製品群の新しい開発モデルの解説次期Office製品群の新しい開発モデルの解説
次期Office製品群の新しい開発モデルの解説
 
ネットワーク分散型フレームワークConView
ネットワーク分散型フレームワークConViewネットワーク分散型フレームワークConView
ネットワーク分散型フレームワークConView
 
PhoneGapでWebアプリをスマホアプリ化
PhoneGapでWebアプリをスマホアプリ化PhoneGapでWebアプリをスマホアプリ化
PhoneGapでWebアプリをスマホアプリ化
 
【17-D-6】.NETアセンブリの宿命
【17-D-6】.NETアセンブリの宿命【17-D-6】.NETアセンブリの宿命
【17-D-6】.NETアセンブリの宿命
 
【デブサミ関西2014】Web技術で作るエンタープライズアプリ
【デブサミ関西2014】Web技術で作るエンタープライズアプリ【デブサミ関西2014】Web技術で作るエンタープライズアプリ
【デブサミ関西2014】Web技術で作るエンタープライズアプリ
 
20120413 nestakabaneworkshop
20120413 nestakabaneworkshop20120413 nestakabaneworkshop
20120413 nestakabaneworkshop
 
クロスプラットフォーム開発入門
クロスプラットフォーム開発入門クロスプラットフォーム開発入門
クロスプラットフォーム開発入門
 
Sharoid Service Menu
Sharoid Service MenuSharoid Service Menu
Sharoid Service Menu
 
Ignite UI 2012 最新情報 jQuery Mobile 編
Ignite UI 2012 最新情報 jQuery Mobile 編Ignite UI 2012 最新情報 jQuery Mobile 編
Ignite UI 2012 最新情報 jQuery Mobile 編
 
ハイブリッドアプリ開発最前線から見たHtml5の理想と現実
ハイブリッドアプリ開発最前線から見たHtml5の理想と現実ハイブリッドアプリ開発最前線から見たHtml5の理想と現実
ハイブリッドアプリ開発最前線から見たHtml5の理想と現実
 
Web Intents入門
Web Intents入門Web Intents入門
Web Intents入門
 
One ASP.NET ~ 今、ASP.NET に何が起こっているのか? ~
One ASP.NET ~ 今、ASP.NET に何が起こっているのか? ~One ASP.NET ~ 今、ASP.NET に何が起こっているのか? ~
One ASP.NET ~ 今、ASP.NET に何が起こっているのか? ~
 

More from Tsutomu Ogasawara

オープンソースを活用したフロントエンド開発の取り組み
オープンソースを活用したフロントエンド開発の取り組みオープンソースを活用したフロントエンド開発の取り組み
オープンソースを活用したフロントエンド開発の取り組み
Tsutomu Ogasawara
 
Cutting edge of web technology
Cutting edge of web technologyCutting edge of web technology
Cutting edge of web technology
Tsutomu Ogasawara
 
楽天の e コマースと HTML5 活用事例
楽天の e コマースと HTML5 活用事例楽天の e コマースと HTML5 活用事例
楽天の e コマースと HTML5 活用事例
Tsutomu Ogasawara
 
Html5 in Rakuten (at HTML5 Experts Night#1) #html5exp
Html5 in Rakuten (at HTML5 Experts Night#1) #html5expHtml5 in Rakuten (at HTML5 Experts Night#1) #html5exp
Html5 in Rakuten (at HTML5 Experts Night#1) #html5exp
Tsutomu Ogasawara
 
空室検索 Map
空室検索 Map空室検索 Map
空室検索 Map
Tsutomu Ogasawara
 
What's Parse
What's ParseWhat's Parse
What's Parse
Tsutomu Ogasawara
 
CakePHP 事例紹介 @ogaoga
CakePHP 事例紹介 @ogaogaCakePHP 事例紹介 @ogaoga
CakePHP 事例紹介 @ogaoga
Tsutomu Ogasawara
 

More from Tsutomu Ogasawara (7)

オープンソースを活用したフロントエンド開発の取り組み
オープンソースを活用したフロントエンド開発の取り組みオープンソースを活用したフロントエンド開発の取り組み
オープンソースを活用したフロントエンド開発の取り組み
 
Cutting edge of web technology
Cutting edge of web technologyCutting edge of web technology
Cutting edge of web technology
 
楽天の e コマースと HTML5 活用事例
楽天の e コマースと HTML5 活用事例楽天の e コマースと HTML5 活用事例
楽天の e コマースと HTML5 活用事例
 
Html5 in Rakuten (at HTML5 Experts Night#1) #html5exp
Html5 in Rakuten (at HTML5 Experts Night#1) #html5expHtml5 in Rakuten (at HTML5 Experts Night#1) #html5exp
Html5 in Rakuten (at HTML5 Experts Night#1) #html5exp
 
空室検索 Map
空室検索 Map空室検索 Map
空室検索 Map
 
What's Parse
What's ParseWhat's Parse
What's Parse
 
CakePHP 事例紹介 @ogaoga
CakePHP 事例紹介 @ogaogaCakePHP 事例紹介 @ogaoga
CakePHP 事例紹介 @ogaoga
 

Recently uploaded

論文紹介:Deep Learning-Based Human Pose Estimation: A Survey
論文紹介:Deep Learning-Based Human Pose Estimation: A Survey論文紹介:Deep Learning-Based Human Pose Estimation: A Survey
論文紹介:Deep Learning-Based Human Pose Estimation: A Survey
Toru Tamaki
 
ヒアラブルへの入力を想定したユーザ定義型ジェスチャ調査と IMUセンサによる耳タッチジェスチャの認識
ヒアラブルへの入力を想定したユーザ定義型ジェスチャ調査と IMUセンサによる耳タッチジェスチャの認識ヒアラブルへの入力を想定したユーザ定義型ジェスチャ調査と IMUセンサによる耳タッチジェスチャの認識
ヒアラブルへの入力を想定したユーザ定義型ジェスチャ調査と IMUセンサによる耳タッチジェスチャの認識
sugiuralab
 
Humanoid Virtual Athletics Challenge2024 技術講習会 スライド
Humanoid Virtual Athletics Challenge2024 技術講習会 スライドHumanoid Virtual Athletics Challenge2024 技術講習会 スライド
Humanoid Virtual Athletics Challenge2024 技術講習会 スライド
tazaki1
 
Generating Automatic Feedback on UI Mockups with Large Language Models
Generating Automatic Feedback on UI Mockups with Large Language ModelsGenerating Automatic Feedback on UI Mockups with Large Language Models
Generating Automatic Feedback on UI Mockups with Large Language Models
harmonylab
 
ハイブリッドクラウド研究会_Hyper-VとSystem Center Virtual Machine Manager セッションMM
ハイブリッドクラウド研究会_Hyper-VとSystem Center Virtual Machine Manager セッションMMハイブリッドクラウド研究会_Hyper-VとSystem Center Virtual Machine Manager セッションMM
ハイブリッドクラウド研究会_Hyper-VとSystem Center Virtual Machine Manager セッションMM
osamut
 
「進化するアプリ イマ×ミライ ~生成AIアプリへ続く道と新時代のアプリとは~」Interop24Tokyo APPS JAPAN B1-01講演
「進化するアプリ イマ×ミライ ~生成AIアプリへ続く道と新時代のアプリとは~」Interop24Tokyo APPS JAPAN B1-01講演「進化するアプリ イマ×ミライ ~生成AIアプリへ続く道と新時代のアプリとは~」Interop24Tokyo APPS JAPAN B1-01講演
「進化するアプリ イマ×ミライ ~生成AIアプリへ続く道と新時代のアプリとは~」Interop24Tokyo APPS JAPAN B1-01講演
嶋 是一 (Yoshikazu SHIMA)
 
ロジックから状態を分離する技術/設計ナイト2024 by わいとん @ytnobody
ロジックから状態を分離する技術/設計ナイト2024 by わいとん @ytnobodyロジックから状態を分離する技術/設計ナイト2024 by わいとん @ytnobody
ロジックから状態を分離する技術/設計ナイト2024 by わいとん @ytnobody
azuma satoshi
 
無形価値を守り育てる社会における「デー タ」の責務について - Atlas, Inc.
無形価値を守り育てる社会における「デー タ」の責務について - Atlas, Inc.無形価値を守り育てる社会における「デー タ」の責務について - Atlas, Inc.
無形価値を守り育てる社会における「デー タ」の責務について - Atlas, Inc.
Yuki Miyazaki
 
生成AIがもたらすコンテンツ経済圏の新時代  The New Era of Content Economy Brought by Generative AI
生成AIがもたらすコンテンツ経済圏の新時代  The New Era of Content Economy Brought by Generative AI生成AIがもたらすコンテンツ経済圏の新時代  The New Era of Content Economy Brought by Generative AI
生成AIがもたらすコンテンツ経済圏の新時代  The New Era of Content Economy Brought by Generative AI
Osaka University
 

Recently uploaded (9)

論文紹介:Deep Learning-Based Human Pose Estimation: A Survey
論文紹介:Deep Learning-Based Human Pose Estimation: A Survey論文紹介:Deep Learning-Based Human Pose Estimation: A Survey
論文紹介:Deep Learning-Based Human Pose Estimation: A Survey
 
ヒアラブルへの入力を想定したユーザ定義型ジェスチャ調査と IMUセンサによる耳タッチジェスチャの認識
ヒアラブルへの入力を想定したユーザ定義型ジェスチャ調査と IMUセンサによる耳タッチジェスチャの認識ヒアラブルへの入力を想定したユーザ定義型ジェスチャ調査と IMUセンサによる耳タッチジェスチャの認識
ヒアラブルへの入力を想定したユーザ定義型ジェスチャ調査と IMUセンサによる耳タッチジェスチャの認識
 
Humanoid Virtual Athletics Challenge2024 技術講習会 スライド
Humanoid Virtual Athletics Challenge2024 技術講習会 スライドHumanoid Virtual Athletics Challenge2024 技術講習会 スライド
Humanoid Virtual Athletics Challenge2024 技術講習会 スライド
 
Generating Automatic Feedback on UI Mockups with Large Language Models
Generating Automatic Feedback on UI Mockups with Large Language ModelsGenerating Automatic Feedback on UI Mockups with Large Language Models
Generating Automatic Feedback on UI Mockups with Large Language Models
 
ハイブリッドクラウド研究会_Hyper-VとSystem Center Virtual Machine Manager セッションMM
ハイブリッドクラウド研究会_Hyper-VとSystem Center Virtual Machine Manager セッションMMハイブリッドクラウド研究会_Hyper-VとSystem Center Virtual Machine Manager セッションMM
ハイブリッドクラウド研究会_Hyper-VとSystem Center Virtual Machine Manager セッションMM
 
「進化するアプリ イマ×ミライ ~生成AIアプリへ続く道と新時代のアプリとは~」Interop24Tokyo APPS JAPAN B1-01講演
「進化するアプリ イマ×ミライ ~生成AIアプリへ続く道と新時代のアプリとは~」Interop24Tokyo APPS JAPAN B1-01講演「進化するアプリ イマ×ミライ ~生成AIアプリへ続く道と新時代のアプリとは~」Interop24Tokyo APPS JAPAN B1-01講演
「進化するアプリ イマ×ミライ ~生成AIアプリへ続く道と新時代のアプリとは~」Interop24Tokyo APPS JAPAN B1-01講演
 
ロジックから状態を分離する技術/設計ナイト2024 by わいとん @ytnobody
ロジックから状態を分離する技術/設計ナイト2024 by わいとん @ytnobodyロジックから状態を分離する技術/設計ナイト2024 by わいとん @ytnobody
ロジックから状態を分離する技術/設計ナイト2024 by わいとん @ytnobody
 
無形価値を守り育てる社会における「デー タ」の責務について - Atlas, Inc.
無形価値を守り育てる社会における「デー タ」の責務について - Atlas, Inc.無形価値を守り育てる社会における「デー タ」の責務について - Atlas, Inc.
無形価値を守り育てる社会における「デー タ」の責務について - Atlas, Inc.
 
生成AIがもたらすコンテンツ経済圏の新時代  The New Era of Content Economy Brought by Generative AI
生成AIがもたらすコンテンツ経済圏の新時代  The New Era of Content Economy Brought by Generative AI生成AIがもたらすコンテンツ経済圏の新時代  The New Era of Content Economy Brought by Generative AI
生成AIがもたらすコンテンツ経済圏の新時代  The New Era of Content Economy Brought by Generative AI
 

スマートフォンアプリケーション開発の最新動向

Editor's Notes

  1. \n
  2. \n
  3. \n
  4. \n
  5. \n
  6. いま、Web 業界では、HTML5 vs ネイティブアプリといった、話が出ている。\n\n
  7. 写真はカメラアプリ。撮影状態のビューの上に独自の UI を表示したり、デバイスの機能を拡張するようなものは、ネイティブで開発する必要がある。\nあとは、ゲームのような応答速度を要求するアプリなど。\n\n
  8. 画面は Financial Times。\n独自の定期購読サービスを行うため、HTML5 に移行。\nlocalStorage や Application Cache を使って、オフライン購読や高速化を実現。\nテキスト中心のコンテンツであることもあり、デバイスの依存性を排除できた。\n
  9. UI の一部に WebView を使って、サーバが送信してきた HTML/CSS/JavaScript を描画する。\nコンテンツ部分は、Safari で見たときと同じ。\n\n
  10. Facebook の場合、メニュー、検索、ツールバー部分がネイティブ UI。\nコンテンツ部分が WebView。\nアプリをアップデートしていないのに、コンテンツ部分が更新されていたりする。\n\n
  11. あと、Web の会社の NAVER がスマートフォンアプリで成功したことは、Web 業界ではかなり注目されています。\n
  12. \n
  13. あと、既存会員に対してメールマガジンを送って誘導するようなケースも、アプリの起動は難しい。\n
  14. 別の課金サービスへのアプリ内からの誘導は、Apple の審査でリジェクトされる。\n\n
  15. これらの理由により、ネイティブアプリだけではなく、Web アプリやハイブリッド型のアプリが必要とされている。\n\n
  16. これらの理由により、ネイティブアプリだけではなく、Web アプリやハイブリッド型のアプリが必要とされている。\n\n
  17. \n
  18. \n
  19. \n
  20. Appcelerator というベンダーが開発していう。\nここにあるように、JavaScript コードを各種プラットフォームに変化するフレームワーク。\n\n
  21. Titaniumu は JavaScript のインタプリタがネイティブの実行環境上で動作している。\nKitchen Sink というデモアプリがあるので、それを実行してみる。\n\n
  22. Titaniumu は JavaScript のインタプリタがネイティブの実行環境上で動作している。\nKitchen Sink というデモアプリがあるので、それを実行してみる。\n\n
  23. \n
  24. JSONP で取得したデータをモデルにマッピングして、モデルとバインドされたビューに自動的に表示するようなことが可能。\n正直複雑。\nエンタープライズ向け???\n
  25. \n
  26. 元々は別のベンダーが開発していたのを、Adobe が買収。\nHTML5/CSS3/JavaScript を PhoneGap でラップして、各種プラットフォームのバイナリに変換してくれる。\n\nAdobe は Flash で負けたのですが、実は HTML5 にも注力していて、「Adobe Edge」という HTML5 オーサリングツールをリリースしている。\nそれで作った HTML5 アプリをネイティブとしてリリーするためのフレームワーク。\n
  27. この後紹介する jQuery Mobile などの Web アプリのフレームワークを利用することも可能。\n\n
  28. \n
  29. \n
  30. \n
  31. \n
  32. \n
  33. \n
  34. 最近のアプリケーションは、クライアントだけで閉じて実行されることはほとんどなく、サーバにデータを集めて、それをたくさんの人とシェアするようなケースが多い。\nたとえば Instagram のようなアプリ。\nそのサーバサイドでやるべきことが提供されていて、クライアントのプログラミングのみで利用可能。\n
  35. 実はたくさんの BaaS サービスが既に存在していますが、今日はその中の Parse をご紹介します。\n\n
  36. \n
  37. \n
  38. ・データベースとファイルの保存\n・Geo Location を利用したデータの取得。\n・Push Notification の送信\n・メールアドレスでのユーザー認証\n・Facebook、Twitter でのユーザー認証\n・Facebook、Twitter の SDK を含み、認証データと連携して API を実行可能。\n
  39. \n
  40. \n
  41. \n
  42. \n
  43. \n\n\n\n
  44. \n