Menu

File Formats

Vector and Animation Formats

Vector image formats store artwork as shapes, lines and curves, so the picture can be made larger or smaller without turning blocky. Two common vector image formats are SVG and EPS.

SVG and EPS

SVG is designed for screens and the web. Because it describes shapes rather than pixels, an SVG file is usually small, and it can be scaled to fit a phone or a large display without loss of quality. SVG can also include animation, such as a shape that moves or changes colour. For example, a museum's online floor plan could use SVG, with a small dot that pulses to show where you are. EPS is another vector format, often used for artwork that will be printed, because a printer can scale it cleanly.

FormatTypeAnimation?Good for
SVGVector imageYesSmall, sharp graphics that scale
EPSVector imageNoPrint-ready artwork
SWFVector animationYesOlder animations; needs a plugin
MP4VideoYesDetailed or photographic animation

SWF and older animations

SWF is a vector animation format, but it needs a plugin to play. Modern browsers no longer support the plugin, so SWF is now uncommon and a poor choice for a new product. An old revision game with a bouncing character saved as SWF may not open on a current laptop.

Storing animation

Animation can be stored in video formats such as MP4, or in vector formats such as SVG. MP4 works well for detailed or photographic animation that needs to play in many places. SVG suits simple animation made from shapes, such as a recipe app where a whisk icon rotates while a timer counts down. The choice depends on the content and where it will be used: MP4 for realistic motion and wide playback, SVG for small, sharp, shape-based animation.

Practise this