PopBalloons and making Demonstration Videos
Posted March 8th, 2009 by NickBackground
While learning how to use the microphone on the iPhone to record I thought a quick and fun iPhone Game which leverages the microphone on the phone.
There’s lots of apps out there that take advantage of the accelerometers, but not too many that use the microphone as a control device. In PopBalloons you control a laser that floats around the screen (using the accelerometers, of course
, but to fire the laser you need to make a sound. A snap, a click, sing a song, whatever. The intensity of the laser is directly proportional to the intensity of the sound that the iPhone hears. You can even slightly tap the microphone with your finger, if you really need to be quiet.
As an added bonus, I cartooned up some LOL cats, and instead of popping balloons with your sound-laser, you can pop LOL-CATS! I know, it’s brilliant. More information on PopBalloons, and all of my future mobile phone apps can be found at the website of my new company, Mophilia, Inc.
Demonstration Videos
The real point to this post is to demonstrate how to make a crude demonstration video of a live-action game. My first thought was to take screenshots using the screen shot function and then string them into a video.
UIImage *viewImage = [UIImage imageWithCGImage:screen];
CGImageRelease(screen);
However, the process of getting the screen shot and saving it takes way to long and eats up too much memory to be run at full speed. So it occurred to me, that since the game is being triggered by timers which are on the order of 30fps then I could slow the game down and take screenshots between the frames. For example, if I slowed the entire gameplay down to 10fps then I could take screenshots at that rate and not run into memory issues. So in my PopBalloons_Prefix.pch file I have this:
#define PopBalloonsMasterFrequency 10
All of the rest of the frequencies are based on this one. So if I have a timer that normally runs at 20fps I would simply redefine the frequency like this:
#define kUpdateFrequency ((2./3.)*PopBalloonsMasterFrequency)
Now I can arbitrarily slow down my entire game so that I can do CPU and memory taxing procedures. In case you are interested I save the images to file using:
if (![imgData writeToFile:filePath atomically:NO]) {
NSLog(@”Failed to write the image data to file.”);
}
Where filePath is an NSString object that contains the full path to the destination file and viewImage is a UIImage object from the code above.
Encoding the PNG files into a Video
Now that I have a whole bunch of images I need to encode them into a movie. I use mencoder to do this. Mencoder comes with MPlayer which can be installed using Darwin Ports.
Note you need to have /opt/local/bin set in your PATH file.
I wanted the video to include an image of the phone, so it the game looks like it is being played. To do so I just used Grab to take a screenshot of the simulator and saved that file as PhoneImage.png in the same directory as my screenshot files. Now I can use some a handy python script to combine the images and generate what will be the frame for my video.
from PIL import Image
phone_image_name = ‘PhoneImage.png’
file_names = [f for f in os.listdir('.') if not os.isdir(f) and not f.split('_')[-1] == ‘done.png’ and not f.split(‘.’)[-1] == ‘py’ and not f in [phone_image_name] and not f[0] == ‘.’]
for file_name in file_names:
phone_image = Image.open(phone_image_name)
im = Image.open(file_name)
phone_image.paste(im, (63,160))
phone_image.save(file_name.split(‘.’)[0] + ‘_done.png’)
After the images are converted I just delete all the old files and then string them together to make a video using mencoder:
The product of this is the following video:
As you can see it’s far from perfect. It’s a little shaky and you can see the flicker of the text prompt in the Text Field, but as a first pass it will do.
-Spicy
Tags: Development, iphone, news, videos
2 Responses to “PopBalloons and making Demonstration Videos”
March 8th, 2009 at 7:42 pm
…………….customize?……
March 8th, 2009 at 7:42 pm
Not to disappoint you or anything…
Leave a Reply