| 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,
- Build a set of blocks to create a Traffic Light project
- Check the output of the experiment using the simulator
- 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 on the Turn LED block and drag it to the working area.
Place this 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.
We can also change the colour of the LED.
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 sufficient amount of time.
For this, we must add a Wait block.
From the left panel, Click on Time.
Drag and drop the Wait block for 0.2 seconds in the working area.
Place this block below the turn ON LED block as shown.
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.
To change the state of the LED, click on the dropdown arrow and select 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.
Finally, duplicate the Turn LED block and place it below the wait block.
Turn the LED block to OFF.
|
| 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 icon 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 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
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 Resistor (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 electroblock 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 Project 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.
|
|
|
This brings us to the end of this tutorial.
Let us summarise.
|
| Slide 7
Summary
|
In this tutorial, we learnt how to
- Build a set of blocks to Create a Traffic light project
- Check the output of the experiment using the simulator
- Upload the arduino code on arduino uno.
|
| 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:# 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 red LED to 3 seconds.
|
| 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
About Spoken Tutorial project
|
The video at the following link summarizes the Spoken Tutorial 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.
|
| Slide 11
Answers for THIS Spoken Tutorial
|
Please post your timed queries in this forum.
|
| Slide 12
Acknowledgement
|
Spoken Tutorial project was established by the Ministry of Education(MoE), Govt of India
|
| Slide 13
Thank you
|
This tutorial has been contributed by FOSSEE and Spoken Tutorial Project, IIT Bombay.
Thank you for watching.
|
