Introduction to Arduino!
Jody Culkin 2011

A couple of notes
This is the script for my Introduction to Arduino Comic. Each page is described in terms of the panels on that page. For each panel, there is a description of the drawing or visual content, any text in text balloons, text in the text panels at the bottom of the panels, and text labels that are in the drawing. I have indicated what text is in bold in word balloons and text panels.

Probably the best way to check placement and font styles would be to compare with the original PDF.

Fonts:
For most of the text in word balloons and text panels, I used LetterOMatic! 9 pt. I used LetterOMatic! 10 pt bold for text I wanted to emphasize in text panels, 9 pt in word balloons. Most text is black (#000000), highlighted text is sometimes red (#FF0000) or gray (#666666). 

I included some of the font size and color information in the descriptions of the panels themselves if it is different from the standard 9 pt.

For code, I used Monaco 10 pt with code formatted with the same colors as in the Arduino interface in the illustrator file (see my original PDF).

On the last page, which has a lot of text, sub-heads are in 11 or 9 pt, links are 8 pt. In final panel, my info is 10 pt, thanks are 7 pt, Creative Commons license info is 6 point.


PAGE 1: Intro and Definition of terms
Panel 1:
Drawing:
Arduino! Over semi-transparent detail of Arduino Uno drawing.  By Jody Culkin 

Panel 2
Drawing: Character head and shoulders facing left
Word balloon: What is an Arduino?
(In text panel) It's an open-source electronics prototyping platform. What does that mean? 

Panel 3
Drawing: Definitions of open source, electronics, prototyping, platform on blue background with terms on left in black 14 pt type, white shapes with definitions on right in gray 9 pt type
(Text)
Open Source- “Resources that can be used, redistributed or rewritten free of charge. Often software or hardware.”
Electronics- ”Technology which makes use of the controlled motion of electrons through different media.”
Prototype- “An original form that can serve as a basis or standard for other things.”
Platform- “Hardware architecture with software framework on which other software can run.”

PAGE 2: Intro to the platform and microcontrollers
Panel 4 
Drawing: An Arduino connected to a breadboard with a photocell and LED with character looking on pointing.
Labels:
Microchip 
Photocell
Breadboard
LED 
(In text panel): An Arduino contains a microchip, which is a very small computer that you can program. You can attach sensors to it that can measure conditions (like how much light there is in the room). It can control how other objects react to those conditions (room gets dark, LED turns on).

Panel 5
Drawing: 2 switches 
Labels:
ON
OFF
(In text panel) Or it can respond when a switch is pressed.

Panel 6
Drawing:  finger points to mouse and monitor.
Word balloon: A mouse is a common input device for a desktop computer, a monitor is a common output device.
(In text panel) Microcontrollers use inputs and outputs like any computer. Inputs capture information from the user or the environment while outputs do something with the information that has been captured.

PAGE 3: Inputs and outputs, analog and digital
Panel 7
Drawing: Momentary switch and force sensitive resistor
Labels:
	Momentary switch
Force sensitive resistor
(In text panel) An input into the Arduino could be a switch or a sensor.

Panel 8
Drawing: DC motor, laptop 
Labels:
	DC Motor
(In text panel) Any object we want to turn on and off and control could be an output. It could be a motor or even a computer.


Panel 9
Drawing: Character head and shoulders facing right
Word balloon: What’s the difference between digital and analog inputs and outputs?
(In text panel) Inputs and outputs can be digital or analog. Digital information is binary- it is either true or false. Analog information is continuous, it can hold a range of values.

Panel 10
Drawing: Character with hands on hips
Word balloons: 
Left balloon: Digital information is discrete and finite. All information is described in two states, 1 or 0, on or off. 
Right balloon: Analog information is characterized by its continuous nature. It can have an infinite number of possible values.
(In text panel) A switch is a digital input, a sensor is an analog input. The range of an analog sensor is limited by its conversion to digital data.

PAGE 4: Review of electricity, terms and concepts
Panel 11
Drawing: Character profile, arms pointing up 
Word balloon: Voltage? Current? Resistance? Ohm’s Law?
(In text panel): Before we plug in the Arduino, we should review a few terms and principles that have to do with how electricity (and therefore electronics) works. 

Panel 12 (definitions on white shapes)
Voltage (V) is a measure of the electrical potential in a circuit. It is measured in volts.
Panel 13
Current (I) is the amount of flow through a conductive material. It is measured in amperes or amps.
Panel 14
Resistance (R) is a material's opposition to the flow of electric current. It is measured in ohms.
(Text panel underneath all) Electricity is the flow of electrical energy through a conductive material.



Panel 15
Drawing: tank with water connected to pipes through which water flows with valve attached that limits flow
(Text in white shapes)
(Near tank) The speed of flow is determined by voltage
(Near valve) Resistance increases or decreases flow
(Near pipes) Amount of flow moving through pipes is current
(In text panel): The water analogy is commonly used to explain these terms. Here’s one model.

PAGE 5: ohm’s law, what is a circuit, schematic
Panel 16 
Drawing: (Ohm’s law on white shape. Top line in red 16 pt, rules 9 pt black, or gray 7 pt type) 
Ohm’s law
Current = Voltage/Resistance
(I= V/R)
or
Resistance = Voltage/Current
(R = V/I)
or
Voltage = Resistance * Current
(V = R*I)
(In text panel): There is a relationship between voltage, current and resistance discovered by Georg Ohm, a German physicist.

Panel 17
Drawing: Tank with hose with valve limiting flow
(In text panel): For example, increase the resistance, less flow.

Panel 18
Drawing: Bigger tank, more flow from hose
(In text panel): Or increase the potential, more flow.

Panel 19
Drawing: battery attached with wires to switch and light bulb
(In text panel): Now let’s look at a simple circuit. Every circuit is a closed loop that has an energy source (battery) and a load (lamp). The load converts the electrical energy of the battery and uses it up. This one has a switch too.

Panel 20
Drawing: Schematic of simple circuit
Labels: (font-Geneva)
	Lamp
Switch
DC power source	
(In text panel): This is a schematic of the same circuit (it represents the circuit using symbols for the electronic components). When the switch is closed, current flows from the power source and lights the lamp.

PAGE 6 AC, DC, back to Arduino, USB, software
Panel 21
Drawing: Schematic with Direct Current and Alternating Current.
Labels:
Direct Current (DC) 
Alternating Current (AC)
(In text panel): There are two common types of circuits, direct current and alternating current. In a DC circuit, the current always flows in one direction. In AC, the current flows in opposite directions in regular cycles. We will only talk about DC circuits here.

Panel 22
Drawing: close up of Arduino, character in profile with hand on cheek
Word Balloon: Now that we’ve reviewed some basics of how electricity works, let’s get back to the Arduino.
(In text panel): The Arduino will need power to run. We will need to attach it to a computer to program it.

Panel 23
Drawing: Arduino, laptop, USB cable poised to connect them
(In text panel): Attaching the Arduino to a computer with a USB cable will supply the power we need and allow us to start programming.

Panel 24
Drawing: close up of interface of Arduino web page. White shape with text:
Labels:
Download Here (red type 18 pt)
 http://www.arduino.cc/en/Main/Software (black 10 pt)(linked)
(In text panel): You’ll have to download and install software to program the Arduino. it is available from the URL above free of charge. The Arduino software runs on the Mac OS X, Windows and Linux platforms.

PAGE 7: Download software and connect board
Panel 25
Drawing: Text in white shape (URLS are linked) (URLS in 10 pt red type, other text 9 pt black)
For instructions on how to install
Arduino software on a Mac:

http://www.arduino.cc/en/Guide/MacOSX 

For instructions on how to install
on Windows:

http://www.arduino.cc/en/Guide/Windows

For instructions on how to install
on Linux:

http://www.arduino.cc/playground/Learning/Linux
(In text panel): Go to the URLS above for detailed instructions on installing the software on these platforms.

Panel 26:
Drawing: Detail of Arduino with led at pwr lit up.
(In text panel): When you have installed the software, connect the Arduino. An LED marked ON should light up on the board.

Panel 27:
Drawing: Screenshot of menus in interface of Arduino software, selecting the board 
(In text panel): Launch the Arduino software. In the tools menu, select the board you are using (Tools > Board). For example, Arduino Uno.

Panel 28:
Drawing: Screenshot of menus in interface of Arduino software, selecting the serial port 
(In text panel): Next select the serial port. (Tools > Serial Port) On a Mac it will be something like /dev/tty.usbmodem. On a windows machine, it will be COM3 or something like that.

PAGE 8: IDE, First script
Panel 29:
Drawing: Character talking head shot facing left. 
(Word bubble): What’s an Integrated Development Environment?
(In text panel): When you downloaded the Arduino software, you downloaded an IDE. It combines a text editor with a compiler and other features to help programmers develop software.

Panel 30:
Drawing: Screenshot of interface of menus, selecting Blink Script
(In Text Panel): The Arduino IDE allows you to write sketches, or programs and upload them to the Arduino board. Open the Blink example in the file menu. File > Examples > 1.Basics > Blink.

Panel 31:
Drawing: Screenshot of interface of Arduino software, strip of buttons and part of sketch. Arrow pointing to upload button
Labels:
	Upload button
(In text panel): To upload the sketch to the Arduino board, click the upload button on the strip of buttons at the top of the window. Some messages will appear in the bottom of the window, finally Done Uploading.

Panel 32:
Drawing: Close-up of the Arduino with LED light at pin 13.
(In text panel): The LED at pin 13 on the Arduino starts blinking.
 
PAGE 9: writing scripts: setup and loop- brief overview of language
Panel 33:
Drawing: Blink script on white shape
void setup() {                
  // initialize the digital pin as an output.
  // Pin 13 has LED connected on most Arduino boards:
  pinMode(13, OUTPUT);     
}

void loop() {
  digitalWrite(13, HIGH);   // set the LED on
  delay(1000);              // wait for a second
  digitalWrite(13, LOW);    // set the LED off
  delay(1000);              // wait for a second
}
(In text panel): A sketch, like a program written in any language, is a set of instructions for the computer. If we look closely at the Blink sketch, we see there are 2 major parts, setup and loop.

Panel 34:
Drawing: fingers point to definitions of setup and loop on white shapes. 
Text (setup and loop in red type, definition in black all 10 pt.)
Setup: happens one time when program starts to run
Loop: repeats over and over again
(In text panel): These are both blocks of code called functions that every sketch will have. They are blocked out by curly braces { }.

Panel 35:
Drawing: Back of character reading Arduino reference guide on laptop. URL (linked) on white shape 
Text (10 pt red type)
http://arduino.cc/en/Reference/HomePage 
(In text panel): Check out the Arduino website for the Arduino reference guide and many other resources to learn the language. 

Panel 36:
Drawing: Close up of blink script with explanation line by line with comments. Comments are in red in LetterOMatic
Text
void setup() {              //declares block of code   
  pinMode(13, OUTPUT); 	//sets pin 13 to output
}	//end block of code

void loop() {		//declares block of code
  digitalWrite(13, HIGH);	 //sets pin 13 high
  delay(1000); 		//pause 1 second    
  digitalWrite(13, LOW);  	//sets pin 13 low
  delay(1000); 		//pause 1 second
}	//end block of code
(In text panel): For now, let’s look at this simple script line by line and see what each line does.

PAGE 10: Using a Breadboard, LED digital output
Panel 37:
Drawing: Hand holding breadboard
(In text panel): How do we control objects that are not on the Arduino board? We will connect the Arduino to a solderless breadboard. This will allow us to quickly set up and test circuits.

Panel 38: 
Drawing: Close up of breadboard- text on white shapes with pointing arrows: (red type 10 pt bold)
Labels: 
Holes connected horizontally
Holes connected vertically
(In text panel): This breadboard has 2 rows of holes running down the left and right side, and 5 rows of holes on either side of a middle indentation. The side rows are connected vertically, each row of 5 holes in the middle are connected horizontally.

Panel 39:
Drawing: Power and ground connected from Arduino to breadboard and across top of board so power and ground run down both sides
(In text panel): We will connect power and ground from the Arduino board to the vertically connected strips on the left and right with 22 gauge wire. Other components can be attached to the holes in the middle and to power and ground as needed.

Panel 40:
Drawing: LED.  Text defines anode and cathode 
Labels:
Anode (connects to power)
Cathode (connects to ground)
(In text panel): When current flows through an LED (Light Emitting Diode) in the right direction, it lights up. We’ll attach an LED to the breadboard, then to the Arduino so we can control it with code.

PAGE 11: Digital output 
Panel 41:
Drawing: Breadboard attached to Arduino with LED attached
(In text panel): The anode is connected to pin 2 on the Arduino through a 220 ohm resistor. The cathode is connected to ground. Pins 2 through 13 can be configured as digital inputs or outputs. Click new button to start a sketch.

Panel 42:
Drawing: Script on white shape
void setup() {                
  pinMode(2, OUTPUT);     
}
void loop() {
  digitalWrite(2, HIGH);  
  delay(500);             
  digitalWrite(2, LOW);   
  delay(500);             
}
(In text panel): In setup, we set pin 2 to be an output. In loop, first we set pin 2 high which lights the led. Delay pauses 500 milliseconds, or half a second. When pin 2 is set low, the LED goes off, we pause another half second.

Panel 43: 
Drawing: buttons on Arduino IDE interface. Text labels buttons with pointing arrows (red 10 pt type bold)
Labels:
Verify button
Upload button
(In text panel): Click verify on the menu to check your code. If there aren’t any errors, click upload to put your program on the Arduino.

Panel 44:
Drawing: 2 panels, LED glows on, LED off
(In text panel): The LED blinks on for half a second, then blinks off for half a second, over and over again.

PAGE 12: Digital input: setting up a switch to turn LED on and off
Panel 45:
Drawing: hand holding switch 
(In text panel): Next we will add a switch, a digital input, so we can turn the LED off and on. 

Panel 46:
Drawing: Detail of switch attached to board along with LED and resistors
(In text panel): Connect one end of a momentary switch to pin 4 on the 
Arduino, with a 10k resistor connected to ground attached to the same end. Attach the other end to power. We will leave the LED attached to the same pin.


Panel 47:
 Drawing: code for switch script written on white shape
void setup() {                
  pinMode(2, OUTPUT); 
  pinMode(4, INPUT); 
}

void loop() {
  if(digitalRead(4)){
    digitalWrite(2, HIGH);  
  }else{            
  digitalWrite(2, LOW);   
  }
}
(In text panels): Next we’ll write the code. In setup, we declare pin 2 an output and pin 4 an input. In loop, we use an if statement, if we read pin 4 as high, we set the LED pin to high, otherwise we set the LED pin to low, turning it off.

Panel 48: 
Drawing: split panel, finger pushing switch with LED lit, finger lets up and LED is off
(In text panel) The LED lights when the switch is held down.

PAGE 13: Analog input. Potentiometer
Panel 49:
Drawing: Character head shot in front of gigantic potentiometer.
Word Balloon: A potentiometer, or pot, is a variable resistor. The amount of resistance changes as it is turned, increasing or decreasing depending on which direction it is turned.
(In text panel): Now we will set up an analog input. We’ll use a potentiometer. 

Panel 50:
Drawing: Breadboard with potentiometer attached to Arduino 
(In text panel): Attach the middle pin on the potentiometer to analog pin A0. Attach one end of the pot to power, the other to ground.

Panel 51:
Drawing: code for analog read serial output on white shape
void setup() {                
  Serial.begin(9600); 
}

void loop() {
  Serial.println(analogRead(A0));  
}
(In text panel): First we will look at the range of values we get by turning the pot using the serial monitor. In our code, we initialize the serial object in setup, setting a baud rate of 9600. In loop, we read the value from analog pin a0 and print it to the serial object using the printLn function.

Panel 52:
Drawing: Serial monitor window in Arduino software interface with numbers showing range of values. Arrows point to serial monitor button 
Labels:
Click to open serial window
(In text panel): After you have uploaded the script to the Arduino, click the serial monitor button in order to see the values as you turn the pot. A window will open, and you will see values ranging from 0 to 1023 as the pot is turned.


PAGE 14: Analog output
Panel 53: 
Drawing: breadboard attached to Arduino with pot, LED and resistors
(In text panel): Let’s use the changing values we receive from the pot as a dimmer to control an LED. Attach the anode through a resistor to the board at pin 3, cathode to ground.

Panel 54:
Drawing: Diagram of pulse width modulation duty cycles on white shape.
Labels:
0% Duty Cycle - analogWrite(0)
50% Duty Cycle - analogWrite(127)
100% Duty Cycle - analogWrite(255)
(In text panel): We’ll use Pulse Width Modulation (PWM). This is a method of simulating an analog value by manipulating the voltage, turning it on and off at different rates, or duty cycles. You can use PWM with pins 3, 5, 6, 9, 10, and 11.	

Panel 55:
Drawing: code for analog read analog write on white shape
int sensorValue = 0;

void setup() {                
  pinMode(3,OUTPUT); 
}

void loop() {
  sensorValue = analogRead(A0);
  analogWrite(3, sensorValue/4); 
}
(In text panel): First we create a variable to store the value of the pot. In setup we make pin 3 an output. In loop, we store the value we have read from pin a0 in our variable. Then we write the value to pin 3, our LED pin. We have to divide the variable by 4, so we will have a range of values from 0 to 255, or a byte.	

Panel 56:
Drawing: On left, split panels- top: LED shines dimly, bottom: LED shines brightly. Right side: hand turns potentiometer.
(In text panel): The brightness of the LED changes, ranging from completely off to very bright as you turn the pot.													

PAGE 15: Links, credits
Panel 57:
Drawing: Standing view of character pointing down in front of detail of Arduino board and name
Word balloon: That’s it! This is a very brief intro. In the next panels, there are links and other resources. Check them all out, you’ll find lots more!

Panel 58:
Drawing: text inside of white shape (all URLs are linked)
Links
	    Software
		Software Download 
   	     http://www.arduino.cc/en/Main/Software 
Language Reference 
   	     http://arduino.cc/en/Reference/HomePage
    Supplies
Sparkfun Electronics 
    	     http://www.sparkfun.com/ 
Adafruit Industries 
    	      http://adafruit.com/ 
Maker Shed 
       	     http://www.makershed.com/ 
Jameco Electronics 
                  http://www.jameco.com/ 

Panel 59: 
Drawing: text inside of white shape (all URLs are linked)
Tutorials
Arduino site Tutorials 
   	    http://www.arduino.cc/en/Tutorial/HomePage
Lady Ada 
   	     http://www.ladyada.net/learn/arduino/
Instructables 
    	    http://www.instructables.com/tag/type-id/
    category-technology/channel-arduino/

Books 
     	Getting Started with Arduino by Massimo Banzi
 	Making Things Talk: Using Sensors, Networks, and Arduino to See, Hear, 
and Feel Your World by Tom Igoe
Physical Computing: Sensing and Controlling the Physical World with 
Computers by Dan O'Sullivan & Tom Igoe
Arduino Cookbook  by Michael Margolis


Panel 60:
Drawing: text inside of white shape. Creative Commons license logo in lower right hand corner.
All text and drawings by Jody Culkin for more, check out jodyculkin.com
  
Special thanks to Tom Igoe, Marianne Petit, Calvin Reid, the faculty and staff of the Interactive Telecommunications Program at NYU, particularly Dan O’Sullivan, Danny Rozin and Red Burns. Thanks to Cindy Karasek, Chris Stein, Sarah Teitler, Kathy Goncharov & Zannah Marsh. 

Many, many thanks to the Arduino team for bringing us this robust and flexible open source platform.

And thanks to the lively, active and ever growing Arduino community.

Introduction to Arduino by Jody Culkin is licensed under a Creative Commons 
Attribution-NonCommercial-ShareAlike 3.0 Unported License.



