本記事は、2017/5/23, 24に開催された「de:code 2017」の1セッション、「War is over : ブラウザエバンジェリスト達とWebの未来を語ろう」を聴講したレポートです。

GoogleやMozillaのエバンジェリストたちがマイクロソフトのセッションで仲良くお話、って光景を見るだけでも楽しいセッションでした

左からMozilla Japan 技術戦略マネージャ 浅井智也氏、Google デベロッパーアドボケート 北村英志氏、日本マイクロソフト デベロッパーエヴァンジェリズム統括本部 物江修氏

Web Payments, WebVR, Web Assembly, Progressive Web Appsについてエバンジェリストたちが語る

Web Payments

物江 まず、Web Paymentsについてお聞かせ願いたいのですが、こちら北村さんご説明をお願いできますか？

北村 まず前提として、インターネットを利用する際に私たちがクレジットカードを利用するようになってから、それなりに時間が経過しましたね。そして現在転換期が訪れているといっていいのではないかと思います。これまでのように、フォームにクレジットカードの情報を生で入れて送信するというので、本当にいいのだろうか。

そうした問題を解決すべく提案されているのが、Payment Request APIです。他のサードパーティ製アプリに遷移して戻ってくるなどのUIを通じて、決済に必要な情報を、スムーズにユーザーに対して問い合わせることができます。

（筆者注: Payment Request APIの日本語による解説記事） （筆者注: よりシンプルな Web の決済方法 : Payment Request API の紹介）

Google デベロッパーアドボケート 北村英志氏

物江 なるほど。このPayment Request APIですが、Edgeではバージョン15からサポートしていまして、Creators Updateを適用したWindows 10上ではすでに利用可能です。Firefoxでのサポートは行われる予定があるんでしょうか？

浅井 はい、時期はまだ言えないのですが、サポートするのは確定しています。

北村 Chromeは現在Android版のみ対応していて、デスクトップ版は開発中です。

物江 あと、iOS版のChromeについても教えていただけますか？

北村 iOS版Chromeは、iOSのWebViewを使っていて、iOSのWebViewはPayment Request APIに対応していません。なので、そのままだとiOS ChromeではPayment Request APIは使えないのですが、実はこれを無理やり使えるようにしてしまおうという計画がありまして。

どう実現するかというと、ChromeからWebViewに対して機能を注入してしまうんですね。WebViewで通常使えないJavaScript APIを使えるようにしてしまう。Cordovaとかでは以前から普通に行われていたことです。

これまではiOSのWebViewに対してJavaScriptをインジェクトして、新しいAPIを使えるようにするということはしてきませんでした。なので、iOS版のChromeにとっては大きな方針転換でもあります。

物江 このように、各種のプラットフォームでサポートがすでに始まっていますので、今年中か、もしくは来年の初めくらいには、一般的に使えるAPIになってそうですね。

浅井 個人的には、（Mozillaの前身である）Netscapeが切り開いた商用インターネットの世界が、ようやくここまで来たか…と感慨深いものがあります。

WebVR

物江 では次はWebVRについてお聞きしていきましょう。WebVRについては、先日のCreators Updateから、1.1のAPIをサポートしはじめました。また、Babylon.jsやA-Frameといったライブラリを使うと、WebVRを簡単に扱うことができると。

浅井さん、A-Frameについて教えていただけますか？

浅井 A-Frameは、Web上で簡単にVRを扱えるようにすることを目指すライブラリです。例えば、HTMLタグを一つぽんと置くだけで360度画像を表示できるようにするとか。

Unityだとアセットストアがあって、アセットを購入したりすることができるのですが、それと同じようなエコシステムがコミュニティ主導で進められているのも特徴です。非常に簡単に3Dコンテンツを作れて、売り買いしながら作っていけるエコシステムができていくだろうと期待しています。

Mozilla Japan技術戦略マネージャ 浅井智也氏

物江 コンテンツで思い出したんですが、意外とWeb上で3Dを扱うような仕事ってまだ少ないらしいんですよね。WebGLがモダンブラウザ全部でサポートされるようになってから結構経つのに、WebGLってどこかゲーム用途のイメージも強いみたいで。

ただWebGLって、本来ゲーム以外の用途もたくさんあるはずなんです。例えばGrimoire.jsっていうライブラリがあるんですが、これは様々な3Dコンテンツを、簡単にWeb上で扱えるようにすることを目的としていて、こういう動きが盛り上がると、WebGLってもっと活用されるんじゃないかと思う。

浅井 その点VRは、コンテンツを中心とした盛り上がりも活発で、結構未来があるんじゃないかな、と思いますね。

物江 ちなみに、VRではなくてMR (Mixed Reality) でいうとHoloJSっていうのもあって、HoloLens用のアプリを作ることもできます…すごく大変なんですけどね(笑)。

ところでChromeも、WebVRには対応済みですよね。何か最近の動きとかを教えていただけますか？

北村 そうですねー、Daydream上でChromeを立ち上げることができるようにする、というのは聞きましたね（筆者注: VR/AR空間内でChromeを立ち上げられるように、ということだと思われる。参考: Chrome is coming to augmented reality and Google Daydream (TechCrunch)）。

WebAssembly

物江 では次は、WebAssemblyのお話を聞かせてください。やはりここは、（WebAssemblyの元になったasm.jsの開発元である） Mozillaの浅井さんにお聞きしようかと。

浅井 はい、WebAssemblyの元になったのはasm.jsという技術です。 もともと、JavaScriptは動的な言語なので、パフォーマンスの向上にも限界がある。そこで、JavaScriptのサブセットとしてasm.jsが提案されたんです。 変数の型が厳密に定義されており、さらに実行に先立ってコンパイルが可能なので、相当に速かった。

WebAssemblyは、さらにそれをコンパイル済みのバイナリとして配布できるようにする技術です。そのバイナリフォーマットに関する仕様がWebAssemblyです。実行速度は相当なもので、現在でもC言語の速度まであと20%というところまで迫っています。

物江 FirefoxやChromeではすでに対応済みなんですよね。Edgeでも、フラグをONにすると使えるようになります。 個人的にはJavaScriptを置き換えるようなものではなく、高機能な計算が必要なところに使うものだと思っていますが、合ってますか？

浅井 はい、そうだと思います。WebAssemblyに出力するのも、基本的にはC/C++やRust言語で書かれたものになりますし。

物江 ちなみに、WebAssemblyへのコンパイルって具体的にはどうやるんですか？

浅井 EmscriptenとBinaryenというツールを組み合わせて、C/C++のコードをWebAssemblyに変換する…というのが一般的ですね。基本的には、LLVMの中間言語が出力できれば、そこからEmscriptenを使ってasm.jsに変換でき、更にBinaryenでWebAssembly化できます。

（筆者注: https://github.com/kripken/emscripten/wiki/WebAssembly も参考のこと）

Progressive Web Apps

物江 昨今のWebの重要キーワード、Progressive Web Appsですが、これは北村さん説明をお願いできますか？

北村 はい。その前に、Progressive Web Appsって、ご存じの方どれくらいいます？…思ったより浸透してないですね。まだまだだな。

Progressive Web Appsっていうのは、一言で言うとモバイルウェブの新しい形です。

• Webサイトがホーム画面から起動できる
• プッシュ通知
• オフラインで動く

北村 百聞は一見にしかずで、twitter.comをAndroid 版 Chromeで開いてみるというのが一番わかりやすいと思います。 これはTwitter Liteと呼ばれていて、動作も素早いし、モバイルアプリと使い勝手はほとんど変わりません。

浅井 PWAは、アプリに比べてデータ通信量も抑えめになるそうです。例えばTwitter Liteではアプリに比べて70%データが削減できるとか。なので、ブラジル、インド、インドネシアといった、ネットワークインフラの整っていない新興国では、アプリよりもユーザのコンバージョン率が高く、採用も広まっているようです。

物江 Firefoxでの、PWA対応はいかがでしょう？

浅井 現在でもホーム画面へのインストールなど基本機能は対応していますし、今後フルスクリーン起動なども順次実装を進めていくそうです

物江 モバイルといえばネイティブアプリ、という印象はいまだに根強いですが、モバイルサイトも同時に構築できてしまうので、環境が整って利点が正しく理解されさえすれば、一気に広まりそうですよね。PWA対応していないブラウザでアクセスしたとしても、通常のWebアプリとして使えますし。

ちなみにEdgeでは、今年の夏頃から開発者向けのビルドでPWAを試せるようになります。年末ぐらいまでには、メジャーブラウザでは全体的にPWAが使えるようになりそうですね。

北村 ちなみにマイクロソフトさんの検索エンジンのBingが、PWAを見つけたらWindows Storeに並べてしまうようになるというのを最近知って、すごい荒業だけどこれは面白いなと思いました。

PWAって捉えどころがないふわっとした用語ではありますが、実際には個々の技術それぞれにもすごく価値があります。オフラインやプッシュ通知がWebアプリで行えるというのは、Ajax以来の技術的な革命じゃないかと思いますね。

Web Components

物江 そろそろお時間も迫ってまいりましたので、最後のトピックです。 Web Componentsについて語りたいのですが、北村さん、Web Componentsのご説明をお願いできますか？

北村 Web Componentsっていうのは、一言で言うと、自分でHTMLタグを作れるという技術です。そして、自作したタグ（コンポーネント）を配布できる。

Web Componentsは、最近だとSafariに搭載されたのが大きいですね。iOSを含め、割とどこでも使えるメジャーな技術になりました。

あともう一つ、AMP (Accellalated Mobile Pages）も実はWeb Componentsを使っています。AMPに対応しているサイトは、現時点でもかなりの数に上りますので、実際にはWeb Componentsはすごい勢いで広まっていると言っていいんじゃないかと思います。

物江 Polymerというライブラリもあるそうですが、それとWeb Componentsの関係はどのようなものでしょうか？

日本マイクロソフト株式会社 デベロッパーエヴァンジェリズム統括本部 物江修氏

北村 Web Componentsっていうのは、W3Cで標準化が進められている技術なんです。具体的には4つの技術から構成されています。

Custom Elementは、先程申し上げたように独自のタグを作ることのできる技術です。

Shadow DOMは、DOMのカプセル化を行えるようにする技術。

Template Elementっていうのは、「テンプレートである」という意味合い以外持たないHTML要素です。

HTML Importというのは、JSやCSSのように、HTMLもインポート可能にするという技術です。

一方でPolymerというのは、Web Componentsの上に構築されたライブラリです。

Web Components標準はそれほど高いレベルのAPIを提供しません。なので、実際にコンポーネントを作ろうとすると、実装の重複が多くなります。その重複を排除して、最小限のコードでコンポーネントを作れるようにするのがPolymerです。

物江 ちなみにEdgeは、Web Componentsについては長いこと意識しているようですが、まだ詳細は未定です。Polymerを使うと、現在のEdgeでもWeb Componentsが動作したりするんでしょうか？

北村 はい、PolymerはPolyfill（対応していないブラウザ上でAPIのエミュレーションを行うライブラリ）も含んでいますので、動作しますね。実は、現在のYouTubeサイトはWeb ComponentsベースのHTMLに全て書き換えられているんです。コードを見てみると面白いと思いますよ。

あと、Polymerはライブラリだけじゃなくてコンポーネントも提供しているんです。 http://webcomponents.org/ を見てみると、すでにいろんなコンポーネントが利用できるのを確認できると思います。

まとめ

物江 では、このディスカッションの締めくくりとして、Webの今後について一言ずついただけますでしょうか？

浅井 はい、モバイル時代は長らくネイティブアプリが中心でしたが、ここに来てWebの力が盛り返してきているのを感じています。ネイティブアプリと遜色ない機能を提供できるだけではなく、ユーザーにリーチするのも、アプリストアよりもWebのほうがハードルが低い。リンクを送るだけでプロモーションできますしね。そういう点で、PWAには期待しています。

北村 PWAについては、ぼくも同じく期待しています。とりあえずTwitter Liteを触ってみてほしいですね。

あとWebの今後という点で思いついたのですが、企業の枠組みを超えた合意形成の方法としては、Webはかなり進んでいるんじゃないかと思います。ディスカッションの場作りとか、標準化を行う上で蓄積されたノウハウはかなり貴重で、他の場面や業界にも活かされていくんじゃないかな…と考えています。

物江 ではそろそろお時間ですので、本セッションを終わりとしたいと思います。みなさま、本日は大変興味深いお話を、どうもありがとうございました。

今回の記事は後編です。前編はこちら

ディープラーニングや機械学習というとちょっと手が出しづらいところがあり避けていた方もいると思いますが、この基調講演ではそういった迷い(?)を払拭するような解説とデモが行なわれました。

そしてもう一つ、オーグメント・リアリティやバーチャル・リアリティ、ホログラム、良い意味でも悪い意味でも「遊び」での利用しかないと思う人が殆どだと思います（私は今日までそのくらいのものだと思ってました）。いやいやどうして、数年後のビジネススタイルを定義する内容の解説とデモが行なわれました。

基調講演後半はエキスパートの佐川がお届けします。

ディープラーニングが行える「SQL Server」

患者のCTスキャンからガンである可能性をディープラーニングを使って解析している。この解析は SQL Server で実行されている。

SQL Server では ディープラーニング・ツール(TensorFlowやCNTK)を SQL として使えるようにしてる。これはストアド・プロシージャで実装され、このストアド・プロシージャの中でAIのエンジンを呼んでる。

新しいクラウドデータベース「Cosmos DB」とは何者か！？

データを分散保存し、分散された各リージョンのデータが一貫性を保って利用できるように設計されている。

Cosmos DB の特徴のひとつは何と言っても世界中に分散させてアクセスできることのようだ。そして分散されたデータについてはRDBMSと同等の一貫性を定義でき5段階から選択できるようになっている

コードを書く上でも Python や R 、 C# と言った言語でも書くことができもちろん Node.js を使っても書くことができる。

AIを活用したドローンとデープラーニングを用いた「Cosmos DB」の実例。

Mixed Reality(複合現実)で実現するビジネス

Augmented Reality(オーグメント・リアリティ)、Virtual Reality(バーチャル・リアリティ)、Hologram(ホログラム)を合わせたものが Mixed Reality(複合現実) であり、今回の de:code2017 のメインと私は思っている。

Mixed Reality のキーマン Alex Kipman がもっと感銘を受けたのが日本だという。彼によると、日本は最も Mixed Reality(複合現実) が進んでいて、コミュニティ活動や HoloLens ハッカソンが世界でも秀でているそうです。

オーグメントリアリティ、バーチャル・リアリティ、ホログラムは別々に用いる技術ではなく同時に使うものであると主張する。

実際に建設業ではホロレンズを使って模型(設計図)を作り、最後にはこれらすべての情報をホロレンズに入れて渡すことができる。

これまでとは変わったスタイルの仕事になると言ってます。ワクワク感が満載で、アニメ好きでは無くてもテンションが上がりそうだ。

コミュニケーションツールとして、

Bot とのコミュニケーションも、

遠距離にいる人ともアバターとして存在することもできるし、

Mixed Reality(複合現実)を使うとすべてのものが変わる。２年から３年先には、バーチャルもリアルも境目がなくなりは物理的にそこに居なくてもいい。ブラウザ(Microsoft Edge)でWebVRを動かしEgdeから椅子を（バーチャルに）引き出すと言ったことも可能になる。

今回の記事は後編です。前編はこちら

今回の記事は前編です。後編はこちら

編集長の白石です。本日はマイクロソフトの開発者向けカンファレンス「de:code 2017」にお邪魔しています。 今回は、その基調講演前半の模様をお伝えします。

イントロダクション – インテリジェントなクラウド、インテリジェントなエッジ

まず、基調講演は、伊藤かつらさんのスピーチから始まりました。

テクノロジーがあまねく社会に影響を与えつつある現在、開発者には大変なチャンス（Oppotunity）が巡ってきている。一方で、開発者の責任（Responsibility）も大きくなってきている。開発者がどんな技術を選んで使用するかは、以前に比べるとその重要度は遥かに増している。

Oppotunity & Responsibility

そんな中、マイクロソフトは以下に示すような不変の価値と原則を信じている。

マイクロソフトが信じる不変の価値と原則

これらの原則は、マイクロソフトのミッションにもそのまま繋がっている。

マイクロソフトのミッション

そしてここ数年、「モバイルファースト」と「クラウドファースト」を掲げて、マイクロソフトはビジョンに邁進してきた。

モバイルファースト＆クラウドファースト

そして今、マイクロソフトが掲げるビジョンは以下のようなもの。インテリジェントなクラウドと、インテリジェントなエッジからなるコンピューティング。

インテリジェントなクラウド＆インテリジェントなエッジ

AI@Microsoft

そして次に登壇したのは Steven “Guggs” Guggenheimer氏。 「AI@Microsoft」と題して、マイクロソフトのAIに対する取り組みを広く紹介します。

AI@Microsoft

マイクロソフトの考えるAIは、人間の創造力を豊かにするものだとします。

Microsoft AI

そこでまず登場したデモは定番の「りんな」。

りんな

で、いつものりんなの話で終わるのかと思いきや、なんと先日、期間限定で俺様キャラの男子AIも公開していたそうです。 名前は「りんお」。ベタですね(笑)

りんお

りんおとの会話

そして話は画像認識技術の発展から、マイクロソフトが提供するコグニティブ・サービスを俯瞰する流れに。 特に、コグニティブ・サービスの様々なカテゴリー上で「Custom」を冠した様々なサービスをリリースしたとのこと。 図にもありますが、「Custom Vision Service」、「Custom Search Service」「Custom Speech Service」、「Custom Search」「Custom Decision Service」などです。

Cognitive Service

例えば、画像から植物の名前を割り出すというアプリであっても、Custom Vision Serviceを使えば簡単に作成できるとのこと。

What-Plant

Custom Vision

そしてAIの話題になると必ず登場するのがチャットボットの話題。ボット開発を促進する、Bot Frameworkの話題も当然上がります。

Bot Framework

そしてボットと言えば、やり取りをする中で、画像やインタラクティブなフォームなどを含む、リッチなカード型UIが使われることが増えてきています。

ボットとのやり取り

JSONでカード内容を定義するだけで、様々なプラットフォームに対応したカードを簡単に作成できる「Adaptive Cards」も、オープンソースで提供しているとのこと。

Adaptive Cards（画像はWebサイトのスクリーンショット）

Azure + AIの組み合わせにより、AIを全ての開発者にとって使いやすいものに。

Azure+AI

Preferred Networksとの協業が発表！

そして、Preferred Networksとの協業が発表されました。

Preferred Networks

登壇した Preferred Networksの西川 徹社長は、同社がオープンソースで開発中の「Chainer」がAzure上で簡単に利用できるようになったこと、この協業によって深層学習の技術をより身近にし、技術者の育成にも力を入れていく狙いがあると語りました。

Chainer

その後、Microsoft Translatorのデモや、実用を想定したと思われる保険問い合わせへのデモ（チャットボットから人間のオペレーターへのスムーズな引き渡しや、顧客の解約確率の予測など、大変面白いものでした）などを公開し、マイクロソフトのAIへの取り組みが本物であることが十二分に伝わるプレゼンテーションで、基調講演の前半は終了しました。

MicrosoftのAIへの取り組みは microsoft.com/aiから見ることができます。

microsoft.com/ai

今回の記事は前編です。後編はこちら