SlideShare a Scribd company logo
1 of 14
HTML5が
デバイス使えるよう
になるって
どーゆーこと?
関西オープンフォーラム2012
2012.11.9
HTML5J.ORG
こまつけんさく
WHAT’S HTML5J.ORG?
ビジョン
 • 世界のWebシーンをリードする日
   本

活動指針:
 • 「つながる」「学べる」「盛り上
   がる」
 • 日本のHTML5技術者のハブとなる

活動内容:
 • 毎月、勉強会を開催 (100人規模)
 • 年に一回カンファレンス (1000人   http://html5j.org
   規模)
 • 地方活動も始めました!
 • 標準化団体(W3C)とも連携し、
   世界へ!!
自己紹介
Official works in NTT Communications
  • リサーチエンジニア
  • 最新Web技術の研究開発
  • 標準化活動 in W3C
Personal works in Community
  • html5j.orgスタッフ
  • Google API Expert (HTML5)
  • Microsoft Valuable Professional (IE)


Blog : http://blog.livedoor.jp/kotesaki/
Twitter : http://twitter.com/komasshu
http://www.flickr.com/photos/creative_tools/5832414882/




HTML5とマルチデバイス
ビューワーとしての
マルチデバイス
            Webサーバー
クラウドとデバイスの連携



       Web Intents




       Web Intents
DEMO TIME!!
CAMERA TO BROWSER
YOUTUBE TO TV
ポイント
それぞれのデバイスをWebアプリとして
        扱う




       同じ仕組みで、
  クラウドもデバイスも扱える
例えばYOUTUBE TO TV
の場合
クラウドアプリ:YouTube                 デバイスアプリ:TV Controller

                  Video URL /
                     VIEW




                  Web Intents

                                                 DLNA
 Web-API



 Video
Database
TV CONTROLLERの
 ちょっと深イイ話
                                  Chrome Packaged Apps
デバイスアプリ:TV Controller             (Background Web Srv)
                                            Service
                         URL               Discovery

                                            SOAP

                        Web-API             Reverse
                                             Proxy
DEVICE ORCHESTRATION!!




http://www.flickr.com/photos/ewang0692/6919870763/
座談会アジェンダ
1.   パネラー自己紹介
2.   HTML5技術のカバーエリア広がってるね!
     •   テレビ、カーナビ、サイネージ、・・・・・・・

1.   HTML5のデバイス利用 どんなAPIがあるの?
     •   Geolocation、Orientation Event、Vibration
     •   getUserMedia, MediaCapture (カメラ系)
     •   Network Information API (3GとかWifi接続検知)
     •   Battery Status API (バッテリー残量)
     •   USB API、Bluetooth API、Raw Socket API、
     •   Network Service Discovery API、 Web Intents Addendum
     •   ….

2.   Webとデバイスの今後の動向、どうやって勉強する?

More Related Content

Viewers also liked

9 oncologic research
9   oncologic research9   oncologic research
9 oncologic research
Juan R Farro
 
9ª olimpiada conalep 2012
9ª olimpiada conalep   20129ª olimpiada conalep   2012
9ª olimpiada conalep 2012
megaradioexpress
 
9. papan proyek panyuran
9. papan proyek  panyuran9. papan proyek  panyuran
9. papan proyek panyuran
pnpm-panyuran
 
레드9카지노 싸이트 『OX600』。『COM』바카라 싸이트
레드9카지노 싸이트 『OX600』。『COM』바카라 싸이트레드9카지노 싸이트 『OX600』。『COM』바카라 싸이트
레드9카지노 싸이트 『OX600』。『COM』바카라 싸이트
sdhfisjuh
 
9_settembre_2014_folder tutto bio.pdf
9_settembre_2014_folder tutto bio.pdf9_settembre_2014_folder tutto bio.pdf
9_settembre_2014_folder tutto bio.pdf
tuttobiosi
 
9p1 seating plan
9p1 seating plan9p1 seating plan
9p1 seating plan
MrMJSmith
 

Viewers also liked (16)

9 oncologic research
9   oncologic research9   oncologic research
9 oncologic research
 
9 storyboard
9 storyboard9 storyboard
9 storyboard
 
9ª olimpiada conalep 2012
9ª olimpiada conalep   20129ª olimpiada conalep   2012
9ª olimpiada conalep 2012
 
9th Class Result 2016 Lahore Board Available Soon At pkresult.com
9th Class Result 2016 Lahore Board Available Soon At pkresult.com9th Class Result 2016 Lahore Board Available Soon At pkresult.com
9th Class Result 2016 Lahore Board Available Soon At pkresult.com
 
9ª SESSÃO EXTRAORDINÁRIA - 13/10/2014
9ª SESSÃO EXTRAORDINÁRIA - 13/10/20149ª SESSÃO EXTRAORDINÁRIA - 13/10/2014
9ª SESSÃO EXTRAORDINÁRIA - 13/10/2014
 
9° practica
9° practica9° practica
9° practica
 
9. papan proyek panyuran
9. papan proyek  panyuran9. papan proyek  panyuran
9. papan proyek panyuran
 
9 tissues
9   tissues9   tissues
9 tissues
 
레드9카지노 싸이트 『OX600』。『COM』바카라 싸이트
레드9카지노 싸이트 『OX600』。『COM』바카라 싸이트레드9카지노 싸이트 『OX600』。『COM』바카라 싸이트
레드9카지노 싸이트 『OX600』。『COM』바카라 싸이트
 
9-PROCESADO DIGITAL
9-PROCESADO DIGITAL9-PROCESADO DIGITAL
9-PROCESADO DIGITAL
 
9 weebly
9   weebly9   weebly
9 weebly
 
9. prepositions tong hop
9. prepositions tong hop9. prepositions tong hop
9. prepositions tong hop
 
9_settembre_2014_folder tutto bio.pdf
9_settembre_2014_folder tutto bio.pdf9_settembre_2014_folder tutto bio.pdf
9_settembre_2014_folder tutto bio.pdf
 
9p1 seating plan
9p1 seating plan9p1 seating plan
9p1 seating plan
 
9 things you can do when employer requires experience and you have none
9 things you can do when employer requires experience and you have none9 things you can do when employer requires experience and you have none
9 things you can do when employer requires experience and you have none
 
(9) Wedding Cake
(9) Wedding Cake(9) Wedding Cake
(9) Wedding Cake
 

Similar to 9th nov2012 kof2012

HTML5とWeb開発に関する最新動向
HTML5とWeb開発に関する最新動向HTML5とWeb開発に関する最新動向
HTML5とWeb開発に関する最新動向
Shumpei Shiraishi
 
HTML5時代のwebクリエイターに必要なこと
HTML5時代のwebクリエイターに必要なことHTML5時代のwebクリエイターに必要なこと
HTML5時代のwebクリエイターに必要なこと
Masakazu Muraoka
 
Html5時代のクリエイターのあり方
Html5時代のクリエイターのあり方Html5時代のクリエイターのあり方
Html5時代のクリエイターのあり方
Masakazu Muraoka
 
はじめてのWeb of Things
はじめてのWeb of ThingsはじめてのWeb of Things
はじめてのWeb of Things
Saki Homma
 
オフラインファーストの思想と実践
オフラインファーストの思想と実践オフラインファーストの思想と実践
オフラインファーストの思想と実践
Shumpei Shiraishi
 
Firefox OS - Blaze Your Own Path
Firefox OS - Blaze Your Own PathFirefox OS - Blaze Your Own Path
Firefox OS - Blaze Your Own Path
dynamis
 
リモートデバッグツール Weinerをつかってみた
リモートデバッグツール Weinerをつかってみたリモートデバッグツール Weinerをつかってみた
リモートデバッグツール Weinerをつかってみた
Masakazu Muraoka
 

Similar to 9th nov2012 kof2012 (20)

WebIntentsにより拓かれる次のWeb
WebIntentsにより拓かれる次のWebWebIntentsにより拓かれる次のWeb
WebIntentsにより拓かれる次のWeb
 
HTML5とWeb開発に関する最新動向
HTML5とWeb開発に関する最新動向HTML5とWeb開発に関する最新動向
HTML5とWeb開発に関する最新動向
 
HTML5ハイブリッドアプリ開発のベストプラクティス
HTML5ハイブリッドアプリ開発のベストプラクティスHTML5ハイブリッドアプリ開発のベストプラクティス
HTML5ハイブリッドアプリ開発のベストプラクティス
 
HTML5時代のwebクリエイターに必要なこと
HTML5時代のwebクリエイターに必要なことHTML5時代のwebクリエイターに必要なこと
HTML5時代のwebクリエイターに必要なこと
 
Web OSで可能になる世界
Web OSで可能になる世界Web OSで可能になる世界
Web OSで可能になる世界
 
ブラウザからWeb OSへ〜Web - TV連携事例からその可能性を探る〜
ブラウザからWeb OSへ〜Web - TV連携事例からその可能性を探る〜ブラウザからWeb OSへ〜Web - TV連携事例からその可能性を探る〜
ブラウザからWeb OSへ〜Web - TV連携事例からその可能性を探る〜
 
Html5時代のクリエイターのあり方
Html5時代のクリエイターのあり方Html5時代のクリエイターのあり方
Html5時代のクリエイターのあり方
 
Leading the way to W3C TPAC 2015 『HTML5 関連の API の現状とこれから』
Leading the way to W3C TPAC 2015 『HTML5 関連の API の現状とこれから』Leading the way to W3C TPAC 2015 『HTML5 関連の API の現状とこれから』
Leading the way to W3C TPAC 2015 『HTML5 関連の API の現状とこれから』
 
Data API + AWS = (CMS どうでしょう 札幌編)
Data API + AWS =  (CMS どうでしょう 札幌編)Data API + AWS =  (CMS どうでしょう 札幌編)
Data API + AWS = (CMS どうでしょう 札幌編)
 
JavaScript And Keywords
JavaScript And KeywordsJavaScript And Keywords
JavaScript And Keywords
 
Platform.html5
Platform.html5Platform.html5
Platform.html5
 
Kilimanjaro Event
Kilimanjaro EventKilimanjaro Event
Kilimanjaro Event
 
はじめてのWeb of Things
はじめてのWeb of ThingsはじめてのWeb of Things
はじめてのWeb of Things
 
20140902 HTML5認定試験紹介資料
20140902 HTML5認定試験紹介資料20140902 HTML5認定試験紹介資料
20140902 HTML5認定試験紹介資料
 
オフラインファーストの思想と実践
オフラインファーストの思想と実践オフラインファーストの思想と実践
オフラインファーストの思想と実践
 
Firefox OS - Blaze Your Own Path
Firefox OS - Blaze Your Own PathFirefox OS - Blaze Your Own Path
Firefox OS - Blaze Your Own Path
 
クラウドサービスを使って作る動画サイト?
クラウドサービスを使って作る動画サイト?クラウドサービスを使って作る動画サイト?
クラウドサービスを使って作る動画サイト?
 
リモートデバッグツール Weinerをつかってみた
リモートデバッグツール Weinerをつかってみたリモートデバッグツール Weinerをつかってみた
リモートデバッグツール Weinerをつかってみた
 
Dropbox APIなどを使って制作を効率化しよう@関西オープンフォーラム
Dropbox APIなどを使って制作を効率化しよう@関西オープンフォーラムDropbox APIなどを使って制作を効率化しよう@関西オープンフォーラム
Dropbox APIなどを使って制作を効率化しよう@関西オープンフォーラム
 
HTML5によるモバイルアプリ開発 が拓拓くビジネスチャンス
HTML5によるモバイルアプリ開発 が拓拓くビジネスチャンスHTML5によるモバイルアプリ開発 が拓拓くビジネスチャンス
HTML5によるモバイルアプリ開発 が拓拓くビジネスチャンス
 

More from Kensaku Komatsu

More from Kensaku Komatsu (20)

Media processing with serverless architecture
Media processing with serverless architectureMedia processing with serverless architecture
Media processing with serverless architecture
 
Boxdev lt-09082016
Boxdev lt-09082016Boxdev lt-09082016
Boxdev lt-09082016
 
a pattern for PWA, PRPL
a pattern for PWA, PRPLa pattern for PWA, PRPL
a pattern for PWA, PRPL
 
Full Matrix Auto Test Framework for WebRTC
Full Matrix Auto Test Framework for WebRTCFull Matrix Auto Test Framework for WebRTC
Full Matrix Auto Test Framework for WebRTC
 
WebRTC 101
WebRTC 101WebRTC 101
WebRTC 101
 
04122016 web rtc_globalsummit
04122016 web rtc_globalsummit04122016 web rtc_globalsummit
04122016 web rtc_globalsummit
 
02172016 web rtc_conf_komasshu
02172016 web rtc_conf_komasshu02172016 web rtc_conf_komasshu
02172016 web rtc_conf_komasshu
 
SkyWay国内唯一のCPaaS
SkyWay国内唯一のCPaaSSkyWay国内唯一のCPaaS
SkyWay国内唯一のCPaaS
 
ラズパイでWebRTC ヾ(*´∀`*)ノキャッキャ uv4l-webrtc 軽くハックしてみたよ!
ラズパイでWebRTC ヾ(*´∀`*)ノキャッキャ    uv4l-webrtc 軽くハックしてみたよ!ラズパイでWebRTC ヾ(*´∀`*)ノキャッキャ    uv4l-webrtc 軽くハックしてみたよ!
ラズパイでWebRTC ヾ(*´∀`*)ノキャッキャ uv4l-webrtc 軽くハックしてみたよ!
 
ビデオ通話・P2Pがコモディティ化する世界 WebRTCによるこれからを探る
ビデオ通話・P2Pがコモディティ化する世界 WebRTCによるこれからを探るビデオ通話・P2Pがコモディティ化する世界 WebRTCによるこれからを探る
ビデオ通話・P2Pがコモディティ化する世界 WebRTCによるこれからを探る
 
最新Web 通信系API総まくり!WebRTC, Streams, Push api etc.
最新Web 通信系API総まくり!WebRTC, Streams, Push api etc.最新Web 通信系API総まくり!WebRTC, Streams, Push api etc.
最新Web 通信系API総まくり!WebRTC, Streams, Push api etc.
 
FirefoxでgetStats()
FirefoxでgetStats()FirefoxでgetStats()
FirefoxでgetStats()
 
14th apr2015 リックテレコ勉強会
14th apr2015 リックテレコ勉強会14th apr2015 リックテレコ勉強会
14th apr2015 リックテレコ勉強会
 
WebRTCが拓く 新たなWebビジネスの世界
WebRTCが拓く新たなWebビジネスの世界WebRTCが拓く新たなWebビジネスの世界
WebRTCが拓く 新たなWebビジネスの世界
 
Web of Thingsの現状とWebRTC活用の可能性
Web of Thingsの現状とWebRTC活用の可能性Web of Thingsの現状とWebRTC活用の可能性
Web of Thingsの現状とWebRTC活用の可能性
 
25th nov2014 52thhtml5j
25th nov2014 52thhtml5j25th nov2014 52thhtml5j
25th nov2014 52thhtml5j
 
知ってると得するかもしれないConstraintsたち
知ってると得するかもしれないConstraintsたち知ってると得するかもしれないConstraintsたち
知ってると得するかもしれないConstraintsたち
 
WebRTCにより可視化されるリアルタイムクラウド。求められるAPI
WebRTCにより可視化されるリアルタイムクラウド。求められるAPI WebRTCにより可視化されるリアルタイムクラウド。求められるAPI
WebRTCにより可視化されるリアルタイムクラウド。求められるAPI
 
エフサミ2014 web rtcの傾向と対策
エフサミ2014 web rtcの傾向と対策エフサミ2014 web rtcの傾向と対策
エフサミ2014 web rtcの傾向と対策
 
HTML5 Night 2014 Web x Network Technology ( WebRTC )
HTML5 Night 2014 Web x Network Technology ( WebRTC )HTML5 Night 2014 Web x Network Technology ( WebRTC )
HTML5 Night 2014 Web x Network Technology ( WebRTC )
 

9th nov2012 kof2012