all micro contact rss

Dial in the Time: Fin 1.2

When I wrote my ten-part series on making your own app marketing videos, one of the first things I recommended was avoiding live footage. Take shots from the iOS Simulator, place them on top of still frames of iPhones and iPads, and animate them in Final Cut. Super easy to get professional looking results.

Live footage is very difficult to get right on a budget. Without professional lighting rigs and a good bit of expertise about how to shoot properly, the results could be devastatingly amateurish.

But there are some things that simply won’t look right in the Simulator. And the circle gesture in Fin 1.2 is one of those things. So pardon me as I talk for a moment about breaking my own rule.

First, a little background. Setting timers in most apps is actually more cumbersome than it should be. Even Apple’s own Clock app uses the UIPicker interface, which actually got worse in iOS 7, as far as ease of use goes. Fin always had common presets on the Settings screen, so you could easily get to 10, 20, 30, 45, etc. with one tap. Chances are, your performance slot is one of those presets, and if not you can at the very least pick the closest one and swipe your way up and down to the exact time you need.

But I always suspected that there was an even better way to go about setting the time. Then one day I got a message from Saul Mora, suggesting that it would be cool if you could swipe around in a circle to set the time. Bingo. Makes perfect sense. Clockwise to add time. Counterclockwise to subtract. Similar to setting an old grandfather clock.

Of course, I had no experience with custom gesture recognizers, and the math was bound to get tricky, with the ability to change the timer even after it was running, counting up vs. counting down, etc. But no matter. Once the seed of his idea hit my brain, it became obvious that this would be a great way to improve the user experience.

So I managed to figure out the code, after a few weeks of pain, and it was time to submit to the App Store. And man, was I excited. It was even better in practice than I had hoped. But I wanted to be sure people could see this new feature, as it’s yet another thing that reads poorly in a screenshot. So I decided to make a new video showing off the feature.

And then I realized that swiping in a circle would be just a little too silly looking in the simulator, with the fake finger overlay I used in the first Fin video. I needed to do some live video on this one.

The first and biggest challenge was lighting. I don’t own a professional lighting rig, so I needed to get as much natural light as possible, yet avoid heavy shadows. Fortunately, my apartment has nice large living room windows, and it’s winter, so slightly overcast days are quite common this time of year. I opened the shutters and set up a small serving table in the living room in mid afternoon.

Secondly, I needed to get the camera as steady as possible. Fortunately, I have two iKlips, one for the iPhone, one for the iPad. I could mount either device to a boom mic stand, and film the other device.

After a few test shots, I knew I could get it to look at least presentable. The trick was taking several of the exact same shots from several angles, on each device, so I’d have enough variety to change up the camera angle frequently. And to position the device so that there would be neither a reflection of the camera nor my windows showing on the screen. That took some practice, particularly with the iPhone shots, as I did those while holding the device in my hand. (The iPad I sat on a 12South Compass stand, so it was much easier to set the correct angle and forget about it.)

After shooting for about a half hour, I was confident I had the footage I needed. I uploaded the clips from both my iPhone and iPad, and I got to work in Final Cut.

Everything else I did the same way as I did for the previous Fin video. Text clips set up first to establish the pace, then the clips of the device. One interesting side note: My establishing shot of the device didn’t need to be a live one. I was just showing the ticking time, not a gesture, in that shot. So I used a Simulator shot. But I wanted it to match the look of the live footage, so I took a photo of my serving table from the living room, and compiled it with the simulator footage and an iPad device frame, to tie it together.

I also animated my live footage clips with the same Ken Burns style zooming that I used on the Simulator shots in the first Fin video. Just because my camera was stationary when I filmed the clips doesn’t mean it has to stay that way in post-production.

The end result is yet another marketing video done for the cost of a few hours of my time and equipment I already owned. And it really sells the new circle gesture way better than any screenshot could. The live footage isn’t as polished as I’d like, of course, but it gets the job done.

I encourage you to experiment with making videos for your own apps. If you can get enough natural light, and you avoid the pitfalls of a shaky camera, strong shadows, and screen reflections, you can get decent results and really impress your potential customers.

Fin 1.2 is now available on the App Store.