Your SlideShare is downloading. ×
Designers, please mind the gap!
Let’s get interactive with Arduino
By Fahed Al Riachi
Bill Verplank
Is the design of a beautiful, useful, and/or controversial
interactive experience, between us (humans) and o...
…but there is a gap
The one that can prevent
artists and designers
from realizing their
interactivity-inclined
ideas into ...
What is Arduino?
“Arduino is an open-source electronics prototyping platform
based on flexible, easy-to-use hardware and s...
What is Arduino?
Board IDE
Integrated Development environment
Community+ +
All is OPEN source
How it works?
Arduino can sense the environment by
receiving input from a variety of sensors and can affect its
surroundin...
Some examples!
Board anatomy
The brain
(microcontroller)
14 Digital input/output
6 Analog output (~PWM)
6 Analog inputs
Send/receive
data...
Some stuff to know!
Inputs & Outputs
Digital Vs. Analog
Can be either digital or analog
Dan Talson, iStockphoto
What is a circuit
(water analogy)
Getting started with Arduino, Massimo Banzi
A basic circuit
Ohms law
V = I * R
I = Current
in Amps
Resistor
It limits the
current
LED
It emits light
when have
current...
…with Arduino
How to connect stuff together easily?
by using a breadboard, it is much easier to prototype
Power rails are
Row-connected
...
Let’s start tinkering!
Blink with Arduino
By using a Digital output from the Arduino, you can
programmatically turn on/off the led
Let’s do that!
… but first, some preparations
Download the Arduino IDE
Go to: Arduino.cc > Download > choose by OS
Get the Arduino driver...
Blink example (Hello world!)
1 . Build this circuit
2. Write the sketch (code)
Open Arduino IDE
Go to: File> Examples > Ba...
Understanding the code
Any Arduino sketch
should always have
setup() and loop()
functions
Create a variable, call it
anyth...
Push button to control LEDs
LED’s party
Keyword:
Digital Input
Control the color of a pixel by waving your hand
The pixel
Keywords:
Analog Input
Hey! Don’t look directly in the LED
R
G
B
Control a servo motor to show your ‘status’
Status: What’s on your mind?
Keywords:
Analog Output
PWM
Library
Make music with light
Light Theremin
Keywords:
Tone()
Hey! Don’t forget to tune your instrument by waving your hand when L...
Create your own musical keyboard
Retro keyboard
Keywords:
Resistor ladder
Hey! Don’t forget to tune your instrument, open ...
Make a touch sensor of anything conductive
Touch anything
Keywords:
External
Library
For one day, let somebody else answers the tough questions…
Ask Im 3ali
Keywords:
LCD and
Random()
Control a motor to spin a color wheel
Motorized color wheel
Keywords:
Transistor
High Load
Hey! If you attach something to...
Create a moving image
Zoetrope
Keywords:
Bridge and
Motor control
Hey! Don’t connect +5V of Arduino to the +9v of the batt...
Control your PC from Arduino
Tweak the logo
Keywords:
Serial
Processing
Build an interactive thing that mixes
at least 3 from what we’ve done
Brainstorm
Design
Build
Write sketch
Test and iterat...
Shields and Accessories
What’s next?
Tell me about your next interactive
project!
Designers, please mind the gap! Let's get started with Arduino
Upcoming SlideShare
Loading in...5
×

Designers, please mind the gap! Let's get started with Arduino

360

Published on

A presentation I made used to conduct a workshop introducing Arduino for Designers.
Projects are built upon work done in the official Arduino Starter Kit, and hereby shared under same Creative Common license Attribution-NonCommercial-ShareAlike

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
360
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
0
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide
  • Blink morse code?
    /*
    Blink
    Turns on an LED on for one second, then off for one second, repeatedly.

    This example code is in the public domain.
    */

    // Pin 13 has an LED connected on most Arduino boards.
    // give it a name:
    int led = 13;

    // the setup routine runs once when you press reset:
    void setup() {
    // initialize the digital pin as an output.
    pinMode(led, OUTPUT);
    }

    // the loop routine runs over and over again forever:
    void loop() {
    digitalWrite(led, HIGH); // turn the LED on (HIGH is the voltage level)
    delay(1000); // wait for a second
    digitalWrite(led, LOW); // turn the LED off by making the voltage LOW
    delay(1000); // wait for a second
    }
  • /*
    Blink
    Turns on an LED on for one second, then off for one second, repeatedly.

    This example code is in the public domain.
    */

    // Pin 13 has an LED connected on most Arduino boards.
    // give it a name:
    int led = 13;
    int dotSeparatorPause = 100;
    int letterSeparatorPause = 1000;
    int wordseparatorPause = 3000;
    int shortDot = 300;
    int longDot = 600;


    // the setup routine runs once when you press reset:
    void setup() {
    // initialize the digital pin as an output.
    pinMode(led, OUTPUT);
    }

    // the loop routine runs over and over again forever:
    void loop() {
    digitalWrite(led, HIGH); // turn the LED on (HIGH is the voltage level)
    delay(shortDot); // wait for a second
    digitalWrite(led, LOW); // turn the LED off by making the voltage LOW
    delay(dotSeparatorPause); // wait for a second
    digitalWrite(led, HIGH); // turn the LED on (HIGH is the voltage level)
    delay(shortDot); // wait for a second
    digitalWrite(led, LOW); // turn the LED off by making the voltage LOW
    delay(dotSeparatorPause); // wait for a second
    digitalWrite(led, HIGH); // turn the LED on (HIGH is the voltage level)
    delay(shortDot); // wait for a second
    digitalWrite(led, LOW); // turn the LED off by making the voltage LOW
    delay(letterSeparatorPause); // wait for a second

    digitalWrite(led, HIGH); // turn the LED on (HIGH is the voltage level)
    delay(longDot); // wait for a second
    digitalWrite(led, LOW); // turn the LED off by making the voltage LOW
    delay(dotSeparatorPause); // wait for a second
    digitalWrite(led, HIGH); // turn the LED on (HIGH is the voltage level)
    delay(longDot); // wait for a second
    digitalWrite(led, LOW); // turn the LED off by making the voltage LOW
    delay(dotSeparatorPause); // wait for a second
    digitalWrite(led, HIGH); // turn the LED on (HIGH is the voltage level)
    delay(longDot); // wait for a second
    digitalWrite(led, LOW); // turn the LED off by making the voltage LOW
    delay(letterSeparatorPause); // wait for a second

    digitalWrite(led, HIGH); // turn the LED on (HIGH is the voltage level)
    delay(shortDot); // wait for a second
    digitalWrite(led, LOW); // turn the LED off by making the voltage LOW
    delay(dotSeparatorPause); // wait for a second
    digitalWrite(led, HIGH); // turn the LED on (HIGH is the voltage level)
    delay(shortDot); // wait for a second
    digitalWrite(led, LOW); // turn the LED off by making the voltage LOW
    delay(dotSeparatorPause); // wait for a second
    digitalWrite(led, HIGH); // turn the LED on (HIGH is the voltage level)
    delay(shortDot); // wait for a second
    digitalWrite(led, LOW); // turn the LED off by making the voltage LOW
    delay(wordseparatorPause); // wait for a second
    }
  • Groups of 3:
    brainstorm  Design  Build  Write sketch Test and iterate until happy  Document  Open and Share
  • Transcript of "Designers, please mind the gap! Let's get started with Arduino"

    1. 1. Designers, please mind the gap! Let’s get interactive with Arduino By Fahed Al Riachi
    2. 2. Bill Verplank Is the design of a beautiful, useful, and/or controversial interactive experience, between us (humans) and objects. It is a focus shift for designers, from form to behavior A specific field of Interaction Design is Physical Interaction Design It uses electronics to prototype new materials for designers and artists. Getting started with Arduino, Massimo Banzi
    3. 3. …but there is a gap The one that can prevent artists and designers from realizing their interactivity-inclined ideas into the physical world Where to start? Know how? Seriously..electronics & code! Start from scratch!
    4. 4. What is Arduino? “Arduino is an open-source electronics prototyping platform based on flexible, easy-to-use hardware and software. It's intended for artists, designers, hobbyists, and anyone interested in creating interactive objects or environments” It is a tiny computer that you can program http://arduino.cc
    5. 5. What is Arduino? Board IDE Integrated Development environment Community+ + All is OPEN source
    6. 6. How it works? Arduino can sense the environment by receiving input from a variety of sensors and can affect its surroundings by controlling lights, motors, and other actuators Is the world Hot, cold, moving, tilted, dark, loud…? SensorsInputs ActuatorsOutputs Change the world! Code (sketch) goes here to tell it to do this do that …
    7. 7. Some examples!
    8. 8. Board anatomy The brain (microcontroller) 14 Digital input/output 6 Analog output (~PWM) 6 Analog inputs Send/receive data over USB + Power External power 6v to 9v 5v supply Ground Getting started with Arduino, Massimo Banzi
    9. 9. Some stuff to know!
    10. 10. Inputs & Outputs Digital Vs. Analog Can be either digital or analog Dan Talson, iStockphoto
    11. 11. What is a circuit (water analogy) Getting started with Arduino, Massimo Banzi
    12. 12. A basic circuit Ohms law V = I * R I = Current in Amps Resistor It limits the current LED It emits light when have current Hey! don’t: • Never connect +ve directly to –ev • Never connect a LED directly to power… always add a resistor
    13. 13. …with Arduino
    14. 14. How to connect stuff together easily? by using a breadboard, it is much easier to prototype Power rails are Row-connected ..the rest are Column-connected
    15. 15. Let’s start tinkering!
    16. 16. Blink with Arduino By using a Digital output from the Arduino, you can programmatically turn on/off the led Let’s do that!
    17. 17. … but first, some preparations Download the Arduino IDE Go to: Arduino.cc > Download > choose by OS Get the Arduino driver Connect the Arduino to your PC using USB cable Windows: control panel > System & security > device manager > right click Arduino > update Driver, then choose arduino.inf Mac: your are done! We will do this only once Let’s Open the Arduino IDE and explore it Select your board: Tools > Board > Arduino Uno Select the Arduino port: Tools > Port > choose the Arduino port Connect Arduino to your PC
    18. 18. Blink example (Hello world!) 1 . Build this circuit 2. Write the sketch (code) Open Arduino IDE Go to: File> Examples > Basic > Blink (you can later modify this code the way you want) Click on “Upload” to move the sketch on to the board Keyword: Digital Output
    19. 19. Understanding the code Any Arduino sketch should always have setup() and loop() functions Create a variable, call it anything, then store a value in it What’s inside {} it Executes only once when the Arduino is reset What’s inside {} it Executes forever in loops… until power is cut This is a comment //, or /* */ All individual instructions should end with semicolon ; Modifying the code Can you modify the sketch so the LED blinks the SOS Morse code? or maybe blinks the code of your name initials?
    20. 20. Push button to control LEDs LED’s party Keyword: Digital Input
    21. 21. Control the color of a pixel by waving your hand The pixel Keywords: Analog Input Hey! Don’t look directly in the LED R G B
    22. 22. Control a servo motor to show your ‘status’ Status: What’s on your mind? Keywords: Analog Output PWM Library
    23. 23. Make music with light Light Theremin Keywords: Tone() Hey! Don’t forget to tune your instrument by waving your hand when LED is ON!
    24. 24. Create your own musical keyboard Retro keyboard Keywords: Resistor ladder Hey! Don’t forget to tune your instrument, open Serial Monitor!
    25. 25. Make a touch sensor of anything conductive Touch anything Keywords: External Library
    26. 26. For one day, let somebody else answers the tough questions… Ask Im 3ali Keywords: LCD and Random()
    27. 27. Control a motor to spin a color wheel Motorized color wheel Keywords: Transistor High Load Hey! If you attach something to the motor head, be very carful so the thing doesn’t fly away when you turn the motor on.
    28. 28. Create a moving image Zoetrope Keywords: Bridge and Motor control Hey! Don’t connect +5V of Arduino to the +9v of the battery
    29. 29. Control your PC from Arduino Tweak the logo Keywords: Serial Processing
    30. 30. Build an interactive thing that mixes at least 3 from what we’ve done Brainstorm Design Build Write sketch Test and iterate until happy Document Open and Share
    31. 31. Shields and Accessories
    32. 32. What’s next? Tell me about your next interactive project!

    ×