HTML5 Experts.jp編集部の馬場です。
いよいよ2020年度から小学校でプログラミング教育が必修化されますね。
今回の「Webの未来を語ろう2018」は「プログラミング教育」がテーマです。

HTML5 Experts.jpの白石編集長をモデレーターに、プログラミング教育の最前線で活躍中の、みんなのコード利根川裕太さん、ライフイズテック水野雄介さん、日本マイクロソフト春日井良隆さんをお招きし、プログラミング教育の現状からプログラミング教育必修化の課題、その先に目指す未来について語っていただきました。

今回のゲストプロフィール

ライフイズテック株式会社 代表取締役CEO 水野 雄介さん
1982年生まれ。慶応義塾大学理工学部物理情報工学科、同大学院在学中に、開成高等学校物理非常勤講師を2年間勤める。卒業後、人材系コンサルティング会社に入社。教育変革を掲げ、退社後、2010年7月、ピスチャー株式会社（現ライフイズテック株式会社）設立。シリコンバレーIT教育法をモチーフとした中高生向けIT教育プログラム「Life is Tech!」を立ち上げる。現在延べ15000名の中高生がLife is Tech !に参加。

NPO法人みんなのコード 代表 利根川 裕太さん
一般社団法人みんなのコード代表。慶應義塾大学経済学部卒業後不動産デベロッパーへの勤務を経て2011年よりラクスル株式会社に立ち上げより参画。2014年Hour of Codeのボランティア実施後プログラミング教育の必要性を感じ、2015年7月一般社団法人みんなのコードを設立し代表理事に就任。2016年、文部科学省「小学校段階における論理的思考力や創造性、問題解決能力等の育成とプログラミング教育に関する有識者会議」委員。

日本マイクロソフト株式会社 プロダクトマネージャ 春日井 良隆さん
岐阜大学 教育学部を卒業後、大沢商会、アドビ システムズを経て、マイクロソフトに入社し、ExpressionとSilverlightのマーケティング戦略を担当する。その後、エバンジェリストとして、ユーザーエクスペリエンスやHTML5、プログラミング教育の普及に奔走し、Imagine CupやHour of Codeの日本での活動を主導する。2015年よりWindowsのプロダクトマネージャーとしてコンシューマ市場を、2017年より教育市場を担当。

プログラミング教育のこれまでの取り組み

白石：まずは皆さんの自己紹介と、プログラミング教育との関わりについてお聞かせください。

水野：ライフイズテック水野です。これまでプログラミング教育は重要だと言われながら、社会がなかなかついていけてなかった。プログラミングスキルは「やりたい」「好き」という気持ちがないと伸びないと考え、7年半前に中高生向けIT教育プログラム「Life is Tech!」を立ち上げました。

「Life is Tech!」は春夏冬休み中に、3～8日間のキャンプ形式でiPhoneアプリやゲームを作りながらプログラミングを学びます。1回150～200人の中高生が参加し、5～6人が1チームになり、大学生がメンターとなって中高生に教えています。これまで延べ27,000人が参加しており、世界2位の規模となりました。

Life is Tech!では、ただプログラミングのスキルをつけるだけでなく、好きな仲間と出会ったり、尊敬する大学生のメンターに学ぶことでこんな先輩になりたいと思ったり、夢中になれることを見つける体験をしてほしいので、大学や企業など、中高生にとって非日常な空間でキャンプするということを大事にしています。

▲「Life is Tech!」キャンプの様子

有料コースと無料コースがありますが、全体の1/3が無料体験会や企業とのタイアップキャンプの参加者です。最近はIoTをテーマに開催したり、NHKさんとAIを学んだりしています。ポケモンGOやUnityのコースも人気があります。参加者には勉強時間はLINEが使えなくなったり、ライバルが勉強し出すと通知が来る機能など、独創的な発想で作った勉強管理のアプリを作り、ダウンロード数が10万超えした子もいます。

子どもたちにはいつもプログラミングの力で「半径2mの世界を自分たちで変えていこう」、さらに「その半径を広げていこう」と伝えています。

▲ライフイズテック株式会社 代表取締役CEO 水野 雄介さん

利根川：僕は大学卒業後、大手の不動産会社に就職し、2011年にラクスルというベンチャーに社長の次にエンジニアとして入って、立ち上げから携わりました。それから4年経った2014年くらいに、エンジニアと非エンジニアの壁をなんとなく感じていたこともあり、アメリカの非営利活動法人Code.orgが展開している「Hour of Code」をみんなでやってみたんですね。

それをきっかけに、こうしたプログラミング教育が日本にも必要だと思うようになり、2015年1月に小学生のプログラミング教育を支援する活動準備を始めました。7月にはCode.orgの日本パートナーとなる一般社団法人みんなのコードを設立しました。

当時はプログラミング教育がこんなに盛り上がるとは思っていませんでしたが、2020年から必修化も決まり、行政・企業との連携を深めながらプログラミング教育の支援活動を広げています。

私たちみんなのコードは、「全ての子どもがプログラミングを楽しむ国にする」というミッションを掲げています。なぜ、全ての子どもなのかというと、プログラミングコンテストはある程度できる子を伸ばすのにはいいけど、全ての子どもの育成に対する取り組みってあまりないと思ったから。なので、裾野を広げるほうを頑張ろうというコンセプトでやってます。

IT人材不足や論理的思考を鍛えるという考え方も大事ではあるんですが、実際に授業でやるときは「プログラミングを楽しむ」というのを第一にして、結果的に子どもの能力が高まるとか、社会で活躍できる人材を育てたいと考えたからです。

「国にする」とした背景は、こういう活動って東京だけ先に進んでしまって、地方との格差が生まれることが多いんですよね。その差を埋めるために地方でも活動しています。とはいえ、全ての子どもに直接教えるのは無理なので学校の先生、特に小学校の先生に対しての指導を行っています。プログラミング教育についてのシンポジウムを開催したり、地方に出向いて体系的に学んでもらったり、実際の授業で使える教材を提供したりなどですね。2017年度のシンポジウムは10都市1000名超の先生に参加してもらいました。これからはさらに拡大していく予定です。

▲一般社団法人みんなのコード 代表 利根川 裕太さん

春日井：日本マイクロソフトの春日井です。Windowsのマーケティング担当として、教育市場を見ています。HTML5 Experts.jpのエキスパートに名前を連ねているように、以前はWeb系の技術のエバンジェリストをしていたのですが、後半は学生向けのエバンジェリズム活動も兼任していて、その頃に知り合ったのが水野さん。

「Life is Tech!」は大学生が中高生を教えるというスタイルで、お互いの年齢が近いから親近感があるんですよね。子どもたちを盛り上げる趣向が凝らされていて「すごい！」って毎回感動しています。しかも、経験と知見が積み重なり、どんどんバージョンアップしてる。

利根川さんとは、彼がCode.orgの日本パートナーとして、みんなのコードを立ち上げた頃に知り合いました。Code.orgはアメリカのSTEM教育（※）の普及を支援するNPO団体で、Microsoft、Apple、Google、Facebook、AWSなど大手のIT系企業が数多くサポートしています。

STEM（ステム）教育：科学（Science）、技術（Technology）、工学（Engineering）、数学（Mathematics）の教育分野を総称する、2000年代に米国で始まった教育モデル。

Microsoftは「Microsoft MakeCode」というMicrosoftが開発した学習者向けのプログラミング環境とコンピューティング教育用教材を展開しています。最近はIoTを活かしたフィジカルコンピューティングが人気で、micro:bitというマイコンと連携できる「MakeCode micro:bit」が注目されています。USBでつないだmicro:bitをビジュアルコーディングでLEDを光らせたり、温度センサーや加速度センサーを使ったモノ作りにも使えます。理科や技術なんかの教科との組み合わせの相性もいいですよね。

ほかにも、MakeCodeはMinecraft（マインクラフト）をプログラミング教材として使うこともできて、一緒に組み合わせる「Minecraft Education Edition」というマイクラの教育版があります。Minecraftは全世界の子どもがほぼ100％やっている人気のサンドボックスゲームですね。

水野：シンガポールでも大人気で、どこのコンビニでも一番目立つ場所に置いてあります。

白石：うちの小4の息子もすごくはまっていますね。いつもYouTubeの実況を見てます(笑)。

春日井：YouTubeを見て勉強する子も多いみたいですね。古い世代は先生からの一方的な詰込み型の教育が当たり前だったんですが、お互い子ども同士が学び合おうという協働学習の学習効果に注目が集まっていて、Minecraft: Education Editionにはそんなこともできるように工夫されています。

先生が黒板に「ここに集合！」と書いたり、仮想世界にいる子どもをガイダンスしたりする機能もあって、お値段もお手頃。先生が一人、1年あたり544円払えば使うことができます。

実績としておもしろいのは、立命館小学校の事例ですね。京都には、たくさんの観光施設があることはご存じの通りですが、海外の人にもっと知ってもらおうという課題を解決する学習にMinecraft: Education Editionが使われました。

ちゃんと設計図を手に入れて、誰が屋根と庭とかを作るかなどの業務分担をし、訪れた人のアングルまで徹底的に考え、議論しながら作っています。先生はあくまで手助けするだけで、子どもたちが主体的に取り組んでいるところが素晴らしいんです。

Minecraft Education Editionはプログラミング教育だけでなく、STEM教育全般をやろうとしています。例えば、私たちの世代だと元素記号を覚えるだけだったものが、仮想空間の中で水素と酸素を合成すると水を生成するようなことを体験したりします。現CEOのサティア・ナデラの理解もあり、マイクロソフトでは全世界的にかなり教育に力を入れていますね。

▲日本マイクロソフト株式会社 Windows プロダクトマネージャ 春日井 良隆さん

白石：子どものプログラミング教育を支援するのは、Microsoftにとってどういうメリットがあるんですか？

春日井：1つは社会的な責任ですね。。第4次産業革命に向けた人材育成を引き合いに出すまでもなく、ICTのスキルを持った人材の育成は急務です。日本のマイクロソフトの人間として、日本の将来に貢献をしたい。それは、偽らざる気持ちです。

商売的な話をすれば、子どもの頃からWindowsに慣れ親しめば、大人になったらSurfaceを買ってくれるだろうという期待もあります(笑)。あとはスマートフォンに対する、パソコンの意義というのも伝えていきたいと考えています。

世界のプログラミング教育はどうなっている？

白石：続いては、世界のプログラミング教育どうなっているかについて伺いたいと思います。1月にロンドンで開催された「BETT」という教育イベント、皆さん行かれてるんですよね？

利根川：私も行ってきました。

春日井：BETTは世界で一番大きい教育系のイベントで、国を挙げてブース出しているところが多く、今年の韓国は大きかったですね。でも、日本はブース出してないんですよ。遅れをとるのではないかとかなり心配しています。

利根川：僕は課題はあるけど、単純に「遅れててやばい」という論調は一面的過ぎると思っています。例えば、グローバルでもプライベートの塾はまだあまりないし、日本の小学校でも先進的な取り組みをやっている先生もいます。

春日井：正確に言うと、プログラミングができる最先端の人材を生み出す高等教育に対する取り組みが遅れているんじゃないかと思っています。

水野：そもそもプログラミング教育の前に、まずパソコンが扱えて、パソコンでものが作れることが必要なんですが、Wifiやパソコンの設備が整っていないですね。以前シンガポールに住んでいたんですが、向こうもそれほど進んでいるわけでもなくて、やはり（プログラミングができる）先生が少ない。

英語は「できない」というマイナスの状態から、「できる」というゼロにすることだけど、プログラミングはゼロをプラスにする学びなので、ほぼ横一線。日本はものを丁寧に作るとか、ソフト面では勝っているので、まだ可能性はあると思います。

利根川：僕も横と比較して嘆くより、これからどれだけ良くしていくかの方が重要で、先に進んでるところからどうやれば前に進めるのかを学べばいいんじゃないかと。アメリカが進んでたらそこからカリキュラムを学べばいいし、悲観する必要はないと思います。

▲HTML5 Experts.jp編集長 白石俊平

白石：ちなみにどこの国が進んでるところかありますか？

利根川：アメリカは進んでますね。あとはイスラエル、イギリス。特にイングランドはコンピューティングという教科があり、小中高と授業があります。時間枠、教科書、センター式みたいな試験もあって枠組みや体制が整っています。

春日井：ちょっと前に話題になった内閣府では、諸外国の若者と比較すると、日本の中学生のスマホの所有率はあまり変わらないのですが、パソコン所有率はかなり少ないという結果になっていました。

水野：普通に向こうは小学3年生からiMovieから動画作ったりしますからね。Googleドライブで宿題出したり、リテラシーの差はかなり大きい。

白石：今の子どもたちはPCがなくてもタブレットやスマホでやっちゃうことが多いですよね。

利根川：コンテンツの消費側はそれでもいいけど、制作する側になるとまだ本格的なところはPCでないとつらいと思います。

春日井：消費は間違いなくスマホ。でも何かクリエイトする時は、PC、キーボード、大きな画面がないと難しい。

白石：ではそういう話やデータから考えると、作る力は育っていかない可能性がありますか？

春日井：なんとかしないといけないですね。

利根川：個人の家庭、学校によっても差が出てくる面もあります。

白石：そういう課題が浮き彫りになり、未来に進んでいかなくてはいけないという話になってきたので、プログラミング教育のこれからの話に進みましょう。

プログラミング教育のこれから

白石：プログラミングの義務教育化の話が出ましたが、ざっくばらんにお聞きしたい。調べたところ「コーディングを覚えることが目的ではない」とか「プログラミング的思考」が大事とか、賛否両論あるらしいですね。アンプラグドコンピュータサイエンスというパワーワードもあったりして。

利根川：よくプログラミングが2020年から必修化になるってメディアに出てるので勘違いする方もいるのですが、正確にいうと小学校、中学校、高校がプログラミングを教えないといけないんですよと指導要領は出ますが、プログラミングという教科ができたり、コードの書き方そのものの授業をやるわけではないのです。その指導要領は10年に一回しか変わらなくて、そのタイミングが小学校が2020年、中学校が2021年、高校が2022年になります。

現状どのくらいプログラミングを授業に取り入れているかというと、小学校についてはほぼなくて、たまに面白いことをやりたい学校や、2020年を見据えて先行的にやる学校がまれにあるくらい。中学校は今の指導要領でも技術課程の中で、4～8時間くらいロボット制御の計測という授業があります。ただこれも問題が山積みで、教科書には入ってはいるけど、ちゃんとやらない先生もいます。

高校は情報という教科の中に、理系よりの「情報の科学」と文系よりの「社会と情報」という科目があり、プログラミングは情報の科学の中にのみ入っています。ただし、学校ごとに開設科目は決まっていて、配分は15％：85％と情報の科学が少ないという状況です。

水野：そうですね。その15％もかなり初歩的な内容が多く、僕が衝撃を受けたのは、テストの問題で「キーボードのここはAですか？Pですか？」って問題が出てたこと。キーボードの位置を覚えることに価値はないし、問題山積みな状況です。

利根川：そして、小学校は算数とか理科の中で、多角形をプログラミングで書いてみる。書くというより、プログラミング体験してコンピュータに指示する感覚をつかみましょうというかんじですね。中学校は今の指導要領にあるロボット等の制御の内容に加えて、ネットワークを使った活動が増えて、今やっていることを倍増にするイメージです。

高校は「社会と情報」と「情報の科学」を統合して情報の科学よりの「情報Ⅰ」という必履修にして、これまで15％しかやってなかったことを100％にして、教科の中に入っていくといったかんじです。プログラミングという単独の教科はありません。

白石：小中高とプログラミングという教科は出てこないと。小学校においては、現在技術課程でやっているのを2020年以降は理科とか算数で、もうちょっと厚めにやるということでしょうか？

利根川：小学校は現時点ではゼロです。ゼロの状態から算数・理科の科目で体験というかたちでやります。ただ、一斉に始められるものでもないので、去年くらいからトライアルが始まっているというかんじです。

白石：まず授業ができるのかが気になりますね。教える科目・内容は学校や先生任せだということですがそこは変わるんですか？

利根川：最低限の基準はありますが、そこは変わらないですね。

春日井：一応教育委員会の皆さんも、変えようとはしていますけどね。

白石：学習指導要領とかって全然わからないんですけど、一応ほかの理科、算数、社会などはここまでやろうよというのは決まっている？

春日井：ざっくりしたガイダンスとかは決まってますね。

白石：たとえば高校3年生の数Ⅲとかだったら微分積分といったところまではやろうとか。

利根川：そういうのは決まってますね。小学校も算数・理科は教科書には書かれるので、多角形を書くのをプログラミングでやってみましょうとか。

白石：でも今の話だと、教科書の内容もバラバラかもしれないと。

利根川：中学校の技術課程くらいになると、あまり教科書は使われなくなるんですよね。副教材中心で、教科書は参考書くらいの扱いになっていくと思います。

白石：「プログラミング教育はコーディングを覚えることが目的ではない」といった内容がブログで書かれて話題になってましたが、どう感じてますか？

利根川：文科省としては、小学校段階からちゃんとプログラミングそのものを学習のターゲットにしようとしています。しかし小学校は全国で2万校あって、40万人の先生がいますが、そのほとんどの先生がITリテラシーが高いわけではありません。その状況から数年でプログラミングを教える環境にするのは無理なんですよね。

春日井：僕が小学生の時は書道やそろばんの塾や、授業で音楽・体育・技術とかやりましたけど、みんな音楽家や書道家になるわけじゃなくて、教養として必要だからやるというかんじでしたよね。

中には体育の授業でスケートを知って、冬季オリンピックを目指すことを決意した子もいるかも知れない。プログラミングもこれから必要になる教養、あるいは未来の可能性をひらくきっかけだと思っています。

利根川：例えば環境問題って家庭科でも理科でも社会科でも、ごみ処理や温暖化などについてはいろんな教科をかいつまんで学ぼうというのは、少しでも興味を持ってもらうために文科省がよくやるやり方です。個人的にはもっとちゃんとやってほしいという思いはありますが、現実的な第一歩としてはしかたがないかもしれません。

白石：でも、そのまま10年間変わらないというのは問題なのでは？

利根川：そうなんです。そこが問題なんですよね。

白石：IT人材を増やすという直接的な影響にはならなさそうですか？

春日井：いわゆる第四次産業革命の人材を育てると国が打ち上げたので、そこに合わせて一つの指導要項が組まれたという背景はありますね。

利根川：文部科学省・経済産業省・総務省、それぞれ動きはかなり違いますね。学校の授業の中で何を教えるのかは文部科学省、総務省は学外や部活や地域であったり、基礎スキルがある人をどうやって伸ばしていくか。経産省はグローバルに発展させるための人材の輩出だったり、このEduTechというものを産業にしていこうとか。文科省だけにとどまらない動きがあります。

学校教育、特に小学校中学校は職業教育じゃなくていろんなチャンスに気づくための機会。30～40代はプログラミングに触れたことがあるのは10％いるかいないかなんですが、この世代になると100％になるんですよね。やってみたら面白いとか伸びそうという子どもの母数が増えて、未来の仕事につながればいい。学校教育としては、そうした体験をしてもらう機会を作るというのが責務になります。

Life is Tech !のような塾・クラブ活動、CoderDojo（コーダー道場）みたいなコミュニティは、よりプログラミングをやりたいという子を伸ばすところ。学校教育にプロフェッショナルな体験を期待しすぎるのはちょっと筋が違います。

ただ政府としては第四次産業革命というムーブメントを起こし、この国をAIやIoTといったテクノロジーの力で、もう一度元気にしようという動きがあります。プログラミング必修化になったのも、ある種内閣内のバズワード、必修化するときの体制を第四次産業革命に生かすため。これらの取り組みで興味が出てきた子のスキルを伸ばし、価値を提供する側に育成するという動きが経産省でも出ています。

社会はどう変わる？子どもたちにはどう教えればいい？

白石：最後は社会がどう変わるか、子どもたちにどう教えればいいんだろうというテーマについてお聞きしたいと思います。どうやったら楽しく効率よく教えることができるのでしょうか。

春日井：白石さんは、今お子さんに何かやらせてるんですか？

白石：うちの小4の息子はHour of Codeから始めました。でもHour of Codeはわりとさくさくできちゃって、次にスクラッチやらせてみたんですが、UIがイマイチいけてないかんじがして…（苦笑）。あとは「プログラミン」をずっとやってました。

最近はビジュアルプログラミング言語で、Minecraftを題材にPythonを教えてました。でも、その辺りから興味が失ってきちゃって。原因はいろいろあると思うのですが、まずプログラミングは多少英語を知ってないとできないんですよね。

例えば、英語でimportと言われてもまったく意味がわからない。すべてがおまじない。コマンドラインをたたかなくてはいけないんですが、そういう単調作業が面倒くさくなってしまってる。親が「やりなよ～」と言うと、逆に嫌になっちゃってる状況なんです。

利根川：そもそも白石さんの「教えよう」というのは、あまり筋がよくない気がします(笑)。基本的に「やりたい」と思ったときに、すっと出す方がいい。いわゆる従来の勉強が嫌いになるのと同じことをプログラミングでもやろうとしている。それであれば教えないほうがよくて、興味を持ったときに教えてあげたほうがいい。特に家庭では子どもに押し付けるとよいことがない気がします。

水野：10歳以上になってくるとだんだん自我が芽生えてくるので、まずお父さんやお母さんがめちゃくちゃ楽しそうにやってることに食いつくんですね。それができないとしたら、僕はコミュニティだと思います。楽しく効率的に学べるかはコミュニティ。

子どもはその場の雰囲気やそこにいる人たちと学ぶことが楽しいとか、ライバルに負けたくないとか、コミュニティに所属することによって子どもたちは成長する。10歳以上になって自分たちが教えられないのなら、自我に任せつつ、そういうところに行かせたほうが伸びると思います。

春日井：でも、白石さんみたいにPython書けるお父さんがいる家庭はなかなかないですよね。

白石：子どもたちも楽しくやってたし、最初はやりたがってたんですけど、そこをどううまく育てていけばいいのかなって考えちゃうんですよね。

水野：英語もそうですよね。5歳くらいのときは楽しかったけど、親が話せなくなると、だんだん楽しくなくなってくる。例えばインターナショナルスクールに行って友だちと毎日楽しく話していると、話せるようになるのと同じことだと思います。

白石：ライフイズテックさんは子どもが「プログラミングをやりたい」って、参加するんですか？それとも親が「やってみたら？」と勧めて参加させてるかんじなんですか？

水野：基本的には子どもたちが「やりたい」と言って参加してきてくれます。僕ら教育者の仕事は、子どもがやりたいって思ってくれるようなものを作る、HPの作りもそうだし、チラシもそうです。オリンピックで飛んでたドローンやPerfumeのプロジェクトマッピングみたいに、子どもたちに作ってみたいと思わせる欲求や、キャンプに参加してみたいというワクワク感を出させることが教育者側のやるべきことだと考えています。

白石：それは子どもたちに直接アプローチしないと、Life is Tech!のキャンプの情報は伝わらないと思うんですが、どうやってるんですか？親とかならいろんなメディアを見ていると思うんですけど。

水野：学校でのクチコミや、友だちの紹介が多いです。先生も自分たちでは教えられないからと、学校単位でキャンプをやったりとか。マイクロソフトさんで、品川女子学院と聖光学院でコラボキャンプをやったこともあります。

親としてはマイクロソフトを見に行けるし、品女の子は共学の雰囲気を楽しめる。きっかけは何でも、結果的に興味を持ってくれればいいんですよね。

春日井：マイクロソフトがMinecraftを教育用にカスタマイズしようとしたのはまさにそれで、子どもたちは興味を持たないとやらない。子どもはMinecraftが大好きなので、だったら教材にしましょうと。Excelでマクロ組んでみましょうっていう授業だったら、楽しくない。

白石：でも、Education Editionは先生しか使えないとのことですが、一般家庭でやるにはどうしたらいいですか。

春日井：最近は教育機関じゃないところでもできるようになってきました。ただMinecraftをパソコンで使う場合、Java版とWindows 10 Editionの2パターンあるんですね。

白石：うちの息子はJava版ですね。

春日井：Pokect Editionは、どんどん、Java版に近づいているのですが、その、Pocket EditionのWindows10版を「Minecraft Windows10 Edition」と言います。Windows10のストアから3,150円でダウンロードできるんですが、これは最初にお話したMakeCodeとつなげられるようになっています。Code Connectionという無償のツールをインストールするだけなので、ぜひやってみて下さい。大人がやっても楽しいですよ。

白石：みんなのコードでは、プログラミング教材「プログル」というツールを作られているんですよね。

利根川：プログルは小学校の算数の授業、主に小学校5年生を対象に、学校の先生が使うために作ったプログラミング教材です。多いときだと1日1000人くらいの児童が使ってくれていて、従来の多角形の学習よりは楽しいと思います。

白石：2020年以降はが爆発的に全国の小学校で使われると。

利根川：そうなるといいですね。うちでプログラミングをやるとしたら、スクラッチとかマイクラのほうが楽しいと思いますけど(笑)。

先生がちゃんと自分が楽しいと思って授業やクラブ、学校外でもやってくれればいいなと。プログルのホームページも学校の先生向けに作っています。

白石：最後に本日のディスカッションを振り返って、ひと言お願いします。

春日井：子どもの頃にピアノを習って、その後ピアノを弾くことが喜びになる人、音楽を聴くことが喜びになる人、音楽に全く興味が持てなかった人など、人それぞれだと思います。いずれにしろピアノを習うという体験をしなかったらわからなかったことですよね。

これからの社会を考えると、プログラミングもそういった機会が与えられるチャンスが増えていくと考えています。そのための支援や活動を続けていきたいと考えています。

利根川：プログラミングを勉強することで、将来ITで価値を提供する仕事に就いたり、営業やマーケッターの仕事でも少し役立てることがあると思います。でも大事なのは、やってみて合うか、合わないと知ること。やったけど自分には合わないというのを早めに知ることはメリットになります。

一方で懸念しているのは、テクノロジーで豊かになっていく東京と、そうでない地方に国が分断されていくんじゃないかという危機感があります。そうならないように、テクノロジーの教育の場を全国に広めていきたいですね。

水野：ライフイズテックは「テクノロジーを知っている」ということを普及させるために活動していますが、プログラミング教育の本質というのはクリエイティビティを伸ばすことだと考えています。業務を効率化させたり、論理的思考を身に付けたり、テクノロジーを進化させるためのツールを作るにもクリエイティビティが必要です。

クリエイティブ力を伸ばすための教育や施策は今後ますます重要になっていきます。本質となるクリエイティビティやコミュニケーションを大事にしながらやっていきたいと思います。

HTML5 Experts.jp編集部の馬場です。毎回豪華ゲストをお呼びして、Webの現在と未来について語っていただく公開座談会企画「Webの未来を語ろう」シリーズ第3弾！

今回は検索エンジン最適化（SEO）の第一人者である辻正浩さんをお招きし、2018年のSEOを語る上で欠かせないことやWeb制作で気をつけたいポイント、「AI First」時代のSEOはどうなっていくのかなどを語っていただきました。

今回のゲスト

辻正浩さん（株式会社 so.la 代表取締役SEO）

Search Engine Optimizer。
1974年北海道生まれ。営業、広告制作、Web制作の経験の後、株式会社アイレップでSEOの専門家としての活動を開始。様々な業界・規模のWebサイトのSEOを担当する。 2011年10月に独立の後、株式会社so.laを設立。SEO専門家としてWebサービスやECサイト、企業サイトのSEOに取り組む。特に大規模サイトを得意とし日本有数の大規模サイトのSEOを多数担当している他、各地での講演にてSEOの啓蒙活動を行なっている。

SEOのエキスパート、辻さんの空前絶後な仕事術

白石：日本で検索される約5％は辻さんの顧客のサイトなのだそうですね。現在はお一人で13社のSEO支援をされているとのことですが、どうやってそれだけの仕事をこなされてるのか気になります。1日のスケジュールはどんなかんじで仕事されているんですか？

辻：だいたい規則的ですね。平日は朝8時か9時に起きて、昼くらいまではメールなどをチェックします。午後はお客様とのミーティングに出かけ、夕方帰ってきたらその日のうちの作業やメール対応などをしています。深夜0時くらいから翌日の作業の準備をして、4時か5時くらいに寝ます。

白石：えっ、朝起きる時間はそんなに早くないなと思ったら、夜中の4時とか5時まで起きて仕事してるんですか。遅くまで仕事をしすぎなんじゃ…。

辻：13社のお客様とは、月に1回か2回必ず1～2時間のミーティングを入れているので、平日の午後はほぼ埋まるんですね。そのミーティングのために、各社のSEOの分析や提案の準備で短くても5～6時間はかかります。翌日の準備をしているとどうしても朝5時くらいになっちゃうんですよ。

ツールも使っていますが、マンパワーでなんとかやってしまうので、同業のSEO業界の人に話をしてもまったく参考にならないって言われてます(笑)。

白石：クライアントワークやってる辻さんもすごいんですけど、仕事以外でも辻さんは検索結果を常に広い領域でウォッチしているイメージがあります。

辻：30万キーワードくらいは定期的にウォッチしてます。私が他社に勝っている点があるとすると、全部一人で見ていることですね。日頃の順位や流入の変化からサイト変更による変化を一人で全部見ていれば、傾向が把握できますから。

白石：辻さんを医療系サイト「WELQ」問題（※）で記憶している人も多いと思うのですが、このときの医療業界の動向はたまたま気づいたんですか？

（※「WELQ（ウェルク）」問題：DeNAが運営する医療情報のキュレーションメディア「WELQ」が、クラウドソーシングなどを使って記事を安く大量に作り、その記事が検索結果で上位表示されていた件。医療系の情報にも関わらず信頼度が低い、記事の制作過程で多数の著作権侵害が認められるなど、多くの批判を受けて現在サイトは停止中）

辻：医療・金融・法律関連といった深刻な情報の検索では、特殊なアルゴリズムが動いています。その中でも医療関連は動きが顕著ですので定期的に確認していました。医療を追っていればけば、その後の他業界がどういう動きになるか予想できますので。

例えば医療系なら一般的な薬や病名とか症状などのキーワードを、それぞれ数百づつ定期的に検索しておいて、上位表示されるサイトの傾向を見ていると面白いですね。動きが変わってきたときに、じゃあペットの病気だと同じような動きか？などとずらして比較するといろいろ見えてきて、興味深いです。

白石：すごいな…。そういった動きを調べているときは何かツールも使ってるんですか？

辻：データはツールを使って分析しています。ただちゃんと分析するときは、ツールだけではできないので、力業ですね(笑)。

白石：辻さんの大事にしているポリシーや哲学的な話も聞いてみたいです。WELQのときって「これは許せない！」という社会正義みたいな想いもあったんですか？

辻：あまり社会正義的なことはやりたいくないです(笑)。基本的に楽しい仕事しかしたくないですし、好きなサイトとか面白いサイトの仕事だけを受けています。そういうサイトだけに関わっていれば仕事も大変ではないですから。

ただ、自分の義務として検索に関わる問題提起をしていくべきとも思っています。SEOを行っている会社にとって、検索エンジンが取引先となることが多いので、おおっぴらに文句は言いづらい人が多いんですね。私は利害関係はありませんし、身軽な立場なのでいくつか話していると、いろんな人からの相談やタレコミがどんどん来るようになって、半分義務のようになってしまっているところはあります。

モバイルファーストの流れでSEOはどうなる？

白石：続いては、SEOの過去から現在までの大まかな流れと制作者向けのポイント、SEOの未来を聞いていきたいと思います。まず、モバイルファーストはGoogleのSEOにどういう影響を及ぼしているんでしょうか。

辻：2016年、2017年、2018年の今くらいまででいうと　モバイルファーストの影響は大きいと思います。Googleの仕様として大きな変化は、モバイルファーストインデックス（MFI：Mobile First Indexing）ですね。

（モバイルファーストインデックス：Googleがこれまで検索エンジンがPCサイトの内容をもとにコンテンツの質を評価していたのを、スマートフォンサイトを評価の主軸に評価し、インデックスするという方針転換のこと）

Googleはレスポンシブウェブデザインでやっているサイトについては、PCサイトのページとモバイルページのソースに違いはないので一切影響はないと言っています。レスポンシブ以外のところはどうかというと、同じURLで別のHTMLを出しているダイナミックサービングも、別のURLでPCとモバイルを対応しているサイトも、内容が同じなら影響はないと言っています。

（ダイナミックサービング：URLはPCサイトとスマホサイトで一緒だが、アクセスするデバイスによって見せるページやテンプレートを切り替える方式）

ただ、レスポンシブウェブデザイン以外では、Googleが見るページのデザインや動線が大幅に変わることになるわけですよね。おそらく経験がある方も多いと思いますが、コンテンツを変えずにデザインと導線を全部変える大幅なリニューアルをすると検索順位に大きな影響があるものです。

しかしGoogleはその影響がほぼないようにすると言っているんですよ。今までの経験上そうなるはずはないのですが、そう言い切るからには、Googleはいろいろな今までにない処理をしてくるんだろうなあと思っています。

本当にそうなればいいのですが、やはり大きな変化になるかもしれないとして、ウォッチしていく必要があると考えています。

白石：PCサイトしかないサイトはどうですか？

辻：モバイルファーストインデックスでも大きな変化はないはずです。ただ、昔からモバイル版を用意していないサイト、モバイルフレンドリーではないサイトは、モバイルからの検索では順位が大幅に落ちていますので、どうにかするべきでしょうが。

白石：スマホ用URLがあるサイトやスマホ用コンテンツが違うというサイトはいかがでしょう？

辻：そういうサイトはアノテーションなどを複雑に対応する必要があって難易度が高いですね。Googleはカンファレンスの質問などで「完璧に実装できた場合は問題ない」と回答してします。ただし「そういうサイトはめったにないし、だいたいみんなミスをする」とも言われていたそうですが。私なら早めにコンテンツの整理をお願いしますね。

このPC版とスマホ版という話は、サイトの規模によってはクロールの観点で複雑になることもあります。PC版とスマホ版でソースが違う巨大なサイトでは、PC版しかまともにクロールできていないところが多いです。

毎日数万とかページが増える巨大サイトは毎日数百万何千万とGooglebotがデータを取りに来て、Googleのためにサーバ負荷対応が必要なところも多いのですが、PC版とモバイル版の両方を取得するためには、さらに倍の負荷になってサーバ費用もかなり増えます。

そういう事情への配慮なのか、巨大なサイトではPC版を中心にクロールをかけて、スマホ版ページはパターン認識による推測ですましていることがあります。

巨大なサイトのクロールでは、かなり複雑な処理が行われているんです。モバイルファーストインデックスになるとそのあたりも変わるでしょうから、巨大なサイトではなにか特殊な変化が発生する可能性は十分にあるでしょうね。

白石：今後はモバイルクロールがメインになると？

辻：私がログを見られる巨大サイトの多くでは、PCクローラとモバイルクローラの割合が8：2くらいなんですが、今後は逆転させるそうなんです。巨大サイトではPCページは認識できていてモバイルページは認識できていないようなケースも多いので、データベースの処理も複雑になるんだろうなと。そのタイミングでは何かイレギュラーなことが起こるかもしれません。

Googleは問題ないといいますが、過去にない大規模な仕様変更ですので、どういう影響があるかはやはり分からないですね。

普通の規模のサイトや、レスポンシブウェブデザインのサイトは確かに問題は起きないと思いますが、そうではないところにとってはいろいろイレギュラーがあるかもという想定で注意して監視しておいたほうがいいと思います。

Webコンテンツの「正しさ」への流れ

白石：では、話題を変えて。最近はWebコンテンツの「正しさ」への流れがありますが、どうお考えですか？

辻：WELQ問題が端を発し、Googleは2017年12月6日にウェブマスター向け公式ブログで、日本語検索の結果について「医療や健康に関する検索結果の改善」を発表しました。医療や健康に関する部分はここで非常に大きな変化があったわけですが、この前後にGoogleはいろんなことをやっているんですよね。

明確に違法と言えないけど怪しいサイトや悪質なサイトの順位を露骨に落とした、と思える動きもありました。昨年末に逮捕者も出たようなフィッシングサイトへの対応も進んでいます。大きな社会問題になったことに対して積極的に対応するようになった、と思いますね。フェイクニュースなどインターネットへの信頼性が疑われるようになって、明らかに態度を変えたように思います。

白石：それまでのGoogleは「インターネットの自由」を優先していて、それは面白さでもありましたが…。「正しさ」が大事という方向に舵を切ったと？

辻：はい。情報の正確性を意識するようになったことはいわれています。「Googleは検閲はすべきでない」というポリシーとインターネットの自由を大切していることは確かです。Googleを含めたインターネット全体が自由だけでは問題があるという方向に流れています。いいことかはわかりませんが、どんどん加速化していますね。

白石：でも、人によって「正しさ」が違う情報っていっぱいあるじゃないですか。Googleがその「正しさ」を決めるのは、限られたことにしかできないんじゃないかなって思うんですけど。

辻：難しいですね。最近は癌について検索したら、国の医療機関などしかまともに出なくなりました。ただお医者さんの眉をひそめるような高額だったり、実績に乏しい微妙な治療方法の多くは違法ではないですよね。それらがGoogleの判断によって多くの人に知られづらくなったわけですよね。これはGoogleの検閲ともとれる行為かもしれませんが、それが受け入れられています。難しいことですよね。

個人的には、深刻な病気に悩む人が検索の情報で迷惑をかけられたという話をたくさん聞いてきたので、今の状態が悪いとはまったく思わないんです。インターネットの自由も大事だけど、その自由の中でも規制したほうがいいこともあります。ただ、これがどんどん拡大するようではまずいですよね。

白石：価値中立、道徳的に中立という言葉がありますが、Googleは今まではそこを頑張ってたんでしょうけど、あまりに誤った情報などを出してしまうのはまずいと考えたんでしょうね。ただ、Googleの一存で何が正しくて、何が間違っているのかという思想の部分を決めてしまうのはどうかという問題もありますね。

辻：本当にそう思います。ただこの問題、Googleは本当に慎重に考えていると思います。Googleの考え方は発表される声明だけではなくて、実際の順位の動きなどで大分理解できているつもりですが、今のGoogleでも表現の自由とかインターネットの自由の尊重とかは、過剰なほど慎重だと思います。

ただ、それでも対応を変えていかないと行けないほどインターネットは複雑になったということかなと思います。現状のGoogleには不安はないし、変なことはやらないと信じています。でも今後どう変わるかはわからないので、今後も動向は見ないといけないですね。

全てのサービスとGoogleが競合化する！？

白石：次のテーマ「Googleの競合化」ですが、これはどういう意味でしょうか？

辻：最近、Googleでグルメ関連の検索をすると一番上に地図が出ますよね。ユーザー評価もあるし、ローカルガイドにもなって、とても便利ですよね。あと飛行機の予約ができるGoogleフライトも、ホテルの予約もできるし、ユーザーには便利でいいサービスなんですが、これらによって奪われてしまったサービスも出てきます。

Googleマップではスマホを持ったユーザーの行動がオプトインで記録されていますが、そのあたりの独自データを激しく使い出すと、他のサービスはなかなか太刀打ちできないですよね。

白石：あらゆるサービスにGoogleが競合として参入していくわけですね。

辻：増えていることはたしかです。Googleが持てない価値を考えて作るしかないんですが、情報を集めて出すサービスは勝ち目がなかなかない厳しい状況になると思います。

Web制作におけるSEOのポイントは？

白石：ここからはWeb制作におけるSEOのポイントについて聞いていきたいと思います。マークアップなどで気をつけることとかありますか？

辻：昔は「<strong>をつけろ」とかありましたけど、最近は効かなくなりましたね。私もマークアップを変えろという指摘はほぼしなくなりました。普通にミスのないマークアップでWebサイトを作れば評価されるので、SEOのためにマークアップで何かするということが減ってしまったんですよね。

ただ、サイト設計については口を出さなくてはいけないことが、多くなってきました。Googleは公式に認めていませんが、どんなユーザーがどういうページを見ていていて、どこで離脱しているかなど、ユーザー行動を見ているんですね。

白石：まあ、肯定しにくいですよね。

辻：Googleは否定するけど、一般ユーザーがWebページ内でどういう行動をするかが検索結果に影響するようになってきました。その影響力はどんどん大きくなっています。

白石：昔は内部リンクを充実させるために、人間が踏まなさそうなリンクをフッターに大量に仕込んでたじゃないですか。あれはまだ有効ですか？

辻：2012年くらいから一切やらなくなりました。そういう人が使わないリンクをはずして順位がかわるか実験を何度もしてみたのですが、一切変わらなかったんです。それからはSEOだけの目的でリンクを張ることはあまりしなくなりましたね。

白石：クローラーのためにAタグを書いておくのはもう必要ないんですね。

辻：これからはユーザーが使いやすいページを作ることを優先した上で、どうやって検索に強くするかを考えることが有効になってきます。例えば、グローバルメニューとかカテゴリとか本来はユーザ動線として強いはずなのに、ニーズがない情報が並んでるサイトってあるじゃないですか。ユーザが好む動線に検索ニーズもある情報をまとめるとか、マークアップとかよりもユーザーの検索ニーズを意識したサイト作り、などが重要ですね。

白石：ユーザーにとって自然な導線をちゃんと作り込むようにしなさいということですね。

辻：はい、それがSEOの観点として大事になったということです。

白石：一般ユーザーはあまり気にしてないと思いますが、URLは未だに重要ですか？

辻：少なくとも日本国内ではURLの深さとかは、最近は関係なくなくなってきました。パラメータをつけるとどうこうとかありましたが、今のGoogleだけでいうなら認識するようになってきた。ただし、Google以外の検索エンジンは上手く認識できない場合が多いので、やるしかないんですが。

白石：コンテンツづくりについても聞いてみたいと思います。昔、辻さんがGoogleに好かれるための記事を書いてたじゃないですか。検索エンジンには好かれるキーワードを散りばめて、見出しをちゃんと書いて、先に結論があって、見出しの近くに重要キーワード置いてとか。

辻：それは今でもまだガリガリ効きます。SEOを考えたキーワードは大事ですね。ただし、キーワードを書かなくても、テーマによって検索ニーズがあるものはランキングが上がるという流れもあります。

白石：以前流行ったキーワードたくさん入れたSEO用の記事も効くのでしょうか。

辻：そういう何も考えてないSEO記事は大分効かなくなりましたね。Googleはユーザーを見出したということもあり、読み込んでくれる文章じゃないとユーザーは離脱するので効果はなくなっていくと思います。

白石：AMPのSEO観点は何かありますか？

辻：AMPということだけではなく、考えなくてはいけないことがあります。例えば、最近はパーマリンクの重要性がすごく高まっていると思います。3年前くらいはパーマリンクのURLを評価をするサービスは少なかったと思いますが、最近はスマートニュースやグノシーなど、評価付けする存在が増えてきました。

URL単位で評価をするサービスにとって、AMPのURLでシェアなどをされると本来の記事と価値を統合するのに時間がかかったり、されなかったりすることもあります。他にも様々なデメリットはありますが、表示スピードが上がるといったメリットもあるわけで、メリットデメリットを考えて判断するべきですね。

個人的には、ニュースなどAMPに対応すると表示枠が増えるジャンル以外は、まだ様子見をするべきだと思います。先に言いましたパーマネントリンクの問題も今後の仕様改定で解決されるようですし、AMP関連の仕様はまだまだ進化を続けています。対応の工数も大きいですし、大きな利益が見込めないならもう少し仕様が固まってからでいいのではないでしょうか。

パフォーマンス・スピードはSEOに影響しない！？

白石：パフォーマンススピードが高いサイトは評価するとGoogleが言ってますが、実際はどうでしょう？

辻：実はそれ勘違いなんですね。Googleのウェブマスターブログでは、極めて遅い体験を提供しているサイトだけを落とすと言っています。昔行った以前の実験によると、読み込み速度が25秒以上かかるサイトはだいたい順位が落ちました。

白石：辻さん、そんな実験もやってるんですね(笑)。

辻：はい！どれだけ速くしてもランキングが上がることはなく、遅いサイトが落ちます。ただ、スピードを上げることはユーザーの行動が良くなります。結果的に順位が高くなることはあります。

個人的な経験では、サーバーの速度がある程度早ければ、さらにサーバ環境を向上してもユーザー体験は目に見えて変わらないですよね。それだと順位も変わりません。ただ、速度の実測値は変わらなくてもCSSの配慮などでサクサク動いているような感覚にしたほうがランキングが上がるんですよね。

白石：ということは、本当の速度を見ているのではなく、Googleはユーザー体験の方を見ているということですね。

辻：はい、良いユーザー体験を提供すれば順位が上がります。勘違いしてはいけないのは、速度改善でユーザー行動を良くするのは素晴らしいことなんです。

白石：なるほど。ユーザーのためにやるのはいいことなのに、SEOのためにやるのは違うということですね。

白石：最後はネイティブアプリのようなUXをWebページでも提供することができるProgressive Web Apps（PWA）について。プッシュ通知がWebサイトでできたり、ホームスクリーンにアイコンが出てアプリをダウンロードしてもらえたら、以降はアプリで作ってもらえるとか、クロスプラットフォームで対応できるなど便利な機能がいろいろある上に、SEOにもいいということで盛り上がっています。

辻：Googleはアプリ内のユーザの行動はあまり把握できていませんよね。ユーザーが自社アプリに流れた結果、メインサイトのユーザ行動が減って検索順位が落ちる影響は明らかにあります。そういう観点ではPWAはアプリより良いと考えています。

白石：PWAが有望なのであれば、クロスプラットフォームでWebページからアプリ版も作れる。SEO効果もあるし、ゲーム仕様でなければ普通に作れるし、今後は全部PWAでいいんじゃないでしょうか。

辻：PWAのニーズは高まっていくでしょうね。逆に、アプリ開発しかできない開発者はPWAによって活躍の場が減っていくかもしれません。

「AI First」で変わるSEOの未来

白石：「AI First」という言葉をいままで使っていませんでしたが、未来の話もしたいですね。

辻：Googleが公式でも「AI First」と言うようになってきましたね。プロダクトの全てにAIを入れ出しているので、今後AIでいろんな判断がされるようになっていくのが一番影響されるところです。

白石：これまで、Googleがユーザー行動を見ているという話がたくさんありました。結局のところ、今までのクローラーが単純すぎたということで、普通の人間がページを見たときにいい印象を受けるかを判断をするようになる。人間の判断にどんどん近づいているということでしょうか。

辻：その通りだと思います。その状況でSEOを考えると、GoogleのAIに上質な餌をどう与えていくかを意識することが大事になっていきます。

白石：「餌付け」というのはユーザーに有益な情報を提供しようということですね。Googleに情報をあげるとAIが賢くなる。Googleはその先に何を作っていくのか考えちゃいますね。

辻：そうですね。その先に過剰な怖さを感じている話もよく聞きますが、「Google怖い」は「電気怖い」と同じような話かなとも思っています。Googleを恐れるときは正しく恐れるべきだと言っておきたいです。

白石：ただしく恐れろということですね。辻さんに大きな拍手をもって終わりにしたいと思います。ありがとうございました！

こんにちは、dotstudioのちゃんとくです。HTML5Experts.jpでは、昨年に引き続き新春企画として「Webの未来を語ろう 2018」を開催することになりました！

ブラウザ編に続く第2弾の今回は、2017年初頭のHoloLens発売に始まり、ARKit/ARCoreとスマートフォン対応の拡充、各地にVR Zone誕生と話題を集め、一挙にホットトピック入りしたxR技術の現在と未来について。各領域のプロフェッショナルを招き、編集長の白石氏をMCに、さまざまな立場から意見交換を行っていただきました。

広がるxR領域の現状と課題、そして未来への期待について、なかなか聞けない学会話や開発事情など、たっぷりとお楽しみください！

ゲスト紹介

諸星 一行氏（いっこう氏）

Mercari, Inc. R4D
株式会社メルカリの研究開発組織”R4D”でVR/AR/MR領域を担当するリサーチエンジニア。 業務の傍らで”xR Tech Tokyo”や”例のハッカソン”といった勉強会やハッカソンなどのコミュニティ運営を行なっている。日本バーチャルリアリティ学会認定VR技術者。

前本 知志氏

株式会社ホロラボ / システムフレンド Co-founder（取締られ役 兼 取締役）
数年前よりモーションセンサーの面白さに取りつかれKINECTを趣味で触り始め、会社にXRや医療機器開発のチームができる。 センサー系飲み会コミュニティTMCNや、HoloLensに特化した株式会社ホロラボの立ち上げメンバー。 米国MicrosoftよりMixedReality分野のMVPとして認められている。

千葉 慎二氏

日本マイクロソフト株式会社
ハドソン中央研究所でゲームのベースシステム等を開発後、Microsoftに転職。ゲーム機向けWindows OSやXbox SDKの開発などを行う。 近年はKinect、HoloLensといった新技術を啓蒙し、研究者や学生向けの支援活動を担当。

2017年に印象に残ったxR領域のトピックは？

白石: 皆さま、本日はお集まりいただきありがとうございます！まずは簡単に自己紹介と、2017年のxR界隈で1番印象に残ったことを教えてください。

いっこう: こんにちは、メルカリのいっこうです。2017年のホットトピックは、MicrosoftがxR領域に本腰を入れてきたことですね。HoloLens、immersiveと、デバイスをいろいろと出してきたのが衝撃的でした。

前本: 株式会社システムフレンドや株式会社ホロラボで取り締まられ役をしている前本です。僕にとっても、HoloLensが発売されたことは大きな出来事でした。HoloLensが出たから、ホロラボという会社もHoloMagiciansというコミュニティもできましたし。HoloMagiciansでのHoloLens日本発売直後のイベントで、80人もの購入者が一同に集まってみんなで繋げたワクワク感はすごかったです。

白石: 80人×約30万……2400万円……。お金の話になるとすぐ計算しちゃう（笑）。

▲ 発売からわずか2週間後に80人が集ったHoloMagiciansミートアップ

千葉: Microsoftの千葉です。もともとはハドソンというゲーム会社でゲームの根底となる部分のシステム開発をしていて、Microsoftに転職してからは16年くらいずっとXboxチームにいました。HoloLensはKinectから派生してできたところがあって、Xboxチームでは一部Kinectの開発にも携わっていたので私がHoloLensのプロトタイプを見たのは実はかなり前のことなんですよね。その頃から開発を続けて、ようやく世に出てきたな、という感覚です。

▲ Xboxをローンチした人にだけ配られるというジャンパーを着た千葉氏

前本: 千葉さんのことはKinect時代から尊敬しているんですよ！僕は当時からKinectで遊んでいて、それがどんどん進化してHoloLensの形になるのを目の当たりにして、感動です。

千葉: お二人がHoloLensをトピックに挙げてくださったように、私にとっては多くの人にHoloLensを使っていただいているということが2017年最も印象深いことです。それとMicrosoftに勤めながら、東京女子医科大学で学生としてHoloLensを使った医療の研究をしています。業務でも研究でもHoloLensを使っています。

白石: えーっ、じゃあ千葉さんは女子大生？周りは女子ばっかりですか？

千葉: 私がいるのは大学院なので、おじさんばかりですよ（笑）。

白石: ちなみに私はHTML5Experts.jpの編集長と、TechFeedというエンジニア向けのキュレーションサイトを作っています。私自身はWeb領域の人間でxRについては素人なので、今日はバンバン質問させていただきます！

VR/AR/MRとは何か？デモで見る各領域の現在

現実と仮想が複合するMRの世界観

白石: 2017年のホットトピックはお三方とも「HoloLens」に関することで一致しましたね。まずはMRについて、現在の様子を伺っていきたいと思います。

千葉: まず伺ってみたいんですが、「Mixed Reality（MR）」という言葉について正しく理解している自信があるという方？

（会場、手が挙がらない）

千葉: なかなかいないですよね。それが一つ、現状の課題なんです。簡単に言うと、MRは現実の世界と仮想の世界が融合しているという形です。どう融合するかにも、現実世界の中に仮想世界を入れ込むとか、逆に仮想世界に現実世界を入れ込むとか、いろいろな考え方があります。MRは、テレビの中に入り込んで、仮想のつくられた世界を見渡すことができ、そこから現実の世界も覗くことができる、というような考え方です。

白石: 仮想と現実がMixする、という意味合いなんですね。HoloLensのデモでは、現実世界をキャラクターが動いたり、現実の壁を割っていたり、というのを見ますが、それはどちらなんですか？

前本: その捉え方は宗教論争に近いものがあるんですよ。

いっこう: Microsoftさんの提唱するMRと、もともと日本バーチャルリアリティ学会が学問として20年以上研究している考え方とで違う部分があるんです「VimかEmacsか」という話に近いです（笑）。

白石: あー、よくわかりました。それは大変だ（笑）。どういう部分でお互いに違うなと思っているんですか？

千葉: デバイスを主体で見るか、現実世界を主体で見るかなど……考え方の違いですね。揉めているわけではなく、「そういう考え方もあるよね」という感じなんですが。

白石: なるほど。話の抽象度が高まってきたので、HoloLensの現在がわかるデモがあるといいんですが。

▲ DNP「AR/VR/MRを活用した体感型デジタルショールーム」（動画リンク）

前本: これはHoroLensだけでなく他のデバイスや技術を組み合わせたデジタルコンテンツエキスポでの展示なんですが、シェアリングという技術を使って同じ空間を共有する仕組みです。

白石: これはHoloLensと、スマートフォン？

前本: そうです。HoloLensとGoogle Tangoの技術を使って、デバイス同士がお互いの位置を認識し、他の人が操作したことを他のデバイスでも検知できるようになっています。「いま隣の人がこの商品をいいねした」とか、「この商品を買った」とか、デバイスを介して共有できる仕組みです。

千葉: 複数の人が同じ世界をそれぞれ見ることができる、というのがシェアリングですね。

前本: 実はtoBの事例も増えてきて、製造業とかデザインの現場とかで活用が進んでいるんですよ。 ▲ ホロラボ「AR CAD Cloud」（動画リンク）

前本: AR CAD Cloudは、CADデータをHoloLensにダウンロードしてその場ですぐに見られるサービスです。モノを作る前に、作ったらどうなるかが確認できる時代になっています。

千葉: 日本で一番最初に業務にHoloLensを取り入れた事例は、日本航空さんですね。1つはパイロットの訓練向け、もう1つは整備士の訓練向けシミュレーションです。飛行機は飛ばしていないと利益効率があがらないので実機での練習は難しく、シミュレータも好きな時に使えるわけではなかった。新人の方なんかは、机の上に印刷した紙を広げて手を置いて、ということをしていたらしいです。

VRでもいいんじゃないかと思うかもしれないですが、訓練では自分の手が認識できることが重要だそうで、外の世界をシースルーで見ることができるHoloLensが向いていたようです。

白石: MRとVRは似たようなことができそうだけど、確実な違いがあるんですね。MRのいいところは「現実世界も見えている」というところですかね。

千葉: そうですね。VRにも現実世界を取り込むことはできるんですが、結局カメラであって目で見る現実とは違うものなんですよね。

白石: Windows MRというのがありますけど、どういうものなんですか？

千葉: 最初のデバイスとしてHoloLensが発売されたんですが、やはりコンシューマー向けとしては高額じゃないですか。裾野を広げたいという意図で、Windows MRと名前を変えて、HoloLensはその一つということになりました。

白石: HoloLensはハイエンドなWindows MR対応デバイスの一つ、というところでしょうか。

千葉: 開発者視点でいうと、HoloLensの開発ノウハウでWindows MRが開発でき、逆も然りと。デバイスも複数社から出ていて、4〜5万円程度とそれほど高額ではないので手軽さは広がったかと思います。

被るだけではないVRの領域

白石: 続いてVRについても伺っていきたいです。

いっこう: 実はVRの歴史は長く、日本バーチャルリアリティ学会は25年ほど、研究分野としてのVRは50年ほど前からあります。ちなみに学会的にはVRを「仮想現実」と訳すのは少しNGで、アカデミア的には「人工現実感」を推していきたいです。……細かいんですが、一応（笑）

白石: 訳にも違いが出るんですか。いまVRではどんなことが実現できるんですか？

いっこう: バーチャルというのは「仮想」ではなく、「姿形はそのままだけど実際にはないもの」なんです。VRというとヘッドマウントディスプレイのイメージですが、実際には被らなくてもそこにあるという捉え方です。例えばドームスクリーンとか、匂い系のデバイスとかもVRですし、舌に電気を流して味を感じるのもVRです。頭に電気を流して、幼女にビンタされる感覚を味わうというのもVRです（笑）。

白石: 世界はそんなところまで行っているんですか（笑）！？

いっこう: 開発者レベルなんですけどね。学術としてのVRとコミュニティのVRはやや溝があり、もう少しうまく繋がったらいいなと思っています。VRはMRに比べてデバイスが多いので、一般のガジェット好きが手軽に楽しめるのがいいところかなと思います。

白石: 先ほどMRはシースルーなところが利点という話がありましたけど、VRの利点はやはり没入するというところですかね？

いっこう: 被るタイプのものだと完全没入型というメリットは1つ大きいですね。あとは学会的な見方ですが、VRは「3C/3E」のための道具なんです。3CはCreation（創造）、Control（制御）、Communication（通信）。3Eは、Elucidation（解明）、Education（教育）、Entertainment（娯楽）です。

Control（制御）はいわゆるロボット制御だけでなく、例えば人が入れない原発などを遠隔で見る、というもVRの領域です。

Communication（通信）というと、最近だとVirtual YouTuber（VTuber）やVRChatが流行っていますよね。VTuberではキヅナアイちゃんがいて、去年くらいから他のVTuberがどんどん出てきてかなり盛り上がっています。アイちゃんを知っている人？

（会場、ほとんどが挙手）

白石: VTuber、VR Chat、初耳です……！流行っているんですね。

いっこう: アイちゃんに関しては既にかなり稼いでいて、スタイルとして確立しているかなと。加えて、最近は割と簡単にVTuberになれる仕組みが整ってきたと思います。ちょうど先日UnityとWindows MR（Lenovo Explorer）を使って、ほぼコードを書かずにVTuberになるという記事が上がっていました。

⇒ 参考: windowsMRでバーチャル生放送をするためのセットアップ

白石: これは、配信をする側がデバイスを被っているということなんですか？

いっこう: そうです。鏡を置いて、ボイスチェンジャーを使って。最近はあえて声はおっさんのままというVTuberが流行っていますが（笑）。

白石: うーん、すごいですね。VR Chatというのは？

いっこう: VR Chatはここ最近でグッとユーザが伸びているんですが、セカンドライフのようなイメージで、自分のアバターを使ってワールドワイドにコミュニケーションできるものです。まだ高いんですが、一般人でも自分の身体を3Dスキャンしてアバターに使う人も出てきました。

⇒ 参考: 3Dスキャンした実写アバターで「VRオフ会」する猛者が登場　これもうオフかオンかわかんねぇな……

白石: これはどうやって移動するんですか？実際に歩いて動く？

いっこう: 手に持ったコントローラが紐付いて手の動きを自然に見せてくれ、足の動きは補完されます。

白石: なるほど。3Eの方だとどのような具体例があるんでしょうか？

いっこう: Entertainment（娯楽）ではVR ZoneやVR PARK TOKYOなどが流行っていますし、開発者もエンタメ系の用途で使っている人が多いですよね。HoloLensでもエンタメはできるんですけど、広く受けているのは没入感の違いかなと思います。

千葉: 現実世界から離れたいこと、ありますもんね（笑）。

各OS対応で盛り上がるAR領域

白石: AR領域でいうと、ARKit、ARCoreがすごく盛り上がりましたよね。

千葉: GoogleのハイエンドなARプラットホームTangoは終了が決まってしまいましたね……。後続でマス向けのARCoreが発表されました。

いっこう: ARKitの方はアップデートで、これまで水平だけだったのが垂直も検出できるようになり、できることが増えましたね。

白石: スマートフォンの普及率からいうと、xRの中では一般普及するのはARが早いんでしょうか？

千葉: 手軽に使えるという意味ではそうでしょうね。

前本: VR、MRの課題は、手軽じゃないという部分がありますからね。買わないと、被らないといけない。最近のARはARKit/ARCoreの登場で、すごく現実感が出てきました。10cm動かすと10cm動くように精度が上がって、一つ上のステージに上がったなと思います。

▲ AR World Sharing Demo（動画リンク）

いっこう: Web技術の文脈では、WebVR、WebARが有用ですね。これまでアプリでしかARが実現できなかったのが、ブラウザがgetUserMediaに対応して、Webベースでカメラ情報を取得して実現できるようになったのが大きいです。MozillaさんがWebVRとWebARを統合したWebXRを推していて、W3CではWebVRは既にAPIが用意されていますが、次のバージョンアップではWebXRにしようということになっています。

⇒ 参考: WebXR Device API Specification

いっこう: 簡単にVRアプリケーションを開発できる、WebVRフレームワークのA-Frameもかなり盛り上がっていて、コミュニティが成熟してきていますね。

⇒ 参考: A-Frame

さらなる発展へ向けて技術的課題の解決が必要

白石: ここまではそれぞれの技術の現状を伺ってきましたが、さらなる進歩へのボトルネックや技術的な課題といった部分も聞いてみたいですね。

千葉: デバイスの制約は一つ大きな課題ですね。例えばデバイスを被らないといけないし、デバイスの処理能力がそれほど高くないし、バッテリーの持ちの問題もある。VRでもバッテリーとは逆にケーブル接続の制約があるかと思います。

白石: HoloLensって、実際には電池はどれくらい持つものですか？

千葉: 通常の使い方だと3〜4時間、積極的に使っていると2時間ほどです。技術の進歩で、将来的には解決されていく課題だとは思いますが。

白石: 逆に2012年頃に作っていたプロトタイプから考えるとどうですか？

千葉: 当時はいろいろ剥き出しで、サイズも大きくケーブルも多く、本当に最終製品になるんだろうか？と不安でした。でもやっぱり技術の進歩があって、5年経ってわずか579グラムです。今の課題も5年後、10年後と解決されていくはずですね。

前本: 2017年後半は開発環境の課題が多かったですね。HoloLensのアプリケーションはまずUnityで開発して、Visual Studioに書き出して、HoloLensにデプロイするという流れなんですが、それぞれのバージョンの違いで整合性が取れないようなことがあってかなりバッドノウハウが蓄積していました。

白石: 開発環境の問題があったんですね。

前本: いまはだいぶ落ち着いて、初めての人でも開発しやすくなりました。発売当初に初めてHoloLensを触ったときは、こんなことが生きている間にあるんだ！と思ったのに、すぐに視野が狭いとか腕が疲れるとか、思うところがでてきて、終わりがないです（笑）。

千葉: 本当ですよね。今から10年前を考えてみると、2017年にこんなデバイスがでていると想像できなかった。10年先は想像できないけど、たぶん10年後も満足していないと思います。人間の探究心って便利じゃないところを見つけてしまうので終わりはないけど、気がついたらみんな普通に使ってましたという感じになるんじゃないかと思っています。

xRで盛り上がるビジネス領域

白石: xRの技術的な側面をたくさん聞かせてもらいましたが、実際にはxR界隈ではどういうビジネスが生まれているんでしょうか？

いっこう: VRでいうと、アメリカのVR/AR専門ファンドのThe Venture Reality Fundが年に2回作成しているVRカオスマップが参考になります。

▲ The Venture Reality FundによるVRカオスマップ

いっこう: 機械、ソフト、ハードとだいぶプレイヤーが多くなっていると思います。その中で一部日本の企業も入っていて、健闘しているなあと思いますね。

白石: 大カテゴリが「Applications/Content」「Tools/Platform」「Infrastructure」。ホロラボさんはアプリケーション領域ですよね。どういうお仕事がメインですか？儲かっていますか（笑）？

前本: まあ、お陰様でぼちぼち……（笑）。受託で作る場合と、AR CAD Cloudのように自社パッケージとして作る場合とがあり、始めたばかりなのでなんでもアリ、という感じです。

いっこう: ゲームカテゴリだとバンダイナムコさんが入っていますね。もともとが大きい会社ですけど、VR Zoneもかなり盛り上がっていますし、VR領域では日本で一番じゃないかなと思います。

白石: Tools/Platformというと、去年Oculas Riftが値下げをしたじゃないですか。正直、売れてないのかな？と思ったのですが……。

いっこう: 逆に、値下げをしたことでめちゃめちゃ売れたと思います。Windows MRも手頃な値段なので、結構売れているのではと思っています。

千葉: そうですね、各社お互いの価格を意識しつつ値段をつけていると思います。

xRでどうやって「URL」にアクセスするか

白石: 会場からも質問を受け付けてみたいと思うんですが、どうでしょうか？

参加者: 現在のマウスとキーボードで扱うコンピュータのUIは、平面を前提にしているじゃないですか。xRのような3Dで見られるHPやメディアって、どういう形になっていくんでしょうか？例えばWebページにアクセスしたい時、URLの入力はどうするんだろうって想像がつかないんです。

前本: 一つあるのは、リアリティがあるからといって、リアルと同じようにしないといけないと疲れるんですよね。マウスやキーボードのように、操作性を上げる入力装置があったほうがいいだろうと思います。

いっこう: HoloLensってエアタップなど手を前に出して操作しますけど、結構腕が疲れるんですよね。VR空間の移動も、ワープ方式やコントローラを使う方式があるけど、あまりしっくり来ていなくてまだ確立していない。

千葉: これまでのUIが生きる部分と、人間の通常の行動がそのままUIになる部分とあると思います。URLでいうと声を発したら文字になって適用されるというのも いいかもしれない。

いっこう: いろいろな方法を試していかないとなあというところですよね。

2020年に向けた期待

白石: たっぷりと伺ったところで締めたいと思いますが、最後に2020年の少しだけ未来に、xRはどうなっているか想像や期待を伺わせてください。

いっこう: 2年後かあ……。VRはハード面では一体型が出てきて、画質も上がって、さらに進歩すると思うんですけど、一般普及するのは正直まだまだかなあと思っています。

白石: どうしたら一般普及するんでしょうね？キラーコンテンツの登場？

いっこう: Yahoo!BBがモデムを無料で配ってADSLが普及したように、国や機関が無料で配るくらいしないと普及しないんじゃないかと思います。

白石: 無料で！確かにそうですね。前本さんはどうでしょう？

前本: 現実的には通信が5Gになったり、視野が広がったりと、技術的な課題がクリアされていくと思います。期待でいうと、xRネイティブな世代が遊びとしてVRやARとAIを連携したりしていて、そういう遊びの中からすごいものが出てくるんじゃないかと密かに思っています。もしかしたら攻殻機動隊も実現するんじゃないかな。

千葉: 技術的な進歩はもちろんですけど、私が期待したいのは「xR盛り上がっているぞ」という一体感ですね。熱量のある人が増えて、ビジネスも増えて、私自身この領域の仕事にもっともっと関われたらいいなと期待しています。

白石: それぞれの熱いお気持ち、ありがとうございます。本日は大変勉強になりました！

HTML5 Experts.jp 副編集長兼エキスパートの吉川です。昨年好評だった「Webの未来を語ろう」企画を2018年もやります！

今回はパネルディスカッション形式で、HTML5 Experts.jp 編集長の白石が、ブラウザベンダーのGoogleのデベロッパーアドボケイトのえーじさん、 Microsoftのエバンジェリスト物江さんをお迎えして、興味深いお話を多数お聞きしました。

会場も交えたトークは、今後のWeb業界の動向を追いかける上で、重要な内容となっているので、ぜひ読んでみてください！

2017年のWebで印象に残ったことは？

白石: まずは簡単な自己紹介と、2017年のWebで印象に残ったことを教えてください。

えーじ: えーじです。Googleでデベロッパーアドボケイトをしています。もともとは、Google Chromeのアドボケイトという位置付けでしたが、最近はもっと広くなって、Web全体のアドボケイトを担当しています。 特にChromeだけの話に限らず、Web全般について話をしていますね。これには、我々のチームの理想として、Webすべてに貢献していこうという想いがあります。

2017年で印象に残ったことは、SafariがService WorkerとPayment Requestに対応すると表明したことがすごく意義深いと思っています。

物江: 物江と申します。Microsoftでエバンジェリストをしています。以前はWebに軸足を置いていたんですが、現在はWebだけに限らずISV(Individual Software Vendor)、独立してサービスや製品を提供しているパートナーさん向けに様々な技術の啓発を行なっています。Webについては、個人的なものも含めていろいろ活動しています。

2017年に印象に残ったことは、WebAssemblyやPWA（Progressive Web Apps）などについて、ブラウザベンダーがきちんと足並みを揃えて、仕様を策定するようになったということですね。非常にいい流れになってきていると思います。

▲左から、日本マイクロソフト株式会社 物江修さん、Google デベロッパーアドボケイト えーじさん

白石: 皆さん、ありがとうございます。ついでに私の2017年で印象に残ったこともお話ししておくと、個人的にはdev.toや日本経済新聞社の日経電子版が爆速だったという、そういう事例が出てきたのは印象的だったなと思います。裏側でHTML5やWebの最先端技術とか、そういったものを使って1段階上のレベルの速さを実現している。

Webプラットフォームベンダーやコミュニティの皆さんの啓蒙活動などもあって、PWAをはじめとしたWeb技術だとかパフォーマンスだとかが、ビジネス上も重要であるというところも浸透してきている。その結果として、Webプラットフォームの機能がフル活用されつつ、パフォーマンスというところに影響がでた良い例かなと。

今回は、Webの過去・現在・そして未来を語るという構成で進めてみたいと思います。

イントロダクション:HTML5は世界を変えたのか？

白石: 2017年以前のWebを振り返ると、ブラウザ戦争などの分断化があって、そこからHTML5のムーブメントが起こり、Webの様々な仕様が生まれてブラウザに実装されました。

ただ、それら「HTML5」のムーブメントは世界を変えたんでしょうか？ これまであまり、そういう振り返りをしたことがなかったので、一度やってみたいなと思っていたんです。お二人はどうお考えですか？

物江: そうですね、一般ユーザーの目からすると、確かにあまり変わっていないかもしれません。例えば、YouTubeのプレイヤーは、FlashからHTML5になりましたけど、変わったって気がつく人はあまりいませんよね。普通の人は、きっとまったく意識せずに使っている。HTML5でできたことは、とっくにFlashでもできていたわけで。

でも、開発者にとっては大きな変化がありましたよね。結局、開発者はみなHTML5を使っています。これはなぜかというと、HTML5がシンプルだからこそだと思うんですよ。

エキスパートの竹洞さんがいいことを言っていたんですけど、Webが素晴らしく進化したのはKISSの原則(*1)のおかげといっていました。つまり、誰でも簡単に使えるからこそ普及した。わざわざFlashを使わなくても、Web標準技術だけを使えばいろんなことができるようになった。それによって作り手側の裾野が広がって、以前よりもリッチなコンテンツがたくさん出るようになってきたのかなと思います。

*1 … “Keep it simple, stupid” （シンプルにしておけ！この間抜け）、もしくは、”Keep it short and simple” （簡潔に単純にしておけ）という経験的な原則の略語。Wikipedia

えーじ: ぼくも、世界は変わったと思います。やっぱりHTML5でWebを変えようっていうムーブメントがあったこと、それ自体が良かったと思うんですよね。良い意味でのブラウザ間の競争が起きて、どんどん新しい提案がなされて、共通して使えるものがどんどん生まれていった。

ちゃんと数えたことないですが、HTML5の機能でみんな当たり前に使うようになったものっていっぱいあると思うんですよ。例えば、CSS3で角丸を使うっていうのももう当たり前にみんなやっているし、それが動かないブラウザはほぼ、ない。そういうものが当たり前に使えるようになったっていうのは、一昔前からすると全然状況は異なっている。そういう意味では、相当変わったと思います。

白石: そういえば、元Mozilla Japanの浅井智也さんに以前教えてもらったんですが、Web関連技術を全部まとめた図があるんです。これ、曼荼羅図みたいな感じなので、「Web曼荼羅」なんて呼ばれているそうです(笑)。

HTML5とその関連技術（webapi.link）

こうして考えると、HTML5のムーブメントはたくさんのものを生み出しましたねえ。一般のユーザーからはあまり変わってないように見えても、「それは時間をかけて変わっているから」という面もありそうですね。

えーじ: はい、そして、これだけのものがたくさん生み出された結果、Webはアプリケーションプラットフォームになった。それが、HTML5以前との大きな違いだと思いますね。

Webは難しすぎる─Webプラットフォームの現状と課題

白石: では、iOSやAndroidといった他のプラットフォームとWebプラットフォームとを比較すると、Webはどういう立ち位置にあるとお考えですか？

物江: Webプラットフォームは時間をかけてここまで成熟してきました。機能的な面では、他のプラットフォームにもひけをとらないというところまで来たんじゃないかと思います。

そして今、Progressive Web Apps (PWA)が浸透しつつあることが、今後のWebにとってはすごく意義のあることだと思っています。 PWAって、ある意味ひとつの理想の到達点だと思うんですよね。Javaなどが理想に掲げていた「Write Once, Run Anywhere」を、PWAは真の意味で実現するわけです。 これ、次のWindowsの大型アップデートでPWAがデスクトップアプリっぽく動いだり、Windowsストアからインストールできるようになるから言っているわけじゃないですよ(笑)。

白石: そこでいつも言われているのが、Webアプリって動作が遅いんじゃないかってことですよね。

物江: ただ、そうした問題についても、Webプラットフォームは長いこと取り組んでいて、もはやあまり問題にならないレベルじゃないかと思います。 ブラウザの実装という面でも、仕様の面でも、絶え間ない改善が続けられてきました。

仕様の面でそうした部分について期待できるのは、やはりWebAssemblyですね（筆者注: ブラウザが高速に実行可能な、ポータブルなバイナリ形式）。 昨年、モダンブラウザが同時にWebAssemblyのサポートを表明するということがありましたが、これでWebの速度はまた一段階アップすることが期待できます。

あとはやはりハードウェアの進歩が解決するものも多いでしょう。ちなみに、今のWeb技術の素晴らしいところは、ハードの性能に縛られた設計をしていないこと、どこでも同じWeb技術が動作することだとも思います。

例えば昔、貧弱だった携帯電話の機能に合わせた仕様で、HDMLやCHTMLというモバイル専門のタグがありましたが、今はもうほとんど残っていません。結局、性能に関わる問題は時間が解決してしまう部分も大きいんです。いま大切なことは、「いかに人間が作りやすいか、使いやすいか」が重要になってくるかなと思います。

えーじ: ぼくも、パフォーマンス面は既にあまり課題とは考えていません。それよりぼくが課題だと感じているのは、開発者にとってのWeb技術はかなり複雑になってしまっていることです。

例えば「Extensible Web」というのを聞いたことがある方がいらっしゃると思います。これはWebの技術設計に対する、ここ数年における指針のようなもので、具体的には「標準としては、ユースケースを規定しない低レベル（低レイヤー）なAPIを提供する」というものです。

そうすることで、そうしたAPIを使用したハイレベルなライブラリだとかベストプラクティスが、開発者の手によって作られることを期待する。こうすることで、「ハイレベルだけど使われないAPI」が標準で規定されてしまうという問題を解決しようとしています。

ただ今は過渡期なので、低レベルなAPIがどんどん増え、ライブラリも量産されていて、はっきり言って混沌としています。例えばService Workerもすごく低レベルなAPIで、実際に使うとなるとなかなか難しい。

そこにGoogleがWorkboxというライブラリを出していたりするんですが、それを使うと簡単にServiceWorkerを使える一方で、ServiceWorkerもライブラリもどちらも学ばなくてはならない。

これがWeb Componentsなんかだと、仕様そのものがどんどん変わっていて、なかなか安定しない。Polymerというライブラリを使おうにも、Polymerも仕様に合わせてどんどん変わっている。どの時点の仕様が正しいのか、検索したときにどれが最新なのかわかりづらい。そういうところが複雑で、開発者はみな苦労してるんじゃないかなと思います。

個人的には、以前Webpackにやられたことがありまして(笑) 。将来的にはES Modulesが広まれば、そういうビルドプロセスを経なくてもうまく動くようになるんだと思うんですが、今は過渡期として、やっぱりGulpなりWebpackなりRollupなりを使う必要がある。

ビルドツールも次々に生まれるし、フレームワークもそう。フレームワークとビルドツール、様々なライブラリも組み合わせなくちゃならないし、ベストプラクティスが簡単にはわからない。その辺がかなり複雑になっているなと感じています。

各ブラウザベンダーのこれからの動向は？

白石: 皆さんご自身の会社の立場からお聞きしたいなと思うんですけど、ブラウザベンダー各社がどういう想いで、どういう方向を向いて実装しているのかをお聞かせください。

えーじ: 会社（Google）としての方向性はもちろんですが、チーム内でWebに関する課題を共有して、その解決策を探ることは普段から行っています。

例えば、先ほど挙がっていたパフォーマンスを例に挙げましょう。

実はJavaScriptのパフォーマンスって、もうあまり問題にならなくなっているんです。むしろ悪いのはレンダリングの部分で、そこを速くするための努力はずっと続けています。

あと、ネットワークの遅延もすごく大きい要因なので、ServiceWorkerみたいな仕様を提供することで、スピードの課題に開発者自身が取り組みやすくする。

さらに、パフォーマンスに関するベストプラクティスを開発者の皆さんと共有するのも重要です。

このように、課題一つとってもたくさんのアプローチがある。こういう活動を、チーム一丸となって同時に取り組んでいるという状態ですね。

白石: なるほど。ちなみにGoogleの中で、「今のWebはこういう課題があるね」みたいな、そういう話し合いっていうのはよくされるんですか？どんな議論がされてるのか興味があります。

えーじ: はい、常にやってますね。世界中から集ってきた情報を、雑談ベースでやり取りするような感じです。

例えばこれからGoogleがインドでももっと使われるようにするためには、インドの市場を考えなきゃいけない。しかしインドは全然違う世界だと。

例えばネットワークにしても、今われわれが4Gは当たり前に使ってますけど、向こうの世界は2Gなんです。3Gですらない。なのに、何MBっていうファイルをダウンロードしないと見れないサイトっていうのはざらにあるわけですよ。そういったネットワーク環境の悪いところに対して、開発者の皆さんがサービスを提供しようと思った時にどうするのか。そういう課題がインドに進出しようと思っているチームから上がってきたりします。

他には例えば最近は、アクセシビリティにもかなり力を入れていたりもしますね。アクセシビリティに強く関心のある人たちがチームに入ったことで、Webのアクセシビリティをもっと良くするための話し合いや仕様の提案なども活発に行なっています。

物江: Microsoft Edgeは、相互運用性とセキュリティ、アクセシビリティとパフォーマンスの4つが何においても優先されています。

例えば相互運用性でいうと、 -webkit-text-stroke というベンダープリフィックスがあります。これ、以前はWebKit系のブラウザでしか動かなかったんですが、現在はEdgeでも開発中なんです。多くのサイトで使われているような機能については、全部同じように動くようにするというのを優先的にやっています。

アクセシビリティに関しては、画面に表示されるすべてのテキストについて、スクリーンリーダーのような外部のプログラムを呼び出せるような仕組みが、WindowsにはOSレベルで入っています。それを使って、アクセシビリティを強化するような仕組みがEdgeに入っていたりしますね。

パフォーマンスについては、Chakra（EdgeのJavaScriptエンジン）のパフォーマンスアップを継続的に行っています。特に、こないだのアップデートでようやくブラウザ内部のリファクタリングが終わったようで、Edgeが出た頃からのパフォーマンスでいうと、3～4倍速くなってます。

白石: リファクタリングっていうのは、Internet Explorerから引きずっているコードがかなりあるのを書き直すって話ですよね。それが行われているって話はだいぶ前に聞いていましたが、ついに終わったんですね。

物江: はい、ほぼ全部終わったんじゃないかと。もともとEdgeのレンダリングエンジンってTrident（IEのレンダリングエンジン）から派生したものなので、20年以上前のものということで、根っこの部分で仕様が古い部分があったんですよ。その修正がようやく終わったという感じです。これから先は、Edgeの開発はどんどん加速していくんじゃないかと期待しています。

あとは、やはり2000年代と比較すると、ユーザーの意見をより開発に取り入れようという姿勢が顕著になったかと思います。Windowsをお使いの方はわかると思うんですが、フィードバックHubというのがありまして、そこでバグの報告だとか、追加してほしい機能をリクエストできるんですよ。そのリクエストのベット数が多いと優先度があがっていって、対応されるというようになっています。

注目のWeb最新技術を一挙に解説！Web Payments、WebVR、AMP、PWA、WebAssembly…

白石: ではここからは、注目のWeb最新技術についていろいろお聞きしたいと思います。Web Payments、WebVR、AMP、PWA、WebAssemblyなどなど、仕様ごとに概要と現状をお話しください。

Web Payments

えーじ: 今までWebでお金を払うといったら、フォームを使ってクレジットカード番号を入れたりとか、どこかのサイトに飛んで、そこのサイトにあらかじめ保存してある支払い情報を使うといったことがほとんどだったと思います。Web Paymentsを使うと、ブラウザがネイティブで表示してくれるUIを使って支払いができるようになるというのが大きな特徴ですね。ちょっと見てもらうと、PolyCartというWeb Paymentsのデモサイトで確認することができます。

Web Paymentsのデモサイト（PolyCart）

ブラウザネイティブのUIを通じてクレジットカードの情報や、配送先、連絡先などの入力を促すことができます。そうして入力された情報はブラウザが記憶してくれるので、次からはクリックするだけで支払い情報を入力することができます。

もっとすごいのは、将来的には支払い方法を追加できるようになるんです。例えば、Apple PayやGoogle Payで支払うのも可能ですし、仮想通貨なども使えるようになるでしょう。

WebVR

物江: 以前から、「Web上でVRコンテンツを表示する」っていうのは、Three.jsなどを使って実現が可能でした。ではWebVRは何が違うかというとVRデバイスからのフィードバックを受けることができるんです。これによって、VRデバイスと深く連動したWebサイトを作ることができます。

それにWindows10だと、ネイティブでVRの環境をサポートしていて、WebVRに対応したWebサイトにいくと、自動的にVRゴーグル上で全画面表示してくれるようになっています。VRのビデオもそのまま見ることができるので、真の意味でシームレスにVRのコンテンツが提供できるようになっています。

個人的に楽しみなのは、VRをきっかけとして新しいUIが生まれてくることですね。既存のVRゴーグルを使ったことがある人はわかると思うんですけど、キーボードもマウスも何も使えないんです。そうすると新しいUIを考える必要があって、そこに新しい可能性を感じています。

えーじ: ちなみに最近はWebXRっていうらしいですね。VR、AR、MRをコンセプトに入れた仕様を作ろうとしているという動きもありますね。

AMP

白石: 次はAMPですが、これについては既にたくさんの方がご存知でしょうから、簡潔に。主にモバイル環境で、Webページを素早く表示できるようにするための、HTMLのサブセットですね。

えーじ: AMPの仕様自体もさることながら、AMPが基本的にWeb Componentsでできているのは興味深いです。Web Componentsの仕組みを使って独自のエレメントを定義していて、なおかつパフォーマンスも追求しているので、結果としてパフォーマンスのベストプラクティスの塊をWeb Components化したものになっている。大変面白いと思います。

Progressive Web Apps

白石: 次は、恐らく今年最大の注目キーワードProgressive Web Appsですね。これは（ずっと啓蒙してきた）えーじさんに語っていただくしかないでしょう。

えーじ: はい。とはいえPWAという言葉自体は、皆さんに意識してもらいやすくするためのマーケティング用語のようなもので、技術的な観点からはそれ自体意味がないと思っています。実際の中身はService WorkerだったりとかPush Notificationだったりとかそういう具体的な機能やAPIから構成されています。

日本でも、昨年後半くらいからPWAが注目されはじめました。さっきのdev.toとか日経電子版とかも、PWAの構成要素を利用することで高速化が実現できたと。PWAの中のひとつひとつの技術要素をうまく使うとここまで速くできるんだよ、といういい例ができたなと思っています。

白石: ちなみに、個人的にはPWAっていまいち意味がわからないな、と思ってて。なにが「プログレッシブ」なんでしょうか？プログレッシブって、「だんだん（進化する）」って意味ですよね。

えーじ: PWAにおける「プログレッシブ」には2つ意味があります。

1つは昔から言われているプログレッシブ・エンハンスメントです。古いブラウザでも見ることができる基本的なWebサイトをまずは作って、そこに、新しいブラウザで使える機能を足していくという考え方。そうすれば、クライアントの環境を最大限活かすことができます。

白石: では、Service Workerが使えるブラウザだったらオフラインという機能が使えるけど、そういう機能が使えないブラウザにも同等のものを提供する。既存のサイトにあとからその機能を提供することも割と簡単にできますよっていうそういう思いを込めたものということですね。

えーじ: そうです。もう1つが、今あるサイトに機能を付け加えていくことで、徐々にPWAに近づけていけるという意味です。PWAのためにサイトを一から作り直すとか、大幅な改修を行う必要はない。既存のサイトを徐々に拡張していけばいいんです。

白石: なるほど、そういう意味合いだったんですね。ちなみにPWAの中では、Service Workerが代表的なAPIですよね。他にはWeb App Manifestとか、Push Notificationとかでしょうか。

えーじ: そうですね。ちなみに、PWAのウリの一つに、OSのホーム画面にアイコンを追加できるというのがあるんですが、以前はただのWebアプリへのショートカットでした。でも今は違います。PWAをホーム画面に置く際、アプリのパッケージを動的に生成してインストールするので、OS上の扱いはネイティブアプリとほとんど変わりないんです。なので、プッシュ通知のオン／オフをアプリごとに設定できたり、ネイティブアプリでしかできなかったことがPWAでも同様に行えます。

WebAssembly

白石: 次はWebAssembly、物江さんご説明お願いします。

物江: WebAssemblyは、Webブラウザ上で非常に高速に動作させることができる、デバイスに依存しないバイナリ形式です。現在は用途がある程度限られていて、DOMを操作することなどはできませんが、CPU依存の計算処理などは極めて高速に動作させることができます。 Emscriptenなどのツールを使うと、C/C++で作られたものをWebAssemblyに変換できるので、C/C++で書かれたゲームなどをWebAssemblyに移植することも比較的容易です。また現在はまだ開発中ではありますが、MonoがC#からWebAssemblyをコンパイルするmono-wasmであったり、マイクロソフトも実験プロジェクトとしてWebAssemblyを介してWebブラウザー上でC#とRazorを走らせるWeb UI framework Blazorを開発していたりします。

（ここで会場からエキスパートであるあんどうやすしさんから質問）

あんどうやすし: 現在のWebAssemblyって結局計算することしかできないじゃないですか、DOMもいじれないし、JavaScriptのAPI呼び出しも直接は行えない。今後もそれは変わらないんでしょうか。特にデータの渡し方に結構制限があって、使い勝手がいいものにするには難しいなと感じています。SharedArrayBufferという仕組みで一次元配列の共有はありますが、それも使いづらいし…。

物江: それは、今の段階ではまだなんとも言えないですね。

えーじ: ちなみにSharedArrayBufferはこないだのメルトダウンとスペクター(*2)の影響で機能が停止になります。

白石: ありゃ、まさかそんなところにまで影響及ぶとは…(笑)。

*2 … CPUでの投機的実行という高速化プロセスを悪用した脆弱性

Web Share API

白石: 他には、注目のAPIとかはありますか？

えーじ: 最近追加されようとしている新しい機能にWeb Share APIというのがあります。

Androidのインテントをご存知の方だったらすぐ分かる機能ですが、例えばあるサイトを「FacebookやTwitterでシェアしたい」という場合に、Web Share APIを使うと簡単に外部アプリを呼び出すことができます。

逆に、自身のWebアプリを「シェアする先のアプリ」として使ってもらうようにすることもできます。それがWeb Share Target APIというものです。

Web Share APIは既に使えるんですが、Web Share Target APIは、現在限られたサービスにしか開放されていません。このように、Chrome では一部のドメインに先行してWebプラットフォームの機能を試してもらうオリジントライアルというものをやっているのですが、現在TwitterのモバイルサイトがWeb Share Target APIを使えるようになっています。mobile.twitter.comで実際に試すことができますので、TwitterのPWAをまだ試したことがない方は、AndroidのChrome betaチャネルか、devチャネルを使ってインストールしてみてください。何かシェアしようとしたときに、TwitterのPWAが候補として出てきます。

Web Authentication

白石: Web Authenticationというのもあると聞きました。

えーじ: Web Authenticationは、実はEdgeでもう使えるんです。仕様がちょっと古いので、APIが全く異なりますが、Polyfillもあります。Web Authenticationをひとことでいうと、セキュリティキーなどを用いた多要素認証を標準技術で扱えるようにするものです。顔認証や指紋認証と組み合わせれば、安全性の高いログインの敷居はぐっと下がると思います。

物江: FIDO Allianceという標準化団体があるんですけど、そこで生体認証などのもっと広い話をしています。既にWindowsだとWindows Helloという生体認証の仕組みがFIDOの標準で作られていますね。

えーじ: FIDOのWeb版がWeb Authenticationになるわけです。Web Authenticationの実装はこれからどんどん出てくるでしょう。Mozillaさんもこないだ実装を開始しましたし、Chromeもそろそろ入ってくるのかなと思います。

白石: そうすると、もしかしたら今年はWebサイトで指紋認証とか顔認証とかが一般的になってくるという可能性があるってことですかね。

えーじ: そうですね。どの認証方式を使えるようにするかっていうのは、順番に1つずつ入れていくという話らしいので、まずはセキュリティーキーから利用できるようになって、そのうちNFC、指紋認証ができるようになっていくようです。徐々にそういったものが実装されていけば、本当にパスワードを覚えなくてもいい世界っていうのが実現できるかもしれないので、すごく楽しみにしています。

ちなみに、Credential Management APIというIDとパスワード、いわゆる共通鍵認証をする仕様があるんですが、それとAPIのネームスペースが同じになるので、共通のAPIを使うことになります。まったく別々だった仕様が一緒になるというのも個人的には面白いと感じています。

エキスパートたちが見据えるWebの未来について

白石: 最後にWebの今後について感じていることをお聞かせください。

えーじ: ぼくらブラウザベンダーは、「こうなるといいな」というものをいろいろ作ってるんですけど、それはブラウザベンダーが勝手にやってるわけじゃなくて、開発者の皆さんの声とか、こういうWebがいいという声をもとにやっているので、フィードバックをできるだけいただいたほうが、より皆さんの理想としているWebができると思っています。

フィードバック方法にも今はいろいろあって、GitHub上で管理されている仕様にIssueを立てるっていうのも一つの方法ですし、一番簡単な方法です。それすらめんどくさいということであれば、ぼくに直接言っていただくとかでも構いません(笑)。そんな感じで、開発者の皆さんと一緒にWebを盛り上げていけたらいいなと思います。

物江: 個人的な思いとしては、今非常にWebって良い方向に進んでいると思っています。（お互いを傷つけ合うような）ブラウザ戦争は終わりました。今は良い意味でお互いに競争し合ったり、歩調を合わせてWebを良いものにしていこうという動きが主流になりつつ会って、とても好ましく感じています。今後もそれが続いていって、Webのテクノロジーの活用範囲が広がればいいなと思っています。

白石: 皆さん、本日は様々なお話をお聞かせいただき、ありがとうございました！