<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	xmlns:series="http://organizeseries.com/"
	>

<channel>
	<title>CHIRIMEN &#8211; HTML5Experts.jp</title>
	<atom:link href="/tag/chirimen/feed/" rel="self" type="application/rss+xml" />
	<link>https://html5experts.jp</link>
	<description>日本に、もっとエキスパートを。</description>
	<lastBuildDate>Sat, 07 Jul 2018 03:14:05 +0000</lastBuildDate>
	<language>ja</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>https://wordpress.org/?v=4.7.19</generator>
	<item>
		<title>Web技術でここまでできるのか！IoT/WoTの可能性を探る、「第59回 HTML5とか勉強会」レポート</title>
		<link>/shumpei-shiraishi/16760/</link>
		<pubDate>Thu, 27 Aug 2015 04:42:15 +0000</pubDate>
		<dc:creator><![CDATA[白石 俊平]]></dc:creator>
				<category><![CDATA[最新動向]]></category>
		<category><![CDATA[CHIRIMEN]]></category>
		<category><![CDATA[IoT]]></category>
		<category><![CDATA[WebRTC]]></category>
		<category><![CDATA[WoT]]></category>

		<guid isPermaLink="false">/?p=16760</guid>
		<description><![CDATA[連載： イベントレポート (39)こんにちは、編集長の白石です。 昨日（2015年8月27日）、「IoT / WoT」をテーマにした「第59回 HTML5とか勉強会」に参加してきました。 この記事では、イベントの模様や参...]]></description>
				<content:encoded><![CDATA[<div class="seriesmeta">連載： <a href="https://html5experts.jp/series/eventarchives/" class="series-159" title="イベントレポート" data-wpel-link="internal">イベントレポート</a> (39)</div><p>こんにちは、編集長の白石です。</p>

<p>昨日（2015年8月27日）、「IoT / WoT」をテーマにした「第59回 HTML5とか勉強会」に参加してきました。
この記事では、イベントの模様や参加した感想をレポートしたいと思います。</p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/08/IMG_3111.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/08/IMG_3111-640x480.jpg" alt="IMG_3111" width="640" height="480" class="aligncenter size-large wp-image-16761" srcset="/wp-content/uploads/2015/08/IMG_3111.jpg 640w, /wp-content/uploads/2015/08/IMG_3111-300x225.jpg 300w, /wp-content/uploads/2015/08/IMG_3111-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>

<p>ちなみに、「IoT」（Internet of Things）はバズワードなのでご存じの方も多いと思いますが、「WoT」というのは「Web of Things」の略です。「IoTのWeb版」と言えばわかりやすいでしょう。個人的には「WoT」という言葉にはどうも「IoTブームに乗ってやれ」という（何者かの）意図があるような気がしていて、ちょっと懐疑的でした。リソース食いだし、デバイスの機能を自由に使うこともできないWeb技術は、IoTとは相性悪いんじゃないか…と。</p>

<p>しかし、今回のイベントに参加して、そうした疑いは晴れました。「Web×デバイス」の勢い、まがい物ではなさそうです。そしてその勢いをさらに推し進める一員になりたいな…と思ったのも正直な気持ちです。それくらい、最先端では楽しいことが起きている。</p>

<p>では、前置きが長くなりましたが、イベントの内容を簡潔にご紹介していきたいと思います。
イベント自体の内容が盛りだくさんでしたので、今回のレポートでは前半の2セッションのみのご紹介となりますがご容赦ください。</p>

<p>また、講演資料はアップされたのを確認次第、追記していきます（現在のところ、2つ目のセッションに関する資料しか見当たりませんでした）。</p>

<h2>「myThings開発者のMaker Faire Tokyo体験記」</h2>

<p>1つ目のセッションは、ヤフー株式会社の河合将臣氏と畑元氏による 「myThings開発者のMaker Faire Tokyo体験記」でした。</p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/08/DSC08527.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/08/DSC08527-640x480.jpg" alt="DSC08527" width="640" height="480" class="aligncenter size-large wp-image-16780" srcset="/wp-content/uploads/2015/08/DSC08527.jpg 640w, /wp-content/uploads/2015/08/DSC08527-300x225.jpg 300w, /wp-content/uploads/2015/08/DSC08527-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>

<p>「<a href="http://mythings.yahoo.co.jp/" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer">myThings</a>」とは、2015年7月にヤフージャパンがリリースしたプロダクトです。
複数のWebサービスやデバイスを自由自在に繋いで、いろんなことをオートメーションさせられるサービス／モバイルアプリです。</p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/08/IMG_3116.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/08/IMG_3116-640x480.jpg" alt="IMG_3116" width="640" height="480" class="aligncenter size-large wp-image-16763" srcset="/wp-content/uploads/2015/08/IMG_3116.jpg 640w, /wp-content/uploads/2015/08/IMG_3116-300x225.jpg 300w, /wp-content/uploads/2015/08/IMG_3116-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>

<p>と、この説明を聞くと「それって<a href="https://ifttt.com/recipes" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer">IFTTT</a>と何が違うの？」と思ってしまうのが自然な流れ（？）。</p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/08/IMG_3121.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/08/IMG_3121-640x480.jpg" alt="IMG_3121" width="640" height="480" class="aligncenter size-large wp-image-16765" srcset="/wp-content/uploads/2015/08/IMG_3121.jpg 640w, /wp-content/uploads/2015/08/IMG_3121-300x225.jpg 300w, /wp-content/uploads/2015/08/IMG_3121-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>

<p>このセッションでは、その疑問にもしっかり答えていました。いわく、</p>

<ul>
<li>日本語対応</li>
<li>Yahoo! Japanのサービスが使える。特に、通常API経由では利用できないサービスやデータを使えるのは強み</li>
<li>国内で展開されているサービスも利用できる。代表的なのははてなブックマーク。</li>
</ul>

<p>だそうです。</p>

<p>また、<a href="http://www.idcf.jp/cloud/iot/" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer">IDCF Cloud</a>というプラットフォームも用意されており、自作のガジェットとmyThingsをつなぐことも可能。MQTTやWebSocket、REST APIに対応しているそうで、Web技術者でも簡単に扱えそうなのが魅力。</p>

<p>セッションの後半では、Maker Faireにヤフーさんが出展された時の（もちろんmyThingsとIDCF Cloudを使った）デモアプリを、内部設計や作業工程も含めて情報共有していただきました。</p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/08/IMG_3124.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/08/IMG_3124-640x480.jpg" alt="IMG_3124" width="640" height="480" class="aligncenter size-large wp-image-16766" srcset="/wp-content/uploads/2015/08/IMG_3124.jpg 640w, /wp-content/uploads/2015/08/IMG_3124-300x225.jpg 300w, /wp-content/uploads/2015/08/IMG_3124-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>

<p>Web技術者がハードウェアの設計・製造まで行ったということで、その過程で気づいたことを以下のようにわかりやすくまとめています。</p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/08/IMG_3139.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/08/IMG_3139.jpg" alt="IMG_3139" width="640" height="640" class="aligncenter size-full wp-image-16767" srcset="/wp-content/uploads/2015/08/IMG_3139.jpg 640w, /wp-content/uploads/2015/08/IMG_3139-150x150.jpg 150w, /wp-content/uploads/2015/08/IMG_3139-300x300.jpg 300w, /wp-content/uploads/2015/08/IMG_3139-207x207.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>

<h2>「WebController for V-Sido CONNECT：WebRTCとWebGLで作る人型ロボット遠隔操縦システム」</h2>

<p>２つ目のセッションは、株式会社アトモスデザインの児玉 哲彦さんによる「WebController for V-Sido CONNECT：WebRTCとWebGLで作る人型ロボット遠隔操縦システム」でした。</p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/08/DSC08580.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/08/DSC08580-640x480.jpg" alt="DSC08580" width="640" height="480" class="aligncenter size-large wp-image-16781" srcset="/wp-content/uploads/2015/08/DSC08580.jpg 640w, /wp-content/uploads/2015/08/DSC08580-300x225.jpg 300w, /wp-content/uploads/2015/08/DSC08580-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>

<p><a class="embedly-card" href="http://www.slideshare.net/ecru0606/html5150826" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer">第59回 HTML5とか勉強会 ーIoT/WoT発表資料「Web Controller for V-Sido CONNECT：WebRTCとWebGLで作る人型ロボット遠隔操縦システム」</a>
<script async src="//cdn.embedly.com/widgets/platform.js" charset="UTF-8"></script></p>

<p>このセッションのウリは、とにかく「ホンモノのロボットをWebブラウザで動かせる！」という点。Google Chrome上で動作するWebアプリから、ロボットの手を動かしたり足を動かしたり、果ては怒らせたり。</p>

<p>「JavaScriptでロボットを動かす」なんて、数年前では考えられなかった事態に感動です。</p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/08/IMG_3151.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/08/IMG_3151-640x480.jpg" alt="IMG_3151" width="640" height="480" class="aligncenter size-large wp-image-16770" srcset="/wp-content/uploads/2015/08/IMG_3151.jpg 640w, /wp-content/uploads/2015/08/IMG_3151-300x225.jpg 300w, /wp-content/uploads/2015/08/IMG_3151-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/08/IMG_3150.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/08/IMG_3150-640x480.jpg" alt="IMG_3150" width="640" height="480" class="aligncenter size-large wp-image-16769" srcset="/wp-content/uploads/2015/08/IMG_3150.jpg 640w, /wp-content/uploads/2015/08/IMG_3150-300x225.jpg 300w, /wp-content/uploads/2015/08/IMG_3150-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>

<p>そもそも<a href="http://www.v-sido.com/ja/product/connect/index.html" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer">V-Sido CONNECT</a>というのは、人型ロボットを作るためのOS（そんなのがあったのか…）である「<a href="http://www.v-sido.com/ja/product/os/index.html" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer">V-Sido OS</a>」用のマイコンで、公式HPによると「シリアルサーボモーターをつなぐだけでロボットを作ることが可能です。」「V-Sidoの一部機能がマイコンに搭載されているので初心者でも簡単にロボットを動かすことができます」とのこと。</p>

<p>今回の児玉さんの発表は、この「V-Sido CONNECT」をWebブラウザ上から制御できるというプロダクトの紹介というわけです。
このWeb Controllerはどう動作しているかというと、Webアプリとスマホアプリを連動させ、スマホからBluetoothでロボットの制御信号を送っているとのこと。先ほどのmyThingsといい、スマホがIoTデバイスのハブになるという流れなのは間違いなさそうです。</p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/08/IMG_3160.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/08/IMG_3160-640x480.jpg" alt="IMG_3160" width="640" height="480" class="aligncenter size-large wp-image-16771" srcset="/wp-content/uploads/2015/08/IMG_3160.jpg 640w, /wp-content/uploads/2015/08/IMG_3160-300x225.jpg 300w, /wp-content/uploads/2015/08/IMG_3160-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>

<p>また、Webアプリとスマホアプリの通信はWebRTC（及び、NTTコミュニケーションズの<a href="http://nttcom.github.io/skyway/" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer">Skyway</a>）を使用しているそう。WebRTCを使う決め手となったのは、映像や音声を扱うことができるから（ロボットのカメラから映像を受信したりできる）。</p>

<p>以下の比較表は中々興味深いです（写真ボケててすいません）。</p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/08/IMG_3161.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/08/IMG_3161-640x480.jpg" alt="IMG_3161" width="640" height="480" class="aligncenter size-large wp-image-16772" srcset="/wp-content/uploads/2015/08/IMG_3161.jpg 640w, /wp-content/uploads/2015/08/IMG_3161-300x225.jpg 300w, /wp-content/uploads/2015/08/IMG_3161-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>

<p>WebRTCのおかげで、なんと<strong>ドイツから日本のロボットを動かす</strong>といったような接続性を確保できたとのこと。地球狭い。</p>

<p>そして、Webエンジニアであれば気になるコーディング方法ですが、以下の表に示すように、非常に簡潔なAPIです。たったこれだけでロボットに複雑な制御を行わせることができるというのは、Web技術者にとってはありがたい限りです。</p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/08/IMG_3164.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/08/IMG_3164-640x480.jpg" alt="IMG_3164" width="640" height="480" class="aligncenter size-large wp-image-16773" srcset="/wp-content/uploads/2015/08/IMG_3164.jpg 640w, /wp-content/uploads/2015/08/IMG_3164-300x225.jpg 300w, /wp-content/uploads/2015/08/IMG_3164-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>

<p>2000年代の「ユビキタスコンピューティング」に足りなかったものは今は揃っており、WoT時代の幕開けを感じさせてくれるセッションでした。</p>

<p><a href="https://html5experts.jp/wp-content/uploads/2015/08/IMG_3174.jpg" data-wpel-link="internal"><img src="/wp-content/uploads/2015/08/IMG_3174-640x480.jpg" alt="IMG_3174" width="640" height="480" class="aligncenter size-large wp-image-16774" srcset="/wp-content/uploads/2015/08/IMG_3174.jpg 640w, /wp-content/uploads/2015/08/IMG_3174-300x225.jpg 300w, /wp-content/uploads/2015/08/IMG_3174-207x155.jpg 207w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>

<h2>まとめ</h2>

<p>今回紹介しなかった後半の内容（MozillaのFirefox OSベースのマイコン「CHIRIMEN」や、NTTコミュニケーションズ小松さんによるRaspberry PiとWebRTCを連動させた話）も非常に興味深かったので、気になる方は<a href="https://twitter.com/search?f=tweets&amp;vertical=default&amp;q=%23html5j&amp;src=typd" data-wpel-link="external" target="_blank" rel="follow external noopener noreferrer">Twitter</a>でイベントの様子を確認してみてください。</p>

<p>イベント全体の模様をを動画でご覧になりたい方はこちらからどうぞ。</p>

<iframe width="560" height="315" src="https://www.youtube.com/embed/rXiJNgN6l3Y" frameborder="0" allowfullscreen></iframe>

<p>このIoTブームの中、「Web技術者にできることを広げようとしている人たちが多く存在する」「Web技術者にできることはたくさんある」ということを実感させてくれる、非常にバリエーション豊かな内容でした。</p>
]]></content:encoded>
		
		<series:name><![CDATA[イベントレポート]]></series:name>
	</item>
	</channel>
</rss>
