GraphicsMs. BrewerSpring 2013

Bellwork

• Edmodo – log on!• Quiz? Take it if you need to!

• Policies and Procedures Powerpoint in Shared Folder!

• Get to Know you document in Shared Folder!

• What does it mean to compress an image?

• Why do you think we compress images?• What do you think are the effects on

the image?

BELLWORK

Topics we’ll be Exploring…

• Graphic File Formats• Clipart• Photo Editing• Photo Manipulating• Creating and Presenting Graphics Projects• Multimedia Projects

Assignments you’ll have…

• Vocabulary Quizzes• Original Clipart• Clipart Projects• Paint Projects• Photo Editing and Manipulation • Multimedia Projects• Individual Presentations

Top ways to ACE Graphics

Complete all assignments according to the rubric.

Hand your work in on time.Complete your powerpoint

presentation when I am giving notes or explaining something new – they are graded.

Study for your tests and quizzes. They do count!

Top ways to ACE Graphics

Plan ideas in advance. Storyboards are graded.

Have a positive attitude and good work ethic

Be Creative

Be School Appropriate

Be Unique

Key Learning

Image editing skills can enhance personal and professional projects

Unit Essential Question

How can I design and create quality graphics

for publication?

Lesson Essential Question

How do I choose the best file format when saving

an image?

Vocabulary.bmp.gif.jpg.png.psd.tiff

• Lossy Compression• Lossless

Compression

So why do we compress images??

• By decreasing the image size (bytes) the screen speed is faster

• By decreasing the image size (bytes) the web page loads faster

• By decreasing the image size (bytes) the less the bandwidth consumption

Image Compression Methods

Two Types - • Lossy Compression• Lossless Compression

Lossless Compression

• The file does not discard any data when saving.

• Compression occurs by recording color changes from the pixel directly to the left.

• Each pixel maintains its own identity.

• Compression results in a sharp image that looks identical to the original.

• Can reduce a file up to 30%.

Lossy Compression

• The file loses data each time it is saved.

• Compression occurs by averaging pixels values (colors) to eliminate the amount of info needed to be saved.

• Each time you save, your image deteriorates more resulting in COMPRESSION ARTIFACTS.

• Can reduce a file up to 50%.

Compression TypesLossy

A compression type in which the image loses color data each time it is saved.

How it compresses:Averages colors so some

can be eliminated.Compression results:

Loss of quality, blurring and compression

artifacts.Percent of reduction:

About 50%

LosslessA compression type in which no data is lost when saving.

How it compresses:Compares each pixel with the one before it and only

records color change.

Compression results:No color loss or blurring.

Percent of reduction:

About 30%

BellworkUse the Internet to find the full file format

names for the following file extensions:.gif.tiff.jpg or jpeg.png.psd.bmp

Let’s look at some images…

Image ExamplesGIF –

Graphics Interchange

Format Images

.gif Graphics Interchange Format

• Characteristics– Can only have 256 colors

• Compression–Lossless Compression

• Best Uses–Web Graphics (logos, banners)–Text, Line Art, Large blocks of Color

• Poor Uses–Photographs

Image ExamplesBMP - Bitmap

.bmp Bitmap• Characteristics– Older File Format–Created by Microsoft – use with MS Paint

• Compression– Lossless Compression if done through ZIP

• Best Uses–Clipart and Basic Images

• Poor Uses– If need a quick response time

Image ExamplesPNG – Portable

Network Graphics

.png Portable Network Graphic

• Characteristics– Newer File Format to replace .gif–Standard File Format for Paint

• Compression–Lossless Compression

• Best Uses–Web Design Image Format

• Poor Uses–Traditional Print

Image ExamplesJpg or Jpeg–

Joint Photographic Experts Group

.jpeg Joint Photographic Experts Group

• Characteristics– Uses all Colors (16.7 Million)–Recognized by all Web Browser Software

• Compression– Lossy Compression

• Best Uses– Photographs–Screen Graphics – Power Point, Web

• Poor Uses– Images with few colors, text, simple shapes

Image Examples.psd

Photoshop Format

.psd – Photoshop Format• Characteristics– Uses all Colors (16.7 Million)–Supports Photoshop Functions

• Compression–Lossless Compression

• Best Uses–Photoshop Work in Progress

• Poor Uses–MS Office Programs or Web Site images

Image ExamplesTiff –

Tagged Image File

Format

.tiff Tagged Image File format• Characteristics– Can use any resolution–Supports Photoshop Functions

• Compression–Lossless Compression

• Best Uses–Print Graphics

• Poor Uses–Web Images

Summary…

Compare and Contrast the file format options discussed in class on the handout provided.