Note: If you don’t want to read all of this then what you are looking for is the last video on this page…
EDIT (Nov 12): A friend sent me this link. Someone else was apparently thinking the same way I was as far as the remote input goes: Tappity
When it came time to market Tap-Fu, we really wanted crystal clear video showing the gameplay. Normally this is done with Snapz or some equivalent screen capture software and the Simulator. The problem with this approach is that the Simulator doesn’t support multi-touch very well and Tap-Fu pretty much requires it.
So we tried a few different things and eventually came up with a unique solution.
Experiment #1: Tap-Fu Video Out
The “most obvious” choice was to just run out and get a video out cable from the nearest Apple store so we could connect it to a HD camcorder. Well, when we got it all plugged in we quickly came to the realization that it doesn’t automatically mirror the iPhone’s screen. As it turns out, the TV out is treated much like a second display. You need to draw to a UIWindow-like class in order to see anything at all. A quick google search turns up the following by Erica Sadun:
We render the game at 600×400 on an iPhone 3gs and our frame rates are quite decent. Easily fast enough to get a decent video.
However, the problem is that there is an digital to analog to digital conversion going on. The video starts looking fuzzy and the colors shift a bit.
iPhone->Analog->DV
Snapz screenshot on a Mac
Well, the capture isn’t too bad but it looks worse in motion. The Snapz captured one is there for reference, but keep in mind it’s still compressed. Anyway, back to the drawing board.
Experiment #2: Tap-Fu on Mac with controls from an iPod Touch
So at this point, recording the video via an analog process is clearly not going to work as we wanted. So we have to find a way to record our gameplay on a Mac or on the phone. The Mac seemed a bit easier. Programs like Snapz make recording video quite easy. The problem is that it’s impossible to do multi-touch… or is it?
…then it hit me…
All I need to do is get the multi-touch off of the iPhone into the Mac in real time. In a couple of hours I had a simple iPhone app (UDPJoystick, source code below) streaming the necessary information over UDP. Just type in the destination address and port and we’re good to go. The Mac side of the equation was also quite simple because our input system is abstracted away. I build a “UDP input” class and tested it out. It worked remarkably well!
(Now why didn’t I think of this BEFORE spending $55 on an Apple video out cable I wonder?)
So now I had the ideal solution. It’s unfortunate that the videos aren’t actual iPhone videos, but it’s pretty close to the real thing. Tap-Fu is frame rate locked at 30 FPS so gameplay isn’t changed at all by running it on a mac.
Now I have a solution to all of my problems… now what can I do? Geek time!
Experiment #3: Presenting the Tap-Fu Game Console
I wondered what it would look like combining both of these techniques. I loaded a combined Video Out/UDP Input version of Tap-Fu onto my 3gs and I stuck the UDPJoystick app on an iPod Touch, connected them wirelessly via wifi, and lo and behold I think I created the first iPhone game console complete with wireless controllers (as far as I know)! Enjoy!
It’s too bad Apple would never allow this stuff in their store. I’m sure they have a good reason though…
Source Code
- TW2UDPJoystick – Source code for the UDP Joystick App that sends UDP packets to a device.
