20150620 Creators Meetup29...

68
Session05 『見えるようにする』から考えてみる デバイス・センサー連携をいくつか 20150620 29Creators MeetUp 田中正吾

Transcript of 20150620 Creators Meetup29...

Page 1: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

Session05『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

20150620 第29回Creators MeetUp 田中正吾

Page 2: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

私の話はスライドは後ほど共有します。話す内容に注力いただいて大丈夫です!

Page 3: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

自己紹介

Page 4: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

田中正吾(たなかせいご)屋号:ワンフットシーバス

2004年よりフリーランス。以後、FLASH制作を中心にインタラクティブコンテンツを主に行い現在に至る。最近は、JavaScriptやHTML5アニメーション、スマートフォン演出制作のワークフロー改善に関わったりしていました。

Page 5: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

HTML5アニメーション作ったりしています

Page 6: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

デジタルサイネージ作ったりしてます

Page 7: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

アプリ作ったりしています

Page 8: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

「見えるようにする」

Page 9: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

まず、WEBって。

Page 10: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

WEBは五感の中でも「見る」(視覚)中心

Page 11: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

私はWEB制作において。ユーザー操作を「見えるように」したり、コンテンツのデータを「見えるように」してきた。

BUTTON

BUTTON

IMAGE IMAGE IMAGE

Page 12: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

私にとって身近な制作感覚この「見えるようにする」

これを軸にデバイス連携をいくつかお話します。

Page 13: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

WEBのいいところ

Page 14: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

データを見えるようにするのが得意

Page 15: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

遠く離れた情報を得るのが得意

Page 16: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

遠く離れたところに情報や操作を送るのも得意

Page 17: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

最近はこれが発展して情報をみんなでシェアするのも得意

Page 18: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

命令を自動で行ってくれる

Page 19: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

いつでもみることができる

Page 20: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

データを収集・蓄積・分析するのが得意

Page 21: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

このあたり。いいよね。

Page 22: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

デバイスやセンサーとまぜてみる

Page 23: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

うちの部屋は夏に暑くなる(温度センサー+WEB)

Page 24: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

デバイス WEB

Page 25: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

我が家の部屋は暑い

Page 26: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

「どれくらい暑い?」

Page 27: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

見えるようにしてみた。

Page 28: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

見えるようにしてみた。

温度センサー

温度データをサーバーと通信

(cloudBit)

Page 29: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

デモ

Page 30: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

6/2 すごく暑かった

6/20 今日

リアルタイム測定値

Page 31: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

なにがよいか?

Page 32: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

従来の温度計は計れるが離れたところで見れない

Page 33: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

一般の天気情報では我が家の温度まではわからない

XXX区の天気

Page 34: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

スマホも温度センサーはあるがいつも持ち運んでいる

(しかもバッテリーの温度を計測する用途に近い)

Page 35: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

このあたりの惜しいところが

Page 36: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

今回のもので、

Page 37: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

自分の知りたい温度を遠くでいつでも見ることができる

Page 38: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

ふりかえり

Page 39: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

「温度が遠くから見えるようになった」

Page 40: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

➔温度センサーの反応がWEBで見える。➔ここでのWEBのいいところ

◆温度に置き換えることで、漠然としていた「暑さ」が見えるようになった。

◆家にいなくても家の温度がわかる。◆温度変化を自動で収集して蓄積してくれる。◆グラフにすることで温度の変化も見えるようになった。

➔結論:我が家はやっぱり暑かった32度は注意すべき温度。そして、日によっては涼しい時もある。

Page 41: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

デバイス→WEB たとえば

➔光センサーで家のつけっぱなしを感知➔温度に応じて冷房をON➔ポストに郵便物が入ったら通知

とか、やれたらおもしろい。

Page 42: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

余談

Page 43: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

温度センサーは熱の出る機器とは離すのが重要(結果がズレる)

熱源1:電源部分

熱源2:cloudBit

Page 44: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

ウォンバットの投稿するとウォンバットメーターが上昇

Page 45: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

デバイス WEB

Page 46: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

私はウォンバットという動物が好きでTumblrに日々投稿していまして

(wombat10.tumblr.com)

Page 47: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

反応は気になるわけです。

Page 48: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

見えるようにしてみた。

Page 49: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

ウォンバットメーター

Page 50: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

投稿すると

Page 51: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

メーターが上がる

Page 52: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

アクション(リブログ・スキ!)でも

Page 53: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

メーターが上がる

Page 54: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

動画デモ

Page 55: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

というわけで

Page 56: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

テンションが上がる!

Page 57: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

実は今日も簡易版を

Page 58: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

置いてあるこれ↓

Page 59: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

置いてあるこれ↓

Page 60: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

投稿デモ(うまくいきますように)

Page 61: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

wombat10.tumblr.comの最新投稿に反応。(スキ!・リブログにも反応)

Page 62: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

ふりかえり

Page 63: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

「ブログの動向が見えるようになった」

Page 64: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

➔WEBのアクションでデバイスが反応。➔ここでのWEBのいいところ

◆投稿と投稿への賞賛(スキ!・リブログ)を自動で収集してくれる。

◆自分で見に行かなくても自然にお知らせしてくれる。◆自分以外の人も眺められるので、みんなで見て楽しい。楽しい情報のシェア度合いが高まる。

➔結論:リアルタイムに反応がわかって楽しい。スマホ通知とは、また違った見え方。

Page 65: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

WEB→デバイス たとえば

➔TwitterでのCMUへの投稿量(1分間)によってメーターで通知してくれる。

➔Amazonで1ヶ月で購入した商品数をメーターで通知してくれる。

とか、やれたらおもしろい。

Page 66: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

まとめ

Page 67: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

➔WEBでは身近な「見えるようにする」ことはデバイスやセンサーを使ったときも案外地続きで活かせる。決して突拍子のないことではない。

➔WEBの良さ(自動・収集・蓄積・遠隔・見える化など)をデバイスやセンサーと絡めると新しい可能性が見える。

まとめ

Page 68: 20150620 Creators Meetup29 『見えるようにする』から考えてみるデバイス・センサー連携をいくつか

ご清聴いただきましてありがとうございました!