: Designing scalable graphics without using vectors I'm working on an mobile phone game, and don't have the luxury of being able to use vector graphics. I'd like the game to be playable on a

@Holmes874

I tend to focus on iOS mainly, but mobile safari has supported SVG for a while now. Apparently Android's browser on Honeycomb and up also supports SVG. I tend to only use SVG for most of my icons in mobile iOS work.

The alternative is to use raster, of course. If you want to use only one image for all devices, then you need to make a really large image, as you can scale down easily, but not up (and have it look good).

UPDATE:

If your question is


are there scalable image formats that aren't vector?


Then the answer is no, not really. If it's not vector (we'll lump 3D modeling into that) then it's raster. Raster images have a finite number of pixels so can only be scaled up to that point. You can scale down from that with some success, but not usually up very much before it starts looking poor.

Vote Up Vote Down

@Cofer715

I am skeptical about the idea that "vectors aren't supported." I am certain that libraries exist for all mobile platforms: vectors are only ever viewed as raster images.

{edit for clarity:}
While the "mipmap" discussion below refers to 3d rendering, the mipmaps themselves are "raster" textures to be applied during rendering. There is no reason one cannot use the mipmap concept as assets in a pixel-based 2d render without a 3d pipeline...
{end edit}

In any event, the most common alternative is a mipmap, either calculated on the fly (cpu intensive, less control), or pre-rendered and stored (more storage). Mipmaps are usually used for 3d level of detail (LOD) where the best assets are only required for things closest to the viewport.

If you have a pre-rendered graphic(s) with multiple sizes in it, you can choose the proper asset to use based upon the viewport size. This also allows for a low/med/high user preference if they encounter unsuitable performance. Additionally, you can package the assets by size and perhaps leave out the highest pixel dimension set for devices that are storage limited.

Because scaling always involves quality loss, it is probably beneficial to pre-render the assets so that you can fix them up for quality.

( en.wikipedia.org/wiki/Mipmap )


In 3D computer graphics, mipmaps (also MIP maps) are pre-calculated,
optimized collections of images that accompany a main texture,
intended to increase rendering speed and reduce aliasing artifacts.


"aliasing artifacts" = Scott's "huge mistake" comment.

Vote Up Vote Down