Efficient Game Graphics
-
Upload
elijah-wolfe -
Category
Documents
-
view
22 -
download
0
description
Transcript of Efficient Game Graphics
Efficient Game Graphics
From Flash MX 2004 Game Design Demystified
Choosing Vector Vs. Bitmap
• Both have places in Flash Graphics
• Vector are smaller and more scalable
• Bitmap allow for richer graphics and photographs
• Best solution is often to use both
Vector Graphics
• Vector Graphics are described as mathematical equations for points and curves.
• Image is not the actual image but a mathematical description of the image rendered on the screen at run-time. – Best for line work and graphical shapes.
Vector Graphics
• Created in tools like Freehand and Illustrator. Flash also create vector art. – File types are ,AI, .EPS and .SWF
• Graphics are resolution independent. – No matter how close you zoom in or enlarge
the image it is preserved
Advantages
• File size and flexibility
• Scale and positioning flexibility– Helpful if you are going to change the size of
your graphic while playing
Disadvantages
• Because image is recreated on the fly, it may effect performance.
Bitmap Graphics
• A description of each pixel in a file with entries for red, green, blue and alpha.
• Created with PhotoShop, Fireworks and paint programs– File types are GIF, JPEG, and PNG
Advantages
• Performance– Does not require the complex rendering of
some vector files. – It is already in the format the playback engine
creates.
• Image complexity– Photos, 3D worlds and complex backgrounds
are almost always in Bitmap.
Disadvantages
• Don’t work well if you have to zoom or rotate them.
• Files sizes can quickly get large
File Types for Flash Games
• For Bitmaps you should either use GIF, JPEG or PNG
GIF
• Indexed color
• Reduced to 256 colors maximum
• Allows for one transparent color
• Considered Lossless– If the image only has 256 or less colors
JPEG
• True 24-bit color
• Ideal for graphics from photos or gradients.
• Is a lossy format, changing the data in the file
• Bad for lines and text images
PNG
• 8 and 24 bit versions– Substitutes for GIF and JPEG
• 8-Bit is indexed like GIF, with more transparency options.
• 24-Bit is lossless with 8 bit transparency. – In Flash PNG images are compressed at
publishing using the JPEG method.
Compression
• File size is critical for web delivered games
• Flash is very efficient at delivering small files
• It is up to you to make the right choices to maximize Flashes abilities
Lossless Compression Schemes
• Do not actually remove any data
• Treat graphics as rows of particular color.
• Colors are converted to an index and converted to only those index colors. – 2 to 256 colors
• Compression goes by pixel rows and reduces the information
Lossy Compression
• Sacrifices Image quality for Image size– Removes information invisible to the eye– As compression ration increases Image
quality decreases.
• Always compress your images only once. – Reducing a reduced image can have a
dramatic effect on quality. – Always keep original images in their native
form.
Changing Bitmap Properties
• Bitmap properties in the Library allows you to change settings for compression
• Global compression settings can be changed in the Publish settings
• When using Lossless Compression (GIF or PNG-8) the compression settings in Photoshop and fireworks are superior to those in Flash and should be modified there.
Optimizing your images
• Game image rendering is often the cause of problems with performance
• You need to be sensible with your design– Smaller graphics render faster– The more you move a frame the more
processing– If you are trying to move at 30 frames per
second, the images must render in less that 1/30th of a second
Simplify Vectors
• Flash gives you tools to simplify the vectors that you cretae in vector graphics. – Optimize curves from the Modify Menu
• Works on Illustrator and EPS graphics as well as those created in Flash
Other considerations
• Alpha Channels– More alpha channels = more rendering
• Anti Aliasing– Adds processing time. In some cases (Small fonts) it
may not help legibility
• Bitmap Smoothing– Flash process to improve scaled bitmap can use extra
processor time
• Use ActionScript functions when possible to improve performance
Loading Graphics at Run-Time
• May increase speed if you are loading additional parts of the program while it is playing
• Allows you to change the game without having to recompile the SWF.
• Flash only loads JPEG and SWF files– May limit your choices