Introduction: Robotic Expressions Using Oled Display and ESP32
If you are here, then I can tell you that somewhere in your heart,you have love for robots and want to have one. Or maybe you just want to make a robot with somekind of expressions. That's exactly what you are going to learn today. I personally wanted to have a breadboard setup showing emotions and by watching it I can think about new ideas. It's really easy project and you can do it even if you have a little knowledge or beginner. You just need few things mentioned below. So I guess we should dive into it.
Supplies
Hardware
- 128 x 64 OLED Display 1306
- ESP32 (Mine is devkit V1)
- Breadboard and Wires
- A laptop
Softwares
- Arduino IDE
- Ezgif.com
- IrfanView
- OLEDanimations
Step 1: Converting Video to GIF and Frames
I searched on google and found this video really cool and thought to convert it into code and display it on OLED display. So, I downloaded it and uploaded it on ez-gif website, on tab named Video to GIF conversion.
Then Click on Convert, and it'll convert it into GIF.
Now without leaving tab click on Resize Icon in menu.
(Note: You can perform new action on your previously generated or converted result. This saves us from repeatedly uploading converted results again and again for new steps. So you can simply proceed forward to next step and perform task on your most recently conversion.)
Select the new size, Width of 128 px and Height of 64 px and click on Resize Image.
Once conversion is done, now we can apply some effect on our GIF.
Select effects from the menu
And Check the following boxes:(you can refer to image titled effects)
Color Preset: Grayscale
Replace Color with transparency: Black
And then click on Apply Selected
Once it's finished we'll be able to see the result in preview panel.
Now we can split this modified GIF into frames. For that we can click on Split icon.
And then simply click on Split to Frames and we'll be able to see individual splited frame.
Click on Download as ZIP folder for ease.
Now Extract the content into a new folder.
IrfanView
That's it our one part is done. Now we need will openanother software call IrfanView.
I'm using this software just because it'll rename the long name into something simpler and short. And also it'll convert our images into grayscale. And also if you are using different display then it can also change the dimensions. It can do batch conversions which saves our time. I know this all can be done by using EZ-gif website. but Rename part is missing in that. So that's the reason I used IrfanView.
Open IrfanView software and navigate to your extracted folder and click on Add All.
Click on Advance setting and check the following boxes. (Or you can refer to image titled as Advance setting)
Change color depth: 2 colors(Black and White)
and Negative
And if you want to resize your frames you can also do that from resizing image option.
And now select the Output Folder. where you want to export your output.
And click on Start Batch and let it get completed.
Now we can jump to next step.
So now we have fullu customized frames. Which basically are images. And we cannot directly display them on OLED display.So we have to convert them into C code. So for that purpose you can use different options. Like most famously Image to CPP software. But I peronally found this software OLEDanimation by VolvosProject very easy to use. He's a nice guy teaching about arduino on Youtube. He's a good teacher by the way.
So now just openthis software OLEDanimation.
And on Select Folder and navigate to the folder in which you stored your output from IrfanView software.
An it'll start generating code which you can copy and paste into your Arduino IDE. Or you can download from below.
Step 2: Circuit Diagram
It's a simple circuit.
Connect the wires:
VCC of oled to VCC of ESP32
GND of oled to GND of ESP32
SCL of oled to D22 of ESP32 which is SCL pin basically.
SDA of oled to D21 of ESP32 which is SDA pin.
Step 3: CODE
You can download the example file from below.
You'll also need to download library in arduino ide. You can do this by going to Arduino library manager and search for SSD1306 and install it. Most likely the second library Adafruit GFX gets downlaoded automatically as dependacy of the main library. But if somehow it doesn't.Then you can simply install it by searching for it in library manager again.
Then compile the sketch and upload it by selecting the Exact com port.
If you don't see your board in there then most likely it's your first time using ESP32.
In that case go to Board Manager and Search for ESP32 from there you can install it.
Then choose the board, in my case it is Esp32-DEVKIT-V1, and choose the port and upload it.
You can download it from my Github