Understanding the Sifteo Cube Asset Workflow: Graphics

Sifteo cubes are a fantastic new way to game.  So fantastic that I want to make new games for them!  So I will document what I learn about them here.


Here are my abbreviated notes from the Sifteo developer’s page

Graphics are always in lossless format, png is preferred.

Cube basics:

Our displays are 128×128 pixels, with a color depth of 16 bits per pixel. This format is often called RGB565: it assigns 5 bits to red, 6 bits to green, 5 bits to blue.

Putting an image into your program:

stir is a tool that uses the assets.lua config to generate C++ code for the game. Your .lua will look like this:

GameAssets = group{}

Background = image{"stars-bg.png", quality=9.85}
Star = image{"star-8.png", pinned=true, width=8, height=8}
Font = image{"font-8x16.png", pinned=true, width=8, height=16}

What does each part mean?

  • The parts of the asset group called GameAssets will be compressed together, and loaded together.
  • “width = x” and “height = y” specifies values which otherwise default to the native LCD width and height in a frame
  • “pinned = true” means the tiles of this graphic are pinned together sequentially – this is mandatory for sprites.
  • “quality = n” means you can compress the image to some value between 1 (compressed) and 10 (lossless).
  • “flat = true” means show the whole uncompressed image not the default compressed version.  It is like specifying “quality = 10”.  How are they different?
      • Background = image{“stars-bg.png”, quality = 10} creates a lossless image of type AssetImage.
      • Background =  image{“stars-bg.png”, flat = true} creates an uncompressed image of type FlatAssetImage.
      • These are different asset types.  One is compressible, the other is uncompressible.  This is important for memory usage! One uses a single memory slot that gets referenced every time the asset is used, the other will take up a memory slot every time.  For instance if I had AssetImage a and FlatAssetImage b, for a list {a,b,a,a,a,b,a,b} I will use 4 memory slots: 1 for a, and 3 for each time I listed b. PinnedAssetImage and FlatAssetImage both use memory this way.

How do I do an animation?

For multiple frames, lay them out contiguously (one after the other) in the source image.  Order is important.  You can specify width or height to indicate the size of a frame within your image.  stir will divide your image into a grid of frames, and its frames attribute will be calculated from left to right, top to bottom.  It processes blocks of 8×8 tiles per frame.  If an 8×8 block of AssetImage is a duplicate, it will reference the original memory slot.

How do I use stir?

stir provides several options to configure its execution. These options are integrated into the default Makefiles that ship with the SDK, but you may wish to integrate stir into your workflow in other ways.

Option Meaning
-h Show a help message and exit
-v Enable verbose output
-o <myproof>.html Writes an HTML image proof to <myproof>.html – open this up in your web browser
-o <assets.gen>.cpp Generates C++ source data for your assets to <assets.gen>.cpp – include this file in your build
-o <assets.gen>.h Generates C++ header data for your assets to <assets.gen>.h – include this file in your build
VAR=VALUE Define a Lua script variable, prior to parsing the script

Asset lists, Audio, and Trackers are described on the SDK page


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s