HTML5は本当にFlashの代替になり得るのか?~Webテクノロジー進化論

65,068 views
64,827 views

Published on

第20回 RIAコンソーシアム・ビジネスセミナー「Flash」はその役割を終えたのか~今後のRIA開発を考える~
http://www.riac.jp/2012/01/bflash-ria.html

でつかった資料

Published in: Technology
5 Comments
113 Likes
Statistics
Notes
No Downloads
Views
Total views
65,068
On SlideShare
0
From Embeds
0
Number of Embeds
1,955
Actions
Shares
0
Downloads
377
Comments
5
Likes
113
Embeds 0
No embeds

No notes for slide

HTML5は本当にFlashの代替になり得るのか?~Webテクノロジー進化論

  1. 1. RIAコンソーシアム [B]セミ | 2012.02.20 HTML5は本当にFlashの代替になり得るのか? 〜Webテクノロジー進化論 太田禎一 | アドビ システムズ 株式会社 テクニカルエバンジェリスト ちなみにわし ダーウィンだから よろしく© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.Photo: C. G. P. Grey http://www.cgpgrey.com/
  2. 2. おまえダレ?  テクニカルエバンジェリストです。正式な肩書きなのですごめんなさい  放送・出版・デジタルメディアを中心に、いろいろなお客様に最新 Adobeテクノロジーや、そのよさをお伝えする仕事  直接お伺いしたり、イベント・カンファレンスでお話したり© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 2
  3. 3. はじめに…© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 3
  4. 4. 大事なことなので何度でも言います 普及率なめんな。© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 4
  5. 5. Flash Playerの普及率 Millward Brown調べ1 (2011.06) RIASTATS調べ2 (2012.02) Flash Player 10+ Flash Player 10+ 98.9% (Japan) 86.37% (Japan) ※PCのみ ※スマホ・タブレット含む 5© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.Source: 1http://www.adobe.com/products/flashplatformruntimes/statistics.displayTab3.html 2http://riastats.com/
  6. 6. ダーウィン&ウォレスの自然選択説 自然選択説(しぜんせんたくせつ、英: natural selection)とは、進化を説 明するうえでの根幹をなす理論。厳しい自然環境が、生物に無目的に起き る変異(突然変異)を選別し、進化に方向性を与えるという説。1859年に チャールズ・ダーウィンとアルフレッド・ウォレスによってはじめて体系 化された。自然淘汰説(しぜんとうたせつ)ともいう。© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 6Link: http://ja.wikipedia.org/wiki/%E8%87%AA%E7%84%B6%E9%81%B8%E6%8A%9E%E8%AA%AC
  7. 7. ダーウィンフィンチ 1970年 - 80年代に観察された自然選択の例。長い乾期によってダーウィン フィンチが主食にしていた木の実が少なくなると、堅い実を食べるのに適 した大きな嘴を持った個体が選択的に生き残った。その後、大雨で食料が 増えると、大きな嘴を持つ個体は(体の維持などの点で)不利となり、全 体の平均的な体格は縮小する傾向を示した。単純に体格や嘴の平均値が変 化するだけではなく、性選択の影響も同時に受け、複数の小グループに収 斂する様子も観察されている。© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 7Link: http://ja.wikipedia.org/wiki/%E8%87%AA%E7%84%B6%E9%81%B8%E6%8A%9E%E8%AA%AC
  8. 8. 選択圧 自然環境は急激に変化することはまれであるため、特定の方向に選択を偏 らせることがある。例えば砂漠では砂色の体が保護色となる 、発汗が抑え られわずかな水分を有効利用する、あるいは夜行性となるなどが生存に有 利に働く。このように実際に生存率に差をもたらす自然環境の力を選択圧 と言う。生息する環境が異なれば、生物は異なる選択圧を受ける。生物は 常に様々な選択圧に晒されており、また一つの性質に対して複数の選択圧 が働くのが普通である。© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 8Link: http://ja.wikipedia.org/wiki/%E8%87%AA%E7%84%B6%E9%81%B8%E6%8A%9E%E8%AA%AC
  9. 9. なんでダーウィン? Webテクノロジーが 生息する環境に注目し そこにどのような選択圧が存在するのかを 理解すると、今後なにが生き残るのかが 見えてくるはず、きっと。© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 9
  10. 10. Webテクノロジーの選択圧とは? 1. 普及率=リーチ! 2. 機能・性能 3. ユニークな価値© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 10
  11. 11. 「Webテクノロジー進化論」 以下の選択圧に適応したWebテクノロジーはその環境 で生き残り、進化をつづける 1. 少しでも広くリーチできるテクノロジーが生き残る (機能の優劣は決定打ではない) 2. もしも同程度のリーチなら機能・性能が高いテクノ ロジーが生き残る 3. ただし、他では得られないユニークな価値を提供で きるテクノロジーはニッチとして、あるいは住処を変 えて長く生き残る© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 11
  12. 12. たとえばオンラインビデオ© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 12
  13. 13. たとえば「マルチメディア」© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 13
  14. 14. で、今日のお題「HTML5は本当にFlashの代替になり得るのか?」© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 14
  15. 15. HTMLテクノロジーのザックリとした進化とその現状 PC ブラウザ スマートフォン ブラウザ スマートフォン アプリ© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 15
  16. 16. Flashテクノロジーのザックリとした進化とその現状 最初からiOS出禁な Flash Playerは充分な PC リーチを達成できず 選択圧に屈して終了。 ブラウザ ごめんなさい普及率 なめてましたw スマートフォン ブラウザ スマートフォン アプリ© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 16
  17. 17. Flashやばいじゃん! PCブラウザでも Flashはぜ〜んぶ HTML5に置き換えられて 絶滅するね!© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 17
  18. 18. 次にくるのは PCブラウザにおける HTML5の隆盛にともなう Flashの終焉ですね? ktkrワクテカ!© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 18
  19. 19. …まずはじめにちょっと整理が必要 「HTML5」って便利なコトバ なんだけど、それが指し示すものは 人や文脈によって違う。© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 19
  20. 20. 「HTML5」の定義 にょろ〜ん! HTML5=Flash不要 という意味だと仮定して もっとわかりやすく 「アンプラグド」と呼んでみる。© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 20
  21. 21. アンプラグドを構成するもの ブラウザ内蔵の機能 のみですべてを実現 Audio/Video グラフィック HTML5 Video SVG HTML5 Audio HTML5 Canvas H.264 WebGL アプリケーション WebM Web Fonts Theora Web Storage Web Sockets File API アニメーション Offline Web Apps UI DOM+JavaScript HTML5 Forms DOM+CSS3 Transforms Drag and Drop HTML5 Canvas Touch Events© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 21
  22. 22. アンプラグドを構成するもの ブラウザ内蔵の機能 のみですべてを実現 Audio/Video グラフィック HTML5だけじゃなくて HTML5 Video いろんな技術の SVG HTML5 Audio HTML5 Canvas 組み合わせ♡ H.264 WebGL アプリケーション WebM Web Fonts Theora Web Storage Web Sockets File API アニメーション Offline Web Apps UI DOM+JavaScript HTML5 Forms DOM+CSS3 Transforms Drag and Drop HTML5 Canvas Touch Events© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 22
  23. 23. これらがバラバラにブラウザ実装されているのがいま (&未来永劫) 各々普及率が 異なる© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 23Link: http://html5readiness.com/
  24. 24. とりあえずノリで実装しちゃわれてる機能も♡ CSS3 Vendor Prefixes -moz- -webkit- -ms- -o-© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 24
  25. 25. caniuse.com© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 25Link: http://caniuse.com/
  26. 26. html5please.us© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 26Link: http://html5please.us/
  27. 27. ちなみに… HTML5の実装状況を知るには caniuse.com html5please.us この2つを絶対押さえておくべき。© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 27
  28. 28. はいはい、アンプラグドが いろんなものの集合体だってことは わかった。そんで?© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 28
  29. 29. …もういっこ整理 もうひとつ、 「Flash」ってひとことで言って もPCブラウザではさまざまな 用途で使われている。 用途=Webテクノロジーが棲む環境 ととらえ、ザックリ区分してみよう。© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 29
  30. 30. PCブラウザにおけるFlashの用途。ザックリと アニメー ゲーム・高 表示エフェ RIA (業務 ション・ 度なインタ オンライン クト・スラ アプリケー モーション ラクティブ ビデオ イドショー ション) GFX コンテンツ© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 30
  31. 31. 他にもあるだろうけど… まぁ、ザックリ理解。© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 31
  32. 32. アンプラグド vs. Flash検証 5つの環境それぞれで Webの選択圧をふまえ、 アンプラグドとFlashのどちらが 生存に適しているのかを検証 してみるっていうのが このプレゼンの主旨。 じゃぁいってみよう。© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 32
  33. 33. アンプラグド vs. Flash:表示エフェクト  アンプラグド実現方法 DOM+JavaScript (jQueryなど)  リーチ 機能を抑えればほぼ100%  機能 JavaScriptによるDOMアニメーションで、従来Flashに 頼っていた単純な画像の移動や切り替え効果はすべて実 現できる。旧バージョンのIEで適切に表示されない画像 表示エフェ (透過PNG)・CSS効果も一部あるがその場合でもコン クト・スラ テンツはなんとか表示される (graceful degradation) イドショー し、Polyfillsが使える場面もある© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 33Link: http://www.pentax.jp/japan/products/k-01/
  34. 34. PNG alpha transparency普及率:93.3%© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 34Link: http://caniuse.com/png-alpha
  35. 35. CSS3 Opacity普及率:70.93%© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 35Link: http://caniuse.com/css-opacity
  36. 36. HTML5エフェクトライブラリ (ごく一部) jQuery & Plugins© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 36Link: http://djdesignerlab.com/2011/09/02/20-fresh-jquery-animation-plugin-and-tutorials/
  37. 37. アンプラグド vs. Flash:アニメーション  アンプラグド実現方法 JavaScript (jQueryなど) 、SVG、およびCSS3アニメー ション (Adobe Edgeなど)  リーチ SVGや、CSS3 transformsをはじめとする高度なアニメー ションに必須な機能がIE6/7/8で使えない  機能 アニメー SVGならびにCSS3プロパティとエフェクトのすべてが使 ション・ えれば、Flash 8レベルのアニメーションはだいたい実現 モーション 可能。コマアニメにはスプライトシートを使う GFX© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 37Link: http://www.enfantsterrible.com/
  38. 38. CSS3 Transforms普及率:68.49%© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 38Link: http://caniuse.com/transforms2d
  39. 39. SVG普及率:69.09%© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 39Link: http://caniuse.com/svg
  40. 40. HTML5アニメーションライブラリ (ごく一部) jQuery & Plugins Easel.js Raphael.js Processing.js Paper.js© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 40
  41. 41. アンプラグド vs. Flash:RIA  アンプラグド実現方法 JavaScriptライブラリ (jQuery/Backbone.jsなど)、HTML5 RIAフレームワーク (Ext JS/SproutCore/Dojo/YUIなど)  リーチ canvas/CSS3/File API等に依存するためIE6/7/8非対応で あったり、対応していてもPolyfillsに頼る局面では動作速 度が実用的でないHTML5 RIAフレームワークが多い  機能 RIA (業務 データグリッドやフォーム等基本的な機能は揃っている アプリケー ション) が、Flexと同レベルの機能セット・動作一貫性・(IDE/デ バッグ環境を含めた) 開発生産性は実現できていない© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 41Link: http://dev.sencha.com/deploy/ext-4.0.0/examples/desktop/desktop.html
  42. 42. HTML5 form普及率:2.92%© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 42Link: http://caniuse.com/forms
  43. 43. File API普及率:24.93%© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 43Link: http://caniuse.com/fileapi
  44. 44. Offline web applications普及率:57.98%© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 44Link: http://caniuse.com/offline-apps
  45. 45. Web Sockets普及率:41.86%© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 45Link: http://caniuse.com/websockets
  46. 46. JavaScriptライブラリ&HTML5 RIAフレームワーク (ごく一部)© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 46
  47. 47. Flex to Sencha ちなみに Adobeの元エバン ジェリストTedがFlex ユーザーにオススメ してるのは Sencha (Ext JS/Sencha Touch)© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 47Link: http://www.sencha.com/blog/flex-to-sencha-the-opportunity/
  48. 48. アンプラグド vs. Flash:ゲームなど  アンプラグド実現方法 HTML5ゲームライブラリ (DOMベース:enchant.jsなど、 canvasベース:IMPACT/Easel.jsなど)  リーチ HTML5ゲームライブラリはIE6/7/8非対応  機能 Flash 2Dでできること (カジュアルゲームレベル) は ゲーム・高 HTML5ゲームライブラリでほぼすべて再現可能 (サウン 度なインタ ドとビデオを除く)。WebGL (ハードウェア対応3D) はIE ラクティブ 非対応 コンテンツ© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 48Link: http://www.cuttherope.ie/
  49. 49. Canvas普及率:68.99%© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 49Link: http://caniuse.com/canvas
  50. 50. WebGL普及率:46.82%* (マシンのハードウェア環境とドライバに依存)© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 50Link: http://caniuse.com/webgl
  51. 51. Audio API普及率:0%© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 51Link: http://caniuse.com/audio-api
  52. 52. HTML5ゲームライブラリ (ごく一部) enchant.js IMPACT Easel.js Cocos2d-javascript Processing.js Raphael.js© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 52
  53. 53. Flashの優位性は、なにより実績が物語る© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 53Source: http://www.onemorelevel.com/html-5-vs-flash-games/
  54. 54. Facebook版Angry Birds スマホアプリ版累計 ダウンロード数は5億。 Facebook対応とアプリ内 課金で新たな(巨大な) 収益源を得ることに。© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 54Link: https://apps.facebook.com/angrybirds/
  55. 55. アンプラグド vs. Flash:ビデオ  アンプラグド実現方法 HTML5 video要素  リーチ 67.75% (H.264=42.65% WebM=46.86%) ※Flashへのフォールバックが必須  機能 ストリーミング (Live/VoD) 不可能 (ただしHTTP range requestあり)、コンテンツ保護不可能、フルスクリーン オンライン は一部ブラウザでのみ対応 ビデオ© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 55Link: http://vimeo.com/18667898
  56. 56. HTML5 video普及率:67.75%© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 56Link: http://caniuse.com/video
  57. 57. H.264普及率:42.65%© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 57Link: http://caniuse.com/mpeg4
  58. 58. WebM普及率:46.86%© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 58Link: http://caniuse.com/webm
  59. 59. HTML5ビデオプレーヤー&フレームワーク (ごく一部)© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 59
  60. 60. まとめ:アンプラグド vs. Flash勢力図 (2012年2月現在) アニメー ゲーム・高 表示エフェ RIA (業務 ション・ 度なインタ オンライン クト・スラ アプリケー モーション ラクティブ ビデオ イドショー ション) GFX コンテンツ© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 60
  61. 61. ポイント Webテクノロジーの選択圧 (普及率&機能) が、一部の 環境でFlashがアンプラグドに 道を譲る結果につながった。 具体的には (厳密にHTML5ではない) jQueryによる 表示エフェクトとかスライドショー。© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 61
  62. 62. なので レストランの メニューがFlashとか もうマジやめてね© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 62
  63. 63. ポイント いっぽう、高機能なHTML5に依存した IE6/7/8非対応なアンプラグドは その時点でリーチがFlashより低くなり、 選択圧が不利に作用している。© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 63
  64. 64. …だったら無理してHTML5とかじゃなくて PCはぜんぶFlashでよくね?© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 64
  65. 65. 実際問題Flash利用してるWebページ 大幅に減ったりしてないし…© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 65
  66. 66. WebページにおけるFlashの利用率推移 (HTTP Archive) 60% 50% 40% Top 100 30% Top 1000 All 20% 10% 0% 2011.01.20 2011.05.16 2011.09.15 2012.01.15© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 66Source: http://httparchive.org/trends.php
  67. 67. まとめ 河川・海洋では水棲動物、 陸上では陸生動物が それぞれ繁栄している。 これは棲む場所によって異なる選択圧が 適用されるから。 じゃなかったら世界中 カエル (両生類) だらけでしょ?© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 67
  68. 68. でも結局さ、IE6/7/8対応 しなきゃHTML5使えるわけでしょ? いいじゃんそれで♡© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 68
  69. 69. はい、おっしゃるとおり IE6/7/8ガン無視すれば HTML5使いたい放題です。 マジするどいそのとおり!© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 69
  70. 70. 直近のブラウザバージョン別インターネット利用シェア (国内) 26.23% 19.92% 16.45% 9.93% 4.2% 3.87% IE6/7/8 2.97% 32.76% 2.33%© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 70Source: http://gs.statcounter.com/#browser_version-JP-monthly-201201-201202-bar
  71. 71. ポイント 3割のユーザーを問答無用で 切り捨てるリスク を上回るなんらかのメリットがあれば HTML5によるFlash置き換えは いますぐ始めてオッケー。 RIAでもなんでも。© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 71
  72. 72. いや、リスクとか脅しかよw ゆっても時間の問題でしょ?© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 72
  73. 73. そうね、IE6/7/8絶滅まで どれぐらいの時間がかかるか 考えてみよう。© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 73
  74. 74. ブラウザの世代交代スピード IEの世代交代 遅すぎ!© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 74Source: http://arstechnica.com/web/news/2011/08/july-browser-stats-windows-xp-loses-its-majority-share-of-web-users.ars
  75. 75. ブラウザバージョン別インターネット利用シェア推移 (国内) この推移を見てると IE8が5%以下に なるのにあと2年近く かかりそう IE8 26.23%© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 75Source: http://gs.statcounter.com/#browser_version-JP-monthly-200812-201202
  76. 76. Good News! XP以下はIE9以上に アップデート できないけどね…© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 76Source: http://www.itmedia.co.jp/news/articles/1112/16/news030.html
  77. 77. ポイント 一般ユーザー向けの PC Webサイトで本当に IE6/7/8を捨てられるようになるまでは あと2年の辛抱かも。 いっぽう企業内に目を向けると…© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 77
  78. 78. 企業内におけるIE6/7/8ユーザーむちゃむちゃ多い 社内でもっとも多く利用されているブラウザ Webページ閲覧可能企業ベース(n=153) 4.6% IE9.x 9.8% 5.9% ちなみにFlashが 0.7% IE8.x 閲覧できない企業は 1割 IE7.x 2.6% 24.2% IE6.x以前 Firefox Safari 38.6% 13.7% Netscape Opera Chrome© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 78Source: Web広告研究会による第4回企業内Web閲覧環境調査 https://www.wab.ne.jp/wab_sites/contents/1449
  79. 79. ポイント 企業からのIE6/7/8駆逐には もうちょっと時間がかかりそう…© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 79
  80. 80. あきらめないで! でもじつは情シスがきちんと 取り組めば、一社ずつHTML5対応の モダンブラウザにきっと統一できる! 一般向けサイトよりコントロール しやすいはずなのでそこは頑張りましょう!© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 80
  81. 81. じゃあIE6/7/8がこの世から すっきりしゃっきり 退場したらFlashもご退場?© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 81
  82. 82. あのさぁ…人の話ちゃんと聞いてる?© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 82
  83. 83. 「Webテクノロジー進化論」ふたたび 以下の選択圧に適応したWebテクノロジーはその環境 で生き残り、進化をつづける 1. 少しでも広くリーチできるテクノロジーが生き残る (機能の優劣は決定打ではない) 2. もしも同程度のリーチなら機能・性能が高いテクノ ロジーが生き残る 3. ただし、他では得られないユニークな価値を提供で きるテクノロジーはニッチとして、あるいは住処を変 えて長く生き残る© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 83
  84. 84. Flashが今後ユニークな価値を提供できる分野 ゲーム・高 RIA (業務ア 度なインタ オンライン プリケー ラクティブ ビデオ ション) コンテンツ© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 84
  85. 85. RIA (業務アプリケーション) におけるFlashのユニークな価値  大規模開発に適したOOP言語AS3と単一ランタイム RIAが複雑になるにつれてJSの言語としてのスケール性 やブラウザAPIの互換性が問題になってくる  堅牢なUIコンポーネント・アプリケーションフレーム ワークとプログラマーのタレントプール FlexフレームワークはApacheに居を移し進化を継続  UIデザインのスキニング HTML5でFlexと同等のスキニングは実現できていない RIA (業務  バイナリ通信およびP2P アプリケー WebSocketでブラウザ同士のP2Pはできない ション)  Alchemy (高速なC/C++コードの利用) HTML5には存在しない機能 (NaCl/Emscriptenが辛うじ て?)  ブラウザに依存しない一斉自動更新 (新機能追加など) HTML5と違い、全ユーザーを一斉にアップデート可能© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 85Link: http://biz.adobe-ria.jp/application/7
  86. 86. AdobeのFlexに対するスタンスとApache Flex© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 86Link: http://www.adobe.com/devnet/flex/whitepapers/roadmap.html Apache Flex http://incubator.apache.org/flex/
  87. 87. Flashの将来に向けてAdobeがフォーカスしていく分野 ゲーム プレミアムビデオ© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 87
  88. 88. ゲームにおけるFlashのユニークな価値  13.3億の既存インストールベース (PCユーザー) PCブラウザの巨大マーケット+モバイルアプリ  Flashデザイナー・プログラマーのタレントプール 結局は人  高性能なオーディオコントロール Audio APIの規格統一・普及までは時間がかかる  バラつきなく高速なアニメーション表示 ブラウザによるバラつきがHTML5より少ない  Stage 3D ゲーム WebGLの規格統一・普及まではかなり時間がかかる  Alchemy (高速なC/C++コードの利用) HTML5には存在しない機能 (NaCl/Emscriptenが辛うじ て?)  ブラウザに依存しない一斉自動更新 (新機能追加など) HTML5と違い、全ユーザーを一斉にアップデート可能© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 88Link: https://apps.facebook.com/angrybirds/
  89. 89. 【参考】Mobile Performance Tests: HTML5 vs. AIR FPS for 350 sprites 60% 54% Flash (Adobe AIR) はモバイルアプリ 50% になってもHTML5 44% 43% より安定して高速 40% 36% 31% 30% Adobe AIR Canvas 2D 20% 10% 3% 0% iPhone 4S iPad 2 XOOM© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 89Source: http://esdot.ca/site/2011/mobile-performance-tests-html5-vs-air
  90. 90. プレミアムビデオにおけるFlashの強み  単一のコーデック (H.264) 実装 ブラウザベンダーがコーデックで合意することはない  単一のビデオストリーミング実装 MPEG-DASH等のストリーミング規格統一・普及までは 時間がかかる  単一のDRM実装 W3CでDRMの統一は不可能  Stage Video GPUで高速化されたビデオ表示 プレミアム ビデオ  P2P W3CでP2Pの規格統一・普及までかなり時間がかかる  Webカメラ入力対応 getUserMediaの規格統一・普及までかなり時間がかかる  ブラウザに依存しない一斉自動更新 (新機能追加など) HTML5と違い、全ユーザーを一斉にアップデート可能© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 90Link: http://www.hulu.com/
  91. 91. getUserMedia/Stream API:0.02%© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 91Link: http://caniuse.com/#search=getuse
  92. 92. でもね、PCオワテルの! 未来はスマホ・タブレットなの PC無くなるんだぜ?© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 92
  93. 93. そうかなぁ… 基本的な数字から見ていきましょう© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 93
  94. 94. スマートフォンが年間出荷台数で初めてPC・タブレット合計を抜く© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 94Source: http://www.asahi.com/digital/cnet/CNT201202060023.html
  95. 95. 年間出荷台数シェア≠インストールベース© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 95
  96. 96. 世帯が保有する主な情報通信機器の保有率 (普及率) 2010年末 93.2% 85.8% 83.4% 46.9% 47.6% 43.0% 43.8% 26.8% 23.3% 14.9% 17.0% 9.7% 7.2% 3.5% 0.4%© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 96Source: 平成23年通信利用動向調査 http://www.soumu.go.jp/johotsusintokei/statistics/statistics05.html
  97. 97. 世帯が保有する主な情報通信機器の保有率 (普及率) 推移 パソコン ちょっと 減ってる 今回の調査で 初登場© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 97Source: 平成23年通信利用動向調査 http://www.soumu.go.jp/johotsusintokei/statistics/statistics05.html
  98. 98. スマホ・タブレット vs. PCのインターネット利用シェア (世界) 8.52%© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 98Source: http://gs.statcounter.com/#mobile_vs_desktop-ww-monthly-200812-201202
  99. 99. スマホ・タブレット vs. PCのインターネット利用シェア (米国) 8.64%© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 99Source: http://gs.statcounter.com/#mobile_vs_desktop-US-monthly-200812-201202
  100. 100. スマホ・タブレット vs. PCのインターネット利用シェア (国内) 6.21%© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 100Source: http://gs.statcounter.com/#mobile_vs_desktop-JP-monthly-200812-201202
  101. 101. スマホ・タブレット vs. PCのインターネット利用シェア (韓国) うち9割 Android 23.37%© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 101Source: http://gs.statcounter.com/#mobile_vs_desktop-KR-monthly-200812-201202
  102. 102. スマホ・タブレット vs. PCのインターネット利用シェア (インド) 41.12% うち6割 Symbian© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 102Source: http://gs.statcounter.com/#mobile_vs_desktop-IN-monthly-200812-201202
  103. 103. ほらね。何年後か スマホ・タブレットが す〜んごく普及したらPCからの アクセスは激減するでしょきっと? インドみたいに?© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 103
  104. 104. いや…インドみたいには なりたくてもなれないと思うぞ。 人口12億人に対する 普及率 携帯電話 80% パソコン 3%© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 104Source: http://www.thehindubusinessline.com/industry-and-economy/info-tech/article2415307.ece
  105. 105. マルチスクリーンを使い分ける生活者© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 105Link: “The Habits of Online Newspaper Readers”, WSJ (2010.11.15) http://on.wsj.com/xcwPYN
  106. 106. 米国では生活者のインターネット利用 パターンとしてPC含めた複数端末の 取っ替え引っ替えがすでに あたり前になっている。 実は国内も…© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 106
  107. 107. 機器別インターネットの利用人口 (2009年末) インターネット利用総人口:9,408万人 PCから (人口普及率78.0%) 計8,514万人 (90.5%) 携帯端末・PHS、 携帯情報端末から 計8,010万人 (85.1%) PCのみ 1,292万人 PC・モバイル併用 (13.7%) 6,492万人 (69.0%) モバイルのみ 885万人 (9.4%) 627万人 103万人 (6.7%) (1.1%) 6万人 2万人 (0.1%) ゲーム機・TV等か (0.0%) ら 計739万人 (7.9%)© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 107Source: 平成23年通信利用動向調査 http://www.soumu.go.jp/johotsusintokei/statistics/statistics05.html
  108. 108. 機器別インターネットの利用人口 (2010年末) インターネット利用総人口:9,462万人 PCから (人口普及率78.2%) 計8,706万人 (92.0%) 携帯端末・PHS、 携帯情報端末から 計7,878万人 (83.3%) PCのみ 1,509万人 PC・モバイル併用 (15.9%) 6,495万人 (68.6%) モバイルのみ この数字、ほぼ 744万人 横ばい (7.9%) 630万人 73万人 (6.7%) (0.8%) 9万人 3万人 (0.1%) ゲーム機・TV等か (0.0%) ら 計715万人 (7.6%)© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 108Source: 平成23年通信利用動向調査 http://www.soumu.go.jp/johotsusintokei/statistics/statistics05.html
  109. 109. 国内でも、PCとモバイルはいまも ガチ併用されているし、それが 今後おおきく変わるとは考えにくい。 PCがどっかに消え去るわけではないので。© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 109
  110. 110. PCのWebは今後も重要であり続け、 そこでFlashは (必要とされる場所で) 生き残り 進化し続ける。© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 110
  111. 111. そろそろまとめましょうか。© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 111
  112. 112. 結論 HTML5は本当にFlashの代替になり得るのか? 答えは半分YES、IE6/7/8を無視すれば。© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 112
  113. 113. もいっこ結論 Flashはその役割を終えたのか? 答えは半分YES、広いWeb世界の一部では。© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 113
  114. 114. 大事なことなのでもういちど言います …というわけで普及率なめんな。© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 114
  115. 115. さいごに… HTML5の未来を考えたり Flashの今後を憂いたり する前にいますぐIE6/7/8をどうやって なくすかを考えたほうが(ry© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 115
  116. 116. © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

×