ESP32-CAM RC Car with Camera and Mobile Phone Controller

ESP32-CAM-RC-Car-With-Camera.jpg

Retro-fitting a toy radio control car with an ESP32-CAM to enable Wi-Fi control and video streaming on a mobile phone

This tutorial is fairly advanced and more of an experiment than a finished project. Hopefully there are some ideas and code to learn from that might help with a similar projects.

I bought a cheap radio control car from a local toy shop with the intention of converting the normal radio control elements to a system using an ESP32 micro-controller communicating over WiFi. The ESP32-CAM used in this tutorial features WiFi and a camera so a video stream can be sent from the car.

Unfortunately the ESP32-CAM suffers from a lack of usable pins. I have only found two pins that can be used as outputs so some workarounds and compromises have been made in the design. One pin is used for steering and the other for forward speed control.

Conventionally to control an RC car you need to be able to set four different things, steer left, steer right, go forward, go reverse. The RC car I used doesn’t have analogue steering, it’s just left or right so I used servo motor to push limit switches to turn current on and off to the steering motor.

A motor controller needs two free pins so a reverse signal can be sent in addition to a PWM signal to control speed. However after using one pin for steering there is just one pin left on the ESP32-CAM so while the forward speed can be controlled there’s no way to tell the motor to go the opposite direction.

A possible solution that I haven’t investigated is to add another micro-controller to the system. This could receive data from the ESP32-CAM via the two available pins and parse this data in another Sketch that outputs over multiple pins . For example the ESP32-CAM could output data on a pin in the range 0 to 100, a Sketch on the second microcontroller would interpret the data in the range 0 to 50 to be reverse speeds and 51 – 100 to be forward speeds and activate output pins appropriately.

RC Car Hardware Components

These are the components installed in the RC car. I used 3.3v volts to power the ESP32 with a step down module to make the voltage from the 4 AA cells more stable . The steering is controlled by the two limit switches which make one or other side of the motor live when activated. The limit switches are pushed closed by a servo motor. The motor controller receives a PWM signal from the ESP32 and controls the motor speed.

ESP32-CAM
ESP32-CAM
3.3v Step Down
3.3v Step Down
Motor Controller
Motor Controller
Servo Motor
Servo Motor
Limit Switches
Limit Switches

A closer view of the steering system with the servo and limit switches. When the switches are in the position below, both sides of the steering motor are connected to negative side of the battery. When the servo pushes a limit switch closed, that side of the steering motor is connected to the positive side of the battery.

Servo and Limit Switches

I used a fish-eye lens with a longer cable for the camera. There are various replacement cameras available from here: https://es.aliexpress.com/item/32981773363.html

Longer Camera Cable
Fish-Eye Camera in Hood

This is how it looks assembled. The red and black wires top left are normally connected to the power connector block next to the steering motor.

RC Car Internals Labelled

This is how I wired it all together:

ESP32-CAM WiFi RC Car Wiring Diagram

The car’s speed and steering are controlled using a touch interface on a mobile phone or tablet. Below the the touch interface is a live view from the camera.

Wi-Fi Car Touch Interface

RC Car Sketch

If you’ve not used the ESP32-CAM before you will need to read through this tutorial first – https://robotzero.one/esp32-cam-arduino-ide/ to get familiar with it.

The ArduinoWebsockets and ESPAsyncWebServer libraries need to be installed for this Sketch…

Library Manager ArduinoWebsockets

ESPAsyncWebServer: I’m not sure whether this library has to be used but during the process of developing this project I appeared to have problems with other web server libraries so I ended up with this one. You have to install it manually by copying it to the Arduino libraries folder. https://github.com/me-no-dev/ESPAsyncWebServer

The index_html_gz variable below is the code for the controller interface. If you want to edit this code see this tutorial: https://robotzero.one/esp32-cam-custom-html/

The code uses Web Sockets to stream the camera data to the browser:

client.sendBinary((const char *)fb->buf, fb->len)

and also receive control data from the touch interface on the mobile or tablet:

void handle_message(WebsocketsMessage msg) { // do stuff}

Project Demonstration Video

In there’s a lot of interest in this project (coffees!) I’ll work on a simpler version with a 3D printed chassis with servo control for steering and foreward/reverse and space for the ESP32-CAM to be located without bending pins etc.

You can also find this project on YouTube here: https://youtu.be/BwsH1kLxDmQ

References

Touch Interface: https://www.kirupa.com/html5/drag.htm

11 Replies to “ESP32-CAM RC Car with Camera and Mobile Phone Controller”

  1. rob says:

    Nice project. Have you ever tried the DRV8871 DC motor drivers? They are MOSFET based and have a lower voltage drop and better performance , price wise very similar.

    1. WordBot says:

      Maybe for another project but it looks like the DRV8871 needs a minimum of 6.5v. The ones I used are a quarter of the price and work from 2v – https://aliexpress.com/item/32920407851.html

      1. rob says:

        Ahh. Yes, you are right about that, there is also a low voltage dual channel version , DRV8833.
        Thanks for the great write up.

  2. Anderson F says:

    Very nice project. I just would like to see the code responsible to send commands when we move the button. Could you tell where I can found it ?

    Or you just uploaded the https://github.com/me-no-dev/ESPAsyncWebServer and verything started to works ?

    Thanks.

    1. WordBot says:

      The HTML etc for the interface? It’s in this variable index_html_gz in the code. There’s a little explanation in the tutorial. You can also view source in the browser to view it.

  3. Francisco Valladares says:

    I want to congratulate you on your work, you can share the html, since I would like to modify something in the code, I am thinking of implementing it in an ESP32 wrover without a camera, sorry for the translation, my English is not very good

  4. Yigit says:

    https://robotzero.one/esp32-cam-custom-html/

    This website you gave shows how to edit the html for your own file but you didnt give us the code you used which has the joystick.

    Can you upload that too?

    Very nice tutorial btw.

  5. Enn says:

    Nice work send you some coffe 🙂
    Modfied html and triyng to understand the code!
    Q: What is the number 8191

    1. WordBot says:

      Thanks for the coffee! That part of the code comes from here: https://github.com/espressif/arduino-esp32/blob/master/libraries/ESP32/examples/AnalogOut/LEDCSoftwareFade/LEDCSoftwareFade.ino you can see where the number comes from. I don’t 100% understand it all through.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

scroll to top