user interface engineering fs 2013 - ait lab · 2016. 3. 8. · electronics 101 eth zürich...

||

Input Fundamentals

23.09.2013 1

User Interface Engineering – FS 2013

ETH Zürich – Departement Computer Science – User Interface Engineering – FS 2013 – Prof. Dr. Otmar Hilliges

||

Brief Overview of HCI as a discipline

History of the UI

Product perspective

Research perspective

Overview of own research as motivation

23.09.2013 2

Last Week


Design

PrototypeEvaluation

|| 23.09.2013 3

Today


||

Buttons are everywhere

23.09.2013 4

Buttons & Switches


Especially on interactive devices

|| 23.09.2013 5ETH Zürich – Departement Computer Science – User Interface Engineering – FS 2013 – Prof. Dr. Otmar Hilliges

https://www.sparkfun.com/products/9136

https://www.sparkfun.com/products/9136

|| 23.09.2013 8

Bop It – What’s in it?


|| 23.09.2013 9

Bop It – What’s in it?


||

Current, Voltage, Resistance

23.09.2013 10

Electronics 101


Illustrations mostly from:

Paul Scherz, Practical Electronics for Inventors

Recommended Reading:

http://www.andyholtin.com/links/Practical_Electronics_for_Inventors.pdf

- The Basics - Just Enough to Scrape By™

http://www.andyholtin.com/links/Practical_Electronics_for_Inventors.pdf

|| 23.09.2013 11

Current


The amount of charge crossing an area per unit of time

ee

e

e

e e

|| 23.09.2013 12

Current


ee

e

e

e e

𝐼 =Δ𝑄

Δ𝑡=𝑑𝑄

𝑑𝑡

||

Electric currents are carried by electrons

Each electron carries a (negative) charge

− 𝑒 = −1.6 𝑥 10−19𝐶

Current is measured in Ampere (A)

1𝐴 = 1𝐶

𝑠

23.09.2013 13

Current


e

|| 23.09.2013 14

Direction of Flow


ee

e

e

e e

Battery +-

e

e

e

e

Conventional current flow (I)

YouTube: “Oil Drop Experiment”

||

Opposing charge distributions at a distance create

electrical force between them

Unit of positive charge will “pushed” by the positive

and “pulled” by the negative distribution

When the charge unit moves it will change in

potential energy

Voltage is the amount of energy needed to move a

unit charge from one place to another

𝑃𝑜𝑡𝑒𝑛𝑡𝑖𝑎𝑙 𝑒𝑛𝑒𝑟𝑔𝑦

𝑈𝑛𝑖𝑡 𝑜𝑓 𝑐ℎ𝑎𝑟𝑔𝑒1𝑉 = 1

𝐽

𝐶

23.09.2013 15

Voltage


+

+

+

+

+

+

-

-

-

-

-

-

+

V

|| 23.09.2013 17

Voltage – Reference Points


+

-

+

-

6V

3V

0V

Ground or 0V Reference

+

-

+

-

0V

-3V

3V

||

Reduction in current flow due to resistance in conductor

All conductive materials have some resistance

Measured in Ohm (Ω)

Potential difference of 1 Volt will force a current of 1 Ampere through a

resistance of 1 Ohm

23.09.2013 18

Resistance


1Ω = 1𝑉

𝐴


Resistance - Water Analogy

http://hyperphysics.phy-astr.gsu.edu/hbase/electric/watcir.html

http://hyperphysics.phy-astr.gsu.edu/hbase/electric/watcir.html

|| 23.09.2013 20

Resistor Symbol


R

||

Current through a conductor between two points is directly

proportional to the potential difference across the two points

23.09.2013 21

Ohm’s Law


Ohm's law states that the R in this relation is constant,

independent of the current.

𝐼 =𝑉

𝑅𝑉 = 𝐼𝑅 𝑅 =

𝑉

𝐼

||

The work performed by an electrical current as it runs through a circuit

Measured in Watts

23.09.2013 22

Power


𝑃 = 𝑉 × 𝐼 1𝑊 = 1𝑉𝐴

|| 23.09.2013 23

Basic Circuits


|| 23.09.2013 24

Series Circuits


|| 23.09.2013 25

Parallel Circuit


||

What’s in a Switch?

23.09.2013 26ETH Zürich – Departement Computer Science – User Interface Engineering – FS 2013 – Prof. Dr. Otmar Hilliges

|| 23.09.2013 27

Switches


+

-

Interrupter Switch

|| 23.09.2013 28

Switches


+

-

Two way diverter switch

||

Number of

Poles

Throws

Duration of contact

Long-term (Switch)

Momentary (Button)

Default Behavior for Push Buttons

Normally Open (NO)

Normally Closed (NC)

23.09.2013 29

Types of Switches


|| 23.09.2013 30

Single Pole Single Throw (SPST)


|| 23.09.2013 31

Single Pole Dual Throw (SPDT)


|| 23.09.2013 32

Dual Pole Single Throw (DPST)


|| 23.09.2013 33

Single Pole (n) Throws (SP(n)T)


|| 23.09.2013 34

Magnetic Reed Switch


|| 23.09.2013 35

Mercury Tilt-Over Switch


|| 23.09.2013 36

An interactive system – Conceptual Overview


Mechanical

elements

Enclosure

Circuits Microcontroller Host-PC

Sensors

Actuators

ADC

DAC

|| 23.09.2013 37

Microcontroller


Atmel ATmega328

Used in Arduino and other electronics

frameworks

|| 23.09.2013 38

Arduino Pin Mapping


|| 23.09.2013 39

Arduino Board


||

Switch closes/breaks circuit

Problem?

Input is floating

Undefined behavior on digital read

Value might stay or it might alternate quickly

(50Hz hum)

Solution:

Connect to ground value via resistor

Pull-Down Resistor

23.09.2013 41

Connecting to a digital pin


5V

SP

ST

Input

10K

||

Pull-Up resistor is equivalent

Pulls voltage up to high logic state

23.09.2013 42

Pull-Up Resistor


5V

SP

ST

Input

10K

|| 23.09.2013 43

Interactivity


D

LED

1K

Output 12

5V

SP

ST

Input 13

10K


/* * Switch and LED test program */

int ledPin = 12; // LED is connected to pin 12

int switchPin = 13; // switch is connected to pin 13

int val; // variable for reading the pin status

void setup()

pinMode(ledPin, OUTPUT); // Set the LED pin as output

pinMode(switchPin, INPUT); // Set the switch pin as input

void loop()

val = digitalRead(switchPin); // read input value and store it in val

If (val == LOW) // check if the button is pressed

digitalWrite(ledPin, HIGH); // turn LED on

if (val == HIGH) // check if the button is not pressed

digitalWrite(ledPin, LOW); // turn LED off

||

Switches and Buttons are mechanical mechanisms

Not truly binary!

Many switches don’t change instantaneously from “on” to “off” – they bounce

between states

Especially momentary buttons, spring loaded buttons and tilt switches where a

mass moves to make or break contact

23.09.2013 45

Switch Debouncing


|| 23.09.2013 46

Switch bounce


htt

p://w

ww

.la

dya

da

.ne

t/le

arn

/ard

uin

o/le

sson

5.h

tml

||

Read Input once => Wait for bounce duration => Read again

Only if readings agree change state

Issue?

Introduces unnecessary latency

Bounce duration needs to be evaluated empirically

23.09.2013 47

Naïve Debounce


|| 23.09.2013 48

Counter based Debounce


unsigned char counter; //Variable used to countunsigned char T_valid; //Variable used as the minimum duration of a valid pulse

void main() P1 = 255; // Initialize port 1 as input portT_valid = 100; //Arbitrary number from 0 to 255 where the pulse if validated

while(1) //infinite loop

if (counter < 255) //prevent the counter to roll back to 0counter++;

if (P1_0 == 1)

counter = 0; //reset the counter back to 0

if (counter > T_valid) //....// Code to be executed when a valid pulse is detected.//....

//....//Rest of you program goes here.//....

||

Introduce capacitor into circuit

Capacitor resists the voltage change on the out pin

Response speed and hence “harshness” of filter can be tuned exactly

23.09.2013 49

Analog solutions


||

15 Minute Break


||

Designing with Switches


|| 23.09.2013 54

Key cap construction


Key Switch Membrane

Conductive Layer

Conductive Layer

Spacer Non Conductive

|| 23.09.2013 55

Key cap construction


Key Switch Membrane

Conductive Layer

Conductive Layer

Spacer Non Conductive

||

IBM compatible keyboard has 104(+) keys

Issue?

To expensive to read each key individually

Depending on controller 20-100 IO pins

Needed for many different tasks

Solution:

Connect buttons in matrix fashion

Keyboard: 16x8 matrix requires 24 pins

23.09.2013 56

Keyboard Switch Matrix


||

Rows & Columns connected to

microcontroller

Controller drives circuitry and generates key

events (key codes)

Each row and column pin

Can be used as in- or output pin

Output pins are driven (low / high)

Input pins are read (low / high)

23.09.2013 58

Key Matrix


A B

C D

Mic

rocontr

olle

r

||

Drive rows, read columns

Drive columns, read rows

23.09.2013 59

Single Key


A B

E F

C D

G H

I J

M N

K L

O P

||

Drive columns sequentially

Read rows simultaneously

23.09.2013 60

Multiple Keys


A B

E F

C D

G H

I J

M N

K L

O P

||

Certain constellations may lead to erroneous key press/release events

“C” is detected – pressed or not

Release of “B” can’t be detected

23.09.2013 61

Multiple Keys - Ghosting and Masking


A B

C D

A B

D

||

Diodes restrict flow direction of current

23.09.2013 62

Eliminating Ghosting and Masking


D

||

Many other devices (can) produce binary events just like buttons

Proximity detector

Touch sensor

Light barrier

…

23.09.2013 65

Things that act like switches



IR Emitter

Photo Diode


Forward / Backward rotation is ambiguous!

|| 23.09.2013 70

Quadrature Encoding


Clockwise

Rotation

Phase A B

1 0 0

2 0 1

3 1 1

4 1 0

C-Clockwise

Rotation

Phase A B

1 1 0

2 1 1

3 0 1

4 0 0

|| 23.09.2013 71

Example: Rotary Encoder


||

Continuous Input


||

Convert variable resistance to measurable signal

Resistance-varying and fixed resistor in series,

measure voltage between them

No discrete event

Polling required

ADC necessary

23.09.2013 73

Voltage divider


𝑉𝑂𝑢𝑡 = 𝑉𝑠𝑢𝑝𝑝𝑙𝑦 ×𝑅2

𝑅1 + 𝑅2

||

Resistive element

Strip or arc

Sliding contact (Wiper)

Electrical terminals at each end of resistive element

Electrical terminal at the wiper

23.09.2013 74

Example: Potentiometer


R

||

Force Sensing Resistor

23.09.2013 75

Further examples


http://www.openmusiclabs.com/learning/sensors/fsr/

http://www.openmusiclabs.com/learning/sensors/fsr/

||

Resistance straight: 10kΩ

Resistance bent: 40kΩ

23.09.2013 77

Further examples: Flex sensor


||

Instead of measuring force directly measure

velocity

Delay between closing of two switches

Time between break and make of SPDT

switch

Or two staggered switches

23.09.2013 80

Force sensing Switches


||

Optoelectronic sensor

essentially a super fast low-res camera

Typically 18x18 pixel

Sometimes >3000Hz (gaming mice)

LED at grazing angle

Onboard microprocessor computes 2D

coordinates

23.09.2013 82

Optical Mice


||

Mouse sensor operates under very

constraint circumstances

Translation only

Fixed illumination

Simple flow methods are sufficient

23.09.2013 83

Optical Flow


||

Optical Flow estimates motion of

Camera

Objects

Between two successive frames

In the case of the mouse the problem is

slightly easier:

Moves in 2D

On a flat surface

Controlled Illumination

Can be computed efficiently in hardware

23.09.2013 84

Optical Flow


||

Cross-Correlation

Computes similarity between signals (offset in

some dimension(s))

CC-based Optical Flow computation

Shift frame t0 relative to frame t1

n times in all directions

Highest correlation score signifies motion

direction

23.09.2013 85

Onboard Optical Flow


||

Implemented on ASIC

Integrates imaging sensor and processor

Compute optical flow via correlation

Store previous frame

(Row- and column-wise) sums of XORs of

single pixels

Integrate decisions to track movement

Massive parallel implementation

Very fast in hardware

23.09.2013 86

Optical Flow in Hardware


||

Uses infrared laser diode rather than LED

for illumination.

Exploit laser speckle

Pattern produced by mutual interference of

several wavefronts of the same wavelength

but different phase and amplitudes

Observable when coherent lightsource (i.e.

laser) is shown onto a surface (each point on

the surface acts as secondary lightsource)

Increases observable structure in the

environment

Allows for much higher sensing fidelity and

faster update rate

Works on more surfaces (even glass)

23.09.2013 87

Laser Optical Mice


|| 23.09.2013 88

Summary


Overview of input devices built from simple buttons and

switches

Discrete (Game controller buttons, Keyboards)

Analog(-ish) (Mouse-Wheel, Data Glove)

Electronics basics

Current, Voltage, Resistance, Power, Circuits

Working principle of several fundamental input devices

Mouse

Keyboard

||

You have been given three cards

Write down three real-world application ideas using some of the technologies

you learned about today

A (traditional) input device that you are sure will work

A non-traditional input device that re-purposes sensor technologies in a creative

way (e.g., Bop-It, PhotoHelix)

An “out-there” input device – you don’t even need to be sure whether it will work or

not – creativity counts most.

You have 10 Minutes time

Drop off your cards when you are done

We will discuss a select number of your designs next week

23.09.2013 89

Application Cards


||

Scherz, Paul (2006). Practical Electronics for Inventors. McGraw-Hill

Tucker, Allen B. (2004). Computer Science Handbook (Fundamental Input and

Output Devices). Chapman and Hall. 2nd Ed.

Lyon, Richard F. (1981). The Optical Mouse and an Architectural Methodology for

Smart Digital Sensors. Xerox PARC TechReport

Borchers, Jan (2013). Arduino in a Nutshell. http://hci.rwth-aachen.de/arduino

23.09.2013 90

Reading suggestions


http://hci.rwth-aachen.de/arduino

user interface engineering fs 2013 - ait lab · 2016. 3. 8. · electronics 101 eth zürich...

Documents