Diese Präsentation wurde erfolgreich gemeldet.
Wir verwenden Ihre LinkedIn Profilangaben und Informationen zu Ihren Aktivitäten, um Anzeigen zu personalisieren und Ihnen relevantere Inhalte anzuzeigen. Sie können Ihre Anzeigeneinstellungen jederzeit ändern.

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

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

でつかった資料

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.

×