Graphics

Graphics… Can be immersive and capture

imaginations.

Largest Photographs In The World

Graphics

Graphics file types fall into two main categories: Bitmap Graphics and Vector Graphics.

Bitmap Vector

•Referred to as paint graphics•Can show color or black and white photographs/clipart•Non-scalable without loss of quality•Every pixel in the image adds to the overall file size

•Referred to as draw graphics•Can show color or black and white solid fill/gradient image.•Scalable without loss of quality•File size is calculated by storing the positional points of the image and a generic fill color/pattern

1 1 1 0 0 0 0 0 1 1 1

1 1 1 0 1 1 1 0 1 1 1

1 0 0 0 0 0 0 0 0 0 1

1 1 1 0 1 1 1 0 1 1 1

1 1 1 0 0 1 1 0 1 1 1

1 0 0 1 1 1 1 0 1 1 1

1 1 1 0 1 1 1 0 1 1 1

1 1 1 0 0 1 1 0 1 1 1

1 1 1 0 1 1 1 0 1 1 1

1 1 1 1 0 0 0 1 1 1 1

1 1 1 1 1 0 0 1 1 1 1

Width 11 Pixels

Hei

ght 1

1 P

ixel

s

•GIF 8 bit (lets you choose from 256 colors that are premixed)

• JPG 24 bits (essentially mixes custom colors for each pixel on the fly!)

• PNG Portable Network Graphic supports true color 16 million colors.

• BMP Large uncompressed Windows universal file format

•Higher in Quality = Higher in File Size

Bitmaps

Bitmaps - Animated GIF

An animated GIF is a sequence of GIF files all bonded together and displayed one after the other.

With enough panes, you can get very realistic animations. A

minimum of 3 frames is necessary to create animation.

The total file size of an animated gif is the sum of the GIF files used to create the sequence, and that can add up quickly.

• Samplehttp://computer.howstuffworks.com/web-animation2.htm

• Create your own onlinehttp://gickr.com/

Bitmaps - JPEGs

•Samplehttp://computer.howstuffworks.com/question289.htm

•For safe searches always look in trusted sites•Flickr •Alberta Education Online Reference Centre

• It has good compression characteristics on photographic data.

• It lets you adjust the amount of compression.

An MPEG file tries to eliminate repetition between frames to significantly compress video information.

In addition it allows a soundtrack (which animated GIFs do not). Because a typical sequence has hundreds or thousands of frames, file sizes can still get quite large.

Bitmaps - MPEG Compression

[position: 3.123; 48.52]

[position: 10.03; 52.6]

[position: 2.95; 86.52]

[position: 11.04; 102.6]

Bezier curve needs only four points!

Vectors – Flexible and Overlapping

Vectors – Shockwave/Flash

Shockwave/Flash provides a vector-based animation capability. Instead of specifying the color of every pixel, a Shockwave file specifies the coordinates of shapes (things like lines, rectangles, circles, etc.) as well as the color of each shape.

Shockwave/Flash files can be extremely small. They allow animation and sound. The images are also scalable -- because they are vector-based, you can enlarge the image and it will still look like a fluid animation.

http://computer.howstuffworks.com/web-animation1.htm

Lossless compression reduce file size as much as possible without losing image quality. Larger file size than images saved with lossy compression. This technique focuses on image quality as the main goal.

Lossy compression Takes advantage of the limitations of the human eye and discard invisible information. Allows for variable quality levels (compression) and as these levels are increased, file size is reduced.

Image Compression

Fun with Graphics

Blabberize.com3D animationWhat did you see?Free Online Paint And Draw Tools3D-PC Games