Firefox OS and Open Web Board - IGGG Meetup 2015 Spring

Firefox OS + Open Web Board
群馬大学工学部情報工学科 B4 仲野裕文
2015/05/03
群馬大学工学部情報工学科 B4 仲野裕文 Firefox OS + Open Web Board 2015/05/03 1 / 26

自己紹介
About:me
基本情報
名前: 仲野裕文 (ナカノヒロフミ)
通称: すぱさん (スパゲッティのような髪癖が由来)
専攻: 情報工学科 4 年ソフトウェア工学 F 研究室所属
役職: IGGG のエバンジェリスト (自称:宣伝本部長)
出身: 海外 (アルゼンチン、ウルグアイ、中国、マダガスカル)
補足情報
夜中にサイクリング (眠れない夜に思いつきから始まる)
自然の写真など、人は脇役の写真を撮るのが好き
研究室でのテーマは、定理証明支援器 Coq。(使い方の勉強中)

最近、頭から離れないこと
Figure: Youtube からのスクリーンショット

1 Firefox OS とは
2 Firefox OS 搭載デバイス
3 アプリの開発方法
4 Demonstration
5 Open Web Board
6 最後に

Firefox OS との出会い
出会いは、そう、
Gunma.web #18 の「Firefox OS の紹介」 by @ic lifewood さん
から始まった…
はじめは、「ブラウザってハードウェアの情報読み取れるの？」という疑
問があったが…

Firefox OS とは
Firefox OS とは
Firefox OS とは
「Firefox OS(Boot to Gecko または B2G のコードネーム) は Mozilla の
オープンソースモバイル OS です。それは、Gecko ベースのランタイム環
境が起動し、オープン Web アプリがインストール・起動できる Linux
ベースの OS です」a
a
Firefox OS アプリセンタークイックスタートより
※ Gecko は、「Gecko はFirefox が Web コンテンツを表示・レンダリング
に利用しているレンダリングエンジンです。1」
1
Firefox OS アプリセンタークイックスタートより

Firefox OS とは
Firefox OS とは
つまり、Firefox OS の上で走るのは、Web アプリ。ウェブサイトを作る
言語で書ける。
そして、今までパソコンのブラウザ上で動くアプリしか開発できなかった
ウェブプログラマ、デザイナーがスマホを WebAPI(コンテンツ、データ、
デバイスハードウェアまで扱えるインターフェース) を用いて幅広い！

Firefox OS 搭載デバイス
List of Devices with Firefox OS
スマートフォン
スマートテレビ

Firefox OS 搭載スマートフォン
日本国内では、KDDI が Fx0
を販売。
日本を含む 28 カ国、14 機種
が既に販売されている。

Firefox OS 搭載スマートテレビ
Panasonic ビエラ 4K
CX800, CX800N, CX700 シリーズに搭載！発売は、今年 5 月下旬！
Panasonic ケーブルテレビセットトップボックス
Boot to Gecko OS(Firefox OSのノーブランド版) を搭載したケーブルテ
レビセットトップボックスがすでに販売中

Figure: engadget 日本版より

Figure: Panasonic プレスリリースより

アプリの開発方法
How to Develop App for Firefox OS
Firefox OSのアプリ開発方法は、3 つあります。
WebIDE
デスクトップ版 Firefox の「開発」内から。
プロジェクト作成、エディタ、シミュレータが付属する統合開発環境。
Framin
スマートフォンからスマートフォンのアプリを開発することができる。
自分でアプリを作って、自分の端末にインストールができる。
Mozilla AppMaker
ウェブブラウザ上からFirefox OS 向けのアプリを開発できるツール。
ページアクセスと同時に開発ができる。

WebIDE
Firefox OSアプリの開発方法 1: WebIDE
Figure: WebIDE とシミュレータのスクリーンショット

WebIDE
WebIDE: エディタはご自由に
WebIDE でプロジェクトを作成後は、使っているコンピュータのディレ
クトリにすでにある。
よって、
エディタはご自由に
自分が好んで使っているエディタで編集することが可能！
さらに、プロジェクト自体も自分で作成ができる。Firefox OS アプリを
作るための最低限のファイルを含めれば、WebIDE でシミュレータにイ
ンストールできる！

Firefox OS のアプリに必要なもの
manifest.webapp(アプリ情報に関するファイル JSON)
アイコン (アプリのアイコン)
Web アプリ本体
HTML
JavaScript
CSS
以上の 3 つがあれば最低限のアプリは作成可能！
HTML + JS + CSS + manifest = App!

Framin
Firefox OSアプリの開発方法 2: Framin
Figure: Framin のスクリーンショット

Mozilla AppMaker
Firefox OSアプリの開発方法 3: Mozilla AppMaker
Figure: Mozilla AppMaker のスクリーンショット

アプリの配布方法
作ったアプリを公開する方法！
アプリの種類
パッケージ型アプリ
ホスト型アプリ
アプリの配布方法
Firefox Marketplace での配布
セルフホスティングでの配布 (制限がかかる)
※セルフホスティングでの配布は、GitHub、Heroku, Google App Engine
などで配布できる。
※ただし、権限の必要な API を使う場合は、Marketplace からのみ配布
可能。

Demonstration
Demonstration
Firefox OS のアプリを作ってみた！
Windows でFirefox 入れてアプリを作ってみた
お題は、今話題のあのふ・た・りで○○○○○○○○！
※ WebAudio API を使って、img タグをクリックすると特定の音が流れるアプリを紹介。

Open Web Board
Open Web Board
OpenWebBoard とは、何？
Open Web Board とは
「Open Web Board は、Firefox OS を搭載した HDMI ドングル型開発ボー
ドです。USB ホスト機能を搭載し、マウスやキーボード、カメラ、オー
ディオ、USB シリアル機器などをFirefox OS から利用することができま
す。また、ネットワーク機能として無線 LAN、BT(Bluetooth)、
BLE(Bluetooth Low Energy) を搭載し、センサー機器と通信することも可
能です。簡単な Web 技術で様々な周辺機器を活用したアプリケーション
開発にご利用いただけます。」a
a
KDDI Firefox OS Portal Site より

Open Web Board
Open Web Board
Open Web Board とは、何??
「また本デバイスに関するソースコードなどのソフトウェア、技術情報を
公開し、Firefox OS 上でアプリケーションを作成するのみでなく、様々
な活用方法を広げていくことを指向するデバイスです。」a
a
KDDI Firefox OS Portal Site より
要は、使い道は自由！
アイディア次第で、Open Web Board は何でも使える！

Open Web Board
私が考える Open Web Board とは
My idea to Open Web Board
画面出力が HDMI からできるため、テレビを用いた拡張性が強いとみた。
今のテレビは、テレビを視聴することしかできない。
テレビに OS を入れて販売するには時間がかかる。
HDMI であれば、いち早くテレビにテレビ以上のエンターテインメント
を提供できるのではないか。

最後に
Special Thanks
Special Thanks to... Akihiko Kigure! @ic lifewood
深夜の Facebook で参加を決定してヘルプしてくれた兄貴！

最後に
ご清聴ありがとうございました。

最後に
参考にした資料
「Firefox OS の紹介」 http://www.slideshare.net/AkihikoKigure/20150117-gunmaweb-firefox-os
「Firefox OS Expands to Nearly 30 Countries」
https://blog.mozilla.org/blog/2014/12/16/firefox-os-expands-to-nearly-30-countries/
「Mozilla Press Center(画像)」https://blog.mozilla.org/press/media-library/screenshots/
「Panasonic プレスリリース」
http://news.panasonic.com/press/news/data/2015/04/jn150402-1/jn150402-1.html

Firefox OS and Open Web Board - IGGG Meetup 2015 Spring

Recomendados

Recomendados

Mais conteúdo relacionado

Mais procurados

Mais procurados (8)

Destaque

Destaque (7)

Semelhante a Firefox OS and Open Web Board - IGGG Meetup 2015 Spring

Semelhante a Firefox OS and Open Web Board - IGGG Meetup 2015 Spring (20)

Firefox OS and Open Web Board - IGGG Meetup 2015 Spring