HTML5の現在と未来HTML5といえば「カヤックHTMLファイ部」

HTMLファイ部　比留間 和也・神代 友行

13年4月23日火曜日

自己紹介

•面白法人カヤックHTMLファイ部所属比留間 和也

•最近はJSばっかりで、あんまりHTML書いてません。

13年4月23日火曜日

自己紹介

•面白法人カヤックHTMLファイ部所属神代 友行

•Webアプリをメインに開発しています

13年4月23日火曜日

事例紹介

13年4月23日火曜日

デリカD:5 クリーンディーゼル インフォグラフィックスカタログ

13年4月23日火曜日

ジオプリ島とインクの妖精たち

13年4月23日火曜日

JAL SKY SHARE

13年4月23日火曜日

WBCセカンドスクリーンサイト

13年4月23日火曜日

カヤックではキャンペーンがメイン

13年4月23日火曜日

ですが、カヤック HTMLファイ部ではいつもHTML5の可能性を模索しています。

13年4月23日火曜日

HTML5でつくるWebアプリ事情

13年4月23日火曜日

Agenda

• 世界の事例

• KAYACの事例

• 作って分かったこと

• メリット / デメリット

13年4月23日火曜日

世界の事例

13年4月23日火曜日

sun

• 天気アプリ

• ホームアイコン化必須

http://pattern.dk/sun/

13年4月23日火曜日

sun

• 天気アプリ

• ホームアイコン化必須

http://pattern.dk/sun/

13年4月23日火曜日

TabTimes

• ニュースアプリ

• タブレット特化

http://tabtimes.com/

13年4月23日火曜日

TabTimes

• ニュースアプリ

• タブレット特化

http://tabtimes.com/

13年4月23日火曜日

Financial Times

• ニュースアプリ

• iOSアプリからの移行で成功

http://apps.ft.com/

13年4月23日火曜日

Financial Times

• ニュースアプリ

• iOSアプリからの移行で成功

http://apps.ft.com/

13年4月23日火曜日

Fastbook

• sencha touch FWのfacebook viewer

• 実験アプリ

http://fb.html5isready.com/

13年4月23日火曜日

Fastbook

• sencha touch FWのfacebook viewer

• 実験アプリ

http://fb.html5isready.com/

13年4月23日火曜日

KAYACの事例

13年4月23日火曜日

aquoria

• 友達同士で写真を共有するアプリ

• Native アプリを意識したUI

• Webアプリに最適な機能、UIを検証しつつプロジェクト進行中

http://aquoria.com

13年4月23日火曜日

aquoria

• 友達同士で写真を共有するアプリ

• Native アプリを意識したUI

• Webアプリに最適な機能、UIを検証しつつプロジェクト進行中

http://aquoria.com

13年4月23日火曜日

13年4月23日火曜日

Webアプリのメリット・デメリット

13年4月23日火曜日

メリット• マーケットの課金手数料不要

• クロスプラットフォーム

• アプリ審査なし

13年4月23日火曜日

メリット• マーケットの課金手数料不要

• クロスプラットフォーム

• アプリ審査なし

◯

△

◯

13年4月23日火曜日

メリット• マーケットの課金手数料不要

• クロスプラットフォーム

• アプリ審査なし

• ダウンロード不要

◯

△

◯

◯

13年4月23日火曜日

デメリット• パフォーマンスが悪くなりがち

• 端末機能の利用に制限あり( ex. push通知)

• マーケットで発見されにくい

• HTML5の仕様変更の可能性あり

13年4月23日火曜日

デメリット• パフォーマンスが悪くなりがち

• 端末機能の利用に制限あり( ex. push通知)

• マーケットで発見されにくい

• HTML5の仕様変更の可能性あり

◯

△

✕

✕

13年4月23日火曜日

Webアプリは実際どうだったか？

13年4月23日火曜日

大変 (´・ω・｀)

13年4月23日火曜日

• 端末の種類がたくさん

• パフォーマンスが悪くなりがち

• 機能は制限される .....

13年4月23日火曜日

Native app = Web アプリ

13年4月23日火曜日

Native app ≠ Webアプリ

13年4月23日火曜日

Webアプリ最適化

・Native appの良さを踏襲しつつ

・Webに最適な機能、UIに変えていく

13年4月23日火曜日

HTML5を利用して新しいWebアプリの形を模索しています

13年4月23日火曜日

楽しいよ！(*´∀｀*)

13年4月23日火曜日

smart TV

car navigation

Firefox OShttp://realgeekstech.com/zte-open-is-first-phone-to-run-firefox-os/ http://www.samsung.com/us/2012-smart-tv/img/intro-smartHubTV.png

http://www.atpress.ne.jp/releases/31512/v_1.png

13年4月23日火曜日

楽しいよ！(*´∀｀*)

13年4月23日火曜日

HTML5の未来

13年4月23日火曜日

クラウド API オフライン API

WebGL

Web Socket

NSD API

Device API

13年4月23日火曜日

Device free!Place free!

13年4月23日火曜日

例えば13年4月23日火曜日

PCで記事を読み始め13年4月23日火曜日

電車内ではiPadを使って続きを読み

13年4月23日火曜日

待ち合わせ場所ではiPhoneで読み続ける

13年4月23日火曜日

アプリではなく

「体験」の提供

13年4月23日火曜日

パフォーマンスが悪い？ 制約が多い？

13年4月23日火曜日

Web業界の変化のスピードはまさに日進月歩

asm.js

Blink

Servo

13年4月23日火曜日

どこにフォーカスすればいいの？

13年4月23日火曜日

HTML5関連API群出典: http://www.slideshare.net/dynamis/firefox-os-html5j

13年4月23日火曜日

HTML5関連API群出典: http://www.slideshare.net/dynamis/firefox-os-html5j

範囲が広すぎる

13年4月23日火曜日

HTML5でなにができるのか、

を考えるのではなく、

HTML5でなにをしたいのか。

13年4月23日火曜日

FULL CONTROL tokyo13年4月23日火曜日

なにができるかではなく、なにを作るか。

13年4月23日火曜日

ご静聴ありがとうございました

13年4月23日火曜日