Creating graphics for Game Frame is a lot of fun. I recommend starting out by creating a single frame to get the basics. Then move on to a simple animation, and finally explore some of the power that comes with advanced animations. This guide will walk you through those steps.

Single Frame

In your favorite image editor (I use Photoshop), create  a 16×16 image. If you want, you can find plenty on Google by searching for the exact resolution. Save this graphic as a 24-bit BMP file, and name it 0.bmp. (That’s zero-dot-bmp.) Then create a new folder on your Game Frame microSD card (name it whatever you want), and drop your graphic in there. You’re done! Pop the microSD card into Game Frame, and depending on your playback settings it will eventually show the graphic you created.

Animation

Creating an animation isn’t much more work. At the basic level, all you need to do is add more graphics to the same folder as above and increment the file names (i.e. 1.bmp, 2.bmp, 3.bmp, etc.). If Game Frame detects more than one image, it will cycle through the images over and over again, until the system time elapses and it progresses to the next folder on the microSD.

Advanced Animation (CONFIG.INI)

The above works fine, but what if you want to speed up the animation or make it move across the screen? That’s when we add one last file to the folder called config.ini. The best way to do this is to copy this file from a pre-existing folder, and then edit it as necessary. Alternatively, I’ll post an example here.

# All of these settings are optional.
# If this file doesn’t exist, or if
# settings don’t appear in this file,
# Game Frame will use default values.

[animation]

# milliseconds to hold each frame
# (1000 = 1 sec; lower is faster)
hold = 100

# should the animation loop? If false,
# system will progress to next folder
# after the last frame is displayed.
loop = true

[translate]

# move the animation across the screen
# this many pixels per frame. Experiment
# with positive and negative numbers for
# different directions.
moveX = 1
moveY = 0

# should the movement loop?
loop = false

# begin/end scroll off screen?
panoff = true

# optionally dictate the next animation
# EXAMPLE: nextFolder = mspacman
# nextFolder = defend1

A discussion of this file can be found in the forum on this thread.

Leave a Reply