ウェブブラウザの時代は終わるのか 〜スマホアプリとHTML5の未来〜
- 1. Developers Summit 2013 ウェブブラウザの 時代は終わるのか 〜～スマホアプリとHTML5の未来〜～ February 14, 2013 奥 ⼀一穂 株式会社ディー・エヌ・エー Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 2. Developers Summit 2013 本プレゼンテーションは個⼈人の考えを述べた ものであり、株式会社ディー・エヌ・エーの ⽴立立場や⽅方針を反映したものではありません。 2 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 3. Developers Summit 2013 ⾃自⼰己紹介 n 1997-‐‑‒2003 Palmscape / Xiino の開発 ⁃ Palm OS⽤用ウェブブラウザ • 実質世界初 ⁃ Sony, IBM, NTTドコモ等が採⽤用 n 2004 「Webアプリ統合開発環境の開発」 ⁃ IPA未踏スーパークリエータ 3 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 4. Developers Summit 2013 ⾃自⼰己紹介 n 2005-‐‑‒2010 サイボウズ・ラボ ⁃ ウェブ関連のR&D業務 ⁃ Japanize / Pathtraq • ウェブブラウザ拡張を使うサービス ⁃ Q4M • メッセージキュー（MySQLプラグイン） • Mixi, NHN, DeNA等で使⽤用 4 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 5. Developers Summit 2013 ⾃自⼰己紹介 n 2011-‐‑‒ 株式会社ディー・エヌ・エー ⁃ ウェブ関連のR&D業務 • ngCore（スマホ向けゲームエンジン） • JSX（プログラミング⾔言語） 5 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 6. Developers Summit 2013 アジェンダ n ウェブが破壊したもの n iPhoneの登場とスマホアプリ n ウェブvs.アプリ ⁃ 哲学的な話 ⁃ 市場的な話 ⁃ 技術的な話 n まとめ 6 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 7. Developers Summit 2013 ウェブが破壊したもの 7 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 8. Developers Summit 2013 Images by ScoC Lawrence ([email protected]), MicrosoI CorporaJon 8 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 9. Developers Summit 2013 20年年前... n 1993年年 ⁃ PC-‐‑‒9801BX2 • 486SX@25MHz, RAM1.8MB ⁃ Macintosh Color Classic • 68030@16MHz, RAM4MB, HDD40MB ⁃ 漢字Talk 7.1（1992年年秋） ⁃ Windows 3.1 9 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 10. Developers Summit 2013 20年年前... n CUIからGUIへの移⾏行行期 ⁃ 同時にマルチタスク化 n PCは⽣生産作業のためのツール ⁃ ⼀一太郎郎, Excel, MIFES, PageMaker n （⼀一部では）パソコン通信 10 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 11. Developers Summit 2013 hCp://www.niIy.com/25th/niIyserve/ 11 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 12. Developers Summit 2013 20年年前... n GUIが競争⼒力力の源泉 ⁃ Apple vs. Microsoft裁判 • 1988-‐‑‒1994 • WindowsのGUIがAppleの著作権を侵害? → Apple敗訴 12 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 13. Developers Summit 2013 GUIの基本操作 n GUIの基本操作 ⁃ シングルクリック=選択 ⁃ ダブルクリック=デフォルトアクション Before performing an operation on an object, the user must select it, usually by clicking it, to distinguish it from other objects. Selecting the object to be operated on before identifying the operation itself is a funda-‐‑‒ mental characteristic of the Macintosh human inter-‐‑‒ face. 〜～ This is often called the “noun-‐‑‒verb paradigm.” – Apple Human Interface Guidelines 13 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 14. Developers Summit 2013 ところが... n 1995年年 インターネットブーム ⁃ Netscape が上場 ⁃ Internet Explorer 1 ⁃ Yahoo! Inc. 創業 n コミュニケーションツールとしての PC 14 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 15. Developers Summit 2013 ウェブブラウザのUI n OS⾮非依存（別名: オレオレUI） ⁃ ロケーションバー ⁃ シングルクリック＝ページ遷移 ⁃ SDI（タブ） n 貧弱 ⁃ 例例: 画像をドラッグ＆ドロップでフォー ム⼊入⼒力力できない 15 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 16. Developers Summit 2013 マイクロソフト社の戦略略 n ウェブブラウザはOS間の差をなくす → OSメーカーにとっては危機 n Internet Explorerを無料料バンドル → 競合の排除 ⁃ 独⾃自仕様で囲い込み • Java独⾃自拡張, ActiveX n IEを⾜足がかりにサーバ側へ進出 ⁃ msn.com 16 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 17. Developers Summit 2013 Google社の戦略略 n マイクロソフト社のブラウザ⽀支配は危険 ⁃ Mozilla Firefoxを⽀支援 n PC上で「しか」できないことをなくそう ⁃ V8でJavaScriptの速度度向上 ⁃ Google Apps 17 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 18. Developers Summit 2013 ここまでのまとめ n クライアントアプリの⻑⾧長所を消すのがウェ ブ企業の戦略略 n ブラウザをバンドルすることでウェブ企業 に対抗するのがマイクロソフト社の戦略略 n ユーザビリティは進化せず ⁃ むしろ悪化というべき • ウェブサイト毎に異異なるオレオレUI 18 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 19. Developers Summit 2013 iPhoneの登場とスマホアプリ 19 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 20. Developers Summit 2013 Apple社の戦略略 n アプリならではの⻑⾧長所を引き出す ⁃ ホーム画⾯面への露露出 ⁃ 通知 ⁃ オフライン動作 ⁃ アプリならではのUI n エコシステムを構築 ⁃ AppStore 20 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 21. Developers Summit 2013 スマホへのブラウザアプリ最適化 n 不不可能ではない ⁃ ホームへの露露出 → ブックマーク ⁃ 通知 → メール ⁃ オフライン動作 → Offline Web Apps. ⁃ UI → jQuery Mobile, etc. n だがiOS専⽤用に作るならアプリの⽅方が簡単 ⁃ Androidの場合も同様 ⁃ ブラウザ間の差異異が問題に 21 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 22. Developers Summit 2013 Objective-‐‑‒C開発者の増加 hCp://www.Jobe.com/index.php/content/paperinfo/tpci/index.html 22 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 23. Developers Summit 2013 スマホアプリ=進化したウェブアプリ? n 通信はHTTP、UIはネイティブ n 「ウェブより優れた」ユーザー経験を提供 ⁃ Google Maps ⁃ Facebook ⁃ Twitter ⁃ ... 23 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 24. Developers Summit 2013 ウェブは終わり。これからはアプリの時代? 24 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 25. Developers Summit 2013 ウェブvs.アプリ 25 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 26. Developers Summit 2013 哲学的な話 26 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 27. Developers Summit 2013 ウェブとは何か? n ウェブの基本３要素 ⁃ HTML ⁃ HTTP ⁃ URI 27 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 28. Developers Summit 2013 ウェブが成功した鍵=URI ウェブにおけるそれら（基本「プロトコル」）を重要度度の順に挙 げると、まずURI、HTTP、そしてHTMLであった。 （中略略） ウェブの根本原則は、いったん誰かが、どこかに⽂文書を（中略略） 公開したら、リンクを共有することで、誰もが、どこにいても、ど んなコンピューターを使ってもその情報にアクセスできるというも のだ。この点が、それまでのコンピューターシステムのアプローチ と哲学的に異異なっていた。 -‐‑‒ Weaving THE WEB (Tim Berners-‐‑‒Lee) 28 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 29. Developers Summit 2013 ウェブが成功した鍵=URI n URI以前:「○○掲⽰示板の３件⽬目の△△さん の発⾔言」 n URI以後: http://t.co/Us9Mi… 29 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 30. Developers Summit 2013 ウェブが成功した鍵=URI n Google検索索があるのもURIのおかげ ⁃ クローラはURIをたどって情報を収集 n URIによるハイパーリンク → 役割分担と競争 • 検索索エンジンの場合: ⁃ ODiN, Yahoo!, Altavista, Lycos, goo, excite, Google, bing, NAVER, ... • AppStore の場合は? 30 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 31. Developers Summit 2013 スマホアプリ=ウェブを補完する存在 n ⽬目的を限定して「ウェブより優れた」ユー ザー経験を提供 n URIはない 31 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 32. Developers Summit 2013 市場的な話 32 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 33. Developers Summit 2013 スマホアプリ市場の⼤大きさ(世界) n 両社の主⼒力力ビジネス（ハードウェア/広告） を補完する存在 n AppStoreの四半期売上は約14億⽶米ドル ⁃ Google Playはその1/4程度度（らしい） hCp://techcrunch.com/2012/10/25/apple-‐sets-‐all-‐Jme-‐record-‐for-‐quarterly-‐app-‐store-‐sales-‐700k-‐apps-‐275k-‐for-‐ipad-‐6-‐5b-‐paid-‐to-‐devs/ hCp://news.cnet.com/8301-‐1035_3-‐57560218-‐94/google-‐play-‐surges-‐but-‐apples-‐app-‐store-‐is-‐sJll-‐no-‐1/ 33 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 34. Developers Summit 2013 スマホアプリ市場の規模感 n ⽇日本のウェブ市場 ⁃ ネット通販: 7.8兆円 ⁃ ネット広告: 8,100億円 ⁃ ソーシャルゲーム: 3,900億円 n スマホアプリ市場 ⁃ 6,000億円前後（世界四半期推計から換算） 国内市場の数値はそれぞれ下記参照 hCp://www.dentsu.co.jp/news/release/2012/pdf/2012017-‐0223.pdf hCp://www.yano.co.jp/market_reports/C54101500 hCp://www.yano.co.jp/press/press.php/001053 34 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 35. Developers Summit 2013 全てのウェブサイトがアプリ化する? n アプリ化のメリットはサービス毎に異異なる ⁃ SNS ⁃ ニュースサイト ⁃ ECプラットフォーム（例例: Amazon） ⁃ 零零細ネット通販（例例: 伊⾖豆の⼲干物屋） n アプリ化によるデメリットも ⁃ 開発コスト ⁃ 頻繁な更更新ができない 35 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 36. Developers Summit 2013 技術的な話 36 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 37. Developers Summit 2013 進化するウェブブラウザ n JavaScript n WebGL n Web Audio API n PNaCl n W3C Push API 37 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 38. Developers Summit 2013 進化するウェブブラウザ n iOSのJavaScript実⾏行行速度度は１年年で2倍に ⁃ さらに⾼高速化の余地あり • Parallel GC, optimization, etc. 38 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 39. Developers Summit 2013 進化するウェブブラウザ n WebGLへの対応 ⁃ Chrome 25 beta for Androidで対応 • ただし、デフォルトオフ ⁃ シェーダーを使った表現が可能に n Web Audio API ⁃ 効果⾳音再⽣生や⾳音声合成等 ⁃ iOS 6で対応 ⁃ Chrome for Androidは今年年前半 hCp://code.google.com/p/chromium/issues/detail?id=166003 39 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 40. Developers Summit 2013 PNaCl (Portable Native Client) n Native Clientとは? ⁃ ブラウザのサンドボックス上でネイティ ブコードを動かす技術 ⁃ Google Chromeに搭載 n PNaClとは? ⁃ LLVM bitcodeでバイナリ配布 ⁃ ウェブブラウザがネィティブコードにコ ンパイルして実⾏行行 40 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 41. Developers Summit 2013 PNaCl (Portable Native Client) n PNaCl完成時には、⼀一般のウェブサイトに配 置されたバイナリが実⾏行行可能になる予定 n 進捗: ⁃ 昨年年末に、SDKがPNaCl対応完了了 ⁃ Chromeの対応は、これから 41 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 42. Developers Summit 2013 W3C Push API n ウェブサイトからスマホへのプッシュ通知 ⁃ 通知を受けるとブラウザが起動して通知 を処理理 n 2012年年10⽉月に最初のWorking Draft n Firefox OSが別⽅方式での実装を予定 ⁃ 当初はアプリのみ 42 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 43. Developers Summit 2013 事例例: ngCore on HTML5 n ngCoreとは? ⁃ DeNAが提供するゲーム開発環境 ⁃ JavaScriptでゲームアプリ開発 • Android / iOS対応 • OpenGL等のネイティブAPIを利利⽤用 n ngCore on HTML5とは? ⁃ ngCore⽤用ゲームをウェブブラウザで ⁃ 2年年前は夢物語だと⾔言われた。今は? 43 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 44. Developers Summit 2013 hCp://www.atmarkit.co.jp/fwcr/design/ux/d89clip43/01.html 44 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 45. Developers Summit 2013 まとめ 45 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 46. Developers Summit 2013 まとめ n スマホアプリとウェブブラウザは相互補完 の関係にある ⁃ UIに優れるスマホアプリ ⁃ 幅広い⽤用途に対応するウェブブラウザ n それでも敢えて⽐比較するなら… 46 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 47. Developers Summit 2013 Pros and Cons n スマホアプリ ○ デバイスの能⼒力力を最⼤大限引き出せる × OS毎の開発が必要 n ブラウザアプリ ○ 不不⾜足していた機能が実装されつつあ る × ブラウザ間の互換性問題 47 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 48. Developers Summit 2013 アプリの⽤用途別分類(例例) スマホアプリ向き 利利⽤用頻度度⾼高 SNS ゲーム メッセンジャー ニュースサイト ⾼高度度なUI 機種⾮非依存 ECサイト 利利⽤用頻度度低 ウェブアプリ向き 48 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 49. Developers Summit 2013 アクション ウェブブラウザに限らず「○○にはできな い」と決めつけていることはありませんか? ⾃自分の中の常識識を問いなおしてみませんか? 49 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.
- 50. Developers Summit 2013 ご清聴ありがとうございました 50 Copyright (C) 2013 DeNA Co.,Ltd. All Rights Reserved.