Firefox OS

Firefox OS
Slides @ html5j.org 35th
by Tomoya Asai (dynamis)

Last Update: 2013/01/22

about:dynamis

Tomoya Asai @ Mozilla Japan
http://dynamis.jp

@dynamitter
facebook.com/ dynamis
レッサーパンダが好き。

mailto: Tomoya ASAI <dynamis@mozilla-japan.org>

今週末は大阪でおさわり！

http://m2.cap-ut.co.jp/event/semi07.html

今週末は東京でもおさわり！

http://atnd.org/events/36267

Firefox OS イベント共催募集

2012.11.03:
デザイナーズハック, Tizen Japan コ
いっしょにンソーシアムと共催
おさわり！ 2012.12.09:
HTML5＋α @福岡と共催
2013.01.26:
まにまにカレッジと共催
次はあなたと！

about: Firefox OS group

http://FxOS.org/
(https://groups.google.com/
group/ﬁrefoxos にリダイレクト)
コミュニティ一緒に作ってくれる
人を募集しています。(・・).

みんないっしょに！

Firefox OS 情報集めてます

http://FxOS.org/wiki
(https://github.com/dynamis/
ﬁrefoxos/wiki にリダイレクト)
随時更新しています。

みんなよろしく！

https://twitter.com/lindwurm_/status/288558397119397888

MMoozziillllaa ステキでしょ？

ステキな世界を作るため
よりいっそう頑張ってます

本日のトピック

about:
Why Firefox OS?
Firefox OS
Web = OS
Marketplace
Apps Dev

Why Firefox OS?

html5j.org ですし、
HTML5 的な視点から

どうして FFiirreeffooxx が
OOSS になるの？

"HTML5" の目的

アプリのための HTML
すべてを Web 技術で実現
互換性のある実装に
ブラウザの挙動を厳密に定義
マルチデバイス Web
どこでも同じ "One Web"

Web 標準プラットフォーム

プラットフォーム
としての Web

Web がプラットフォームなら業界標準技術でアプリ環境が統一される

独占プラットフォームの支配

ネイティブアプリ
機能も速度もネイティブ優先
アプリエコシステム
専用のストアや課金システム
WebView
Web は中に取り込んでしまう

独占的プラットフォーム

i a f c

プラットフォーム毎に異なる言語で個別の専用アプリを作る必要がある

独占プラットフォームの問題

プラットフォーム依存
それぞれ異なる言語や API
不透明な継続性・再利用性
ベンダーと運命共同体
囲われた世界での自由
ビジネス的な制約も多い

Web 標準のオープンな世界
vs
独自技術による囲い込み

「ブラウザ戦争」の時代はとっくに終わりました

"HTML5" への期待

次世代プラットフォーム
アプリ開発のプラットフォーム
Web アプリ開発を簡単に
互換性のある範囲の拡大
マルチデバイス展開
言語と API を共通化

Web が共通プラットフォーム

プラットフォーム
としての Web

Web がプラットフォームなら業界標準技術でアプリ環境が統一される

Web ベースで透明性や自由度
の高いプラットフォームへ

既存の独占的 Firefox OS による
プラットフォーム Open プラットフォーム
開発者/OEM/キャリア market 開発者/OEM/
/ キャリア

Apple Google MS
App Store Play Marketplace

iPhone/iPad 端末端末

ユーザ

ユーザユーザユーザ端末

オープンなモバイルで
イノベーションを加速！

オープンと競争は革新の源泉

Web = OS

Web が OS となる時代が来ました

うぇぶがおーえす？

Web が OS になるって
どーいうことなんでしょう？

Web で可能になったこと

マルチメディア
Audio, Video, Animation, 3D ...
アプリケーション
Ofﬂine, Storage, File ...
高度な通信制御
双方向通信, DNT ...

Web ではできなかったこと

システムステータス
WiFi 情報, モバイル通信...
各種センサー
光センサー, 近接センサー...
低レベルハードウェア制御
USB, BlueTooth, NFC...

Khronos SMIL Vibra-
tion
WebGL Geo-
SVG
other location
Orien-
tation
Canvas
WHATWG Web IETF
Messag-
ing Web
Multi SPDY
Web Sockets DNT
Media Mouse, Sockets
HTML5 Key ev. XHR2
FileAPI CSP
Forms
W3C Server-
Oﬄine ECMA
HTML5 HTML5 Support
Sent ev. ECMA
Script
Parser
Indexed
Web
WAI- DB
XHTML5 Storage
ARIA
Semantic
Elements Web Media
Workers Layout Queries
Micro-
HTML Data
Trans CSS3~ Flex
Box
OGP XPath form
RSS Anim
Math Regions
ation
ML WOFF
DOM4

Khronos SMIL Vibra- MP3
WebCL Webm Opus
tion
WebGL Geo-
SVG
H.264
other location
Orien-
Web
Audio Notiﬁ-
tation Web
Canvas cation
WHATWG Web IETF RTC
Messag-
ing Web TCP Tel
Multi SPDY
Web Sockets DNT Socket
Media Mouse, Sockets
HTML5 Key ev. XHR2 Radio
FileAPI CSP
Forms Net
W3C Server- Info
Oﬄine ECMA
HTML5 HTML5 Support
Sent ev. ECMA
Script ECMA
NFC

Parser 6th
Indexed
Web Device
WAI- DB
Storage Storage
XHTML5 ARIA
Semantic Web
Elements Web SQL
Media
USB
Workers Layout Queries
File
Micro- Sys
HTML Data
Trans CSS3~ Flex
Box
Battery
Status
OGP XPath form Proxi-
Anim mity
Schema RSS Math Regions
.org ation
ML WOFF
RDF DOM4

Web APIs
Alarm Device Storage Settings
attention screen Embed Apps Web SMS
Audio Policy FM Radio Storage
Background Geolocation System XHR
Sensor IdleAPI TCP Socket
Background Mobile Web Telephony
services Connection Time Manager
Browser Network Events Voicemail
Camera Network Stats Open Web Apps
Contacts Manage
WiFi Management
Desktop Power
などなど...
Notiﬁcation Management

実装状況などのまとめ表: https://wiki.mozilla.org/WebAPI

Web API は標準化

不足機能は実装＆標準化
Web ＝ Native とする
W3C などで標準化
実装と平行して標準化
Device API, System Apps...
そのほか IETF などでも

http://bit.ly/systemlevelapi

これなら WWeebb で
大丈夫だね！

どんなアプリでも作れそう！
ボクもいろいろ作りた∼い！

Firefox OS

Web = OS を現実に実装

FFiirreeffooxx OOSS って
どんなんだろう？

フォクすけもわくわく。

ステータスバー (通知、
電波強度、電池残量...)も
カメラやラジオも
ビデオや音楽の再生も
マーケットプレイスも
システムの環境設定も
ホーム画面や壁紙も
電話や SMS の送受信も
もちろんブラウザも
その他なんでも...

ステータスバー (通知、
電波強度、電池残量...)も
カメラやラジオも
ビデオや音楽の再生も
マーケットプレイスも
システムの環境設定も
ホーム画面や壁紙も
電話や SMS の送受信も
もちろんブラウザも
その他なんでも...

すべて Web 技術で！

Firefox OS (Boot to Gecko)

Web 技術が「ネイティブ」
HTML5, JavaScript, Web API...
Java に匹敵する速度も目指して
Gecko エンジンだけ起動
Kernel 上に Gecko を
Java VM などの中間レイヤなし
Gecko = Firefox 描画エンジン

プロジェクト名は今も Boot to Gecko

Firefox OS = スマート(軽量) OS
既存プラットフォーム Firefox OS

Web Browser/
Platform

Native API- HTML5 User
based UI Experience/
Content
APIs Web Engine/
Standard Device
APIs
Kernel
(e.g. Android, iOS, Kernel
Win7, etc.)

Device
(phone, tablet, Device
desktop)

Web プラットフォームの実行環境としては圧倒的にスマート！

Firefox OS エコシステムの魅力

ネイティブに負けない
提供される API も充実
一部処理は速度面でも匹敵
スリムな HTML5 実行環境
$100 スマホでも十分動作
$100 タブレットは当たり前
圧倒的な開発者数...

開発者の多いプラットフォーム
800万人

10万人 45万人

Web プラットフォームの開発者は iOS の 80 倍、Android の 18 倍！

Global アプリパートナー

まだまだあるけど入り切りません。一部ロゴ古いかも。ゴメンね。

*1
アプリも「ぐぐる」時代へ

"まずインストール" は古い
ディレクトリ(紹介)だけのマーケッ
トでは Google 以前の Web と同じ
動的な Web アプリ環境
Web サイトや Web アプリはアク
セスするだけで使える
アプリを検索してまず試し、
気に入ったらホームに追加する

*1 everything.me ってサービスだから正確には「えぶる」かも？

Firefox OS とセキュリティ

ユーザがアプリ権限管理可
「インストール時に全て許可」の
モデルではプライバシー守れない
インストール時と実行時に権限を
許可するハイブリッド方式
ユーザが理解できるか。プライバ
シーに関わるかなどで分類。

開発パートナーと製品化

Telefónica が最初に製品化
世界 5 位のキャリア
最初はブラジルで発売予定
Qualcomm ローエンドチップ
現在は Dev Phone by ZTE
コードネームは「うなぎ」

Open Web Device パートナー

現時点で公表済みの一部パートナーのみ。続報は来月ね。

スマホ OS の Web 度

iOS:
WebView は速度 1/3 制限あり
Android:
WebView 埋め込みでハイブリッド

？
Tizen, Ubuntu:
HTML5 でもアプリ開発可能
Firefox OS:
HTML5 に最適化設計された OS

下に行くほど Web 技術の活用範囲が広い

ステキなモバイル OS はどれ？

Web 技術の最適化 ◎ ○ ×
マーケットの自由度 ◎ ○ ×
製品化の自由度 ◎ ○ ×
オープン ◎ ○ *1
×
アプリの権限管理 ◎ × ○
PC/Mobile 共通アプリ ◎ × ×
ネイティブアプリ × ◎ ◎
開発者コミュニティ 8000K 450K 100K
*1 できあがってから部分的にだけ公開する Delayed Open
*1 タブ毎のプロセス分離の弊害 *2 デフォルトブラウザは OS 側に含まれるため

ステキ。

僕もスマホになって君と
一緒にお出かけしたいな！

Marketplace

Open Web Apps...

まーけっと？

Web アプリの配信方法は？

Firefox Marketplace

Device, OS 横断マーケット
Web Platform のためのストア
Firefox 限定にならない設計
現在テスター向け公開中
対象は Firefox OS と Android 版
Firefox Aurora/Nightly
PC で見るには UA 書き換え...

https://marketplace.firefox.com/

オープンなアプリストア

全てを Web 技術で実装
安定・平等な環境を提供
どこでも配信＆インストール
ベンダー非依存
Firefox Marketplace 以外にも
ストア、認証、課金も自由に

https://marketplace.firefox.com/

Android に HTML5 アプリ環境

マルチデバイスマーケット
PC, Android, Firefox OS...
Web App = Native App に
ホームスクリーンへの追加や
独立してフル画面起動など
ネイティブ同様の利用体験
Firefox = WebRT for Android

ホームにインストール、アプリを起動した画面、マーケットをブラウズ

WWeebb だから
どこにでも！

Web らしいシステムだね！

Apps Dev

Open Web Apps...

Firefox OS のアプリ開発

Web アプリです。

大事なこと３回
いつもと一緒で
あんしんだね！

Firefox OS Simulator

再起動不要の拡張機能
https://addons.mozilla.org/ja/
ﬁrefox/addon/ﬁrefox-os-simulator/
ポチッと押すだけ
Web 開発メニューに追加される
Firefox デスクトップビルド＋
プロファイル＋Alpha

https://github.com/dynamis/firefoxos/wiki/simulator

GAIA Building Blocks (UI 部品)

Gaia (Firefox OS 標準) Apps
のデザインを簡単に作れる
https://wiki.mozilla.org/Gaia/
Design/BuildingBlocks
使っても使わなくても OK
好きな SDK/Library 使える
自由な Web ですから！

http://mozilla-b2g.github.com/Gaia-UI-Building-Blocks/

実機で開発したい？

僕の手でも使えるかな？

Developer Preview Phone

Telefónica と Geeksphone で作られた開発者向けテスト端末

Developer Preview Phone

2013/02 発売予定
Keon:
Snapdragon 1GHz, 4GB ROM,
512MB RAM, 3.5" HVGA
Peak:
Snapdragon 1.2GHz x2, 4GB ROM,
512MB RAM, 4.3" qHD

http://www.geeksphone.com/

もっと知りたい？

僕はもっと知りたい！

Firefox OS コミュニティを！

http://FxOS.org/
(https://groups.google.com/group/
ﬁrefoxos にリダイレクト)

http://FxOS.org/wiki
(https://github.com/dynamis/ﬁrefoxos/
wiki にリダイレクト)

みんな参加してね。
みんなよろしく！

開発者ツール紹介

一通りの機能と使い方
Firefox 標準の開発者ツール
隠し設定やビルトイン関数のリ
ファレンスなども含めています
Firebug とその拡張機能
アイコンや背景画像を変更する
カスタマイズにも言及してます

http://r.dynamis.jp/devtools

CSS 最新機能紹介

CSS の新機能紹介
新機能や昨年から変わった点

http://r.dynamis.jp/css2012

JavaScript.Next

JavaScript の最新仕様
ECMAScript 5th のポイント
JavaScript 次世代仕様
ECMAScript 6th や Harmony

http://r.dynamis.jp/jsnext

セキュリティ関連機能紹介

セキュリティ大事！
知っておくべき機能です
Content Security Policy
次世代セキュリティポリシー
Same Origin Policy はもう古い

http://r.dynamis.jp/sec

Firefox OS

Recommended

More Related Content

Similar to Firefox OS (20)

More from dynamis (20)

Firefox OS