Paint Shop Proand the Web

Rick Matthews

Dept. of Physics, Wake Forest University

And

The International Center for Computer Enhanced Learning

matthews@wfu.edu

http://www.wfu.edu/~matthews

My favorite PSP tricks

• JPG vs. GIF• Layers

– Raster vs. vector

– Text and shapes

– Adjustment layers

• Fixing exposure problems• Color correction• File export: JPG and GIF• Screen capture

JPG vs. GIF

• Nearly all web images are one of these two.

• Each is a compressed format. Goal: small file size=>quick download.

• Each has compromises, but very different compromises.

GIF

• Limit of 256 colors on screen.

• Shrinks files by looking for areas of uniform color.

• Great for text, line graphs, simple computer art. Poor for photographic images.

GIF and photos

• Problems:– No uniform

color, so big files

– Lots of colors, so poor fidelity.

JPG and photos

• Photo rendition is the design goal of JPG.

• It is a lossy compression method, discards info least likely to be noticed.

• Huge reductions in file size with minimal quality loss.

JPG and text, line art• JPG is at its worst where GIF is best: Large areas of

uniform color. Below are magnified 200x100 images.

GIF, 646 bytes, perfect

JPG, 2,400 bytes

TIFF, PSP, PNG

• CAUTION: Never use JPG for your working file format.

• Each Save, Load cycle degrades image more.

• Lossless formats: TIFF, PSP, PNG.

• PSP: optimal internal format, but proprietary.

• TIFF: widely supported across multiple platforms.

• PNG: Newest, will eventually replace GIF. Not yet well supported.

Layers

• 3 kinds:– Raster (images)

– Vector (adjustable objects)

– Adjustment (affect lower layers, not directly visible.

Layers

• 3 kinds:– Raster (images)

– Vector (adjustable objects)

– Adjustment (affect lower layers, not directly visible.

Layers

• 3 kinds:– Raster (images)

– Vector (adjustable objects)

– Adjustment (affect lower layers, not directly visible.

Example: Levels and color

• Levels let you intuitively (and reversibly) correct brightness and contrast.

• Uses adjusment layer.• Color balance is

another adjustment layer.

Example: Gamma

• Handy when dark areas need to be lightened more than brighter areas.

• Consider working on duplicate layer, to save original.

Transparency

• Handy trick to create header images for web pages, backgrounds for PowerPoint slides

• Must create a duplicate layer, then make background white.

Screen capture

• Handy for tutorials on software.

• Easy way to grap images that were not intended to be grabbed.

PowerPoint

Steps in creating a PowerPoint presentation

• Choosing a presentation template

• Choosing a format for each slide

• Images• Animation• Sound, Narration• Export to Web

Presentation template

• Appropriate theme?• More important:

contrast

Layout

• Think about leaving room for illustrations, pop-ups.

• Can always delete text boxes.

• Inserted text boxes have defective bullets.

Inserting images

• Can use Insert, Picture, File, or…

• Copy and paste from PSP.

• Best to size images in PSP first, rather than resizing in PowerPoint.

Animations

• Introduces elements of slide sequentially.

• Choose SlideShow > Custom Animation

• “Effects” controls how it appears.

• “Timing” controls when.

Narrations

• Easy!• Slide Show > Record

Narration• External microphone

is recommended.

Web authoring: PowerPoint vs. direct authoring

• Uses a tool you may already know.

• Efficiency much improved in PP2000.

• Layout is easy, well-defined.

• Nearly trivial way to post class notes on web.

• Less flexible layout.• Slower viewing, because

files are larger.• Linear document: not a

“web-like.”

Publishing your PPT on the web

• To create web page select File> Save As Web Page

To create web page select File> Save As Web Page

Default: works with IE5 only. To fix, click “Publish.”

• Preview web view under File Menu.

Miniproject on PSP and Powerpoint

Two Miniprojects -- PSP

• Start with a photographic image.

• Correct brightness and contrast using levels, correct gamma, correct color.

• Add text overlay• Save as PSP, export as

JPG.

• Prepare another image consisting only of vector text and shapes.

• You should have at least 3 layers: raster background with a uniform color, vector layer for text, vector layer for shapes.

• Save as PSP image, export as GIF.

Miniproject -- Powerpoint phase

• Create a brief presentation, with your choice of designs.

• Create three slides in more than one layout, and include at least one picture.

• Experiment with different animations. Overdo it. Be tacky.

• Add one “virtual” slide, consisting of sequence of slides with “fake” pop-up boxes.

• Export to web.