Difference between revisions of "ElectroBlocks-archive-sept-2025/C2/Traffic-Lights/English"

From Script | Spoken-Tutorial
Jump to: navigation, search
(Created page with "'''Title of the Script: Traffic Lights ''' '''Author: Pratik Nemane''' '''Keywords: '''Electroblocks, arduino board, 220 ohm resistor, LEDs breadboard, spoken tutorial, vide...")
 
Line 1: Line 1:
−
'''Title of the Script: Traffic Lights '''
+
Title of the Script: Traffic Lights  
  
−
'''Author: Pratik Nemane'''
+
Author: Pratik Nemane
  
−
'''Keywords: '''Electroblocks, arduino board, 220 ohm resistor, LEDs breadboard, spoken tutorial, video tutorial.
+
Keywords: Electroblocks, arduino board, 220 ohm resistor, LEDs breadboard, spoken tutorial, video tutorial.
  
  
  
−
{| border=1
+
{| style="border-spacing:0;"
−
|-  
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| '''Visual Cue'''
−
|| '''Visual Cue'''
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| '''Narration'''
−
|| '''Narration'''
+
 
−
|-  
+
|-
−
|| '''Slide 1'''
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| '''Slide 1'''
  
 
'''Title slide'''
 
'''Title slide'''
−
|| Welcome to the Spoken Tutorial on '''Traffic Lights''' using '''Electroblocks'''.
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Welcome to the Spoken Tutorial on '''Traffic Lights''' using '''Electroblocks'''.
−
|-  
+
 
−
|| '''Slide 2'''
+
|-
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| '''Slide 2'''
  
 
'''Learning Objectives'''
 
'''Learning Objectives'''
−
|| In this tutorial, we will learn how to,
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| In this tutorial, we will learn how to,
 +
 
 
# Build a set of blocks to create a Traffic Light project
 
# Build a set of blocks to create a Traffic Light project
 
# Check the output of the experiment using the simulator
 
# Check the output of the experiment using the simulator
Line 26: Line 28:
  
  
−
|-  
+
 
−
|| '''Slide 3'''
+
|-
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| '''Slide 3'''
  
 
'''System Requirements'''
 
'''System Requirements'''
−
|| To record this tutorial, I am using:
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| To record this tutorial, I am using:
 +
 
 
* Ubuntu Linux OS version 22.04
 
* Ubuntu Linux OS version 22.04
 
* Google Chrome browser
 
* Google Chrome browser
  
 
A working internet connection to use '''Electroblocks'''.  
 
A working internet connection to use '''Electroblocks'''.  
−
|-  
+
 
−
|| '''Slide 4'''
+
|-
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| '''Slide 4'''
  
 
'''Prerequisite'''
 
'''Prerequisite'''
Line 42: Line 47:
  
 
'''https://spoken-tutorial.org'''
 
'''https://spoken-tutorial.org'''
−
|| To follow this tutorial,  
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| To follow this tutorial,  
 +
 
 
* Learner should have a basic knowledge of Electroblocks interface  
 
* Learner should have a basic knowledge of Electroblocks interface  
 
* If not, please visit the relevant tutorials on this website.
 
* If not, please visit the relevant tutorials on this website.
  
−
|-  
+
 
−
|| Type [https://electroblocks.org/ https://electroblocks.org/] '''
+
 
 +
|-
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Type [https://electroblocks.org/ https://electroblocks.org/] '''
  
 
Highlight the link in the search tab
 
Highlight the link in the search tab
Line 53: Line 61:
  
 
[https://electroblocks.org/ https://electroblocks.org/]
 
[https://electroblocks.org/ https://electroblocks.org/]
−
|| Let us open the '''Electroblocks''' '''platform''' using '''Google Chrome browser. '''
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Let us open the '''Electroblocks''' '''platform''' using '''Google Chrome browser. '''
  
  
Line 60: Line 68:
  
 
You will see the default Blink '''LED''' circuit on the screen.
 
You will see the default Blink '''LED''' circuit on the screen.
−
|-  
+
 
−
|| Click on the''' New File '''icon.
+
|-
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Click on the''' New File '''icon.
  
  
Line 68: Line 77:
  
 
Click the '''OK''' button.
 
Click the '''OK''' button.
−
|| Click on the '''New File/Blank file''' option available on the toolbar.
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Click on the '''New File/Blank file''' option available on the toolbar.
  
  
Line 74: Line 83:
  
 
Click the '''OK''' button to start a new project.
 
Click the '''OK''' button to start a new project.
−
|-  
+
 
−
|| Point to the number 3 in the loop block.
+
|-
−
|| Observe the loop block in the working area.
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Point to the number 3 in the loop block.
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Observe the loop block in the working area.
  
  
 
It indicates that the simulation will run for 3 times.
 
It indicates that the simulation will run for 3 times.
−
|-  
+
 
−
|| Point to 3.
+
|-
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Point to 3.
 +
 
  
 
Click to change the number from 2 to 3.
 
Click to change the number from 2 to 3.
−
|| Let us change the number to 2.  
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Let us change the number to 2.  
  
  
 
This will simulate the code for 2 times.
 
This will simulate the code for 2 times.
−
|-  
+
 
−
|| Add the entire Output video.mp4 in the main video at the 1:32 timestamp.
+
|-
−
|| We will create this '''traffic light''' output.
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Add the entire Output video.mp4 in the main video at the 1:32 timestamp.
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| We will create this '''traffic light''' output.
  
  
 
Let’s start by building '''traffic lights''' using '''Electroblocks'''.
 
Let’s start by building '''traffic lights''' using '''Electroblocks'''.
−
|-  
+
 
−
|| Main Video.mp4
+
|-
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Main Video.mp4
  
  
 
Click on the '''Add-ons''' menu.
 
Click on the '''Add-ons''' menu.
 +
  
 
Select '''LED''' Option
 
Select '''LED''' Option
  
  
−
|| We need three '''LED''' blocks with different colours, namely, red, orange and green.
+
 
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| We need three '''LED''' blocks with different colours, namely, red, orange and green.
  
  
Line 115: Line 131:
  
  
−
|-
 
−
|| Click on the Turn '''LED''' '''block''' and drag it in the working area.
 
  
  
−
Place the '''LED''' option in the loop block.
+
|-
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Click on the Turn '''LED''' '''block''' and drag it in the working area.
  
  
−
Point to the '''LED'''.
+
Place the '''LED''' option in the loop block.
−
|| Click on the '''Turn LED''' block and drag it to the working area.
+
  
  
−
Place this block inside the loop block.
+
Point to the '''LED'''.
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Click and place the '''Turn LED''' block inside the loop block.
  
  
Line 135: Line 150:
  
  
−
|-  
+
 
−
|| Zoom in to show the resistor
+
 
 +
|-
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Zoom in to show the resistor
  
  
Line 142: Line 159:
  
  
−
|| Let us Zoom in to see the circuit connection clearly.
+
 
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Let us Zoom in to see the circuit connection clearly.
  
  
Line 149: Line 167:
  
 
By default, the '''LED''' is always connected to pin 2 of''' Arduino'''.
 
By default, the '''LED''' is always connected to pin 2 of''' Arduino'''.
−
|-
 
−
|| Change the''' LED pin '''and '''LED''' colour
 
−
|| Change the '''pin''' number to '''pin 12'''.
 
  
−
 
+
|-
−
We can also change the colour of the '''LED'''.
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Change the''' LED pin '''and '''LED''' colour
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Change the '''pin''' number to '''pin 12'''.
  
  
 
Click on the colour section on the '''LED''' '''block''' and select the green colour.
 
Click on the colour section on the '''LED''' '''block''' and select the green colour.
−
|-  
+
 
−
|| Only narration
+
 
 +
 
 +
 
 +
|-
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Only narration
 +
 
  
 
Add the''' Wait block'''
 
Add the''' Wait block'''
Line 174: Line 195:
  
 
Change to 4 seconds
 
Change to 4 seconds
−
|| Let’s make sure that the '''LED''' remains turned '''ON''' for a sufficient amount of time.
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Let’s make sure that the '''LED''' remains turned '''ON''' for a specific amount of time.
  
  
Line 183: Line 204:
  
  
−
Drag and drop the '''Wait block for 0.2 seconds''' in the working area.
+
Drag and place '''Wait block for 0.2 seconds''' block below the '''turn ON LED''' block.  
  
  
−
Place this block below the '''turn ON LED''' block as shown.
+
Change the time to '''4 seconds''' in the block as shown.
  
 +
|-
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Only narration
  
−
Change the time to '''4 seconds''' in the block as shown.
 
−
|-
 
−
|| Only narration
 
  
 
Duplicate the '''LED block'''
 
Duplicate the '''LED block'''
  
  
−
|| Let’s turn '''OFF''' the green '''LED'''.
+
 
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Let’s turn '''OFF''' the green '''LED'''.
  
  
Line 203: Line 224:
  
 
This action creates an identical block in the working area.
 
This action creates an identical block in the working area.
−
|-  
+
 
−
|| Point to '''Duplicate block '''
+
|-
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Point to '''Duplicate block '''
  
  
Line 214: Line 236:
  
 
Change state of the '''LED'''
 
Change state of the '''LED'''
−
|| Drag and place this block below the '''Wait for 4 seconds''' block.
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Drag and place this block below the '''Wait for 4 seconds''' block.
  
  
Line 222: Line 244:
 
This block turns OFF the LED connected to pin 12.
 
This block turns OFF the LED connected to pin 12.
  
−
|-  
+
 
−
|| Duplicate the '''LED block'''
+
 
 +
 
 +
|-
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Duplicate the '''LED block'''
  
  
Line 230: Line 255:
  
 
Drag and place this new block below the green colour led block as shown.
 
Drag and place this new block below the green colour led block as shown.
−
|| Now, let's add a second''' LED''' block to represent the orange colour.
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Now, let's add a second''' LED''' block to represent the orange colour.
 +
 
  
 
Right click on the '''LED '''block and select the '''Duplicate''' option.
 
Right click on the '''LED '''block and select the '''Duplicate''' option.
Line 236: Line 262:
  
 
Drag and place this new block below the green colour led block as shown.
 
Drag and place this new block below the green colour led block as shown.
−
|-  
+
 
−
|| click on the dropdown arrow and select On.
+
|-
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| click on the dropdown arrow and select On.
  
  
Line 244: Line 271:
  
 
Click on the colour section on the LED block and select orange colour.
 
Click on the colour section on the LED block and select orange colour.
−
|| To change the state of the''' LED''', click on the dropdown arrow and select '''ON'''.  
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| To change the state of the''' LED''', click on the dropdown arrow and select '''ON'''.  
  
  
Line 251: Line 278:
  
 
Click on the '''colour''' section on the '''LED''' block and select '''orange''' colour.
 
Click on the '''colour''' section on the '''LED''' block and select '''orange''' colour.
−
|-  
+
 
−
|| Duplicate the wait for 4 seconds block
+
|-
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Duplicate the wait for 4 seconds block
  
  
 
Place this block below the''' LED turn ON''' block.
 
Place this block below the''' LED turn ON''' block.
 +
  
 
Change the time to 1 second.
 
Change the time to 1 second.
−
|| Let us keep the orange LED turned ON for 1 second.
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Let us keep the orange LED turned ON for 1 second.
  
  
Line 264: Line 293:
  
  
−
Place this block below the LED turn ON block.
+
Place this block below the LED''' turn ON '''block.
  
  
 
Change the time to '''1 second''' as shown.
 
Change the time to '''1 second''' as shown.
−
|-  
+
 
−
|| Duplicate the''' LED block'''
+
|-
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Duplicate the''' LED block'''
  
  
Line 279: Line 309:
  
 
To change the state of the '''LED''', click on the dropdown arrow and select off.
 
To change the state of the '''LED''', click on the dropdown arrow and select off.
−
|| We will now turn '''OFF''' the orange LED.
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| We will now turn '''OFF''' the orange LED.
  
  
Line 288: Line 318:
  
  
−
To change the state of the LED, click on the dropdown arrow and select '''OFF'''.
+
Change the state of the LED to OFF.
−
|-
+
−
|| Highlight the red '''LED''' block setup between the 5:45 to 6:06 timestamp
+
−
|| '''Duplicate''' the previous LED block and place it below the orange LED block.
+
  
  
−
Change the '''pin''' number to 10 and select RED colour.
 
  
  
−
Duplicate the '''Wait''' block and set the time to '''2 seconds'''.
+
|-
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Highlight the red '''LED''' block setup between the 5:45 to 6:06 timestamp
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| '''Duplicate''' the previous LED block and place it below the orange LED block.
  
  
−
Finally, '''duplicate''' the Turn '''LED''' block and place it below the wait block.
+
Change the '''pin''' number to 10 and select RED colour.
  
  
−
Turn the '''LED''' block to '''OFF'''.
+
Duplicate the '''Wait''' block and set the time to '''2 seconds'''.
−
|-  
+
 
−
|| Only narration
+
|-
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Only narration
  
  
Line 312: Line 341:
  
 
Point the cursor to arduino code
 
Point the cursor to arduino code
−
|| Let us switch to the '''arduino''' '''code''' section.
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Let us switch to the '''arduino''' '''code''' section.
  
  
Line 319: Line 348:
  
 
An '''Arduino''' '''code''' for a traffic light experiment is generated here.
 
An '''Arduino''' '''code''' for a traffic light experiment is generated here.
−
|-  
+
 
−
|| Point the cursor to arduino code
+
|-
−
|| The '''LED''' '''pin''' connections are defined in the void setup function.
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Point the cursor to arduino code
−
|-  
+
 
−
|| Point the cursor to arduino code
+
 
 +
 
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| The '''LED''' '''pin''' connections are defined in the void setup function.
 +
 
 +
|-
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Point the cursor to arduino code
  
  
 
Highlight '''digitalWrite(12, HIGH)'''
 
Highlight '''digitalWrite(12, HIGH)'''
−
|| The working of these 3 '''LEDs''' is explained in the void loop function.
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| The working of these 3 '''LEDs''' is explained in the void loop function.
  
  
 
The '''digitalWrite(12, HIGH)''' command says that the green '''LED''' will be turned ON.
 
The '''digitalWrite(12, HIGH)''' command says that the green '''LED''' will be turned ON.
−
|-  
+
 
−
|| Highlight the '''delay(4000) '''
+
|-
−
|| The '''delay(4000)''' line of code makes sure that the green '''LED''' is '''ON''' for 4 seconds.
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Highlight the '''delay(4000) '''
 +
 
 +
 
 +
 
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| The '''delay(4000)''' line of code makes sure that the green '''LED''' is '''ON''' for 4 seconds.
  
  
 
In the arduino syntax, '''4000 milliseconds''' represent '''4 seconds.'''
 
In the arduino syntax, '''4000 milliseconds''' represent '''4 seconds.'''
  
−
|-  
+
 
−
|| Highlight '''digitalWrite(12, LOW)'''
+
 
 +
 
 +
|-
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Highlight '''digitalWrite(12, LOW)'''
 +
 
  
 
Highlight remaining all code
 
Highlight remaining all code
−
|| The''' digitalWrite(12, LOW)''' command says that the green LED will be turned off.
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| The''' digitalWrite(12, LOW)''' command says that the green LED will be turned off.
  
  
 
Similarly, orange and red '''LEDs''' will be turning '''ON''' and turning '''OFF''' after a given interval.
 
Similarly, orange and red '''LEDs''' will be turning '''ON''' and turning '''OFF''' after a given interval.
  
−
|-  
+
 
−
|| Point to the simulator.
+
 
−
|| Let’s check the desired results using the '''simulator'''.
+
 
−
|-  
+
|-
−
|| Click on '''Home''' page
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Point to the simulator.
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Let’s check the desired results using the '''simulator'''.
 +
 
 +
|-
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Click on '''Home''' page
  
  
 
Click on the play button
 
Click on the play button
−
|| Click on the '''Home''' icon from the toolbar.
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Click on the '''Home''' page Option from the toolbar.
  
  
 
Click on the '''Play''' button to start the simulation.
 
Click on the '''Play''' button to start the simulation.
−
|-
 
−
|| Point towards the simulation window.
 
−
|| The visual representation of the simulation shows that:
 
−
* The green '''LED''' connected to '''pin''' 12 turns ON for 4 seconds, then turns OFF.
 
−
* After that, the orange '''LED''' connected to '''pin''' 11 turns ON for 1 second, then turns OFF.
 
−
* Then the red '''LED''' connected to '''pin''' 10 turns ON for 2 seconds, then turns OFF.
 
  
−
|-  
+
|-
−
|| One by one step
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Point towards the simulation window.
 +
 
 +
 
 +
 
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| The visual representation of the simulation shows that:
 +
 
 +
* The green '''LED''' turns ON for 4 seconds, then turns OFF.
 +
* The orange '''LED''' turns ON for 1 second, then turns OFF.
 +
* The red '''LED '''turns ON for 2 seconds, and turns OFF.
 +
 
 +
 
 +
 
 +
|-
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| One by one step
 +
 
  
 
Click the '''Previous''' '''Step''' button
 
Click the '''Previous''' '''Step''' button
Line 373: Line 427:
  
 
Click on the '''Next Step '''button
 
Click on the '''Next Step '''button
 +
  
 
Highlight the '''Loop''' block
 
Highlight the '''Loop''' block
−
|| To see the simulation in the '''step by step '''manner,
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| To see the simulation in the '''step by step '''manner,
  
  
Line 385: Line 440:
  
 
The '''execution''' state of the '''block''' is highlighted with a yellow colour outline.  
 
The '''execution''' state of the '''block''' is highlighted with a yellow colour outline.  
−
|-  
+
 
−
|| Only narration  
+
|-
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Only narration  
  
 
Click on the '''Download''' icon
 
Click on the '''Download''' icon
Line 393: Line 449:
 
Click on the '''Download''' '''project''' option.
 
Click on the '''Download''' '''project''' option.
  
−
|| Let us now '''download''' the project in our system.
 
  
  
−
Click on the '''Download''' icon.
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Let us now '''download''' the project in our system.
 +
 
 +
 
 +
click on the '''Download''' icon.
  
  
 
Then, select the '''Download Project''' option.
 
Then, select the '''Download Project''' option.
  
−
|-  
+
 
−
|| Select the directory
+
 
 +
 
 +
|-
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Select the directory
  
  
Line 409: Line 470:
  
  
−
|| Select a directory and save the project with the filename '''Traffic Light'''.
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Select a directory and save the project with the filename '''Traffic Light'''.
  
 
Click on the '''Home''' icon.
 
Click on the '''Home''' icon.
Line 418: Line 479:
  
  
−
|-  
+
 
−
|| '''Slide 5'''
+
|-
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| '''Slide 5'''
  
  
 
'''Hardware Requirements'''
 
'''Hardware Requirements'''
−
|| To perform this experiment, we require
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| To perform this experiment, we require
 +
 
 
* 3 '''LEDs''' (red, green, orange)
 
* 3 '''LEDs''' (red, green, orange)
−
* 3 '''Resistor''' (220 '''Ohms''')
+
* 3 '''Resistors''' (220 '''Ohms''')
 
* '''Arduino Uno'''
 
* '''Arduino Uno'''
 
* '''Arduino '''cable
 
* '''Arduino '''cable
Line 431: Line 494:
  
  
−
|-  
+
 
−
|| '''Slide 6'''
+
|-
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| '''Slide 6'''
  
  
 
'''Circuit Diagram.png'''
 
'''Circuit Diagram.png'''
−
|| Please refer to this '''circuit diagram''' to make the circuit connections.
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Please refer to this '''circuit diagram''' to make the circuit connections.
−
|-  
+
 
−
|| Add image
+
|-
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Add image
  
  
 
Text box  
 
Text box  
−
|| Connect the '''arduino''' to your system with an '''arduino''' cable.
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Connect the '''arduino''' to your system with an '''arduino''' cable.
  
  
−
Windows users can go directly to the '''electroblock''' and '''upload''' the code.
+
Windows users can go directly to the '''electroblocks''' and '''upload''' the code.
  
  
−
 
−
|-
 
−
|| Setup for '''Ubuntu''' users only.
 
  
  
 +
|-
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Setup for '''Ubuntu''' users only.
  
  
 
Open the '''terminal'''
 
Open the '''terminal'''
−
 
−
 
  
  
Line 473: Line 535:
  
  
−
|| For '''Ubuntu '''users, please follow the steps mentioned below.
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| For '''Ubuntu '''users, please follow the steps mentioned below.
  
  
Line 495: Line 557:
  
  
−
|-
 
−
||
 
  
−
 
+
|-
−
 
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Type sudo chmod -R 775 /dev/ttyACM0
−
Type sudo chmod -R 775 /dev/ttyACM0
+
  
  
Line 510: Line 569:
  
 
Point to command
 
Point to command
−
 
−
 
  
  
Line 518: Line 575:
  
 
Go to the electroblocks website and click on the upload button.
 
Go to the electroblocks website and click on the upload button.
−
|| Then type,
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Then type,
  
  
Line 534: Line 591:
  
 
If an error occurs, go back to the '''electroblocks''' website and click on the '''Upload''' '''button'''.
 
If an error occurs, go back to the '''electroblocks''' website and click on the '''Upload''' '''button'''.
−
|-
 
−
|| Click on the upload code button and check the arduino USB port name.
 
−
 
−
 
−
 
  
 +
|-
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Click on the upload code button and check the arduino USB port name.
  
  
  
−
|| Click on the''' upload code button''' and check the '''arduino USB''' '''port''' name.
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Click on the''' upload code button''' and check the '''arduino USB''' '''port''' name.
  
  
Line 550: Line 604:
  
 
You have to run these commands only once.  
 
You have to run these commands only once.  
−
|-  
+
 
−
|| Restart the system
+
|-
−
|| We have to '''restart''' the system to save these changes.
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Restart the system
−
|-  
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| We have to '''restart''' the system to save these changes.
−
|| Open the '''electroblocks''' website.
+
 
 +
|-
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Open the '''electroblocks''' website.
  
  
Line 570: Line 626:
  
 
Point to Pop up window  
 
Point to Pop up window  
−
 
−
 
  
  
 
Click on the ok button
 
Click on the ok button
−
 
−
 
  
  
 
Point to''' traffic light project.'''
 
Point to''' traffic light project.'''
−
|| Open the '''electroblocks''' website again.
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Open the '''electroblocks''' website again.
  
  
Line 586: Line 638:
  
  
−
Click on the '''Project''' icon on the toolbar.
+
Click on the '''Projects''' icon on the toolbar.
  
  
Line 602: Line 654:
  
 
The '''Traffic light project '''appears on the screen.
 
The '''Traffic light project '''appears on the screen.
−
|-  
+
 
−
|| Only narration
+
|-
−
|| Let’s '''upload''' this '''code''' on the '''arduino''' '''uno''' to perform the same experiment with hardware.
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Only narration
−
|-  
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Let’s '''upload''' this '''code''' on the '''arduino''' '''uno''' to perform the same experiment with hardware.
−
|| Click on the '''Upload''' code option on the right hand side of your screen.  
+
 
 +
|-
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Click on the '''Upload''' code option on the right hand side of your screen.  
  
  
Line 616: Line 670:
  
  
−
|| Click on the '''Upload''' button on the toolbar.
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Click on the '''Upload''' button on the toolbar.
  
  
Line 626: Line 680:
  
 
Select the '''port''' to which '''Arduino''' is connected and click on '''Connect''' button.
 
Select the '''port''' to which '''Arduino''' is connected and click on '''Connect''' button.
−
|-
 
−
||
 
  
−
 
+
|-
−
 
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Point to''' Good Job '''message on the screen.
−
Point to''' Good Job '''message on the screen.
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| It will take a few seconds to connect the '''arduino board '''to the system.
−
|| It will take a few seconds to connect the '''arduino board '''to the system.
+
  
  
Line 642: Line 693:
  
  
−
|-
 
−
|| Add the entire Output video.mp4 in the main video at the 13:54 timestamp.
 
−
|| Notice that the '''LED'''s are turning''' ON''' and turning''' OFF.'''
 
−
|-
 
−
||
 
−
|| This brings us to the end of this tutorial.
 
  
 +
|-
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Add the entire Output video.mp4 in the main video at the 13:54 timestamp.
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Notice that the '''LED'''s are turning''' ON''' and turning''' OFF.'''
  
−
Let us summarise.
+
|-
−
|-  
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| '''Slide 7'''
−
|| '''Slide 7'''
+
  
  
 
'''Summary'''
 
'''Summary'''
−
|| In this tutorial, we learnt how to
+
 
 +
 
 +
In this tutorial, we learnt how to
 +
 
 
# Build a set of '''blocks''' to Create a '''Traffic light project'''
 
# Build a set of '''blocks''' to Create a '''Traffic light project'''
 
# Check the output of the experiment using the '''simulator'''
 
# Check the output of the experiment using the '''simulator'''
Line 662: Line 712:
  
  
−
|-  
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| This brings us to the end of this tutorial.
−
|| '''Slide 8'''
+
 
 +
 
 +
Let us summarise.
 +
 
 +
|-
 +
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| '''Slide 8'''
  
  
 
'''Assignment'''
 
'''Assignment'''
−
|| As an '''assignment''', please do the following,Connect* A green '''LED''' to pin 3,
 
−
* An orange '''LED''' to pin 5, and
 
−
* A red '''LED''' to pin 6 on the '''Arduino board'''.
 
  
  
 +
As an '''assignment''', please do the following,Connect
  
 +
* A green '''LED''' to pin 3,
 +
* An orange '''LED''' to pin 5, and
 +
* A red '''LED''' to pin 6 on the '''Arduino board'''.
  
 +
Adjust the delay times as follows:
  
−
Adjust the delay times as follows:# Set the '''delay''' for the green '''LED''' to 6 seconds.
+
# Set the '''delay''' for the green '''LED''' to 6 seconds.
 
# Set the '''delay''' for the orange '''LED''' to 2 seconds.
 
# Set the '''delay''' for the orange '''LED''' to 2 seconds.
 
# Set the '''delay''' for the red '''LED''' to 3 seconds.
 
# Set the '''delay''' for the red '''LED''' to 3 seconds.
  
  
−
|-  
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| As an '''assignment''', please do the following,Connect
−
|| Add the entire assignment video.mp4 in the main video at the 14:46 timestamp.
+
−
|| Notice the output of the assignment as shown in the video.
+
−
|-
+
−
|| '''Slide 9'''
+
  
 +
* A green '''LED''' to pin 3,
 +
* An orange '''LED''' to pin 5, and
 +
* A red '''LED''' to pin 6 on the '''Arduino board'''.
  
−
'''About Spoken Tutorial project'''
+
Adjust the delay times as follows:
−
|| The video at the following link summarizes the '''Spoken Tutoria'''l project.
+
  
−
Please download and watch it.
 
−
|-
 
−
|| '''Slide 10'''
 
  
  
−
'''Spoken Tutorial workshops'''
 
−
|| The Spoken Tutorial Project team conducts workshops and gives certificates.
 
  
−
For more details, please write to us.
+
|-
−
|-  
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Add the entire assignment video.mp4 in the main video at the 14:46 timestamp.
−
|| '''Slide 11'''
+
| style="background-color:transparent;border:1pt solid #000000;padding:0.176cm;"| Notice the output of the assignment as shown in the video.
−
 
+
−
 
+
−
'''Answers for THIS Spoken Tutorial '''
+
−
|| Please post your timed queries in this forum.
+
−
|-  
+
−
|| '''Slide 12'''
+
  
−
 
+
|-
−
'''Acknowledgement'''
+
| style="background-color:transparent;border:1pt solid #000000;padding-top:0cm;padding-bottom:0cm;padding-left:0.191cm;padding-right:0.191cm;"| '''Slide 9'''
−
|| '''Spoken Tutorial project''' was established by the Ministry of Education(MoE), Govt of India
+
−
|-  
+
−
|| '''Slide 13'''
+
  
  
 
'''Thank you'''
 
'''Thank you'''
−
|| This tutorial has been contributed by''' FOSSEE''' and '''Spoken Tutorial Project''',''' IIT Bombay.'''
+
| style="background-color:transparent;border:1pt solid #000000;padding-top:0cm;padding-bottom:0cm;padding-left:0.191cm;padding-right:0.191cm;"| This tutorial has been contributed by''' FOSSEE''' and '''Spoken Tutorial Project''',''' IIT Bombay.'''
  
  
 
Thank you for watching.
 
Thank you for watching.
−
|-
+
 
 
|}
 
|}

Revision as of 12:20, 9 June 2025

Title of the Script: Traffic Lights

Author: Pratik Nemane

Keywords: Electroblocks, arduino board, 220 ohm resistor, LEDs breadboard, spoken tutorial, video tutorial.


Visual Cue Narration
Slide 1

Title slide

Welcome to the Spoken Tutorial on Traffic Lights using Electroblocks.
Slide 2

Learning Objectives

In this tutorial, we will learn how to,
  1. Build a set of blocks to create a Traffic Light project
  2. Check the output of the experiment using the simulator
  3. Upload the Arduino code on Arduino Uno Board.


Slide 3

System Requirements

To record this tutorial, I am using:
  • Ubuntu Linux OS version 22.04
  • Google Chrome browser

A working internet connection to use Electroblocks.

Slide 4

Prerequisite


https://spoken-tutorial.org

To follow this tutorial,
  • Learner should have a basic knowledge of Electroblocks interface
  • If not, please visit the relevant tutorials on this website.


Type https://electroblocks.org/

Highlight the link in the search tab


https://electroblocks.org/

Let us open the Electroblocks platform using Google Chrome browser.


In the address bar, type the URL as shown and press Enter.


You will see the default Blink LED circuit on the screen.

Click on the New File icon.


Click on the New File/Blank file option available on the toolbar.


Click the OK button.

Click on the New File/Blank file option available on the toolbar.


A pop-up window appears.

Click the OK button to start a new project.

Point to the number 3 in the loop block. Observe the loop block in the working area.


It indicates that the simulation will run for 3 times.

Point to 3.


Click to change the number from 2 to 3.

Let us change the number to 2.


This will simulate the code for 2 times.

Add the entire Output video.mp4 in the main video at the 1:32 timestamp. We will create this traffic light output.


Let’s start by building traffic lights using Electroblocks.

Main Video.mp4


Click on the Add-ons menu.


Select LED Option


We need three LED blocks with different colours, namely, red, orange and green.


Click on the Add-ons menu on the left panel.


A new list opens.


Click on the LED option, you will see two blocks.



Click on the Turn LED block and drag it in the working area.


Place the LED option in the loop block.


Point to the LED.

Click and place the Turn LED block inside the loop block.


Notice the change in the circuit on the simulation screen.


You can see an LED connected to the arduino.



Zoom in to show the resistor


Point to pin 2.


Let us Zoom in to see the circuit connection clearly.


Here the LED is connected through a resistor to the Arduino.


By default, the LED is always connected to pin 2 of Arduino.

Change the LED pin and LED colour Change the pin number to pin 12.


Click on the colour section on the LED block and select the green colour.



Only narration


Add the Wait block


Click on the Time.


Drag and drop the Wait block.


Place this block below the LED block.


Change to 4 seconds

Let’s make sure that the LED remains turned ON for a specific amount of time.


For this, we must add a Wait block.


From the left panel, Click on Time.


Drag and place Wait block for 0.2 seconds block below the turn ON LED block.


Change the time to 4 seconds in the block as shown.

Only narration


Duplicate the LED block


Let’s turn OFF the green LED.


Right click on the Turn ON LED block, and select the Duplicate option.


This action creates an identical block in the working area.

Point to Duplicate block


Drag and place this block below the Wait for 4 seconds block.


Click on the dropdown option and select off state.


Change state of the LED

Drag and place this block below the Wait for 4 seconds block.


To change the state of the LED, click the dropdown arrow and select OFF.


This block turns OFF the LED connected to pin 12.



Duplicate the LED block


Right click on the LED block and select the Duplicate option.


Drag and place this new block below the green colour led block as shown.

Now, let's add a second LED block to represent the orange colour.


Right click on the LED block and select the Duplicate option.


Drag and place this new block below the green colour led block as shown.

click on the dropdown arrow and select On.


Click on the pin 12 dropdown menu and change the pin number to pin 11.


Click on the colour section on the LED block and select orange colour.

To change the state of the LED, click on the dropdown arrow and select ON.


Click on the pin 12 dropdown menu and change the pin number to pin 11.


Click on the colour section on the LED block and select orange colour.

Duplicate the wait for 4 seconds block


Place this block below the LED turn ON block.


Change the time to 1 second.

Let us keep the orange LED turned ON for 1 second.


For this, duplicate the Wait for 4 seconds block.


Place this block below the LED turn ON block.


Change the time to 1 second as shown.

Duplicate the LED block


Right click on the Turn LED block and select the Duplicate option.


Drag and place this block below the Wait for 1 second block.


To change the state of the LED, click on the dropdown arrow and select off.

We will now turn OFF the orange LED.


Right click on the Turn LED block and select the Duplicate option.


Drag and place this block below the Wait for 1 second block.


Change the state of the LED to OFF.



Highlight the red LED block setup between the 5:45 to 6:06 timestamp Duplicate the previous LED block and place it below the orange LED block.


Change the pin number to 10 and select RED colour.


Duplicate the Wait block and set the time to 2 seconds.

Only narration


Click on the code icon.


Point the cursor to arduino code

Let us switch to the arduino code section.


Click on the Code icon.


An Arduino code for a traffic light experiment is generated here.

Point the cursor to arduino code


The LED pin connections are defined in the void setup function.
Point the cursor to arduino code


Highlight digitalWrite(12, HIGH)

The working of these 3 LEDs is explained in the void loop function.


The digitalWrite(12, HIGH) command says that the green LED will be turned ON.

Highlight the delay(4000)


The delay(4000) line of code makes sure that the green LED is ON for 4 seconds.


In the arduino syntax, 4000 milliseconds represent 4 seconds.



Highlight digitalWrite(12, LOW)


Highlight remaining all code

The digitalWrite(12, LOW) command says that the green LED will be turned off.


Similarly, orange and red LEDs will be turning ON and turning OFF after a given interval.



Point to the simulator. Let’s check the desired results using the simulator.
Click on Home page


Click on the play button

Click on the Home page Option from the toolbar.


Click on the Play button to start the simulation.

Point towards the simulation window.


The visual representation of the simulation shows that:
  • The green LED turns ON for 4 seconds, then turns OFF.
  • The orange LED turns ON for 1 second, then turns OFF.
  • The red LED turns ON for 2 seconds, and turns OFF.


One by one step


Click the Previous Step button


Click on the Next Step button


Highlight the Loop block

To see the simulation in the step by step manner,


Click the Previous Step button to return to the beginning of Step 1.


Click on the Next Step button, notice the blocks in the working area.


The execution state of the block is highlighted with a yellow colour outline.

Only narration

Click on the Download icon


Click on the Download project option.


Let us now download the project in our system.


click on the Download icon.


Then, select the Download Project option.



Select the directory


Click on the Home icon


Select a directory and save the project with the filename Traffic Light.

Click on the Home icon.


Now let us see how to execute the same traffic light experiment on the hardware.



Slide 5


Hardware Requirements

To perform this experiment, we require
  • 3 LEDs (red, green, orange)
  • 3 Resistors (220 Ohms)
  • Arduino Uno
  • Arduino cable
  • Breadboard and connecting wires


Slide 6


Circuit Diagram.png

Please refer to this circuit diagram to make the circuit connections.
Add image


Text box

Connect the arduino to your system with an arduino cable.


Windows users can go directly to the electroblocks and upload the code.



Setup for Ubuntu users only.


Open the terminal


Type sudo usermod -a -G dialout $USER


Enter system password


Press Enter.


Type the password and press Enter.


For Ubuntu users, please follow the steps mentioned below.


Open the terminal.


At the prompt, type:


sudo usermod -a -G dialout $USER


Press Enter.


The system will prompt you to enter the system password.


Type the password and press Enter.



Type sudo chmod -R 775 /dev/ttyACM0


press Enter.


Point to ttyACM0


Point to command


Only narration


Go to the electroblocks website and click on the upload button.

Then type,


sudo chmod -R 775 /dev/ttyACM0(ACMzero)


And press Enter.


ttyACM0 is the arduino usb port.


This command initiates the communication between Electroblocks website and arduino board.


If an error occurs, go back to the electroblocks website and click on the Upload button.

Click on the upload code button and check the arduino USB port name.


Click on the upload code button and check the arduino USB port name.


Use the port name and change it accordingly in the sudo command.


You have to run these commands only once.

Restart the system We have to restart the system to save these changes.
Open the electroblocks website.


Only narration


Click on the project icon


Click on the choose file option.


Open the traffic light.xml file


Point to Pop up window


Click on the ok button


Point to traffic light project.

Open the electroblocks website again.


Let us open the Traffic light experiment which we just saved in our system.


Click on the Projects icon on the toolbar.


Click on choose file option.


Open the Traffic Light.xml file.


A pop-window appears on the screen to confirm if you want to open a new file.


Click on the OK button.


The Traffic light project appears on the screen.

Only narration Let’s upload this code on the arduino uno to perform the same experiment with hardware.
Click on the Upload code option on the right hand side of your screen.


Point to usb port list.


Select the usb port


Click on the Upload button on the toolbar.


Click on the Upload code option on the right hand side of your screen.


A list of available USB port connections will appear.


Select the port to which Arduino is connected and click on Connect button.

Point to Good Job message on the screen. It will take a few seconds to connect the arduino board to the system.


Once it is done, you will see a Good Job message on the screen.


It indicates that arduino code has been successfully uploaded on the arduino uno.



Add the entire Output video.mp4 in the main video at the 13:54 timestamp. Notice that the LEDs are turning ON and turning OFF.
Slide 7


Summary


In this tutorial, we learnt how to

  1. Build a set of blocks to Create a Traffic light project
  2. Check the output of the experiment using the simulator
  3. Upload the arduino code on arduino uno.


This brings us to the end of this tutorial.


Let us summarise.

Slide 8


Assignment


As an assignment, please do the following,Connect

  • A green LED to pin 3,
  • An orange LED to pin 5, and
  • A red LED to pin 6 on the Arduino board.

Adjust the delay times as follows:

  1. Set the delay for the green LED to 6 seconds.
  2. Set the delay for the orange LED to 2 seconds.
  3. Set the delay for the red LED to 3 seconds.


As an assignment, please do the following,Connect
  • A green LED to pin 3,
  • An orange LED to pin 5, and
  • A red LED to pin 6 on the Arduino board.

Adjust the delay times as follows:



Add the entire assignment video.mp4 in the main video at the 14:46 timestamp. Notice the output of the assignment as shown in the video.
Slide 9


Thank you

This tutorial has been contributed by FOSSEE and Spoken Tutorial Project, IIT Bombay.


Thank you for watching.

Contributors and Content Editors

Ketkinaina, Madhurig, Pratiknemane

Retrieved from "https://script.spoken-tutorial.org/index.php?title=ElectroBlocks-archive-sept-2025/C2/Traffic-Lights/English&oldid=56956"