How do you build a fun, interactive, and engaging demo for Google Cloud Platform? For the Google Cloud Platform Next events, Bret McGowen, Francesc Campoy, Kathy Kam, and Ray Tsang were on a mission to do exactly that. Instead of a software demo that only runs on a presenter’s screen, we wanted to build a physical exhibit that was interactive, educational and—most importantly—fun!
We also wanted the demo to be widely accessible. It needed to be something people could build at home, even those who couldn’t go to the event could try it out. To make the demo reproducible, we used:
- Open source software—so anyone can use and contribute to it
- Off-the-shelf components—so the hardware is inexpensive and easy to obtain
We started off with the idea of a photo booth, but we wanted something more fun and challenging. We agreed on a photo booth that can rotate an image through 180 degrees, producing a three-dimensional effect. Our project, Cloud Spin, uses 19 Android phones set 10 degrees apart in a half-circle.
When you step into the center of the half circle, all of the Android phones will capture a still image at exactly the same moment, like these:
The Cloud Spin software running in Google Cloud Platform then compiles all the images into a single 180-degree animated GIF.
You can find more Cloud Spin animations on our Twitter feed: @googlecloudspin.
We’re in the process of releasing the source code. Our hope is that you can get together with 18 of your friends (and their smartphones) to make your own Cloud Spin animations.
Over the next few weeks, we’re going to take you through how we built Cloud Spin.
The First Challenge
When you tell an Android phone to take a photo, there can be a delay before the phone actually takes the photo. Having all 19 phones capture the exact same moment is nearly impossible. To make the animation as smooth as possible, the photos must be taken within a 20-millisecond time period.
Since instructing the phones to take a single, simultaneous, photo wouldn’t work, we had the phones capture an 8-second, 30-frames-per-second video starting at approximately the same time. This ensures that each video has frames that overlap the same moment in time.
Next, we needed a way to identify the exact instant to use as the GIF, and extract the frames for it from across the 19 different videos. We considered a number of methods to identify the frames, including using simple timestamps, image-recognition algorithms, or a standard camera flash. We considered the pros and cons of each method and in the end, we settled on a simple solution—an audio cue.
Clapperboards have had a long history in the movie industry. The bang from slamming down the hinged stick helps movie editors synchronize videos taken from different cameras. We didn’t have a clapperboard, so as you jump into the air, the Cloud Spin operator presses a button on a tablet to generate a short audio beep (2600 Hz) that’s recorded as part of each video:
We can then analyze the audio stream of the video to find the beep and map that to the video frame. Matt Condon, a summer intern at Google, helped us develop the initial Python code. He used Numpy and MoviePy to analyze the audio stream from each video and extract the frame that contained the audio beep.
Then we stitched together the frames from each Android phone with ffmpeg to produce a spinning animated GIF.
Because we could be taking hundreds of Cloud Spin videos in a single event, we needed to design an architecture that could scale to meet the demo’s compute demands.
We used several Google Cloud Platform services to orchestrate video recording on all 19 phones, store the Cloud Spin videos, locate the shared frame and stitch together the animated GIFs.
By running our apps on a managed infrastructure, we could focus 100% of our time on writing code and developing the demo experience. Ultimately, we created an interconnected system composed of four Android applications, one web-based application, and three backend processes in only three weeks.
In the next installment of this series, “Cloud Spin, Part 2: Building mobile apps to orchestrate video recording,” Bret McGowen will describe how we:
- Orchestrated video recording on all 19 phones with Firebase
- Recorded and saved the video using the Camera API
- Uploaded the video to Google Cloud Platform for processing
On behalf of all of us, we hope you’ll find the Cloud Spin blog series informative, useful and fun.
– Posted by Ray Tsang, Google Cloud Platform Developer Advocate
Feed Source: Google Cloud Platform Blog
Article Source: Cloud Spin Part 1: 180-degree animations on Google Cloud Platform