Wi-Fi Controlled Robot Using Wemos D1 ESP8266 and Blynk

In this tutorial I show you how to make a Wi-Fi controlled robotic tank controlled from a smartphone using Blynk App. In this project an ESP8266 Wemos D1 board was used, but other plate models can also be used (NodeMCU, Firebeetle, etc.), and the principles presented in this tutorial can be applied to other robot models.

In previous projects I presented how to mount a robot controller with an Arduino Uno connected to an ESP8266 module and a web interface using html and javascript. A robot was developed using simple materials, without the need of using complex tools such as 3D printers and laser cutting machines. You can read more about this project at the link below:

https://www.hackster.io/igorF2/widc-wi-fi-controlled-fpv-robot-8f1e09

It had some drawbacks, such as the need to use two independent controllers (an Arduino and an ESP8266) and the fact that it could only send/receive commands from a local area network and using a computer (desktop or laptop).

This time I decided to test a different physical structure, and a new way to perform control of the robot. For this, a DIY kit was used for the robot structure, and a Wemos ESP8266 board associated with the Blynk app to carry out its control. The code for robot control was developed using the Arduino IDE.

There are several ways to use this tutorial. You can use it to:

• Learn how to program an ESP8266 using the Arduino IDE;
• Practice your electronics and soldering skills, etc;
• See how to assemble a robotic kit;
• Learn how to use Blynk app on your projects;

Liked that projects? Please consider supporting my future projects with a small Bitcoin donation! :D BTC Deposit Address: 1FiWFYSjRaL7sLdr5wr6h86QkMA6pQxkXJ

Step 1: Tools and Materials

The following tools were used in this project:

• Solder iron and wire. The DC motors already came with wires soldered to its terminals... But it will eventually break and you might have to resolder it. So consider having a good solder iron and wire neaby.

• EVA foam sheet (or other non-conductive material). The robot chassis I used in this project is made of aluminum, and circuit boards are installed on this metal parts. I used a layer of foam sheet between the boards and the metal plate to avoid possible short-circuits.

• Double sided tape. It was used for glueing the foam sheets to the circuit boards, and for the installation of the H-Bridge modue.

• Scissors, for cutting some foam sheet rectangles.

I used the following hardware parts for my project:

• Wemos D1 ESP8266 dev board (link). Wemos D1 board is really easy to use and program with Arduino IDE. It has the same footprint of and ordinary Arduino Uno! This way most of Arduino shield will also work with this board. It has built-in Wi-Fi module, so you can use it in a variaty of projects.You can also use other ESP8266 based boards (link / link).

• L298N dual channel H-bridge module (link). This module allows the 3.3V signals from the Wemos (or an Arduino) to be amplified to the 12V needed for the motors.

• DIY Robot Chassis Tank (link). This awesome kit has with everything you need to built a tank: two DC motors, gears, tracks, bolts, nuts, etc. It already comes with the tools need for assembling the chassis, which is great for beginners!

• 18650 3.7V batteries (x3) (link). I used to power the whole circuit. This tank uses 12V motors. I used three 3.7V batteries in series for powering them.

• 3S 18650 battery holder (link). It can hold three 18650 batteries in serie, and can be easilly be attached to the back of the tank.

• 18650 battery charger (link). Your batteries will eventually run out of power. When that happens, a battery charger will come to your rescue.

• Jumpers (link). I used 6 male-female jumpers for signals between the h-bridge an the Wemos, and 2 male-male jumpers for 5V and Gnd. You might need more if you plan to add some sensors.

• Micro USB cable. You'll need this for uploading your code. Most of the boards already come with its own cable.

The links above are only a suggestion of where you can find the items used in this tutorial (and maybe support my future projects). Feel free to search for them elsewhere and buy at your favorite local or online store.

Step 2: Assembling the Robot

The first part of this project was the assembly of the robot structure.

In previous projects I developed the structure of my own robot, using easily accessible materials (without the need for complex tools, 3D printers or laser cutting machines). You can find this project in the link below:

https://www.hackster.io/igorF2/widc-wi-fi-controlled-fpv-robot-8f1e09

This time I decided to give a chance for a robotic kit obtained from an online store. You can find a link to the robot chassis at the following link: http://bit.ly/2ycI8fP. If you're looking for a kit, I think it's a good option!.

At first it seemed that the assembly would be complex or that I would run into problems like the lack of parts (given the amount of parts that make up the kit). But this kit really surprised me! All the pieces seem to me of good quality, and several spare parts accompanied the kit. Thus, a screw lost underneath the workbench won't make it impossible to carry out your project, which I found to be excellent (especially after losing a couple of screws).

Another positive point is that all the tools needed to mount the robot are included in the kit (a couple of Allen wrenches and the screwdriver). I believe this makes the kit excellent for starters who doesn't have lots of tools!

As a negative aspect I would highlight the lack of documentation. The robot's assembly manual (a spreadsheet file in Chinese) is not extremely user friendly, and there isn't a lot of tutorials online for that tank. And so I decided to document the process of assembling my robot in the video above! Another point of attention concerns the material of the robot structure. The base is entirely made of aluminum, which can cause some short circuit if the pins of the printed circuit boards touch the frame.

There are other online kits that you can use. You can even maker your own structure, as I described bellow.

Step 3: Wiring Up the Circuit (Wemos D1)

In the video above I show you how you can assemble the electronics in the robot structure.

A power pack made of three 18650 batteries was installed on the back of the robot. It provides 11.1V (3 x 3.7V) to the robot. That's enough to power the 12V DC motors.

A L298N dual channel H-bridge was used for the control of the motors. It receives some 3.3V signals of the Wemos board, and provide higher voltages for the motors. It also allow the motors to run in both directions, depenting on the combination of those input signals.

Each device was connected according to the schematics.

Follows a list of the pins you'll need to connect:

Wemos D1 inputs/outputs:

• Digital pin D3 (GPIO5) => H-Bridge ENB pin

• Digital pin D4 (GPIO4) => H-Bridge IN4 pin

• Digital pin D5 (GPIO14) => H-Bridge IN3 pin

• Digital pin D6 (GPIO12) => H-Bridge IN2 pin

• Digital pin D7 (GPIO13) => H-Bridge IN1 pin

• Digital pin D8 (GPIO0) => H-Bridge ENA pin

• 5V pin => H-Bridge 5V pin

• Gnd pin => H-bridge Gnd pin

H-Bridge inputs/outputs:

• ENB pin => Wemos D3 pin

• IN4 pin => Wemos D4 pin

• IN3 pin => Wemos D5 pin

• IN2 pin => Wemos D6 pin

• IN1 pin => Wemos D7 pin

• ENA pin => Wemos D8 pin

• 5V pin => Wemos 5V pin

• Gnd pin => Wemos Gnd pin

• Gnd pin => Battery pack negative wire

• 12V pin => Battery pack positive wire

• OUT1 => Right motor negative wire

• OUT2 => Right motor positive wire

• OUT3 => Left motor positive wire

• OUT4 => Left motor negative wire

Step 4: Setup ESP8266 Board on Arduino IDE

For this project I used Arduino IDE for programming my Wemos. It's the easier way if you've already used an Arduino before, and you won't need to learn a new programming language, like Python or Lua for instance.

If you've never done this before, first you'll have to add ESP8266 board support to the Arduino software.

1. Download and install Arduino IDE latest version

You can find the latest version for Windows, Linux or MAC OSX on Arduino's website: https://www.arduino.cc/en/main/software

Download it for free, install it on your computer and launch it.

2. Adding ESP8266 board

Arduino IDE already comes with support to a lot of different boards: Arduino Nano, Mine, Uno, Mega, Yún, etc. Unfortunatly ESP8266 isn't by default among those suported development boards. So in order to upload your codes to a ESP8266 base board, you'll have to add its properties to Arduino's software first.

Navigate to File > Preferences (Ctrl +, on Windows OS);

• Add the following URL to Additional Boards Manager textbox (the one on the bottom of the Preferences window):

http://arduino.esp8266.com/stable/package_esp8266com_index.json

Navigate for Tools > Board > Boards Manager for adding your ESP8266 board.

• If the text box wasn't blank, it means had already add other boards before on Arduino IDE before. Add a comma at the end of the previous URL and the one above.

• Hit "Ok" button and close the Preferences Window.

• Type "ESP8266" on the search text box, select "esp8266 by ESP8266 Community" and install it.

Now your Arduino IDE will be ready to work with a lot of ESP8266 based development boards, like the generic ESP8266, NodeMcu (which I used in this tutorial), Adafruit Huzzah, Sparkfun Thing, WeMos, etc.

3. Adding the libraries

In this project, I used Blynk library.

Blynk library should de installed manually. Download Blynk library at https://github.com/blynkkk/blynk-library/releases/tag/v0.5.0. Unzip the file, and copy the folders to Arduino IDE libraries/tools folders.

The structure of your your_sketchbook_folder should now look like this:

your_sketchbook_folder/libraries/Blynk

your_sketchbook_folder/libraries/BlynkESP8266_Lib

your_sketchbook_folder/tools/BlynkUpdater

your_sketchbook_folder/tools/BlynkUsbScript

............

Now that your dev environment is ready, let's move on to the next step!

Step 5: Setup Blynk

Blynk is a service designed for controlling hardware remotely over an internet connection. It makes allows you to create Internet of Things gadgets easilly, and supports several hardwares, such as Arduinos, ESP8266, Raspberry Pi, etc.

You can use it to send data from an Android or iOS smartphone (or tablet) to remote device. You can also read, store, and display data obtained by your harware sensors, for instance.

Blynk App is used for the creation of the user interface. It has a variaty of widgets: buttons, sliders, joystick, displays, etc. Users an drag and drop the widget to the dashboard and create a custom graphic interface for a multitude of projects.

It has a 'energy' concept. Users start with 2000 free energy points. Every widget used (in any project) consumes some energy, thus limiting the maximum number of widgets used on the projects. A button, for instance, consumes 200 energy points. This way, one can create an interface with up to 10 buttons for instance. Users can buy extra energy points, and create more complex interfaces and/or several different projects.

The commands from Blynk App are uploaded to Blynk Server over the internet. Another hardware (a NodeMCU, for instance) uses Blynk Libraries to read those commands from the server and perform actions. The hardware can also some data to the server, which might de displayed on the App.

Download Blynk app for Android or iOS from the following links:

https://play.google.com/store/apps/details?id=cc.blynk

https://itunes.apple.com/us/app/blynk-control-arduino-raspberry/id808760481?ls=1&mt=8

Install the app and Create a new account. After that you'll be ready to create your first project.

You'll also need to install Blynk libraries and to get the auth code. The procedure to install the library was described on the previous step. I'll show you how to get the auth token on the next step.

Step 6: Blynk App - Create a New Project

Now I'll show you how I designed my remote control app using Blynk. You can use it as a base for your own creations.

Create new project

Add a project name (Wifi robot), choose the development board (Wemos D1) and connection type (WiFi) and click Create button; The auth token will be sent to your e-mail;

• Create new project;

The auth token is used om Arduino code. It allows the ESP8266 board to reach Blynk server for sending and receiving data.

For the creation of you dashboard, you can drag and drop several objects. Buttons, sliders and joysticks are available for the creation of different control interfaces. You can resize (most of them) and configure their settings as you wish.

In next steps I'll show four different alternatives to control the robot using different widgets.

Step 7: Blynk App #1 - Four Buttons

For the this first app I did a simple control using four simple push buttons to move the robot forward, right, left or backward. For that, I used the 'Styled Button' Widget on Blynk App. Select this option on the Widget Box, drag and drop, and resize the buttons as you wish.

Under Button Settings you'll have to name each button (forward, right, left of backward) and assign a virtual pin as output for each one. I used the following virtual pins:

• Forward: V0 pin

• Right: V1 pin

• Left: V2 pin

• Backward: V3 pin

You'll also have to configure On/Off Labels. By default they are named On and Off, but I changed for a better understanding of what each button means. You can see a screenshoot of the final app on the pictures above.

As you can see, each button is binary. Once they're click the motors will run at full speed.

If you connected everything according to my schematics, you'll have the following outputs:

Arduino Code:

Download the code and open it on Arduino IDE. You'll have to update Blynk auth key and your WiFi credentials (ssid and password) before uploading the code.

For uploading the code, select 'Wemos D1 R2 & mini' (if you're using a NodeMCU) with 921600 kbps upload speed. Plug board on your computer's USB port and upload the code.It will take a while (much more than compliling and uploading a sketch for an Arduino... be patient...). Now it's a good time for you to give a like on this tutorial while you wait! :D

After the upload was complete, unplug the USB cable, and put the batteries. The code will start running and the Wemos board will automatically try to connect the Wi-Fi router and wait for the commands from Blynk server.

Code explained:

In this project I only had to use ESP8266 and Blynk libraries. They are added in the begining of the code.

#include <ESP8266WiFi.h><br>#include <BlynkSimpleESP8266.h>

You'll have to configure your Blynk authorization key and you Wi-Fi credentials. This way your ESP8266 will be able to reach your Wi-Fi router and wait for commands from Blynk server. Replace XXXXX, YYYYY and ZZZZZ with your auth key (you'll receive it on your e-mail), SSID and password of your Wi-Fi network.

char auth[] = "XXXXX";
char ssid[] = "YYYYY"/
char pass[] = "ZZZZZ";

Define the pins of the Wemos connected to the h-bridge. You might use the literal value (D1, D2, De, etc.) of the GPIO number of each pin.

#define ENB D3
#define MOTORB_1 D4
#define MOTORB_2 D5
#define MOTORA_1 D7
#define MOTORA_2 D6
#define ENA D8

The first thing I did during the setup was to configure I/O pins state (as output) and set enable pins to LOW. This way you'll disable both motors on start-up, and the robot won't move randomly while it waits for the rest of the code.

pinMode(ENA, OUTPUT);
pinMode(MOTORA_1, OUTPUT);
pinMode(MOTORA_2, OUTPUT);
pinMode(ENB, OUTPUT);
pinMode(MOTORB_1, OUTPUT);
pinMode(MOTORB_2, OUTPUT);
digitalWrite(ENA,LOW);
digitalWrite(ENB,LOW);

Then it starts Serial port communication (usefull for debuging the code) and Blynk communication (Wi-Fi connection will be performed here).

Serial.begin(9600);
Blynk.begin(auth, ssid, pass);

Main loop consists only in running Blynk.run function. It will check for incoming commands from the server, and call other functions if something happens.

// MAIN CODE
void loop()
{
Blynk.run();
}

Each button on the App is mapped into a virtual pin (V0 to V3). BLYNK_WRITE functions checks if a given pin was clicked and then perform some actions. The same block was defined for each for each virtual button. They'll make the robot move in one of the directions while the button is pressed.

// FORWARD
BLYNK_WRITE(V0) {
int button = param.asInt(); // read button
if (button == 1) {
    Serial.println("Moving forward");
    digitalWrite(ENA,HIGH);
    digitalWrite(ENB,HIGH);
    digitalWrite(MOTORA_1,HIGH);
    digitalWrite(MOTORA_2,LOW);
    digitalWrite(MOTORB_1,LOW);
    digitalWrite(MOTORB_2,HIGH);
  }
  else {
    Serial.println("Stop");
    digitalWrite(ENA,LOW);
    digitalWrite(ENB,LOW);
    digitalWrite(MOTORA_1,LOW);
    digitalWrite(MOTORA_2,LOW);
    digitalWrite(MOTORB_1,LOW);
    digitalWrite(MOTORB_2,LOW);
  }
}

If you connected the pins the same way I did, you'll have the following outputs:

OutputENAIN1IN2ENBIN3IN4FORWARDHIGHHIGHLOWHIGHLOWHIGHBACKWARDHIGHLOWHIGHHIGHHIGHLOWRIGHTHIGHLOWHIGHHIGHLOWHIGHLEFTHIGHHIGHLOWHIGHHIGHLOWSTOPLOW**LOW**

Step 8: Blynk App #2 - Sliding Bars

In the previous app I used simple push buttons to control the robot. As I explained earlier, when the buttons are pressed the motors will run at full speed. This time I made an experimento using two sliding bars. Each one will set the speed and direction of a give motor. Depending on the speed of each track, it's possible to make the robot move forward, turn left/right or go back with variable speeds.

For that, I used the 'Vertical Slider' Widget on Blynk App. Select this option on the Widget Box, drag and drop, and resize the buttons as you wish. Later I realized that the ordinary 'Slider' would be a better option (it would be more comfortable to hold the phone and move both motors at the same time).

Under Button Settings you'll have to name each button (right or left), assign a virtual pin as output, and set the range of values. I used the following virtual pins:

• Left: V0 pin, from -1023 to 1023

• Right: V1 pin, from -1023 to 1023

You can see a screenshoot of the final app on the pictures above.

Remember to set 'Send values on release only' to OFF. This way Blynk will send commands to the robot as you change the slider bar position, and not only on release.

Arduino Code:

Initialization of the code is almost the same as described before.

The following lines were added to the initialization.

Blynk.virtualWrite(V0, 0);
Blynk.virtualWrite(V1, 0);

This way the sliders will go to zero position during the start-up (and the robot will stop moving).

The following code was created for each motor. The microcontroller will read the value of each slider, which is translated into the speed of each track. A deadband (between -500 and 500) was defined so that the robot would stop for low speeds.

If it receives a negative speed, the signals to motor1 and motor2 pins are switched. The speed also determines the duty cycle of the PWM signal used in analog out. The larger the absolute value, the faster the robot runs.

// LEFT TRACK<br>BLYNK_WRITE(V0) {
  int speedL = param.asInt(); // read button
  Serial.print("Left speed: ");
  Serial.println(speedL);
  if (speedL > 500) {
    analogWrite(ENB,speedL);
    digitalWrite(MOTORB_1,LOW);
    digitalWrite(MOTORB_2,HIGH);
  }
  else if (speedL < -500) {
    analogWrite(ENB,-speedL);
    digitalWrite(MOTORB_1,HIGH);
    digitalWrite(MOTORB_2,LOW);
  }
  else {
    digitalWrite(ENB,LOW);
    digitalWrite(MOTORB_1,LOW);
    digitalWrite(MOTORB_2,LOW);
  }
}

Step 9: Blynk App #3 - Accelerometer

Some sensors of the smartphone can also be used with Blynk. This time I wanted to use its accelerometer to control my robot. Tilt the phone and the robot will turn left/right or move forward/backward.

Drag accelerometer object from Widget Box and drop it on the dashboard. Under Button Settings assign a virtual pin as output. I used virtual pin V0. You can see a screenshoot of the final app on the pictures above.

Arduino Code:

Initialization of the code is almost the same as described before.

BLYNK_WRITE(V0) function was used to read accelerometer values. The acceleration on y-axis was used to control if the robot should turn right/left, and z-axis acceleration is used to see if the robot is supposed to move forward/backward.

The code verifies if the acceleration is above/bellow a given threshold in order to choose the speed/direction for the motors.

BLYNK_WRITE(V0) {
  float y = param[1].asFloat(); // read y-axis acceleration
  float z = param[2].asFloat(); // read z-axis acceleration
  if (y > 0.5) {
    Serial.println("Turning left");
    digitalWrite(ENA,HIGH);
    digitalWrite(ENB,HIGH);
    digitalWrite(MOTORA_1,HIGH);
    digitalWrite(MOTORA_2,LOW);
    digitalWrite(MOTORB_1,HIGH);
    digitalWrite(MOTORB_2,LOW);
  }
  if (y < -0.5) { 
    Serial.println("Turning right");
    digitalWrite(ENA,HIGH);
    digitalWrite(ENB,HIGH);
    digitalWrite(MOTORA_1,LOW);
    digitalWrite(MOTORA_2,HIGH);
    digitalWrite(MOTORB_1,LOW);
    digitalWrite(MOTORB_2,HIGH);
  }
 if (z < -0.9) {
    Serial.println("Moving forward");
    digitalWrite(ENA,HIGH);
    digitalWrite(ENB,HIGH);
    digitalWrite(MOTORA_1,HIGH);
    digitalWrite(MOTORA_2,LOW);
    digitalWrite(MOTORB_1,LOW);
    digitalWrite(MOTORB_2,HIGH);
  }
  if (z > 0) { 
    Serial.println("Moving backward");
    digitalWrite(ENA,HIGH);
    digitalWrite(ENB,HIGH);
    digitalWrite(MOTORA_1,LOW);
    digitalWrite(MOTORA_2,HIGH);
    digitalWrite(MOTORB_1,HIGH);
    digitalWrite(MOTORB_2,LOW);
  }
  if ((y < 0.5) and (y > -0.5) and (z > -0.9) and (z < 0)) {
    Serial.println("Stop");
    digitalWrite(ENA,LOW);
    digitalWrite(ENB,LOW);
    digitalWrite(MOTORA_1,LOW);
    digitalWrite(MOTORA_2,LOW);
    digitalWrite(MOTORB_1,LOW);
    digitalWrite(MOTORB_2,LOW);
  }
}

If threshold values aren't exceeded, motors will stop.

Step 10: Blynk App #4 - Joystick

In this app I used a single joystick to control the robot. The speed of each track is defined deppending on x and y positions of the joystick. This way, it's possible to apply different speeds on each track, and move the robot with different speed/directions.

The code used here was derived from the following tutorial. Check it out!

https://www.impulseadventure.com/elec/robot-differential-steering.html

Step 11: Final Considerations

I put a lot of effort into this project, to make it as clear and educational as possible. If you liked it, please don't forget to 'like' and 'share' it. Your support is very important for me! :D

If you still don't follow my tutorials, take a look at those other projects on robotics! I hope you like them!

https://www.hackster.Io/IgorF2/joy-robot-robo-da-alegrIa-bba54f

https://www.hackster.Io/IgorF2/wIdc-wI-fI-controlled-fpv-robot-8f1e09

https://www.hackster.Io/IgorF2/nunchuk-controlled-robotIc-arm-wIth-arduIno-b1c0fa

https://www.hackster.Io/IgorF2/wI-fI-browser-controlled-robotIc-arm-89b63d

Please consider supporting my future projects with a small Bitcoin donation! :D

BTC Deposit Address: 1FiWFYSjRaL7sLdr5wr6h86QkMA6pQxkXJ