Web is the OS (KDDI mugen Labo)

2,146 views

Published on

KDDI ∞ Labo open MEETing Vol.17 で使用したスライド (に少しページを追加したもの)
https://tixee.tv/event/detail/eventId/1158

Published in: Technology
0 Comments
4 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
2,146
On SlideShare
0
From Embeds
0
Number of Embeds
318
Actions
Shares
0
Downloads
23
Comments
0
Likes
4
Embeds 0
No embeds

No notes for slide

Web is the OS (KDDI mugen Labo)

  1. 1. Web is the OSKDDI∞Labo open MEETing Vol.17by Tomoya ASAI (dynamis)Last Update: 2013/02/22
  2. 2. about:me
  3. 3. Tomoya ASAIMozilla JapanTechnical Marketing (Evangelist)dynamis @ communitydynamis.jp@dynamitterfacebook.com/dynamismailto: Tomoya ASAI <dynamis mozilla-japan.org>@
  4. 4. Topics
  5. 5. TopicsBackgroundWeb PlatformFirefox OSWebFWD / Firefox Flicks
  6. 6. Background
  7. 7. 現在のアプリエコシステムアプリマーケットで配信iOS <=> App StoreAndroid <=> Google PlayWindows <=> Windows Store販売、アプリ内課金、広告課金の手数料は 30% が標準その他アフィリエイトなど
  8. 8. 既存の独自プラットフォームプラットフォーム毎に異なる言語で個別の専用アプリを作る必要があるi a f c
  9. 9. 既存エコシステムの課題OS 毎のアプリ開発が必要言語や API は OS に依存iOS/Windows は UI 制限も強いWebView はサブセットWebView << Native追加 API も標準化されない継続性、互換性、実装依存…
  10. 10. Web Platform への期待次世代プラットフォームWeb 技術で何でも可能にマルチデバイス対応開発言語や API の共通化ベンダー非依存の標準自由で持続性のある API
  11. 11. Web が共通プラットフォームWeb がプラットフォームなら標準技術でアプリ環境が統一されるプラットフォームとしての Web
  12. 12. 開発者の多いプラットフォーム調査にも依るけど HTML5 開発者の方が圧倒的に多い800万人45万人10万人
  13. 13. "HTML5" を使うアプリ開発者
  14. 14. Web Platform の課題機能的な制約デバイスやシステム系 API 不足パフォーマンスJava などに比べても数倍遅いアプリ配信と課金Market や Payment の標準がないマイクロベンチなら JS ~= Java に追いついたが実アプリレベルでは JS 遅い
  15. 15. Web Platform
  16. 16. Web 技術 = Native へWeb 技術が「ネイティブ」HTML/CSS/JS ですべて可能に新しい API は W3C 標準化速度も Java に追いつく単純な演算程度なら既に同程度WebGL や DOMCrypt なども活用asm.js で大規模アプリも高速化Web 技術だけですべてが済むプラットフォームとなるよう発展中
  17. 17. Web で可能になってることマルチメディアAudio, Video, Animation, 3D ...アプリケーションOffline, Storage, Indexed DB...高度な通信制御双方向通信, Server-Sent Event...2011 年にはできていたことの一例
  18. 18. Web ではできなかったことシステムステータスWiFi 情報, モバイル通信...各種センサー光センサー, 近接センサー...低レベルハードウェア制御USB, BlueTooth, NFC...2011 年にはできなかったことの一例
  19. 19. SemanticElementsMultiMediaHTML5FormsOfflineSupportHTML5HTML5ParserMouse,Key ev.XHTML5WAI-ARIAW3C
  20. 20. SemanticElementsMultiMediaCanvasHTML5FormsOfflineSupportMicro-DataServer-Sent ev.WebSocketsWebStorageHTML5HTML5ParserMouse,Key ev.XHTML5WebWorkersWebMessag-ingWAI-ARIAW3CWHATWGHTML
  21. 21. SemanticElementsMultiMediaCanvasHTML5FormsOfflineSupportMicro-DataServer-Sent ev.WebSocketsWebStorageLayoutMediaQueriesHTML5CSS3~TransformAnimationRegionsFiltersHTML5ParserMouse,Key ev.XHTML5WebWorkersWebMessag-ingWAI-ARIAW3CWHATWGHTML
  22. 22. SemanticElementsMultiMediaCanvasHTML5FormsOfflineSupportMicro-DataWebGLIndexedDBSVGServer-Sent ev.WebSocketsWebSocketsGeo-locationFileAPIWebStorageXHR2MathMLLayoutMediaQueriesHTML5CSS3~TransformAnimationRegionsFiltersHTML5ParserMouse,Key ev.ECMAScriptCSPSPDYXHTML5Orien-tationWebWorkersWebMessag-ingDOM4SMIL Vibra-tionXPathRSSOGPWAI-ARIAW3CWHATWGotherKhronosECMAIETFWOFFHTMLDNT
  23. 23. SemanticElementsMultiMediaCanvasHTML5FormsOfflineSupportWebmH.264Micro-DataWebGLWebSQLIndexedDBSVGServer-Sent ev.WebSocketsWebSocketsGeo-locationFileAPIWebStorageXHR2MathMLWebAudioLayoutMediaQueriesHTML5CSS3~TransformAnimationRegionsFiltersHTML5ParserMouse,Key ev.OpusECMAScript ECMA6thUSBCSPSPDYWebCLWebRTCNetInfoMP3DeviceStorageTCPSocketNFCFileSysNotifi-cationXHTML5Orien-tationWebWorkersWebMessag-ingDOM4SMIL Vibra-tionProxi-mityXPathRSSRDFOGPSchema.orgWAI-ARIAW3CWHATWGotherKhronosECMAIETFWOFFBatteryStatusRadioTelHTMLDNTFlexBox
  24. 24. H.264IndexedDBFileAPIWebAudioCSS3~OpusECMA6thCSPWebRTCNetInfoDeviceStorageTCPSocketFileSysNotifi-cationProxi-mityBatteryStatusRadioTelDNTSPDYこの辺りが2012 年の進化RegionsFiltersFlexBox今年はもっと!
  25. 25. 進化を続ける Web 技術問題はすべて解決してきた速度遅い → 高速化マルチコア → WorkersGPU 使えない → WebGL, WebCLJS 嫌い → ECMA6th, Emscripten×××できない → API を追加Native なら… → Web が Native
  26. 26. 大規模 App も Native 並の速度へ重い処理も asm.js で C の 1/2 程度までJava や C# と同程度の処理速度
  27. 27. Unreal Engine on Browser100 万行以上の C & OpenGL コードを 5 日で移植LLVM + Emscripten で JS (asm.js) に変換
  28. 28. 実装済み Web APIAlarmattention screenArchiveAudio PolicyBackground SensorBrowserCameraContactsDesktopNotificationDevice StorageEmbed AppsFile HandleFM RadioIdleAPIMouse LockMobile ConnectionNetwork EventsNetwork StatsManagePermissionsPower ManagementSettingsSMSScreen OrientationSocial APISystem XHRTCP SocketWeb TelephonyTime ManagerOpen Web AppsWiFi Managementなどなど...実装状況などのまとめ表: https://wiki.mozilla.org/WebAPI
  29. 29. 次の Web APIBackgroundServicesBluetooth-***CalendarDatabaseMigration (tempto perm storage)FileSystem?NFCHTTP-cacheKeyboard/IMELogMPEG DASHOpen Web AppsParallel ArrayPaymentPush NotificationQuotaResource LockSimple StorageSPDY ServerPushSpellcheckUDB DatagramSocketUSB (low-level)USB file-readingWebRTC -CameraWebRTC - P2Pなどなど...どこまで今年中にサポートされるか楽しみ!
  30. 30. Web 標準を充実させよう!Web = Native に不足機能はすべて定義・実装W3C の WG などで標準化実装と平行して標準化Device API, System Apps...そのほか IETF などでもhttps://wiki.mozilla.org/WebAPI
  31. 31. 僕はまず立派なブラウザになりいつかは立派な OS にならなきゃ
  32. 32. Firefox OS
  33. 33. ステータスバー (通知、電波強度、電池残量...)もカメラやラジオもビデオや音楽の再生もマーケットプレイスもシステムの環境設定もホーム画面や壁紙も電話や SMS の送受信ももちろん ブラウザ もその他なんでも...
  34. 34. ステータスバー (通知、電波強度、電池残量...)もカメラやラジオもビデオや音楽の再生もマーケットプレイスもシステムの環境設定もホーム画面や壁紙も電話や SMS の送受信ももちろん ブラウザ もその他なんでも...すべて Web 技術で!
  35. 35. シンプル&スマートWeb プラットフォームの実行環境としては圧倒的にスマート!WHAT IS FIREFOX OS?HOW IS IT DIFFERENT FROM ANDROIDHTML5 UserExperience/ContentKernelDeviceWeb Engine/StandardDevice APIsFirefox OSWeb Browser/PlatformNative API-based UIKernel(e.g. Android, iOS,Win7, etc.)Device(phone, tablet,desktop)APIsAndroid
  36. 36. Firefox OS とセキュリティユーザがアプリ権限管理可インストール時と実行時に権限を許可するハイブリッド方式「インストール時に全て許可」ではプライバシーは守れなかったユーザが理解できプライバシーなどに関わる API は実行時確認
  37. 37. Developer Preview Phone今週ストアオープン予定Keon:Snapdragon 1GHz, 4GB ROM,512MB RAM, 3.5" HVGAPeak:Snapdragon 1.2GHz x2, 4GB ROM,512MB RAM, 4.3" qHDhttp://www.geeksphone.com/
  38. 38. Developer Preview PhoneTelefónica と Geeksphone が作る開発者向けテスト端末
  39. 39. 開発パートナーと製品化KDDI, Telefónica ...世界の主要 18 キャリアZTE, Alcatel, LG, Huawei, Sony...6 月に 5ヶ国で発売予定スペイン、ブラジル、ベネズエラ、ポーランド、ポルトガル2013 年中に更に 11ヶ国日本や北米では 2013~2014 のタイムフレームで発売予定
  40. 40. MWC で発表したパートナー主要なキャリア、端末メーカー、チップメーカーなど
  41. 41. 端末&チップメーカーSONY Mobile は Telefónica と Firefox OS について提携
  42. 42. いつ Web にするか?
  43. 43. いつ Web にするか?
  44. 44. Marketplace
  45. 45. Web = アプリマーケットへOpen Web AppsWeb アプリのインストール APIFirefox Marketplaceオープンなマーケットの提供Web Paymentsオープンな課金 API の実装
  46. 46. Firefox MarketplaceDevice, OS 横断マーケットWeb Platform のためのストアFirefox 限定にならない設計現在開発者向けに公開中Firefox OS と Android 版 Firefoxの開発版ユーザが対象PC で使うには UA 書き換え...https://marketplace.firefox.com/
  47. 47. Mozilla は Web エンジンに注力ビジネスは自由に独自 Market や自己配布も可能決済手段も自由にベンダー、決済手段、認証システムに依存しない Payment APIハードは Android と共通HAL は Android と共通化
  48. 48. 独占的プラットフォームからオープンな Web へ開発者/OEM/キャリアAppleApp StoreiPhone/iPadユーザGooglePlay端末ユーザMSMarketplace端末ユーザmarket 開発者/OEM// キャリアユーザ端末既存の独占的プラットフォームFirefox OS によるOpen プラットフォーム
  49. 49. Marketplace パートナーの例多数のパートナーのうち一例です
  50. 50. Firefox = WebRT (WebRunTime)Gecko = アプリ環境Firefox = Gecko で XUL/JSWebApps = Gecko で HTML/JSマルチデバイス対応PC, Android, Firefox OS...同じコードでどこでも動くマーケットもマルチデバイス
  51. 51. Android に Web アプリ環境Web App = Native App にホームスクリーンへの追加独立してフル画面起動ネイティブ同様の利用体験Firefox = WebRT for Androidホームにインストール、アプリを起動した画面、マーケットをブラウズ
  52. 52. PC にも Web アプリ環境Web App = Native App にプログラムフォルダ (アプリケーションディレクトリ) への追加ウィンドウはもちろんプロセスもデータも全て独立Firefox = WebRT for PC
  53. 53. Web = MarketplaceMarketplace に縛られないWeb はアクセスすれば使えるMarketplace のアプリでなくともアプリ内課金 API が利用可能Web/Marketplace 横断検索Firefox Marketplace に登録されていないアプリも見つけられる
  54. 54. アプリも「ぐぐる」時代へ"まずインストール" は古いディレクトリ(分類)だけのマーケットでは Google 以前の Web動的な Web アプリ環境インストール不要で使える検索も Market / Web 横断検索*1 everything.me ってサービスだから正確には「えぶる」かも?*1MarketplaceWeb
  55. 55. アプリ内に直接ジャンプ
  56. 56. Web らしいシステムだね!
  57. 57. いつ Web アプリ作るか?
  58. 58. いつ Web アプリ作るか?
  59. 59. App Dev
  60. 60. Firefox OS のアプリ開発Web アプリです。Web アプリです。Web アプリです。大事なこと3回
  61. 61. Firefox OS のアプリ開発Web アプリです。Web アプリです。Web アプリです。大事なこと3回
  62. 62. Firefox OS のアプリ開発いつもの開発ツールいつものエディタいつものライブラリ
  63. 63. Firefox OS Simulator再起動不要の拡張機能https://addons.mozilla.org/ja/firefox/addon/firefox-os-simulator/ポチッと押すだけWeb 開発メニューに追加されるFirefox デスクトップビルド+プロファイル+Alpha詳しい解説: https://github.com/dynamis/firefoxos/wiki/simulator
  64. 64. Firefox OS Simulatorプロファイル付きデスクトップビルドにホームボタンを追加コンソールやディレクトリからアプリケーションを読み込む機能も
  65. 65. Join US!
  66. 66. ••••Mozilla WebFWD起業支援プログラム
  67. 67. •••••••••••Firefox Flicksビデオコンテスト
  68. 68. about: Firefox OS grouphttp://FxOS.org/(https://groups.google.com/group/firefoxos にリダイレクト)コミュニティ一緒に作ってくれる人を募集しています。(・・).
  69. 69. Firefox OS 情報集めてますhttp://FxOS.org/wiki(https://github.com/dynamis/firefoxos/wiki にリダイレクト)随時更新しています。

×