VASSAL 4: Image format and cutout support

I’m beginning to write up some more detailed requirements for VASSAL 4 now. Below, I discuss some things regarding images, as I’ve had these on my mind recently:

I. Image formats

SDL_image is capable of loading various bitmap formats: PNG, JPEG, TGA, BMP, PNM, XPM, PCX, GIF, TIFF, and LBM. Cairo can additionally handle three vector formats: SVG, PDF, and PostScript.

Among the bitmap formats, only PNG, JPEG, and maybe GIF are useful. The others are all trivially convertable into PNG or JPEG, as appropriate, and anyway are archaic and unlikely to be used by anyone. We don’t need them cluttering up a file type selection dropdown box. All three of the vector formats are useful, as I know of no way to losslessly convert between SVG and PDF or SVG and PostScript, and PDF-PostScript conversions can be tricky.

So, the image formats I think we should support in VASSAL 4 are:

  • PNG
  • JPEG
  • GIF
  • SVG
  • PDF
  • PostScript

II. Mapping images to game components

VASSAL 3.1 maps complete images to game components—i.e., one entire image will be used per piece face or board. ZunTzu 1.0 provides two ways to cut images from a larger countersheet image, either by specifying a rectangle and the number of rows columns into which it should be divided, or by providing a mask image indicating the locations of pieces. People have asked us for ways to cut out subimages, and I can see that some module designers might prefer to work with image files which are sheets of piece faces rather than one image file per piece face.

I see four use cases here:

  1. Whole image → one game object
  2. Portion of image → one game object
  3. Portion of image sliced by rectangular grid → one or more game objects
  4. Portions of image defined by whole image mask → one or more game objects

#2 is a special case of #3 (where there is one column and one row), #1 is a special case of #2 (where the cutout rectangle is coincident with the image). #4 is a different sort of thing. If I understand it correctly, ZunTzu locates piece face images by finding contiguous white (unmasked) areas in the mask image with a bucket fill, and then cutting out the smallest rectangle from the piece image which bounds each such rectangle. There’s also a #5 that Jerome, the ZunTzu developer, discusses in this post (boardgamegeek.com/article/6547925#6547925, as point 4), which would involve a small mask to be positioned anywhere over an image, perhaps multiple times. This is a sort of combination of my #2 and #4 above.

Am I missing anything here that we should support?

I’m glad you’re considering image masks! It’s one feature I could have used before to make some piece sets more robust.

Are you considering the mask to be applied to the entire piece, or just to a piece layer? Because I can think of instances where both would be useful.

I’m not familiar with ZunTzu, but I’d be careful about how you might implement this. Especially in free movement/rotation non-gridded games, it may be important exactly where the center of that game piece is, and some images might be non-symmetric.

Thus spake “B.J.”:

I’m glad you’re considering image masks! It’s one feature I could have
used before to make some piece sets more robust.

Are you considering the mask to be applied to the entire piece, or just
to a piece layer? Because I can think of instances where both would be
useful.

I can see how masking at the piece level could also be useful, but
that’s not what this is for. It’s purely a way of cutting small images
from larger ones.

If I understand it correctly, ZunTzu locates piece face images by
finding contiguous white (unmasked) areas in the mask image with a
bucket fill, and then cutting out the smallest rectangle from the
piece image which bounds each such rectangle.

I’m not familiar with ZunTzu, but I’d be careful about how you might
implement this. Especially in free movement/rotation non-gridded games,
it may be important exactly where the center of that game piece is, and
some images might be non-symmetric.

Hmm. I believe the way that ZunTzu does it is as I described. If you
wanted the center of the image to be somewhere other than the center
of the bounding box of the opaque area, I think in ZunTzu you would not
be able to do that with a mask. Instead, you would need to use a
transparent PNG for the image and specify the image using the
coordinates of the rectangle you want cut out.

Including a lot of transparent space in an image in order to fix a
center other than the center of the bounding box of the opaque area is
a kludge. A much better solution would be to permit a way to specify
the center of rotation of a piece.


J.