Being an effective engineering team is often about making the right trade-offs. When our CEO proposed a 21 iPad video wall for Comic-Con San Diego everyone was excited at the ridiculousness of it. The initial excitement was tempered a bit by the timeline we were working with. With less than two weeks before the convention and plenty of “normal” work to do we we’d have to go the quick and dirty route. Once the wall was at the convention the result was going to be on display for thousands of people, ten hours a day, for three or more days. Flaky and unreliable was not an option.
“Real” solutions would involve tightly synchronized clocks or timecode. NTP is made for that purpose, but in the walled garden of iOS apps it wouldn’t be that simple. We’d have to maintain a clock/time in our app that synchronized to a central server frequently and then instruct the app to play a particular video at a specific time. Another option was to provide a syncing signal via the headphone jacks of the devices, but that involved hardware, something we didn’t really have the time to try. In the end, we decided on a simpler approach.
Our initial implementation used a multi-threaded server which connected to each client. The manager had a list of movies to play and the duration of those movies. It would loop through the videos, quickly sending out commands telling the clients to start playing, wait for the video to finish playing and then tell the clients what to play next. If the connections were quick and reliable enough it should work. Thankfully the human vision system is rather forgiving.
The truth is that it worked pretty well. The one change we ended up needing to make was to allow for the time it takes an iPad to load the video before playing. That was addressed by making it a two-step process. We first tell the the clients to prepare and then after waiting a sufficient amount of time, tell them to play the video. It’s not perfect. We’ll see a bit of skew on an iPad every once in a while, but you generally have to be looking for it and even then it’s not objectionable.
Our first content was a set of individually crafted videos with a counter on each screen so that we could detect drift. That’s not very interesting. Now we needed to cut up some video content to fit the wall. To do this we coded up a python script that crops a version of the source video for each iPad to play using avconv/ffmpeg.
There was a lot of drawing and annotating pictures involved with getting the slicing right. We went back and forth quite a bit trying to decide whether we should fit all of the source pixels in to the output videos or allow for the borders by dropping the pixels that fall behind them. The iPad has a huge surround, over 20% of the size of the screen itself. In the end we decided to go with dropping the pixels as there was too much distortion of the content when there’s a physical jump of 1¾” between rows.
At this point we had a working iPad video wall, but it wasn’t particularly fault tolerant, at least not enough to stand up to 10 hour days in a crowded (in terms of RF traffic) convention hall. The lack of time took away a lot of our options here. We thought about trying to connect the iPads over USB, maybe even using MIDI, but the route was a non-starter. Unfortunately USB hubs that can power multiple iPads are hard to come by so we’d lose the ability to charge the iPads while playing.
Once wired connections were ruled out we were left with the option of making the wireless connections as robust as possible. Stable is one thing, but they will never be fool-proof. To handle hiccups we spent some time making all of the code more robust. If an iPad drops out it will immediately start trying to reconnect so that it’ll be ready for the next round. There were several potential failure-cases and we had to look closely at each of them to ensure the iPad would retry as expected without beating the server to death. It’s not perfect, but good enough for a couple days of hack-a-thon style work.
We’re pretty proud of the results. If you’re at Comic-Con stop by our booth, #4902, and check it out. We have some great signings scheduled and you’ll be able to check out our app on our demo iPads. Otherwise we plan to open source the results once we’ve recovered from the event and had a little bit of time to clean up the code. Once we do the iPad Video Wall Code will live on github.