IntroductiontoArduino!

JodyCulkin2011
Acoupleofnotes
ThisisthescriptformyIntroductiontoArduinoComic.Eachpageisdescribedinterms
ofthepanelsonthatpage.Foreachpanel,thereisadescriptionofthedrawingorvisual
content,anytextintextballoons,textinthetextpanelsatthebottomofthepanels,and
textlabelsthatareinthedrawing.Ihaveindicatedwhattextisinboldinwordballoons
andtextpanels.
Probablythebestwaytocheckplacementandfontstyleswouldbetocomparewiththe
originalPDF.
Fonts:
Formostofthetextinwordballoonsandtextpanels,IusedLetterOMatic!9pt.Iused
LetterOMatic!10ptboldfortextIwantedtoemphasizeintextpanels,9ptinword
balloons.Mosttextisblack(#000000),highlightedtextissometimesred(#FF0000)or
gray(#666666).
Iincludedsomeofthefontsizeandcolorinformationinthedescriptionsofthepanels
themselvesifitisdifferentfromthestandard9pt.
Forcode,IusedMonaco10ptwithcodeformattedwiththesamecolorsasinthe
Arduinointerfaceintheillustratorfile(seemyoriginalPDF).
Onthelastpage,whichhasalotoftext,subheadsarein11or9pt,linksare8pt.In
finalpanel,myinfois10pt,thanksare7pt,CreativeCommonslicenseinfois6point.

PAGE1:IntroandDefinitionofterms
Panel1:
Drawing:
Arduino!OversemitransparentdetailofArduinoUnodrawing.ByJodyCulkin
Panel2
Drawing:Characterheadandshouldersfacingleft
Wordballoon:WhatisanArduino?
(Intextpanel)It'sanopensourceelectronicsprototypingplatform.Whatdoesthat
mean?
Panel3

Drawing:Definitionsofopensource,electronics,prototyping,platformonblue
backgroundwithtermsonleftinblack14pttype,whiteshapeswithdefinitionson
rightingray9pttype
(Text)
OpenSourceResourcesthatcanbeused,redistributedorrewrittenfreeofcharge.
Oftensoftwareorhardware.
ElectronicsTechnologywhichmakesuseofthecontrolledmotionofelectrons
throughdifferentmedia.
PrototypeAnoriginalformthatcanserveasabasisorstandardforotherthings.
PlatformHardwarearchitecturewithsoftwareframeworkonwhichothersoftware
canrun.
PAGE2:Intrototheplatformandmicrocontrollers
Panel4
Drawing:AnArduinoconnectedtoabreadboardwithaphotocellandLEDwith
characterlookingonpointing.
Labels:
Microchip
Photocell
Breadboard
LED
(Intextpanel):AnArduinocontainsamicrochip,whichisaverysmallcomputer
thatyoucanprogram.Youcanattachsensorstoitthatcanmeasureconditions(like
howmuchlightthereisintheroom).Itcancontrolhowotherobjectsreacttothose
conditions(roomgetsdark,LEDturnson).
Panel5
Drawing:2switches
Labels:
ON
OFF
(Intextpanel)Oritcanrespondwhenaswitchispressed.
Panel6
Drawing:fingerpointstomouseandmonitor.
Wordballoon:Amouseisacommoninputdeviceforadesktopcomputer,amonitor
isacommonoutputdevice.
(Intextpanel)Microcontrollersuseinputsandoutputslikeanycomputer.Inputs
captureinformationfromtheuserortheenvironmentwhileoutputsdosomething
withtheinformationthathasbeencaptured.
PAGE3:Inputsandoutputs,analoganddigital

Panel7
Drawing:Momentaryswitchandforcesensitiveresistor
Labels:
Momentaryswitch
Forcesensitiveresistor
(Intextpanel)AninputintotheArduinocouldbeaswitchorasensor.
Panel8
Drawing:DCmotor,laptop
Labels:
DCMotor
(Intextpanel)Anyobjectwewanttoturnonandoffandcontrolcouldbean
output.Itcouldbeamotororevenacomputer.

Panel9
Drawing:Characterheadandshouldersfacingright
Wordballoon:Whatsthedifferencebetweendigitalandanaloginputsand
outputs?
(Intextpanel)Inputsandoutputscanbedigitaloranalog.Digitalinformationis
binaryitiseithertrueorfalse.Analoginformationiscontinuous,itcanholda
rangeofvalues.
Panel10
Drawing:Characterwithhandsonhips
Wordballoons:
Leftballoon:Digitalinformationisdiscreteandfinite.Allinformationis
describedintwostates,1or0,onoroff.
Rightballoon:Analoginformationischaracterizedbyitscontinuousnature.It
canhaveaninfinitenumberofpossiblevalues.
(Intextpanel)Aswitchisadigitalinput,asensorisananaloginput.Therangeof
ananalogsensorislimitedbyitsconversiontodigitaldata.
PAGE4:Reviewofelectricity,termsandconcepts
Panel11
Drawing:Characterprofile,armspointingup
Wordballoon:Voltage?Current?Resistance?OhmsLaw?
(Intextpanel):BeforeweplugintheArduino,weshouldreviewafewtermsand
principlesthathavetodowithhowelectricity(andthereforeelectronics)works.
Panel12(definitionsonwhiteshapes)

Voltage(V)isameasureoftheelectricalpotentialinacircuit.Itismeasuredin
volts.
Panel13
Current(I)istheamountofflowthroughaconductivematerial.Itismeasuredin
amperesoramps.
Panel14
Resistance(R)isamaterial'soppositiontotheflowofelectriccurrent.Itis
measuredinohms.
(Textpanelunderneathall)Electricityistheflowofelectricalenergythrougha
conductivematerial.

Panel15
Drawing:tankwithwaterconnectedtopipesthroughwhichwaterflowswithvalve
attachedthatlimitsflow
(Textinwhiteshapes)
(Neartank)Thespeedofflowisdeterminedbyvoltage
(Nearvalve)Resistanceincreasesordecreasesflow
(Nearpipes)Amountofflowmovingthroughpipesiscurrent
(Intextpanel):Thewateranalogyiscommonlyusedtoexplaintheseterms.
Heresonemodel.
PAGE5:ohmslaw,whatisacircuit,schematic
Panel16
Drawing:(Ohmslawonwhiteshape.Toplineinred16pt,rules9ptblack,or
gray7pttype)
Ohmslaw
Current=Voltage/Resistance
(I=V/R)
or
Resistance=Voltage/Current
(R=V/I)
or
Voltage=Resistance*Current
(V=R*I)
(Intextpanel):Thereisarelationshipbetweenvoltage,currentandresistance
discoveredbyGeorgOhm,aGermanphysicist.
Panel17
Drawing:Tankwithhosewithvalvelimitingflow
(Intextpanel):Forexample,increasetheresistance,lessflow.

Panel18
Drawing:Biggertank,moreflowfromhose
(Intextpanel):Orincreasethepotential,moreflow.
Panel19
Drawing:batteryattachedwithwirestoswitchandlightbulb
(Intextpanel):Nowletslookatasimplecircuit.Everycircuitisaclosedloop
thathasanenergysource(battery)andaload(lamp).Theloadconvertsthe
electricalenergyofthebatteryandusesitup.Thisonehasaswitchtoo.
Panel20
Drawing:Schematicofsimplecircuit
Labels:(fontGeneva)
Lamp
Switch
DCpowersource
(Intextpanel):Thisisaschematicofthesamecircuit(itrepresentsthecircuit
usingsymbolsfortheelectroniccomponents).Whentheswitchisclosed,current
flowsfromthepowersourceandlightsthelamp.
PAGE6AC,DC,backtoArduino,USB,software
Panel21
Drawing:SchematicwithDirectCurrentandAlternatingCurrent.
Labels:
DirectCurrent(DC)
AlternatingCurrent(AC)
(Intextpanel):Therearetwocommontypesofcircuits,directcurrentand
alternatingcurrent.InaDCcircuit,thecurrentalwaysflowsinonedirection.In
AC,thecurrentflowsinoppositedirectionsinregularcycles.Wewillonlytalk
aboutDCcircuitshere.
Panel22
Drawing:closeupofArduino,characterinprofilewithhandoncheek
WordBalloon:Nowthatwevereviewedsomebasicsofhowelectricityworks,
letsgetbacktotheArduino.
(Intextpanel):TheArduinowillneedpowertorun.Wewillneedtoattachittoa
computertoprogramit.
Panel23
Drawing:Arduino,laptop,USBcablepoisedtoconnectthem

(Intextpanel):AttachingtheArduinotoacomputerwithaUSBcablewillsupply
thepowerweneedandallowustostartprogramming.
Panel24
Drawing:closeupofinterfaceofArduinowebpage.Whiteshapewithtext:
Labels:
DownloadHere(redtype18pt)
http://www.arduino.cc/en/Main/Software(black10pt)(linked)
(Intextpanel):Youllhavetodownloadandinstallsoftwaretoprogramthe
Arduino.itisavailablefromtheURLabovefreeofcharge.TheArduinosoftware
runsontheMacOSX,WindowsandLinuxplatforms.
PAGE7:Downloadsoftwareandconnectboard
Panel25
Drawing:Textinwhiteshape(URLSarelinked)(URLSin10ptredtype,other
text9ptblack)
Forinstructionsonhowtoinstall
ArduinosoftwareonaMac:
http://www.arduino.cc/en/Guide/MacOSX
Forinstructionsonhowtoinstall
onWindows:
http://www.arduino.cc/en/Guide/Windows
Forinstructionsonhowtoinstall
onLinux:
http://www.arduino.cc/playground/Learning/Linux
(Intextpanel):GototheURLSabovefordetailedinstructionsoninstallingthe
softwareontheseplatforms.
Panel26:
Drawing:DetailofArduinowithledatpwrlitup.
(Intextpanel):Whenyouhaveinstalledthesoftware,connecttheArduino.An
LEDmarkedONshouldlightupontheboard.
Panel27:
Drawing:ScreenshotofmenusininterfaceofArduinosoftware,selectingthe
board
(Intextpanel):LaunchtheArduinosoftware.Inthetoolsmenu,selecttheboard
youareusing(Tools>Board).Forexample,ArduinoUno.

Panel28:
Drawing:ScreenshotofmenusininterfaceofArduinosoftware,selectingtheserial
port
(Intextpanel):Nextselecttheserialport.(Tools>SerialPort)OnaMacitwill
besomethinglike/dev/tty.usbmodem.Onawindowsmachine,itwillbeCOM3or
somethinglikethat.
PAGE8:IDE,Firstscript
Panel29:
Drawing:Charactertalkingheadshotfacingleft.
(Wordbubble):WhatsanIntegratedDevelopmentEnvironment?
(Intextpanel):WhenyoudownloadedtheArduinosoftware,youdownloadedan
IDE.Itcombinesatexteditorwithacompilerandotherfeaturestohelp
programmersdevelopsoftware.
Panel30:
Drawing:Screenshotofinterfaceofmenus,selectingBlinkScript
(InTextPanel):TheArduinoIDEallowsyoutowritesketches,orprogramsand
uploadthemtotheArduinoboard.OpentheBlinkexampleinthefilemenu.File
>Examples>1.Basics>Blink.
Panel31:
Drawing:ScreenshotofinterfaceofArduinosoftware,stripofbuttonsandpartof
sketch.Arrowpointingtouploadbutton
Labels:
Uploadbutton
(Intextpanel):TouploadthesketchtotheArduinoboard,clicktheupload
buttononthestripofbuttonsatthetopofthewindow.Somemessageswill
appearinthebottomofthewindow,finallyDoneUploading.
Panel32:
Drawing:CloseupoftheArduinowithLEDlightatpin13.
(Intextpanel):TheLEDatpin13ontheArduinostartsblinking.

PAGE9:writingscripts:setupandloopbriefoverviewoflanguage
Panel33:
Drawing:Blinkscriptonwhiteshape
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 of
delay(1000);
// wait for a second
}

(Intextpanel):Asketch,likeaprogramwritteninanylanguage,isasetof
instructionsforthecomputer.IfwelookcloselyattheBlinksketch,weseethere
are2majorparts,setupandloop.
Panel34:
Drawing:fingerspointtodefinitionsofsetupandlooponwhiteshapes.
Text(setupandloopinredtype,definitioninblackall10pt.)
Setup:happensonetimewhenprogramstartstorun
Loop:repeatsoverandoveragain
(Intextpanel):Thesearebothblocksofcodecalledfunctionsthateverysketch
willhave.Theyareblockedoutbycurlybraces{}.
Panel35:
Drawing:BackofcharacterreadingArduinoreferenceguideonlaptop.URL
(linked)onwhiteshape
Text(10ptredtype)
http://arduino.cc/en/Reference/HomePage
(Intextpanel):CheckouttheArduinowebsitefortheArduinoreferenceguide
andmanyotherresourcestolearnthelanguage.
Panel36:
Drawing:Closeupofblinkscriptwithexplanationlinebylinewithcomments.
CommentsareinredinLetterOMatic
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

(Intextpanel):Fornow,letslookatthissimplescriptlinebylineandseewhat
eachlinedoes.
PAGE10:UsingaBreadboard,LEDdigitaloutput

Panel37:
Drawing:Handholdingbreadboard
(Intextpanel):HowdowecontrolobjectsthatarenotontheArduinoboard?We
willconnecttheArduinotoasolderlessbreadboard.Thiswillallowustoquickly
setupandtestcircuits.
Panel38:
Drawing:Closeupofbreadboardtextonwhiteshapeswithpointingarrows:(red
type10ptbold)
Labels:
Holesconnectedhorizontally
Holesconnectedvertically
(Intextpanel):Thisbreadboardhas2rowsofholesrunningdowntheleftand
rightside,and5rowsofholesoneithersideofamiddleindentation.Theside
rowsareconnectedvertically,eachrowof5holesinthemiddleareconnected
horizontally.
Panel39:
Drawing:PowerandgroundconnectedfromArduinotobreadboardandacross
topofboardsopowerandgroundrundownbothsides
(Intextpanel):WewillconnectpowerandgroundfromtheArduinoboardto
theverticallyconnectedstripsontheleftandrightwith22gaugewire.Other
componentscanbeattachedtotheholesinthemiddleandtopowerandgroundas
needed.
Panel40:
Drawing:LED.Textdefinesanodeandcathode
Labels:
Anode(connectstopower)
Cathode(connectstoground)
(Intextpanel):WhencurrentflowsthroughanLED(LightEmittingDiode)in
therightdirection,itlightsup.WellattachanLEDtothebreadboard,thentothe
Arduinosowecancontrolitwithcode.
PAGE11:Digitaloutput
Panel41:
Drawing:BreadboardattachedtoArduinowithLEDattached
(Intextpanel):Theanodeisconnectedtopin2ontheArduinothrougha220
ohmresistor.Thecathodeisconnectedtoground.Pins2through13canbe
configuredasdigitalinputsoroutputs.Clicknewbuttontostartasketch.
Panel42:

Drawing:Scriptonwhiteshape
void setup() {
pinMode(2, OUTPUT);
}
void loop() {
digitalWrite(2, HIGH);
delay(500);
digitalWrite(2, LOW);
delay(500);
}

(Intextpanel):Insetup,wesetpin2tobeanoutput.Inloop,firstwesetpin2
highwhichlightstheled.Delaypauses500milliseconds,orhalfasecond.When
pin2issetlow,theLEDgoesoff,wepauseanotherhalfsecond.
Panel43:
Drawing:buttonsonArduinoIDEinterface.Textlabelsbuttonswithpointing
arrows(red10pttypebold)
Labels:
Verifybutton
Uploadbutton
(Intextpanel):Clickverifyonthemenutocheckyourcode.Iftherearentany
errors,clickuploadtoputyourprogramontheArduino.
Panel44:
Drawing:2panels,LEDglowson,LEDoff
(Intextpanel):TheLEDblinksonforhalfasecond,thenblinksoffforhalfa
second,overandoveragain.
PAGE12:Digitalinput:settingupaswitchtoturnLEDonandoff
Panel45:
Drawing:handholdingswitch
(Intextpanel):Nextwewilladdaswitch,adigitalinput,sowecanturntheLED
offandon.
Panel46:
Drawing:DetailofswitchattachedtoboardalongwithLEDandresistors
(Intextpanel):Connectoneendofamomentaryswitchtopin4onthe
Arduino,witha10kresistorconnectedtogroundattachedtothesameend.Attach
theotherendtopower.WewillleavetheLEDattachedtothesamepin.
Panel47:
Drawing:codeforswitchscriptwrittenonwhiteshape
void setup() {

pinMode(2, OUTPUT);
pinMode(4, INPUT);
}
void loop() {
if(digitalRead(4)){
digitalWrite(2, HIGH);
}else{
digitalWrite(2, LOW);
}
}

(Intextpanels):Nextwellwritethecode.Insetup,wedeclarepin2anoutput
andpin4aninput.Inloop,weuseanifstatement,ifwereadpin4ashigh,weset
theLEDpintohigh,otherwisewesettheLEDpintolow,turningitoff.
Panel48:
Drawing:splitpanel,fingerpushingswitchwithLEDlit,fingerletsupandLED
isoff
(Intextpanel)TheLEDlightswhentheswitchishelddown.
PAGE13:Analoginput.Potentiometer
Panel49:
Drawing:Characterheadshotinfrontofgiganticpotentiometer.
WordBalloon:Apotentiometer,orpot,isavariableresistor.Theamountof
resistancechangesasitisturned,increasingordecreasingdependingonwhich
directionitisturned.
(Intextpanel):Nowwewillsetupananaloginput.Welluseapotentiometer.
Panel50:
Drawing:BreadboardwithpotentiometerattachedtoArduino
(Intextpanel):AttachthemiddlepinonthepotentiometertoanalogpinA0.
Attachoneendofthepottopower,theothertoground.
Panel51:
Drawing:codeforanalogreadserialoutputonwhiteshape
void setup() {
Serial.begin(9600);
}
void loop() {
Serial.println(analogRead(A0));
}

(Intextpanel):Firstwewilllookattherangeofvalueswegetbyturningthepot
usingtheserialmonitor.Inourcode,weinitializetheserialobjectinsetup,

settingabaudrateof9600.Inloop,wereadthevaluefromanalogpina0andprint
ittotheserialobjectusingtheprintLnfunction.
Panel52:
Drawing:SerialmonitorwindowinArduinosoftwareinterfacewithnumbers
showingrangeofvalues.Arrowspointtoserialmonitorbutton
Labels:
Clicktoopenserialwindow
(Intextpanel):AfteryouhaveuploadedthescripttotheArduino,clicktheserial
monitorbuttoninordertoseethevaluesasyouturnthepot.Awindowwillopen,
andyouwillseevaluesrangingfrom0to1023asthepotisturned.

PAGE14:Analogoutput
Panel53:
Drawing:breadboardattachedtoArduinowithpot,LEDandresistors
(Intextpanel):Letsusethechangingvalueswereceivefromthepotasadimmer
tocontrolanLED.Attachtheanodethrougharesistortotheboardatpin3,
cathodetoground.
Panel54:
Drawing:Diagramofpulsewidthmodulationdutycyclesonwhiteshape.
Labels:
0%DutyCycleanalogWrite(0)
50%DutyCycleanalogWrite(127)
100%DutyCycleanalogWrite(255)
(Intextpanel):WellusePulseWidthModulation(PWM).Thisisamethodof
simulatingananalogvaluebymanipulatingthevoltage,turningitonandoffat
differentrates,ordutycycles.YoucanusePWMwithpins3,5,6,9,10,and11.
Panel55:
Drawing:codeforanalogreadanalogwriteonwhiteshape
int sensorValue = 0;
void setup() {
pinMode(3,OUTPUT);
}
void loop() {
sensorValue = analogRead(A0);
analogWrite(3, sensorValue/4);
}

(Intextpanel):Firstwecreateavariabletostorethevalueofthepot.Insetupwe
makepin3anoutput.Inloop,westorethevaluewehavereadfrompina0inour
variable.Thenwewritethevaluetopin3,ourLEDpin.Wehavetodividethe
variableby4,sowewillhavearangeofvaluesfrom0to255,orabyte.
Panel56:
Drawing:Onleft,splitpanelstop:LEDshinesdimly,bottom:LEDshines
brightly.Rightside:handturnspotentiometer.
(Intextpanel):ThebrightnessoftheLEDchanges,rangingfromcompletelyoff
toverybrightasyouturnthepot.

PAGE15:Links,credits
Panel57:
Drawing:StandingviewofcharacterpointingdowninfrontofdetailofArduino
boardandname
Wordballoon:Thatsit!Thisisaverybriefintro.Inthenextpanels,thereare
linksandotherresources.Checkthemallout,youllfindlotsmore!
Panel58:
Drawing:textinsideofwhiteshape(allURLsarelinked)
Links
Software
SoftwareDownload

http://www.arduino.cc/en/Main/Software
LanguageReference

http://arduino.cc/en/Reference/HomePage
Supplies
SparkfunElectronics

http://www.sparkfun.com/
AdafruitIndustries

http://adafruit.com/
MakerShed

http://www.makershed.com/
JamecoElectronics
http://www.jameco.com/
Panel59:
Drawing:textinsideofwhiteshape(allURLsarelinked)
Tutorials
ArduinositeTutorials

http://www.arduino.cc/en/Tutorial/HomePage
LadyAda

http://www.ladyada.net/learn/arduino/
Instructables

http://www.instructables.com/tag/typeid/
categorytechnology/channelarduino/
Books

GettingStartedwithArduinobyMassimoBanzi
MakingThingsTalk:UsingSensors,Networks,andArduinotoSee,Hear,
andFeelYourWorldbyTomIgoe
PhysicalComputing:SensingandControllingthePhysicalWorldwith
ComputersbyDanO'Sullivan&TomIgoe
ArduinoCookbookbyMichaelMargolis

Panel60:
Drawing:textinsideofwhiteshape.CreativeCommonslicenselogoinlower
righthandcorner.
AlltextanddrawingsbyJodyCulkinformore,checkoutjodyculkin.com

SpecialthankstoTomIgoe,MariannePetit,CalvinReid,thefacultyandstaff
oftheInteractiveTelecommunicationsProgramatNYU,particularlyDan
OSullivan,DannyRozinandRedBurns.ThankstoCindyKarasek,Chris
Stein,SarahTeitler,KathyGoncharov&ZannahMarsh.
Many,manythankstotheArduinoteamforbringingusthisrobustandflexible
opensourceplatform.
Andthankstothelively,activeandevergrowingArduinocommunity.
IntroductiontoArduinobyJodyCulkinislicensedunderaCreativeCommons
AttributionNonCommercialShareAlike3.0UnportedLicense.