-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
165 lines (163 loc) · 12.5 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title>Arduino Traffic Light - A tutorial to Arduino</title>
<link rel="stylesheet" type="text/css" href="stylesheets/styles.css">
<script type="text/javascript" src="quiz.js"/>
</script>
</head>
<body>
<div class="header"></div>
<div class="content">
<h1>Introduction</h1>
<p>The following tutorial is meant to be a introduction to Arduino programming. It is designed in a way so students can learn first the basics of electronics to understand the circuits and then build a model themelves.
<p>After introducing the electronic components and their basic usage circuits, an introducion of the Arduino board will follow, also its programming basics.</p>
<p>Last, a problem will be presented to guide the tutorial: an Traffic lights controller. This tutorial will guide you through the circuit and the programming of it.</p>
<p>Along this page, you will find Warning, tips, and <i>Do It Yourself</i> sections. You will identify them based on the box styles</p>
<div class="warning box">
<span><b>WARNING:</b> Do not connect a LED directly to a battery with no resistor, it will most probably burn the LED (and your fingers!!).</span>
</div>
<div class="tip box">
<span><b>TIP:</b> The LED will only turn on if the electricity flows in the right direction. If it does not turn on, try inverting the connectors</span>
</div>
<div class="diy box">
<span><b>HANDS ON:</b> It is time to build your first circuit. Find a LED, a 1k ressistor, a battery and some wires and let the LED shine!</span>
</div>
<h1>Electronic components</h1>
<p>Before starting our project, we need to know the basics of some electronic components that we will use in this tutorial. The first one we will talk about is the Battery. </p>
<h2>Power supliers</h2>
<p>Every circuit needs electricity to work. Electric current (electricity) are electrons moving through the wires and components of a circuit. Electricity can travell trough wires, and electronic components, but can not go through air or plastic. Its measured in <b>ampere (A)</b>. </p>
<p>In order to be able to have electricity we need a source of power. Simplifying a lot what a battery is, lets consider it as bunch of electrons willing to go from one end of it to the other. Once all electrons had travell from one end to the other, the baterry is drained.</p>
<p>The batteries work as power supliers and among different cualities they have, one important for our objective here is their <i>potential</i>.</p>
<p><i>Potential</i> is measured in <b>volt (V)</b>. Normally comercial batteries are 1.5V (left), or 9V (middle). The symbol in the right corresponds to the normal representation of a battery in a circuit schematic.</p>
<div class="centeredImageBar">
<img class="inlineImage200" src="images/battery1.5.jpg"/>
<img class="inlineImage200" src="images/battery9.jpg"/>
<img class="separated inlineImage200 schematicSymbol" src="images/batterySymbol.png"/>
</div>
<p></p>
<h2>Resistors</h2>
<p>If not limited, the electric current can be very high and damage the components in your circuit or drain the battery very soon. Resistors present resistance (R) to the current and limit it. Depending on the resistor resistance value, how much it limits the current. The resistance is measured in <b>Ohm (Ω)</b>.</p>
<p>Left image are comercial resistors, and on the right its normal schematic representation.</p>
<div class="centeredImageBar">
<img class="inlineImage200" src="images/resistors.jpg"/>
<img class="separated inlineImage200 schematicSymbol" src="images/resistorSymbol.png"/>
</div>
<p>There is relation between the potential consumed by a component, the current it goes through it and its resistance. the relation is called <a href="https://en.wikipedia.org/wiki/Ohm%27s_law" target="_blank">Ohm's Law</a>. The formula is shown below. It can be read as: <i>given a certain potential (V), the bigger the resistance (R), the smaller the current (I).</i>
</p>
<div class="centeredImageBar">
<img class="inlineImage100" src="images/ohm.svg"/>
</div>
<p>For example, let's imagine the potential (V) between the ends of the resistor below is 5V. Then also asume that the resistanse (R) is 500Ω. The current going through the resistor will we 5V/500Ω = 0,01 A.</p>
<p>Amperes, normally are depicted in milli-amperes (1000mA = 1A), so 0,01A is the same as 10mA</p>
<div class="centeredImageBar">
<img class="inlineImage100" src="images/resistorCurrent.png"/>
</div>
<h2>LEDs</h2>
<p>A Light-Emitting Diode (LED) is capable of producing light when current goes through it. Normally a LED works with 1.5V between its connectors and 10mA current, under normal operation.</p>
<p>LEDs, as diodes, have polarity. This means that it is not the same if you invert the connectors.</p>
<p>LEDs come in different colors, as you can see in the left image. As before, the right is a shcematic representation of it.</p>
<div class="centeredImageBar">
<img class="inlineImage200" src="images/leds.jpg"/>
<img class="separated inlineImage200 schematicSymbol" src="images/LedSymbol.png"/>
</div>
<h2>Protoboard</h2>
<p>The protoboard (Prototyping board) is not an electronic component <i>per-se</i>. Instead, it is a board that helps mounting electronic circuits. Internally, several of the holes are connected between them. This allows to connect components without welding them. Just inserting the components in holes connected underneath will close the circuit between them (as if you have weld them).</p>
<p>Typical protoboards have about 100 lines of 5 holes connected (red rectangle below), and 4 long lines in the sides (green rectangle below). Some models, have 8 half lines instead of 4 (they are not connected in the middle). Normally, the power supliers are connected to the long lines.</p>
</p>
<div class="centeredImageBar">
<img class="inlineImage200" src="images/protoboard.png"/>
</div>
<div class="diy box">
<p><b>HANDS ON 1</b></p>
<p>It is time to build your first circuit. Find a protoboard, a LED, a 1000Ω resistor (1kΩ), a 9V battery and some wires and let the LED shine!</p>
<p>1000Ω resistor has the secuence Brown-Black-Red Gold. This colors indicate the resistance. You can read more about this nomenclature in the following <a href="https://en.wikipedia.org/wiki/Electronic_color_code" target="_blank">color code</a> article. Brown=1, Black=0, Red=x100 = 1000Ω</p>
<div class="centeredImageBar">
<img class="inlineImage300NoShadow" src="images/diy1.1.png"/>
<img class="separated inlineImage300NoShadow" src="images/diy1.2.png"/>
</div>
</div>
<div class="tip box">
<span><b>TIP:</b> The LED will only turn ON if the electricity flows in the right direction. If it does not turn ON, try inverting the connectors. If you look at the LED from top, you will see that one side is flat, that side should be connected to the negative end of the power source.</span>
</div>
<h2>Switches</h2>
<p>Congratulations, you have your first working circuit!!! But there is one litle problem. How do you turn the LED OFF? No, unplugging the battery is not an option!</p>
<p>In order to be able to open and close circuits we need switches. A switch works as any light interruptor you may have at home. In one position it closes the circuit and in the other the circuit remains open. When the circuit is closed, there is electric current going through it and the light turns ON.</p>
<p>When the button is pressed, connectors on one side (1s) get connected to those in the other side (2s). If the button is not pressed, then the circuit stays open (no current can pass)</p>
<div class="centeredImageBar">
<img class="inlineImage200" src="images/11-switch.jpg"/>
<img class="separated inlineImage200 schematicSymbol" src="images/11-switch_schem.png"/>
</div>
<p>Switches will also allow us to generate digital 0s and 1s, but we still need to learn a bit more about electricity first. We will get there very soon.</p>
<h2>Puting all together</h2>
<div class="diy box">
<p><b>HANDS ON 2</b></p>
<p>Add a switch to the circuit of previous exercise. You can now turn the ligth ON only when you press the button.</p>
<div class="centeredImageBar">
<img class="inlineImage300NoShadow" src="images/11-switchCircuit.png"/>
<img class="separated inlineImage300NoShadow" src="images/11-switchCircuit_schem.png"/>
</div>
</div>
<h1>Signals</h1>
<p>As described in the <a href="https://en.wikipedia.org/wiki/Signal">Wikipedia</a>, a signal is a function that "conveys information about the behavior or attributes of some phenomenon". In more practical words, a signal is an electric representation of a given reality. In this tutorial, a signal can be a representation of the state of the button. Pressed or not pressed.</p>
<p>There are diferent type of signals, but we will only focus in two of them here: Digital and Analog signals.</p>
<h2>Digital signal</h2>
<p>A digital signal is a signal that is being used to represent data as a sequence of discrete values; at any given time it can only take on one of a finite number of values. The button is an example of digital signal. </p>
<p>It can either be pressed or not pressed, but it can not be half pressed, or a third pressed. This particular case of digital signal where only 2 possible values exist is called a binary signal. </p>
<p>We can then map each state of the button to a value: 1 for a button pressed and 0 for a button released, for example.</p>
<p>To better ilustrate this, lets do a short Quiz.</p>
<div class="quiz box">
<p><b>QUIZ 1</b></p>
<p>Which potential (V) do you think the loose purple end has?</p>
<div class="quizImageAndRadioSet">
<img class="quizImage300" src="images/11-Quiz1.png"/>
<form >
<p><input type="radio" name="q1" value="q1r1">9 V</input></p>
<p><input type="radio" name="q1" value="q1r2">4.5 V</input></p>
<p><input type="radio" name="q1" value="q1r3">0 V</input></p>
<p><input type="submit" onclick="validateQuiz('q1'); return false;"></input></p>
</form>
</div>
</div>
<div class="quiz box">
<p><b>QUIZ 2</b></p>
<p>If the circuit is the same, but now the button is pressed. What would be the potential (V) in the purple end?</p>
<div class="quizImageAndRadioSet">
<img class="quizImage300" src="images/11-Quiz1.png"/>
<form >
<p><input type="radio" name="q2" value="q2r1">9 V</input></p>
<p><input type="radio" name="q2" value="q2r2">4.5 V</input></p>
<p><input type="radio" name="q2" value="q2r3">0 V</input></p>
<p><input type="submit" onclick="validateQuiz('q2'); return false;"></input></p>
</form>
</div>
</div>
<h2>Creating digital signal</h2>
<p>The circuit above is the easiest way to create a digital signal representing the state of the button. Not pressed, 0V in the output. Pressed, 9V in the output. For simplicity, we generally refer to 0 and 1 respectively.</p>
<hr/>
<h1>The problem: A traffic light controller</h1>
<img src="images/crossroad.jpg"/>
<br><br><br><br><br><br>
<hr/>
<br><br><br><br><br><br>
<h1>Arduino</h1>
<pre>
<code>
// the setup function runs once when you press reset or power the board
void setup() {
// initialize digital pin LED_BUILTIN as an output.
pinMode(LED_BUILTIN, OUTPUT);
}
// the loop function runs over and over again forever
void loop() {
digitalWrite(LED_BUILTIN, HIGH); // turn the LED on (HIGH is the voltage level)
delay(1000); // wait for a second
digitalWrite(LED_BUILTIN, LOW); // turn the LED off by making the voltage LOW
delay(1000); // wait for a second
}
</code>
</pre>
</div>
</body>
</html>