1 / 21

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.

Download Presentation

Efficient Game Graphics

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript


  1. Efficient Game Graphics From Flash MX 2004 Game Design Demystified

  2. 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

  3. 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.

  4. 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

  5. Advantages • File size and flexibility • Scale and positioning flexibility • Helpful if you are going to change the size of your graphic while playing

  6. Disadvantages • Because image is recreated on the fly, it may effect performance.

  7. 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

  8. 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.

  9. Disadvantages • Don’t work well if you have to zoom or rotate them. • Files sizes can quickly get large

  10. File Types for Flash Games • For Bitmaps you should either use GIF, JPEG or PNG

  11. GIF • Indexed color • Reduced to 256 colors maximum • Allows for one transparent color • Considered Lossless • If the image only has 256 or less colors

  12. 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

  13. 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.

  14. 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

  15. 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

  16. 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.

  17. 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.

  18. 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

  19. 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

  20. 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

  21. 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

More Related