thursday week 1: physical computing theory and practice of...

54
Thursday Week 1: Physical Computing 1 Theory and Practice of Tangible User Interfaces Physical Computing Introduction week 01

Upload: others

Post on 05-Aug-2020

1 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

1

Theory and Practice of Tangible User Interfaces

Physical ComputingIntroduction

week 01

Page 2: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

2

Theory and Practice of Tangible User Interfaces

How the Computer Sees UsShall we take a better look at ourselves to see our full range of expression?

Illustration from O’Sullivan and Igoe

Page 3: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

3

Theory and Practice of Tangible User Interfaces

Physical ComputingA conversation between the physical world and the virtual world of the computer.

Page 4: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

4

Theory and Practice of Tangible User Interfaces

Input and Output

Page 5: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

5

Theory and Practice of Tangible User Interfaces

Input and Output

Page 6: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

6

Theory and Practice of Tangible User Interfaces

TransductionThe conversion of one form of energy into another

Arduino

Illustration adapted and modified from O’Sullivan and Igoe

Page 7: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

7

Theory and Practice of Tangible User Interfaces

Transducers

output transducersActuators (e.g., motors, buzzers)

input transducerssensors (e.g., switches, levers, sliders, etc.)

Arduino

Illustration adapted and modified from O’Sullivan and Igoe

Page 8: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

8

Theory and Practice of Tangible User Interfaces

Microcontrollers

output transducersActuators (e.g., motors, buzzers)

input transducerssensors (e.g., switches, levers, sliders, etc.)

Arduino

Illustration adapted and modified from O’Sullivan and Igoe

Page 9: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

9

Theory and Practice of Tangible User Interfaces

Digital and AnalogDigital = “whether or not”

(Is the cat on the mat or not?)

Analog signal = “how much”

or “stronger”

“faster”

“brighter”

(How heavy is the cat that’s on the mat?)

Page 10: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

10

Theory and Practice of Tangible User Interfaces

Word of Caution: Your Idea is Important1.

Don’t get trapped in technological seduction

2.

Don’t spin your wheels for so long that you give up your project. There might be an alternative way that makes things easier.

Work at a high level. Talk to us. Ask other people. Take frequent breaks.

From O’Sullivan and Igoe

Page 11: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

11

Theory and Practice of Tangible User Interfaces

Working with ArduinoAn open-source electronics prototyping

Create interactive objects and environments

Page 12: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

12

Theory and Practice of Tangible User Interfaces

What is ArduinoA tiny computer you can program, for rapid prototyping

Page 13: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

13

Theory and Practice of Tangible User Interfaces

Arduino as an Interface Board

Illustration adapted and modified from O’Sullivan and Igoe

Arduino

Page 14: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

14

Theory and Practice of Tangible User Interfaces

Arduino as an Interface Board

Illustration adapted and modified from O’Sullivan and Igoe

Arduino

Page 15: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

15

Theory and Practice of Tangible User Interfaces

Arduino as an Embedded Computing Device

Illustration adapted and modified from O’Sullivan and Igoe

Arduino

Page 16: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

16

Theory and Practice of Tangible User Interfaces

What is ArduinoRelatively cheap (compare with LEGO Mindstorm)

$250 ~$31

Page 17: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

17

Theory and Practice of Tangible User Interfaces

What is ArduinoIt used to be a bit more complicated…

image from www.tangentsoft.net/elec/breadboard.html

Page 18: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

18

Theory and Practice of Tangible User Interfaces

Open source, so you can build one yourself!

Page 19: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

19

Theory and Practice of Tangible User Interfaces

Arduino Board Overview

Page 20: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

20

Theory and Practice of Tangible User Interfaces

Arduino Board Overview•

8 kBytes

of Flash program memory•

1 kByte

of RAM•

12 MHz (Apple II: 1 MHz)

Page 21: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

21

Theory and Practice of Tangible User Interfaces

Arduino Board Overview•

13 digital input/output pins

5 analog input pins

Page 22: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

22

Theory and Practice of Tangible User Interfaces

Arduino Board Overview

Page 23: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

23

Theory and Practice of Tangible User Interfaces

Arduino Board Overview•

USB to serial

Page 24: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

24

Theory and Practice of Tangible User Interfaces

Arduino Software

Page 25: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

25

Theory and Practice of Tangible User Interfaces

Arduino Software

Page 26: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

26

Theory and Practice of Tangible User Interfaces

Arduino Programming Cycle

edit

upload

run verify

Page 27: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

27

Theory and Practice of Tangible User Interfaces

Arduino Programming Cycle

edit

upload

run verify

Page 28: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

28

Theory and Practice of Tangible User Interfaces

Arduino Programming Cycle

edit

upload

run verify

Page 29: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

29

Theory and Practice of Tangible User Interfaces

Arduino Programming Cycle

edit

upload

run verify

Page 30: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

30

Theory and Practice of Tangible User Interfaces

Arduino Programming Cycle

Watch your LED blink!

edit

upload

run verify

Page 31: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

31

Theory and Practice of Tangible User Interfaces

Arduino ProgramProgram consists of 3 parts:

1. Declare

variables at top

2. Initialize

setup() –

run once at beginning, set pins

3. Run

loop() –

run repeatedly, after setup()

Page 32: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

32

Theory and Practice of Tangible User Interfaces

Arduino LanguageLike C but easier

Example functions

pinMode() –

set a pin as input or output•

digitalWrite() –

set a digital pin high/low

digitalRead() –

read a digital pin’s state•

analogRead() –

read an analog pin•

analogWrite() –

write an “analog”

PWM value

delay() –

wait an amount of time

Page 33: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

33

Theory and Practice of Tangible User Interfaces

Example (and many other examples at www.arduino.cc)

Page 34: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

34

Theory and Practice of Tangible User Interfaces

Example (and many other examples at www.arduino.cc)

Declare variables

Page 35: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

35

Theory and Practice of Tangible User Interfaces

Example (and many other examples at www.arduino.cc)

Initialize

Page 36: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

36

Theory and Practice of Tangible User Interfaces

Example (and many other examples at www.arduino.cc)

Run

Page 37: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

37

Theory and Practice of Tangible User Interfaces

Arduino and Breadboard

Page 38: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

38

Theory and Practice of Tangible User Interfaces

Arduino and Breadboard

Page 39: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

39

Theory and Practice of Tangible User Interfaces

Solderless

Breadboard

Page 40: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

40

Theory and Practice of Tangible User Interfaces

Solderless

Breadboard

Page 41: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

41

Theory and Practice of Tangible User Interfaces

Solderless

Breadboard

Page 42: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

42

Theory and Practice of Tangible User Interfaces

Circuits: Avoid ShortcutsElectricity always favors the path of least resistance to ground

Illustration from O’Sullivan and Igoe

Page 43: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

43

Theory and Practice of Tangible User Interfaces

Circuits: Avoid ShortcutsElectricity always favors the path of least resistance to ground

Illustration from O’Sullivan and Igoe

Page 44: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

44

Theory and Practice of Tangible User Interfaces

CircuitsAll the electrical energy in a circuit must be used

Illustration from O’Sullivan and Igoe

Page 45: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

45

Theory and Practice of Tangible User Interfaces

LED•

LED = Light-Emitting Diode

Needs a “current limiting”

resistor, or burns out

Illustration from Tod

Kurt’s Spooky Projects

Page 46: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

46

Theory and Practice of Tangible User Interfaces

Circuits SummaryAvoid deadly shortcuts

Flows to the lowest resistance•

All the electrical energy in a circuit must be used

When in doubt, talk to us, we can help

(Your Arduino has some fail safe, but in the worst case, you could fry your board [$31.00])

Page 47: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

47

Theory and Practice of Tangible User Interfaces

Try to be NeatColor code:

Red: power•

Black: ground

Be consistent

Good Bad

Page 48: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

48

Theory and Practice of Tangible User Interfaces

Be Careful

Page 49: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

49

Theory and Practice of Tangible User Interfaces

Homework This Week•

Get the course lab kit

Download & install Arduino software (www.arduino.cc)

Make an LED blink

Create your course web account

Post the photo of your board and an optional comment on the course website

Page 50: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

50

Theory and Practice of Tangible User Interfaces

Homework: Blinking LED

Resistorred, red, brown, gold

LED

Page 51: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

51

Theory and Practice of Tangible User Interfaces

Homework looks like thisLEDShorter leg groundPolarity matters

220 ohm resistorred, red, brown, goldPolarity does not matter

Page 52: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

52

Theory and Practice of Tangible User Interfaces

Course Kit

Page 53: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

53

Theory and Practice of Tangible User Interfaces

Next ThursdayDon’t forget to bring your lab kit in

Do use the lab hour to catch up

Create your course account

Post your homework on the course website

Page 54: Thursday Week 1: Physical Computing Theory and Practice of ...courses.ischool.berkeley.edu/i290-13/f07/system/...Thursday Week 1: Physical Computing 3 Theory and Practice of Tangible

Thursday Week 1: Physical Computing

54

Theory and Practice of Tangible User Interfaces

Thanks!