Your SlideShare is downloading. ×
  • Like
  • Save
Hardware Sketching Workshop 2013
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Now you can save presentations on your phone or tablet

Available for both IPhone and Android

Text the download link to your phone

Standard text messaging rates apply

Hardware Sketching Workshop 2013

  • 2,136 views
Published

Slides for the workshop at IAMAS from April 30 to May 2 regarding hardware sketching

Slides for the workshop at IAMAS from April 30 to May 2 regarding hardware sketching

Published in Design
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
2,136
On SlideShare
0
From Embeds
0
Number of Embeds
4

Actions

Shares
Downloads
0
Comments
0
Likes
6

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. 2013年4月30日∼5月2日/情報科学芸術大学院大学[IAMAS]新校舎1階ギャラリー小林 茂(情報科学芸術大学院大学[IAMAS]准教授)Extended Motifwork 2013Make: Hardware Sketching #1
  • 2. Photography: Beth and Christianhttp://www.flickr.com/photos/six27/245969277/
  • 3. Extended Motifwork 2013 ¦ Make: Hardware SketchingイントロダクションIDの時代におけるプロトタイピングhttp://www.archiviosacchi.it/press_room/より引用Giovanni Sacchi(1913∼2005年)
  • 4. Extended Motifwork 2013 ¦ Make: Hardware SketchingイントロダクションIDの時代におけるプロトタイピングhttp://www.archiviosacchi.it/press_room/より引用
  • 5. Extended Motifwork 2013 ¦ Make: Hardware SketchingイントロダクションIDの時代におけるプロトタイピングhttp://www.archiviosacchi.it/press_room/より引用
  • 6. Extended Motifwork 2013 ¦ Make: Hardware SketchingイントロダクションIDの時代におけるプロトタイピングhttp://www.archiviosacchi.it/press_room/より引用
  • 7. Extended Motifwork 2013 ¦ Make: Hardware SketchingイントロダクションIDの時代におけるプロトタイピングhttp://www.archiviosacchi.it/press_room/より引用
  • 8. Extended Motifwork 2013 ¦ Make: Hardware SketchingイントロダクションIxDの時代におけるプロトタイピング• 現代における「model making」• Giovanni Sacchiがかつて果たした役割• 複数の職能の間での共通言語として• インタラクションデザインにおいては「形」だけでは不十分• もはや「形態は機能に従う」(form follows function)は成り立たない• プログラミングや電子回路が不可欠☞フィジカルコンピューティングがヒントに
  • 9. Extended Motifwork 2013 ¦ Make: Hardware Sketchingイントロダクション• ニューヨーク大学のITP*1から広まった、インタラクションデザインを教えるためのメソッドの一つ• コンピュータの原理原則を学び、既存のPCにとらわれずに人間とコンピュータの関係を考え直す• プロトタイピングを繰返しながら身体感覚として共通言語を身につけるフィジカルコンピューティング*1 Tisch School of Arts, Interactive Telecommunications Program
  • 10. Extended Motifwork 2013 ¦ Make: Hardware SketchingイントロダクションBill Buxtonの「Design Funnel」• Sketching User Experiences (2007)Sketching User Experiencesより抜粋したものを日本語化(138ページ)投資判定基準重みデザイン ユーザビリティ時間スケッチプロトタイプ
  • 11. Extended Motifwork 2013 ¦ Make: Hardware Sketchingイントロダクションスケッチとプロトタイプの違いスケッチ プロトタイプ提案(suggest) 記述(describe)探求(explore) 精錬(refine)質問(question) 回答(answer)提案(propose) 検証(test)曖昧(noncommittal) 表現(depiction)Sketching User Experiencesより抜粋(140ページ)
  • 12. Extended Motifwork 2013 ¦ Make: Hardware Sketchingイントロダクションスケッチとは?• 素早く• タイムリーに• 安く• 捨てられる材料で• たくさん• 必要最小限のディテールで• 確認ではなく提案と探索をするSketching User Experiencesより抜粋(136ページ)
  • 13. ハードウェアスケッチの例Hardware sketching examples
  • 14. Extended Motifwork 2013 ¦ Make: Hardware Sketchingハードウェアスケッチの例ハードウェアスケッチ• littleBits coffeemakerhttps://vimeo.com/1389390• littleBitshttp://littlebits.cc
  • 15. Extended Motifwork 2013 ¦ Make: Hardware Sketchingハードウェアスケッチの例• 大学院修士1年生1st year students of the master course• プログラミングの経験は少しShe had little programming skills• 電子工作の経験はゼロShe had no electronics skills• 3D CADの経験はゼロShe had no 3D CAD skills• 製作期間はスキル習得も含めて六カ月6 months project including acquiring skillsアクション!ゆびにんぎょう
  • 16. Extended Motifwork 2013 ¦ Make: Hardware SketchingIAMASにおける研究プロジェクト // Research Projects at IAMASリサーチ // Research
  • 17. Extended Motifwork 2013 ¦ Make: Hardware Sketchingハードウェアスケッチの例アイデアスケッチ // Idea Sketchingアクション!ゆびにんぎょう(制作:笠原友美) / Action! Finger Puppet (Tomomi Kasahara)
  • 18. Extended Motifwork 2013 ¦ Make: Hardware Sketchingハードウェアスケッチの例まず、サインペンを使用してアイディアの全体を描いていきます。うまく描く必要はありません、重要なのはアイデアを伝えることです。全体を描いた後は、黒のマーカで全体を縁取ります。これにより遠くからでも、しっかりと形を見ることが出来ます。次に特徴となる部分や、機能がある部分に赤色のマーカーで色をつけます。どこが重要なのかがすぐわかるようになります。最後にグレーのマーカーで陰や質感などを描きます。立体感や素材の特徴によりアイディアのイメージがふくらみます。1 23 4スケッチのルール // Rules of Sketching
  • 19. Extended Motifwork 2013 ¦ Make: Hardware SketchingIAMASにおける研究プロジェクト // Research Projects at IAMAS並べ替えと投票 // Sorting and Voting
  • 20. Extended Motifwork 2013 ¦ Make: Hardware SketchingIAMASにおける研究プロジェクト // Research Projects at IAMASダーティモデリング // Dirty Modelingアクション!ゆびにんぎょう(制作:笠原友美) / Action! Finger Puppet (Tomomi Kasahara)
  • 21. Extended Motifwork 2013 ¦ Make: Hardware Sketchingハードウェアスケッチの例ビデオスケッチ // Video Sketchingアクション!ゆびにんぎょう(制作:笠原友美) / Action! Finger Puppet (Tomomi Kasahara)
  • 22. Extended Motifwork 2013 ¦ Make: Hardware SketchingIAMASにおける研究プロジェクト // Research Projects at IAMASハードウェアスケッチ // Hardware Sketchingアクション!ゆびにんぎょう(制作:笠原友美) / Action! Finger Puppet (Tomomi Kasahara)
  • 23. Extended Motifwork 2013 ¦ Make: Hardware SketchingIAMASにおける研究プロジェクト // Research Projects at IAMASプロトタイプ制作 // Making Prototypesアクション!ゆびにんぎょう(制作:笠原友美) / Action! Finger Puppet (Tomomi Kasahara)
  • 24. アクション!ゆびにんぎょう(制作:笠原友美) / Action! Finger Puppet (Tomomi Kasahara)
  • 25. アクション!ゆびにんぎょう(制作:笠原友美) / Action! Finger Puppet (Tomomi Kasahara)
  • 26. https://vimeo.com/17150420
  • 27. アイデアスケッチ / The idea sketch
  • 28. 最初のプロトタイプ / The first prototype
  • 29. 最初のプロトタイプの外装 / The shell of the 1st prototype (built with 3d printing)
  • 30. 最初のプロトタイプの基板 / The PCB of the 1st prototypeMiga NanoMuscle purchased from SparkFun
  • 31. Comparison between prototypes from the 1st (right) to 4th (left) and an official domino piece
  • 32. LilyPad Arduinoa derivative a derivativeArduino Fio Esper Domino (4th)
  • 33. http://www.diginfo.tv/v/12-0047-r-en.php
  • 34. ものづくり=なぜ? なにを? どうやって?What? How?Why?Making Things
  • 35. ものづくり=なぜ? なにを? どうやって?What? How?Why?Making Things
  • 36. ものづくり=なぜ? なにを? どうやって?What? How?Why?Making Things
  • 37. ものづくり=なぜ? なにを? どうやって?What? How?Why?Making Things
  • 38. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編ワークショップの流れ• セットアップ• Arduinoを使ってみる• 電子回路の基礎知識• 基本的な入出力
  • 39. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編今回使用する主な部品
  • 40. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編Arduinoとは?• フィジカルコンピューティングのためのツールキット• 電子回路をプロトタイピングするためのオープンソースのプラットフォームで、柔軟で簡単に使えるハードウェアとソフトウェアで構成• アーティスト、デザイナ、ホビイスト、そしてインタラクティブなオブジェクトや環境をつくることに興味がある全ての人が対象
  • 41. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編Arduinoを構成する3つの要素• Arduinoボード• ATMega328P(16MHz)を搭載• USB• オープンソース(さまざまなバリエーションと互換機)• Arduino IDE• Windows、Mac OS X、Linux上で動作• オープンソース• デバッガはない• Arduino言語• C/C++をベースにしたプログラミング言語
  • 42. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編Arduinoの流儀デザインについて語ることよりも作ることのほうがArduino の哲学に適っています。良いプロトタイプを作るために、より速く、よりパワフルな手法を探索し続けることが重要です。自分の手を使って考えながら、いろいろなテクニックを試し、発展させましょう。Massimo Banzi(「Arduinoをはじめよう」著者)Massimo Banzi著「Arduinoをはじめよう」003ページより引用
  • 43. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編Arduinoの流儀• プロトタイピング• いじくりまわす• パッチング• サーキットベンディング• キーボードハック• ジャンク大好き!• オモチャをハック• コラボレーションMassimo Banzi著「Arduinoをはじめよう」004∼014ページより引用
  • 44. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編Tinkering(いじくりまわす)Massimo Banzi著「Arduinoをはじめよう」005ページより引用
  • 45. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編Arduinoボードグラウンドパワーインジケータ+3.3V電源の++5Vグラウンド×2アナログ入力×6デジタル入出力×14外部電源
  • 46. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編Arduino IDEVerifyスケッチがコンパイルできるか確認するNew新しいスケッチを生成するOpenサンプルや既存のスケッチを開くSave現在開いているスケッチを保存するSerial Monitorシリアルモニタを開くUploadスケッチを Arduino ボードにアップロードするツールバータ ブテキストエディタメッセージエリアテキストエリア
  • 47. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編Arduinoの動作確認• File→Examples→Digital→Blinkを開く• Uploadボタンを押してアップロード• LEDが点滅することを確認
  • 48. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編電子回路の基礎知識• 基本用語• 電圧:2点間の電位差、単位はV(ボルト)• 電流:流れる電気の量、単位はA(アンペア)• 抵抗:電気の流れにくさ、単位はΩ(オーム)• 最初は水の流れに例えて理解することができる• 電圧→水圧• 電流→水流
  • 49. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編電圧の概念図電位差電位A電位Bグラウンド(GND)
  • 50. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編オームの法則多 少←同じ圧力→←同じ量→←圧力低 ←圧力高
  • 51. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編ブレッドボード
  • 52. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編LEDをつないでみる
  • 53. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編LEDをつないでみる
  • 54. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編抵抗器ありでLEDをつなぐ330Ω
  • 55. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編抵抗器ありでLEDをつなぐ
  • 56. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編オームの法則ふたたびLEDの順電圧抵抗器にかかる電圧330Ω
  • 57. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編オームの法則ふたたび多 少←同じ圧力→←同じ量→←圧力低 ←圧力高
  • 58. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編オームの法則を用いて抵抗値を計算E(電圧) = I(電流) R(抵抗)☜オームの法則を式で表したもの電源電圧 - LEDにかかる電圧 = LEDに流れる電流 抵抗↓抵抗を求めるために変形抵抗 = (電源電圧 - LEDにかかる電圧) LEDに流れる電流↓単位を揃えて実際の値を代入抵抗 = (5 - 1.8) 0.01 = 3.2 0.01 =320↓最も近い値の抵抗器を選択する330Ω※LEDに流れる電流を制限する方法は抵抗器だけではないLEDの順電圧抵抗器にかかる電圧330Ω
  • 59. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編ArduinoでHello World!void setup() {// initialize the digital pin as an output.// Pin 13 has an LED connected on most Arduino boards:pinMode(13, OUTPUT);}void loop() {digitalWrite(13, HIGH); // set the LED ondelay(1000); // wait for a seconddigitalWrite(13, LOW); // set the LED offdelay(1000); // wait for a second}
  • 60. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編点滅の間隔を変えてみようvoid setup() {// initialize the digital pin as an output.// Pin 13 has an LED connected on most Arduino boards:pinMode(13, OUTPUT);}void loop() {digitalWrite(13, HIGH); // set the LED ondelay(100); // wait for a seconddigitalWrite(13, LOW); // set the LED offdelay(100); // wait for a second}
  • 61. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編点滅の間隔を変えてみようvoid setup() {// initialize the digital pin as an output.// Pin 13 has an LED connected on most Arduino boards:pinMode(13, OUTPUT);}void loop() {digitalWrite(13, HIGH); // set the LED ondelay(10); // wait for a seconddigitalWrite(13, LOW); // set the LED offdelay(10); // wait for a second}
  • 62. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編点滅の間隔を変えてみようvoid setup() {// initialize the digital pin as an output.// Pin 13 has an LED connected on most Arduino boards:pinMode(13, OUTPUT);}void loop() {digitalWrite(13, HIGH); // set the LED ondelay(1); // wait for a seconddigitalWrite(13, LOW); // set the LED offdelay(9); // wait for a second}
  • 63. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編アナログ出力(PWM)330Ω
  • 64. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編アナログ出力(PWM)
  • 65. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編アナログ出力(PWM):1.Basics/Fadeint brightness = 0;int fadeAmount = 5;void setup() {pinMode(9, OUTPUT);}void loop() {// set the brightness of pin 9:analogWrite(9, brightness);brightness = brightness + fadeAmount;if (brightness == 0 || brightness == 255) {fadeAmount = -fadeAmount ;}delay(30);}
  • 66. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編PWM(Pulse Width Modulation)05電圧時間05電圧時間
  • 67. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編PWMを利用できるデジタルピングラウンドパワーインジケータ+3.3V電源の++5Vグラウンド×2アナログ入力×6デジタル入出力×14外部電源
  • 68. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編デジタル入力(プルダウン)330Ω10kΩ
  • 69. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編デジタル入力(プルダウン)
  • 70. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編デジタル入力:2.Digital/Buttonconst int buttonPin = 2;const int ledPin = 13;int buttonState = 0;void setup() {pinMode(ledPin, OUTPUT);pinMode(buttonPin, INPUT);}void loop(){// read the state of the pushbutton value:buttonState = digitalRead(buttonPin);if (buttonState == HIGH) {digitalWrite(ledPin, HIGH);}else {digitalWrite(ledPin, LOW);}}
  • 71. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編デジタル入力(プルアップ)330Ω10kΩ
  • 72. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編デジタル入力(プルアップ)
  • 73. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編デジタル出力(シンク)330Ω10kΩ
  • 74. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編デジタル出力(シンク)
  • 75. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編レシピ1・24:明るさに応じてLEDを制御330Ω10kΩ
  • 76. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編レシピ1・24:明るさに応じてLEDを制御
  • 77. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編アナログ入力:自分でコードを書いてみるconst int sensorPin = A0;void setup() {Serial.begin(9600);}void loop() {// read the value from the sensor:int sensorValue = analogRead(sensorPin);// send the value to the PC via serialSerial.println(sensorValue);// wait for a little bitdelay(100);}
  • 78. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編抵抗分圧
  • 79. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編レシピ1・24:明るさに応じてLEDを制御// 閾値const int threshold = 511;// ヒステリシスconst int hysteresis = 102;const int sensorPin = 0;const int ledPin = 9;// 前回の状態boolean wasBright = true;void setup() {pinMode(ledPin, OUTPUT);// LEDを消灯digitalWrite(ledPin, LOW);}
  • 80. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編レシピ1・24:明るさに応じてLEDを制御void loop() {int brightness = analogRead(sensorPin);// 現在の状態(初期値には前回の値を代入)boolean isBright = wasBright;if (brightness > (threshold + hysteresis)) {// 現在の明るさが閾値+ヒステリシスよりも大きければ明るいと判断isBright = true;}else if (brightness < (threshold - hysteresis)) {// 現在の明るさが閾値ーヒステリシスよりも小さければ暗いと判断isBright = false;}if (!wasBright && isBright) {// 暗い状態から明るい状態に変化したらLEDを消灯digitalWrite(ledPin, LOW);}else if (wasBright && !isBright) {// 明るい状態から暗い状態に変化したらLEDを点灯digitalWrite(ledPin, HIGH);}// 全回の値として今回の値をセットwasBright = isBright;}
  • 81. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編PC連携:4.Communication/Dimmer1. ウェブブラウザで次のURLにアクセスhttp://processing.org/download/2. 使用しているプラットフォームに対応したパッケージをダウンロード3. デスクトップなどに展開して起動
  • 82. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編PC連携:4.Communication/Dimmerconst int ledPin = 9;void setup() {// initialize the serial communication:Serial.begin(9600);pinMode(ledPin, OUTPUT);}void loop() {byte brightness;// check if data has been sent from the computer:if (Serial.available()) {// read the most recent byte (0-255)brightness = Serial.read();// set the brightness of the LED:analogWrite(ledPin, brightness);}}
  • 83. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:基本編PC連携:4.Communication/Dimmerimport processing.serial.*;Serial port;void setup() {size(256, 150);// Print available serial portsprintln(Serial.list());port = new Serial(this, "COM1", 9600);}void draw() {// draw a gradient from black to white...// send the current X-position of the mouseport.write(mouseX);}
  • 84. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:応用編デジタル入力の変化をイベントにする(1/2)const int buttonPin = 2;const int ledPin = 13;int buttonState = 0;// 前回のボタンの状態を保持するための変数int lastButtonState = LOW;// 現在のLEDの状態を保持するための変数boolean ledIsOn = false;void setup() {pinMode(ledPin, OUTPUT);pinMode(buttonPin, INPUT);}
  • 85. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:応用編デジタル入力の変化をイベントにする(2/2)void loop() {// ボタンの状態を読み取るbuttonState = digitalRead(buttonPin);// 前回ボタンが押されていなくて現在ボタンが押されていたらif (lastButtonState == LOW && buttonState == HIGH) {if (!ledIsOn) {// 現在LEDがオンでなければオンにセットdigitalWrite(ledPin, HIGH);ledIsOn = true;} else {// 現在LEDがオンであればオフにセットdigitalWrite(ledPin, LOW);ledIsOn = false;}}// 前回のボタンの状態を保持する変数の値に現在のボタンの状態をセットlastButtonState = buttonState;}
  • 86. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:応用編デジタル入力の変化をイベントにする• 変化した時にシリアルで送信するようにしてみる• 1回しかオン/オフしていないのに複数回発生する?• この現象をチャタリングと呼ぶ• ループ中にディレイを入れることである程度解決する
  • 87. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:応用編スイッチを押したら写真を撮影・保存する1. Examples/Libraries/video/Capture/GettingStartedCaptureを開く2. Examples/Topics/File IO/SaveFramesを開く3. 組み合せてマウスクリックで画像を保存できるようにする4. Examples/Libraries/serial/SimpleReadを開く5. Arduino用のスケッチを書いてアップロードする6. 組み合せてスイッチを押したら画像を保存できるようにする
  • 88. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:応用編Arduino側の例(1/2)const int buttonPin = 2;// 前回のボタンの状態を保持するための変数int lastButtonState = LOW;void setup() {pinMode(buttonPin, INPUT);// シリアル通信を9600bpsで開始Serial.begin(9600);}
  • 89. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:応用編Arduino側の例(2/2)void loop() {// ボタンの状態を読み取るint buttonState = digitalRead(buttonPin);// 前回ボタンが押されていなくて現在ボタンが押されていたらif (lastButtonState == LOW && buttonState == HIGH) {Serial.print(*);}// 前回のボタンの状態を保持する変数の値に現在のボタンの状態をセットlastButtonState = buttonState;// チャタリングを防止するために10ms待つdelay(10);}
  • 90. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:応用編Processing側の例(1/2)import processing.video.*;import processing.serial.*;Capture cam;Serial serialPort;void setup() {size(640, 480, P2D);cam = new Capture(this, 640, 480);cam.start();// シリアルポートのリストをプリントprintln(Serial.list());// Mac OS X LionではArduinoは0番目のシリアルポートになる// Mac OS X Mountain Lionでは異なるため、リストの出力に合わせて変更String portName = Serial.list()[6];serialPort = new Serial(this, portName, 9600);}
  • 91. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:応用編Processing側の例(1/2)import processing.video.*;import processing.serial.*;Capture cam;Serial serialPort;void setup() {size(640, 480, P2D);cam = new Capture(this, 640, 480);cam.start();// シリアルポートのリストをプリントprintln(Serial.list());// Mac OS X LionではArduinoは0番目のシリアルポートになる// Mac OS X Mountain Lionでは異なるため、リストの出力に合わせて変更String portName = Serial.list()[6];serialPort = new Serial(this, portName, 9600);}
  • 92. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:応用編Processing側の例(2/2)void draw() {if (cam.available() == true) {cam.read();}image(cam, 0, 0);if (serialPort.available() > 0) {int inByte = serialPort.read();// 読み取ったデータが想定しているものであれば現在の画面を保存if (inByte == *) {saveFrame("output/frames####.png");println("captured");}}}
  • 93. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:応用編スイッチを押したらサウンドを再生する1. Examples/Libraries/minim/PlayAFileを開く2. 先ほどのサンプルを参考にして、スイッチを押したらサウンドを再生するようにする3. Minimのリファレンスは以下を参照http://code.compartmental.net/minim/javadoc/
  • 94. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:応用編Arduino側の例(1/2)const int buttonPin = 2;// 前回のボタンの状態を保持するための変数int lastButtonState = LOW;void setup() {pinMode(buttonPin, INPUT);// シリアル通信を9600bpsで開始Serial.begin(9600);}
  • 95. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:応用編Arduino側の例(2/2)void loop() {// ボタンの状態を読み取るint buttonState = digitalRead(buttonPin);// 前回ボタンが押されていなくて現在ボタンが押されていたらif (lastButtonState == LOW && buttonState == HIGH) {Serial.print(p);}// 前回ボタンが押されていて現在ボタンが押されていなかったらelse if (lastButtonState == HIGH && buttonState == LOW) {Serial.print(r);}// 前回のボタンの状態を保持する変数の値に現在のボタンの状態をセットlastButtonState = buttonState;// チャタリングを防止するために10ms待つdelay(10);}
  • 96. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:応用編Processing側の例(1/2)import ddf.minim.*;import processing.serial.*;Minim minim;AudioPlayer player;Serial serialPort;void setup(){size(512, 200, P3D);println(Serial.list());String portName = Serial.list()[6];serialPort = new Serial(this, portName, 9600);minim = new Minim(this);player = minim.loadFile("marcus_kellis_theme.mp3");}
  • 97. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:応用編Processing側の例(2/2)void draw(){if (serialPort.available() > 0) {int inByte = serialPort.read();if (inByte == p) {player.rewind();player.play();}else if (inByte == r) {player.pause();}}}
  • 98. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:応用編ライブラリはどんな時に有効か?• 複数の入出力を扱いたいとき• 特別なセンサやアクチェータを扱いたいとき• ライブラリの詳細に関しては次のページを参照http://arduino.cc/en/Reference/Libraries
  • 99. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:応用編ライブラリの使い方1. ウェブブラウザで次のURLにアクセスhttps://github.com/soundanalogous/ActionButton/2. ZIPボタンをクリックしてダウンロードし、ダウンロードが終わったら解凍する3. 書類/Arduinoの中に(もしまだなければ)「libraries」というファルダを作成4. 解凍が終わったファイルを次のように配置Arduino/libraries/ActionButton5. SketchメニューのImport Library...のContributedの中にActionButtonが表示されることを確認
  • 100. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:応用編今回のサンプル1. ウェブブラウザで次のURLにアクセスhttps://dl.dropboxusercontent.com/u/36239/workshop_examples_2013-04-30.zip2. ZIPボタンをクリックしてダウンロードし、ダウンロードが終わったら解凍し、書類/Arduinoフォルダに移動する
  • 101. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:応用編LEDライブラリの基本例(1)#include <LED.h>// LEDオブジェクトLED led = LED(9);void setup() {// LEDを1000ms間隔で点滅させるled.blink(1000);}void loop() {// LEDの状態を更新led.update();}
  • 102. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:応用編LEDライブラリの基本例(2)#include <LED.h>// LEDオブジェクトLED led = LED(9);void setup() {// LEDを2000msでフェードインled.fadeIn(2000);}void loop() {// LEDの状態を更新led.update();}
  • 103. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:応用編ActionButtonライブラリの基本(1/2)#include <Button.h>#include <LED.h>Button button = Button(2);LED led = LED(9);void setup() {// ここでは何もしない}
  • 104. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:応用編ActionButtonライブラリの基本(2/2)void loop() {// ボタンの状態を更新(これを実行しない限り状態は更新されない)button.update();// ボタンが押されていればif (button.isPressed()) {// LEDをオンled.on();}else {// LEDをオフled.off();}}
  • 105. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:応用編簡易リファレンス:ActionButton(1/2)// コンストラクタButton(uint8_t buttonPin, uint8_t buttonMode);// ボタンの状態を更新するvoid update();// ボタンが押されているか否かbool isPressed();// updateを呼ぶ前にボタンが押されていたか否かbool wasPressed();// updateの前後で状態が変化したか否かbool stateChanged();// ボタンが押されていない→押されたへの変化が起きたか否かbool uniquePress();// ボタンが押された→押されていないへの変化が起きたか否かbool uniqueRelease();// 長押しのしきい値をセットvoid setHoldThreshold(unsigned int holdTime);
  • 106. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:応用編簡易リファレンス:ActionButton(2/2)// あらかじめ設定した時間だけ長押しされたか否かbool held(unsigned int time);// 引数で与えた時間だけ押されたか否かbool heldFor(unsigned int time);// ボタンが押されたイベントに対するイベントハンドラをセットvoid pressHandler(buttonEventHandler handler);// ボタンが離されたイベントに対するイベントハンドラをセットvoid releaseHandler(buttonEventHandler handler);// ボタンがクリックされたイベントに対するイベントハンドラをセットvoid clickHandler(buttonEventHandler handler);// 長押しイベントに対するイベントハンドラをセットvoid holdHandler(buttonEventHandler handler, unsigned int holdTime);// ボタンが押されている時間unsigned int holdTime() const;// ボタンが押された回数unsigned int presses() const;
  • 107. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:応用編簡易リファレンス:LED(1/2)//コンストラクタLED(byte ledPin, byte driveMode = SOURCE);// LEDの状態を更新void update();// 現在の状態を取得byte getState();// 点灯void on();// 消灯void off();// 点灯と消灯をトグルvoid toggle();// 点滅(引数は間隔、回数、波形、指定回数だけ終了するまで待つか否か)void blink(unsigned int time, byte times = 0, byte wave = 0, bool synchronous);// 輝度をセットvoid setValue(byte val);
  • 108. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:応用編簡易リファレンス:LED(2/2)// 現在の輝度を取得byte getValue();// 指定した値までフェード(引数は値、時間、終了まで待つか否か)void fadeTo(byte val, unsigned int time, bool synchronous);// フェードイン(引数は時間、終了するまで待つか否か)void fadeIn(unsigned int time, bool synchronous);// フェードアウト(引数は時間、終了するまで待つか否か)void fadeOut(unsigned int time, bool synchronous);
  • 109. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:応用編RGB LED150Ω150Ω330Ω
  • 110. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:応用編測距センサ(PSD)
  • 111. Extended Motifwork 2013 ¦ Make: Hardware Sketching補足部品などの購入先一覧• スイッチサイエンスhttp://www.switch-science.com/• メカロボショップhttp://www.mecharoboshop.com/• 共立エレショップhttp://eleshop.jp/• 秋月電子http://akizukidenshi.com/• マルツ電波http://marutsu.co.jp/• aitendohttp://www.aitendo.co.jp/
  • 112. Extended Motifwork 2013 ¦ Make: Hardware Sketching補足さらに詳しく知りたい時は?• Arduino公式ウェブサイト(http://arduino.cc/)• Prototyping Labウェブサイト(http://prototypinglab.com/)• Googleで検索• 書籍で調べる
  • 113. Extended Motifwork 2013 ¦ Make: Hardware Sketchingkonashikonashiとは• ユカイ工学が開発、販売するツールキットhttp://konashi.ux-xu.com• 8つのデジタル入出力ピン、3つのアナログ入力ピン、I2C(デジタル入出力ピン6および7と兼用)、1つのシリアルポート• 外部電源、コイン形電池(CR2032)、バッテリ端子から電源を供給できる• iOS用のライブラリが提供されるI/Oモジュールであるため、プログラミングをiOSデバイス上で完結できる• 必要に応じてArduinoなどと組合わせることができる• 技術的にはBluetooth Low Energyを採用
  • 114. Extended Motifwork 2013 ¦ Make: Hardware SketchingkonashiBluetooth Low Energyとは• 超低消費電力無線通信• Bluetooth 4で統合(=Bluetooth 3+BLE)• 少量データ、低頻度を想定• iPhone 4S(2011年10月)以降のApple社製品、iOS 5以降で対応• MFi(Made For iPhone)のためのNDA締結が不要• XcodeとCoreBluetoothフレームワークで開発できる• デバイス間の接続はスター型で、接続数は上限なし、セントラルとペリフェラルは非対称(ペリフェラルがより低消費電力)参考資料:iOSアプリ開発者のためのBluetooth Low Energy体験講座(上原昭宏氏)
  • 115. Extended Motifwork 2013 ¦ Make: Hardware Sketchingkonashikonashiのピン配列konashiマニュアルより転載USB-microB(USB-Bus power)DC 5.0Vコイン型バッテリ(CR2032type)DC 3.0Vバッテリ電圧(S2B-PH-K-S / JST)DC 3.2 ∼12.0VUSART通信端子デジタルI / O (PIO 0 5)(PWM端子と兼用)デジタルI / O (PIO 6,7)(PWM端子. I2C通信端子と兼用)各種電圧端子(バッテリ電圧, DC5.0V,DC3.0V)アナログ入力 (AIO 0~2)(リファレンス電圧 1.3V)オンボード入力端子(PIO 0)オンボード出力端子(PIO 1~4)オンボード入出力切換え端子
  • 116. Extended Motifwork 2013 ¦ Make: Hardware Sketchingkonashiデジタル入出力ピンの5番にLEDを接続
  • 117. Extended Motifwork 2013 ¦ Make: Hardware Sketchingkonashiアナログ入力ピンの0番にCdSセルを接続
  • 118. Extended Motifwork 2013 ¦ Make: Hardware Sketchingkonashiさらに詳しく知りたい時は?• konashiの製品ウェブサイトのドキュメントhttp://konashi.ux-xu.com/documents/• FacebookのWT-BTLEグループhttps://www.facebook.com/groups/563064710384459/• iOSアプリ開発者のためのBluetooth Low Energy体験講座資料http://www.slideshare.net/reinforcelab/20130322-btle
  • 119. Extended Motifwork 2013 ¦ Make: Hardware Sketchingワークショップ:実践編課題• スイッチをつくる• ここ一番で使うスイッチ• 間違って押せてはいけない• 押した時には確実に動作しなくてはならない• 動作したことが分かるようにインタラクションを実装する• スイッチの形状も検討する• 発表は14:30から