Introduction: Adding a Digital Face to the Modified Baby Monitor

About: I'm a retired Electrical Engineer, now pursuing autonomous robotics

After having "upgraded" the Baby Monitor to the Arduino stepper control, I wanted more than just the "pretty face" I attached initially, which was just a paper face (a place holder).

I decided I wanted a digital face, one that I could program appearances on, and possibly change (react) to inputs.

I had a couple of Arduino MicroView displays that I evaluated, and I actually had reserved for this type of purpose. This would allow for an animated face, either the whole face or just eyes. Because of the small size of the display (a 64x48 pixel OLED display), I decided to consider more the eyes and less the face. A redeeming factor was that in the heart of MicroView there is:

  • ATmega328P. 32KB Flash Memory.
  • Arduino IDE 1.0+ compatible
  • 64x48 Pixel OLED Display
  • 3.3V - 16V DC Input
  • 12 Digital I/O Pins (3 PWM) 6 Analog Inputs
  • Breadboard Friendly DIP Package

The MicroView can operate without any external components other than a power supply. Besides being a graphic display, the MicroView is 100% code compatible with Arduino Uno (ATmega328P version), meaning the code that runs on an Arduino Uno (including Nano) will also be able to run on the MicroView. The key to using this with the stepper motor was that it had enough I/O pins, as well as not exactly matching the pin-outs.

With all that in mind, let's move forward with 3 sections:

  1. modify the "face" to have OLED graphics
  2. transfer the code from the Nano to the MicroView
  3. enhance the graphics with animation

Step 1: What You Will Need - Hardware and Tools

You will need:

Hardware:

Tools:

  • knife or razor saw
  • file

.

Step 2: The Prototype - Learning About the MicroView - Hardware

I wanted to use the Arduino MicroView because it seemed to be the correct size to fit inside the top of the baby monitor, plus it had programmable text and graphics.

In the heart of MicroView there is:

  • ATmega328P
  • 32KB Flash Memory
  • Arduino IDE 1.0+ compatible
  • 64x48 Pixel OLED Display
  • 3.3V - 16V DC Input
  • 12 Digital I/O Pins (3 PWM)
  • 6 Analog Inputs
  • Breadboard Friendly DIP Package

Since the pin-outs didn't exactly match between the Nano and the MicroView, I choose 4 pins next to each other for the stepper pins. For my choice, it was analog pins A0, A1, A2 and A3. At first, I wasn't sure if the analog pins would work because the initial code used digital pins.

Since the bottom of the MicroView had breadboard-compatible pins just like the Nano, all I had to do was move the wires. Since that was compatible with a standard Arduino using the MicroView programmer, the connection wires and the USB cable, this all allowed connection for programming. In fact all the had to be done was change the board choice from the Arduino Nano to the Uno (it's more compatible with the Uno per the programming directions.

But, sure enough, the analog pins worked just fine. By trying this in the Prototyping step, I was able to make sure the stepper portion of the code would work with the MicroView.

So now, we should have a Baby Monitor stepper motor working from the MicroView.

Step 3: The Prototype - Learning About the MicroView - Software

First, I started with the Arduino Nano and software from my previous Instructable (https://www.instructables.com/id/Converting-a-WiFi-Baby-Monitor-to-Arduino-Control/).

Next, I wanted to learn to do graphic eyes. I also wanted to do animated eyes (blinking and optionally looking left and right). First up, because I’m not an artist, was to find if there was any eye graphics already available for the MicroView. There wasn’t but there was graphic capability. Searching for MicroView graphics, I found a website that was perfect to learn from (https://evermorestud.io/microview-graphics/). It takes one through all the steps needed to get graphics and animation onto the MicroView. It did require loading a couple of additional editing programs to manipulate the files however. This included the gimp, ImageJ, jEdit. I also incorporated Excel as a text editing tool.

I then searched the internet for graphics with potential animated eyes and, of course, there were millions! I wanted a site that would provide simple, free eye graphics that could also be easily modified to what I wanted. I finally settled on this selection (from http://www.freepik.com/free-vector/eyes-drawing-c... and choose the upper left corner set of eyes.

I then started modifying the selected eyes to give me the versions I wanted (open, half-closed, closed, looking left and looking right). I used a pixel editing program (ImageJ) to change the graphics, with the results shown above. By following the steps outlined from the website (https://evermorestud.io/microview-graphics/), I was able to load initially 3 sets of graphics (Eye Graphic, HalfClosed Eye and Closed Eye). Later I added the remaining 2 graphics (Looking Left and Looking Right).

They look like:

  • “ uView.pixel($1,$2)”;
  • .
  • .
  • .
  • “ uView.pixel($1,$40)”;

This is part of a larger text file, and is a whole lot of them. Actually, it ended up being the initial 3 separate text files that would be pasted into the Arduino code, with each separate group being called in the “loop” portion of the code. By varying the amount of the "Delay", different timing of each graphic made for a good continuous animation.

Step 4: Modify the "Pill Cap" to Mount the MicroView

{"context":{"location":{"href":"https://www.instructables.com/editInstructable/publish/EYDVGAYJ1CENE4D","origin":"https://www.instructables.com","protocol":"https:","host":"www.instructables.com","hostname":"www.instructables.com","port":"","pathname":"/editInstructable/publish/EYDVGAYJ1CENE4D","search":"","hash":""},"jQuery110201502625568010525":1,"b":{"jQuery110201502625568010525":20,"sizzle-1492443123688":{"parentNode":["1024 46",45]}},"h":{},"gtmHasClickListenerTag":true,"gtmHasLinkClickListenerTag":true,"gtmLinkClickListener":true},"selector":"#editor-Object-62"}

Step 5: The Code of the Project - Enhance the Graphics to Animated Eyes!

The initial code to drive the stepper from the MicroView is essentially the same as the Nano version. This allowed for turning the head left or right, and resting at "home", looking forward.

Next, I wanted to learn to do animated eyes. I wanted eyes blinking and additionally, looking left and right. First up, because I’m not an artist was to find if there was any eye-type graphics already available for the MicroView. There wasn’t but there was graphic capability. Searching for MicroView graphics, I found a website that was perfect (https://evermorestud.io/microview-graphics/). It takes one through all the steps needed to get graphics and animation onto the MicroView. It did require loading a couple of additional editing programs to manipulate the files however. This included "the gimp", "ImageJ", "jEdit". I also incorporated Excel as a text editing tool.

I then started modifying the selected eyes to give me the versions I wanted (open, half-closed, closed, looking left and looking right). They ended up being:

  • Eye Graphic
  • Half Closed Eyes
  • Closed
  • Looking Left
  • Looking Right

I updated the Arduino example code to call the graphics:

  • void loop () { //display eye graphics in an animated way
  • frameOne(); //eyes open
  • delay(2000);
  • frameTwo(); //eyes half open
  • delay(100);
  • frameThree(); //eyes closed
  • delay(200);
  • frameTwo(); //eyes half open
  • delay(100);

}

When this code is run, now the the above delays, the eyes look like they're blinking

Step 6: Final Result

The above video shows the results.

If you look closely, there's a FPV (First Person View) video camera mounted on top of the rotating head. This gets its panning motion from the head, and when the entire assembly mounted on my robot, I now have FPV of what the robot sees.

If you make your own Panning - Animated Face, post your "I made it" in the comments below!


If you enjoy this tutorial, please consider voting for this instructable in the contests!

Robotics Contest 2017

Participated in the
Robotics Contest 2017

Microcontroller Contest 2017

Participated in the
Microcontroller Contest 2017