67WS Event FIO Primer

http://67.org/ws/

ロクナナワークショップイベント

小林茂に学ぶFIOモジュール入門ワークショップ

本日の予定

• 導入／セットアップ（10:00～11:30）• 実習1（12:30～13:30）• 実習2（13:45～15:00）• 制作／発表／質疑応答（15:15～16:30）

導入／セットアップ

• フィジカルコンピューティング再入門• Arduinoの基礎知識• 無線の基礎知識• セットアップ• 動作確認

実習1

• Funnelライブラリの紹介• 簡単な入出力

– LED

– 光センサ（CdSセル）

実習2

• 加速度センサの使い方– 傾きを測る– 急な動きをとらえる

• Flash CS3/4 Professionalで使う

※予定した実習が終わり次第制作に入ります

制作／発表／質疑応答

• 60分間で簡単なサンプルを作ってみる• wonderflの既存のコードから forkしてもOK

• 最後に発表

資料など

• http://funnel.cc/Workshops/67WSFioPrimer

配布物一覧

品名品番など数FIO v1.7 1個バッテリ 860mAh 1個ピンヘッダ 1組XBee Explorer USB 1個XBee 802.15.4 2個ブレッドボード EIC-801 1個ジャンプワイヤ 10本加速度センサ KMX-1050 1個CdSセル 5mm 1個抵抗器 330Ω 2個抵抗器 10kΩ 1個LED 2個USBケーブル 1本

自己紹介

• 電子楽器メーカー（1993～2004）– サウンドデザイナー– 技術研究所– ソフトウェアエンジニア

• IAMAS（2004～）– フィジカルコンピューティング– インタラクションデザイン

自己紹介：書籍（共著）

＋GAINER

GainerBook Labo＋くるくる研究室（九天社：2007年／オーム社：2008年）

自己紹介：書籍（監修）Making Things TalkArduinoで作る「会話」するモノたち

Tom Igoe 著・小林茂監訳・水原文翻訳（オライリー：2008年）

自己紹介：書籍（執筆）

Make日本語版Volume 05-08連載「Prototyping Lab」

オライリー・ジャパン編（オライリー・ジャパン：2008-9年）

自己紹介：書籍（共著・近刊）

ブラウザで無料ではじめるActionScript 3.0 It’s a wonderfl world

面白法人カヤック＆フォークビッツ（ワークス：2009年）

自己紹介：書籍（執筆中）Prototyping Lab

小林茂（オライリー・ジャパン：2010年）

フィジカルコンピューティングとは？

• ニューヨーク大学の ITP*1でTom Igoeらが中心となって教えているコースの名前

• インタラクションデザインを教えるための方法の1つ

• コンピュータが理解したり反応できる人間のフィジカルな表現の幅をいかに増やすか

• デザインやアート教育の1つの分野として定着

*1 Interactive Telecommunications Program

フィジカルコンピューティングの構成要素

• センサやカメラ（例：光、圧力、音、温度、加速度など）• アクチュエータ（例：LED、モータ、ソレノイドなど）• プロセッサ（例：マイコン、I/Oモジュール＋PCなど）

→ものすごく簡単にまとめると　プログラミング＋電子工作

作品紹介1：Mountain Guitar

• 金箱淳一• 音楽表現のためのギター型インタフェース

– 親しみやすさ– 演奏の奥深さ

• 各種センサ＋ I/Oモジュール＋PC

• IAMAS東京展「いまからだ」などで展示• 学生CGコンテストなど受賞多数

作品紹介1：Mountain Guitar（スケッチ）

作品紹介1：Mountain Guitar（1号）


作品紹介1：Mountain Guitar（2号の製作中）



作品紹介1：Mountain Guitar（4号の製作中）

作品紹介1：Mountain Guitar（4号の配線）


作品紹介1：Mountain Guitar（5号の内部）

作品紹介2：Jamming Gear

• 菅野創×西郷憲一郎• ギヤの組合せにより音楽を演奏

– 歯数が異なるギアの組合せによる変化– ミニマルミュージックを視覚的に表現

• 各種センサ×FIO×Max/MSP×PC

• Ars Electronica 2009 Digital Music部門Honorary Mention受賞

プロトタイピング・メソッド

• リサーチ• アイデアスケッチ• ハードウェアスケッチ• プロトタイプ制作• 展示• リフレクション

ハードウェアスケッチ？

• 安価で簡単に加工できる材料で作る• センサやアクチュエータも組込む• 体験さえできれば最終で想定しているのと異なる実現方法でも構わない

※参照：littleBits coffemaker*2

*2 http://www.vimeo.com/1389390

ハードウェアスケッチのメリット

• 早い段階で面白いかどうかを判断できる– 時間やお金をかけると捨てられなくなる– 作りながら考えることができる

• 体験を共有しながらディスカッションできる– アイデアと人格を分離できる– 過去の経験にとらわれずに判断できる

フィジカルコンピューティングとは？

一般的なPCから見た人間は？

• キー情報（ASCIIキーボードから）• マウス情報（1つのマウスから）

→人間とPCの間の帯域幅はいったい何bps？

Alto (1973)

出典：http://toastytech.com/guis/

プログラミング＋電子工作？

フィジカルコンピューティングは難しい？

• プログラミングはそれなりのスキルが必要（例：ActionScript、C、C++、Javaなど）• 電子工作にもそれなりのスキルが必要（例：回路設計、実装、検証）• 両方のスキルが必要ということは…


フィジカルコンピューティングは難しい？

• 確かに習得するまでにはそれなりの努力が必要• できあがった結果は直接的に人間の感覚に訴えるものになる（はず）


最近では扱いやすいプラットホームが登場

• プログラミング– Flash

– Processing

– Max/MSP

• 電子回路のスケッチ– Gainer

– Arduino

– Phidgets

フィジカルな世界とつなぐ方法

マイコンのみ（例：Arduino、Wiring、PIC）a

b

c

d

A

B

C

D

マイコンmicrocontroller

program

a0]=ain.o;aout.1 = 255;


マイコン＋PC（例：Arduino、Wiring）a

b

c

d

A

B

C

D

マイコンmicrocontroller

PC

USB

program

a0]=ain.o;aout.1 = 255;

program

a0]=ain.o;aout.1 = 255;

Arduinoボード

写真：SparkFun Electronics


I/Oモジュール＋PC（例：Gainer、Phidgets）a

b

c

d

A

B

C

D

I/OモジュールI/O module

PC

USB

program

a0]=ain.o;aout.1 = 255;

Gainer I/Oモジュール

写真撮影：高尾俊介

電圧～電流～抵抗

電気の流れは水の流れのようなもの

• 電圧– 2点間の高度（電位）の違い– 基準点が必要（GND）– 単位はボルト（V）

電圧のイメージ図

低高



• 電流– 電圧の高いところから低いところに流れる– 単位はアンペア（A）

電流のイメージ図

少多



• 抵抗– 電流の流れにくさ– 単位はオーム（Ω）

抵抗のイメージ図

低高


よく出てくる補助単位の例

• 1,000倍を表すキロ（例：1kΩ）• 1,000,000倍を表すメガ（例：1MΩ）• 1

1,000を表すミリ（例：1mA）• 1

1,000,000を表すマイクロ（例：50µA）

回路図ってなに？

回路図ってなに？

回路図は電子回路の設計図

• シンボルで表した電子部品の接続を示したもの• シンボルに若干のバリエーションはあるが、基本的には全世界共通

電源の回路図シンボル

+5V GND

スイッチの回路図シンボルと部品例

抵抗器の回路図シンボルと部品例

可変抵抗器の回路図シンボルと部品例

LEDの回路図シンボルと部品例

ブレッドボードってなに？

• 部品の足を穴にさすことで電子回路を形成• はんだ付け不要

– 部品を再利用できる– 回路を組み間違えてもやり直しできる– 耐久性にはやや注意が必要

ブレッドボードの構造

• 横方向のブロックは背面で接続• 縦方向のブロックは未接続• 電源用のエリアは専用に用意されている

LEDを点灯させてみよう

LEDを点灯させてみよう

どうして抵抗器が必要なの？

• LEDには適切な電流の範囲がある（例：20mA）• その範囲を超えると簡単に焼き切れてしまう• 適切な値の抵抗器を用いて電流を制限する• 適切な抵抗値はどうやって求める？→オームの法則を用いて計算する

※抵抗器で電流を制限する方法が全てではありません

オームの法則

電圧～電流～抵抗の関係

V = I × R

• Vは電圧で単位はV（ボルト）• Iは電流で単位はA（アンペア）• Rは抵抗で単位はΩ（オーム）

オームの法則

電源電圧− LEDの電圧 = LEDに流したい電流× R

Rを求めるためにこの式を変形

R =電源電圧− LEDの電圧LEDに流したい電流

例：電源電圧が5.0V、LEDの電圧が1.8V、電流が10mA

R =5 − 1.8

0.01=

3.2

0.01= ？

※実際には計算結果に近い値の抵抗器を用いる

例：LEDを点灯させてみる

参照：ジャンプワイヤの色分け

• 赤：電源の＋側（+5V）• 黒：電源のー側（GND）• 白・青・黄：センサとの接続など

例：LEDを点灯させてみる（NG）

の方向が違うワイヤをさす位置が違う

にささっていない

実習：LEDをスイッチでオン／オフさせてみる

実習：LEDをスイッチでオン／オフさせてみる

7

physical × wonderflで試してみよう

フィジカルコンピューティングの難しさ

• 実際にハードウェアがないと体験できない• さまざまなコード例を一度にみることができない

wonderflとは？

http://wonderfl.net

• 面白法人カヤックによるウェブサービス• ウェブブラウザ上でFlashを作成

– スクラッチから作る– 既存のコードから fork（派生）させる

• 2008年12月の公開後9,000人以上の登録ユーザと28,000以上の実働するAS3用コード（2009年8月現在）

physical × wonderflとは？

http://physical.wonderfl.net

• IAMASとカヤックの産学共同研究• wonderflにフィジカルコンピューティング用の機能を追加– ソフトウェアライブラリ（Funnel）を変更– 配線図用の画像や動画の埋め込み– ハードウェアなしで利用できるGUI

• 2009年7月24日に公開

プロジェクトメンバー

• wonderfl開発チーム– 橋本和宏– 大塚雅和

• IAMAS wxpプロジェクト– 小林茂・平林真実・古堅真彦・鈴木宣也– 金聖勲（hoonida-kim）・三宅太門– 江島和臣・大総佑馬・菊地礼雄・金正運小牧栞奈・竹本香織・朴永孝・三澤太智

デモ：physical × wonderfl

• オンラインでコードを書く• ハードウェアなしで動かしてみる• ハードウェアありで動かしてみる

登録ユーザができること

• コードを書いて公開する• フィードバックを得る• 共有する• 質問する

潜在ユーザができること

• ハードウェアなしで試す• フィジカルコンピューティングの可能性を感じる

• 実働するサンプルで学ぶ

Funnelの特徴

• 入出力をより簡単に扱うためのフィルタ– 不要な変動を除去（Convolution）– 入力を設定した閾値で分割（SetPoint）– スケーリング（Scaler）– オシレータ（Osc）

• 複数の I/Oモジュールに対応

Funnelの構成

USB XBeeBridge

GainerI/O Module

Arduino(with Firmata)

USB XBeeBridge

Funnel Server

ActionScript 3 ProcessingMax/MSPetc.

Ruby

AS3 Library Processing Library OSC LibrariesRuby Library

FIO XBeeFIO XBee

プログラム例（Gainer）

コード例 1 ボタンが押されたらサウンドを再生

var lastState = -1; // 前回の状態を記憶するための変数var t = 127; // 閾値（この値を基準にセンサの状態を判断）var h = 20; // ヒステリシス（誤動作を防ぐための遊び部分）var gio = new Gainer();

function loop():void

var state = lastState;

var val = gio.analogInput[0]; // センサ（アナログ入力0）の値if (val < (t - h)) // 値が一定値より小さければ

state = 0; // 状態を0 にセットelse if (val > (t + h)) // 値が一定値より大きければ

state = 1; // 状態を1 にセットif (lastState == 0 && state == 1) // 前回が0で今回が1なら

sound.start(); // サウンドを再生するlastState = state; // 現在の値を前回の値として記憶

プログラム例（Funnel）

コード例 2 ボタンが押されたらサウンドを再生

var gio = new Gainer();

// 指定した値で入力を分割するフィルタをセットgio.addFilter(new SetPoint(0.5, 0.1));

// 値が０から０以外に変化するイベントに対してリスナをセットgio.addEventListener(RISING_EDGE, onButtonPress);

// イベントが発生した時に以下を実行function onButtonPress(e:Event):void

sound.start(); // サウンドを再生する

フィジカルなUIをシンプルに表現するクラス

• ボタン• ボリューム• 加速度センサ• LED

• フルカラーLED

• モータドライバ（Hブリッジ）

フィジカルなUIをシンプルに表現する

コード例 3 ボタンでLEDをコントロールする例

var gio:Gainer = new Gainer();

// ボタンが押されたらgio.button.addEventListener(PRESS, function(e:Event):void

gio.led.blink(200, 1); // LEDを200ms周期で1回点滅);

// ボタンが長押しされたらgio.button.addEventListener(LONG_PRESS, function(e:Event):void

gio.led.blink(200, 3); // LEDを200ms周期で3回点滅);

FIO (Funnel I/O)とは？

• LilyPad Arduino v1.6がベース• リチウムポリマー電池用の充電器を搭載• XBeeを搭載可能

FIO (Funnel I/O) v1.3

FIO (Funnel I/O) v1.3

+-

Arduinoとは？

• Hernando Barraganが IDII*3にいた時に開発を始めたWiringがベース

• 電子回路をプロトタイピングするためのオープンソースのプラットフォーム

• IDEとArduino I/Oボードから構成される

*3 Interaction Design Institute Ivrea

Wiring


Arduino Duemilanove


Arduino IDE

オープンソース・ハードウェアとは？

• ハードウェアのデザインデータがオープン– 回路図– 基板レイアウト

• ライセンスに基づいて自由に改変できる

LilyPad Arduino


Arduino Pro Mini


Arduino ProtoShield


Arduino XBee Shield


Arduinoの各部紹介

デジタル入出力 x14

アナログ入力 x6GND +5V

GND

Gainer I/OとArduinoの比較

Gainer I/O Arduino Duemilanove

入出力ピン 16 20

A/D 8（8bit） 6（10bit）PWM 8（8bit） 6（8bit）

ユーザボタン 1 0

ユーザLED 1（独立） 1（D13に接続）オープンソース Yes Yes

スタンドアロン No Yes

重点簡単拡張性

Arduinoを用いるメリットは？

• シンプルに記述できる• 非プログラマでも取り組みやすい• 多くの利用例が公開されている• 登場する「おまじない」が少ない

比較：ArduinoでのLED点滅

コード例 4 Arduino言語でのLED点滅

int ledPin = 13;

void setup()

pinMode(ledPin, OUTPUT);

void loop()

digitalWrite(ledPin, HIGH);

delay(1000);

digitalWrite(ledPin, LOW);

delay(1000);

比較：通常のC言語でのLED点滅

コード例 5 通常のC言語でのLED点滅の例

#include <avr/io.h>

#include <avr/pgmspace.h>

#include <avr/delay.h>

#define CLK_CALIB_DATA (FLASHEND - 3)

void init()

uint8_t osccal_data = pgm_read_byte(CLK_CALIB_DATA);

if (osccal_data != 0xff) OSCCAL = osccal_data;

DDRB = 0xff;

DDRD = 0xff;

return;

比較：通常のC言語でのLED点滅

コード例 6 通常のC言語でのLED点滅の例（続き）

void delay_ms(uint16_t t)

while (t--) _delay_ms(1);

int main(void)

init();

for (; ;)

PORTB = 0xff;

delay_ms(500);

PORTB = 0x00;

delay_ms(500);

return 0;

Arduinoを用いるデメリットは？

• C/C++ベースなのでサイズが大きくなりがち• 実行速度の面で不利な場合もある• デバッガは利用できない

ArduinoとPCをつなぐ方法

• 有線– シリアル– USB

– Ethernet

• 無線– Bluetooth

– IEEE 802.15.4 / ZigBee

どのようにデータをやり取りするかについて取り決め（＝プロトコル）が必要

プロトコル：Firmata

http://firmata.org/

• Hans-Christoph Steinerが提案• MIDIを参考にしたプロトコル• Arduino 0012から標準に

Firmataに対応したPC側のライブラリ

• Pd (aka Pure Data)

• Processing

• Funnel

• Linux C++

• C++/openFrameworks

さまざまな無線通信の方式

BAN PAN LAN MAN

伝送速度

伝送距離1m 10m 100m 1km

1k

10k

100k

1M

10M

100M

ZigBee/IEEE 802.15.4

Bluetooth

ANT

IEEE 802.11b

IEEE 802.11a/g

IEEE 802.11n

10G

0.1m

さまざまな無線通信の方式とその特徴

Wi-Fi Bluetooth 802.15.4/ZigBee

IEEE規格 802.11a/b/g/n 802.15.1 802.15.4

周波数帯 2.4GHz/5GHz 2.4GHz 866MHz/915MHz/2.4GHz

通信距離最大100m程度最大100m程度 100m以上（2.4GHz）最大通信速度最大300Mbps 最大3Mbps 最大250kbps（2.4GHz）接続ノード数 32 7 65535

電池寿命数時間数日数年ネットワーク構成スター型スター型スター型・メッシュ型など

主な用途無線LAN 携帯電話セキュリティ機器

表1 主な無線通信規格の比較

IEEE 802.15.4デバイスの種類

• コーディネータ（1個）• エンド・デバイス（複数）

IEEE 802.15.4で可能なネットワークトポロジ

Point to Point

Point to Multi

Star

802.15.4 Coordinator802.15.4 End Device

ZigBeeデバイスの種類

• コーディネータ（1個）• ルータ（複数）• エンド・デバイス（複数）

ZigBeeで可能なネットワークトポロジ

MeshCoordinator

End DeviceRouter

XBeeの特長

• IEEE 802.15.4とZigBeeの2つのモデル*4

– XBee 802.15.4

– XBee ZB ZigBee PRO

• 比較的低価格（国内モデルで約3500円）• 日本国内でも利用できるよう認証取得済み• 利用方法を解説した書籍がある

*4 モデル間での相互接続性はない

XBeeの注意点

• 電源電圧は5Vではない• UDPと同様に相手にパケットが届くことが保証されない

• 同じチャンネルを使用するデバイス全体で帯域幅は100kbps程度

XBeeの設定方法

以下をそれぞれのXBeeについて設定

• hardware/fio/tool/XBeeConfigToolを起動• シリアルポートを選択• PAN IDを設定• コーディネータ／エンドデバイスを選択• エンドデバイスの場合はMY IDを設定• Configureボタンで設定を書込み

FIO：動作確認

• XBee Explorer USBをPCに接続• Arduino 17を起動• Tools→BoardからArduino Pro/ Pro Mini

(8MHz) w/ ATmega168を選択• Tools→Serial Portからシリアルポートを選択• Open→Examples→Digital→Blinkを選択• Upload to I/O Boardでアップロード

FIO：準備

• hardware/fio/firmware/FioStandardFirmataを選択

• Upload to I/O Boardでアップロード

FIO：動作確認

• FIOの電源をオンにする• XBee Explorer USBをPCに接続• Funnel Serverを起動• サンプルで動作確認

FIOにLEDを接続

FIOに光センサを接続

FIOに加速度センサを接続

加速度センサでなぜ傾きを測れるか

g

ø ø

g

g•sinø g•sinø

制作／発表／質疑応答

• 60分間で簡単なサンプルを作ってみる• wonderflの既存のコードから forkしてもOK

• 最後に発表

http://67.org/ws/

ロクナナワークショップイベント

小林茂に学ぶFIOモジュール入門ワークショップ

Date post:	08-May-2015
Category:	Design
Upload:	shigeru-kobayashi
View:	2,755 times
Download:	1 times