Turn your favorite character into a hologram! Strap a PyPortal to a continuous rotation servo and watch in awe. With a few edits and some formatting, you'll have floating animations in no time.

In this guide we'll go through an example of our own animation starring Blinka, the CircuitPython mascot.

We have a custom 3D printed enclosure you can use as a "vertical holder" which attaches to the servo.

To display the graphics and project onto the hologram module, you can also use a smart phone, or tablet, however you won't be able to attach to the servo to rotate freely
Adafruit PyPortal - CircuitPython Powered Internet Display
PyPortal, our easy-to-use IoT device that allows you to create all the things for the “Internet of Things” in minutes. Make custom touch screen interface...
Out of Stock
PowerBoost 1000 Charger - Rechargeable 5V Lipo USB Boost @ 1A
PowerBoost 1000C is the perfect power supply for your portable project! With a built-in load-sharing battery charger circuit, you'll be able to keep your power-hungry...
$19.95
In Stock
Continuous Rotation Servo
This servo rotates fully forward or backwards instead of moving to a position. You can use any servo code, hardware or library to control these servos. Good for making simple moving...
$11.95
In Stock
Fully Reversible Pink/Purple USB A to micro B Cable - 1m long
This cable is not only super-fashionable, with a woven pink and purple Blinka-like pattern, it's also fully reversible! That's right, you will save seconds a day by...
Out of Stock
STEMMA JST PH 3-Pin to Male Header Cable - 200mm
This cable will let you turn a JST PH 3-pin cable port into 3 individual wires with high-quality 0.1" male header plugs on the end. We're carrying these to match up with our...
$1.25
In Stock
Breadboard-friendly SPDT Slide Switch
These nice switches are perfect for use with breadboard and perfboard projects. They have 0.1" spacing and snap in nicely into a solderless breadboard. They're easy to switch...
$0.95
In Stock
Lithium Ion Polymer Battery - 3.7v 1200mAh
Lithium ion polymer (also known as 'lipo' or 'lipoly') batteries are thin, light and powerful. The output ranges from 4.2V when completely charged to 3.7V. This battery...
Out of Stock
Black Nylon Machine Screw and Stand-off Set – M2.5 Thread
Totaling 380 pieces, this M2.5 Screw Set is a must-have for your workstation. You'll have enough screws, nuts, and hex standoffs to fuel your maker...
Out of Stock

Circuit Diagram

The diagram below provides a visual reference for wiring the components. This isn't true to scale, it is just meant to be used as reference. This diagrams was created using Fritzing software.

Adafruit Library for Fritzing

Use our Fritzing parts library to create circuit diagrams for your projects. Download the library or just grab the individual parts. Get library and parts from GitHub Adafruit Fritzing Parts.

Wired Connections

Slide switch to PowerBoost

  • Switch to enable and ground

Servo to PyPortal

  • Ground to ground (D3)
  • Signal (D3)
  • Voltage to voltage (D3)

Battery to PowerBoost

  • JST to JST port

PyPortal to PowerBoost

  • Ground to ground (D4)
  • Voltage to voltage (D4)

First up, find an animation you'd like to turn into a hologram.

You can use videos or GIFs.

In order for the hologram to work properly, try and find something that is a stand alone object or character rather than a landscape etc. If you can get the subject to be against a black background, that helps too.

Giphy has some great options to choose from.

If you can find multiple angles of the animation that is a huge plus, but if not, the same graphic can just be rotated for each angle.

Please make sure the animation is in GIF format.

If the animation is a video file, you can convert it to GIF format with ezgif.com. Head here to convert video to a GIF. Simply upload the video file, make any changes you might want and output as a gif. You can right click and save the file somewhere handy.

We will be using the below GIFs to make the hologram animation featured in the guide.

GIF placement

We're going to use Google Slides to place the GIFs the in the right orientation for the hologram.

If you have a Google account head to the Slides site.

If you don't have a Google account you will need to make one to use Slides.

Under "Start a new presentation", click "Blank"

Delete the default text elements and change the background of the slide to black.

Orient the GIFs

Drag the GIFs onto the slide.

Orient them accordingly. They must be opposite and equidistant from each other as best as possible. 

Screen recording

Take a screen recording of the GIFs playing for 2 seconds or so.

If you have a Mac you can use QuickTime to screen record. For PC you can use Apowersoft's screen recorder or another free screen recorder of your choice.

Create the GIF

  • Head to ezgif.com and select "Video to GIF"

  • Upload the video, and click "Convert to GIF"

  • Next click the "resize" tool

  • Change the size of the GIF to 320 (height) x 240 (width) and click "Resize image"

  • Lastly save the GIF somewhere on your computer

Below is the GIF we made for the guide, if you'd like to use for an example hologram. Right click the GIF and save it somewhere handy on your computer.

Next we'll prepare the PyPortal to upload the GIF.

Upgrade Firmware

Let's get the PyPortal setup with latest firmware. The simplest way is to download the UF2 file from circuitpython.org and drop it on to the PORTALBOOT drive.

  • Plug in your PyPortal via a known good data+power USB cable.
  • Double press the reset button and wait for the NeoPixel to turn green.
  • The PORTALBOOT drive should show up on your computer. 
  • Download the UF2 file below and drop it onto the root of the PORTALBOOT drive. 

Loading GIFs

The drive will automatically reboot and load as a USB drive titled CIRCUITPY. Open the drive and create a new folder named gifs. Download our demo images and drop them into the gifs folder. 

Playing GIFs

Make sure you have added all of your desired gifs to the folders. After that, you will need to download the GIF_SERVO.UF2 file below. 

  • Double press the reset button and wait for the NeoPixel to turn green.
  • The PORTALBOOT drive will show up on your computer.
  • Upload the GIF_SERVO.UF2 file to the PORTALBOOT drive, making sure you rename the file to code.py.

GIF Configuration

The screen should turn blue with a dialog box and text. By default, the GIF player uses a configuration file that lets you specify how to play back the GIF. The configuration file can be optional, but if you'd like to use one use the link below to get it. It's not necessary, so press the TAP icon to proceed and play back your GIFs.

3D Printed Parts

Parts are designed to be 3D printed with FDM based machines. STL files are oriented to print "as is". Parts are listed below with file name and description. Parts require tight tolerances that might need adjusting slice setting. Reference the suggested settings below.

Slice Settings

Use these settings as reference. Values listed were used in Ultimaker's CURA 3.X slicing software.

  • 0.2mm Layer Height / 0.4mm nozzle
  • 0.4mm Line Width (inner & outer widths)
  • 40mm/s printing speed
  • 20% infill
  • Supports: No
  • Brim Line Count: 5

Prep Wires

I used two JST PH 3-Pin to Male Header Cables, one to solder to the PowerBoost and the other cables to connect the servo.

For the PowerBoost cable, we'll only need the red and black wire. I removed the third white wire. Trim and tin the ends of the red and black wires.

Solder PowerBoost

Solder the red wire to the + side and the black wire to the - side of the PowerBoost.

 

Prep Slide Switch 

We can add a slight bend to the slide switch pins so it can sit on the back of the through holes on the PowerBoost. I then trimmed off the third pin to easily fit it on the board. 

Solder Slide Switch

Tin the EN and GND on the PowerBoost and then solder the slide switch into place.

 

PyPortal Standoffs 

We'll need to elevate the PyPortal so it can sit over the PowerBoost and Battery. I used 8mm long nylon standoffs with 5mm M2.5 screws to the mounting tabs on the PyPortal.

Mount PowerBoost

Align the printed PyPortal mount to the reset button cutout. The PowerBoost mounts with the USB port pointing out so we can easily access it for charging the battery.

I used M2.5 5mm screws to mount the PowerBoost.

Mount Battery

Orient the battery so the wires can plug into the PowerBoost. Plug the battery into the Power Boost and the wire on the PowerBoost to the D4 port on the PyPortal. 

Mount PyPortal

Align the PyPortal with the printed mount and use four more M2.5 5mm screws to secure it to the mount.

Servo cable

Pass the JST cable for the servo through the printed mount and connect it to the D3 port on the PyPortal. 

Mount and connect servo

Align the servo with the wire cut out on the walls on the printed mount. 

Plug the male ends into the female ends of the servo. The white wire connects to the orange wire on the servo. Black connects to brown and red connect to the red wire on the servo.

Servo horn

The servo includes a circular horn that press fits into the servo. I wrapped the excess wires around the servo body.

Horn base

The circular servo horn is then press fitted into the larger printed circular base. 

Place Cover

To prevent light leaking on the sides of the PyPortal, we can place the front cover of the display.

Servo Speed 

If your servo has a Potentiometer, we can adjust the speed and direction with a screw driver.

Complete!

Fit the prism in the center of the hologram graphics so the four quadrants align and reflections can project on each side of the prism.  

 

To try out the hologram, place the projector prism on top of and in the center of the screen with the animation.

If the hologram is faint, try turning the brightness up on the screen or moving some place darker.

Smart Phone / Tablet Examples

Here are a couple of slick examples from the Spectre website to test out your prism with a phone or tablet.

Robot

Temporarily unable to load embedded content:
https://www.youtube.com/watch?v=MhIpGQl5g_A

Rocket

Temporarily unable to load embedded content:
https://www.youtube.com/watch?v=MhIpGQl5g_A

Bee

Fairy

Octopus

For more info, here's a video from Specre on how to use the prism:

This guide was first published on Oct 22, 2019. It was last updated on Oct 22, 2019.