To Do

Quiz 2
Launch Internet Explorer
Launch Photoshop
Programs
Dev Apps
Adobe
Adobe CS3
Photoshop CS 3

Download images
Browne to www.msu.edu/course/tsm/251
September 24 photo gallery 2009, 2008 &
2007
October 1 sample images

Download an original image to your

jump drive, P: drive or desktop

Move your cursor over the image

Right mouse click
Save Picture as
Specify location for saving

Open the image in Photoshop

Window (turn on)

Tools
Navigator
Color
Layers
Options

Tools
Palette

Layers Palette

Brightness and Contrast

Use to improve image quality
Remember to use Save As to
maintain your original

Image Adjust Brightness/Contrast

Brightness and Contrast

Try it
Use Save As and name the file
Filename_bright
Close the file
Open the original again

Image Size
Use to reduce or enlarge image size
to a specific size (resampled)
Constrain proportion (aspect ratio)
Use to reduce file size
Remember to use Save As to
maintain your original

Image Image Size Use to reduce physical size of image

without cropping which reduces file size

Input new dimensions leave Constrain Proportions checked

to maintain aspect ratio

Note: Use Save As and new file name to retain original.

Resized image will be a smaller file size

Image size
Try it reduce the photo to a 320
pixel width
Use Save As and name the file
Filename_imagesize
Close the file
Open the original again

Crop Tool

Select area
Set specific dimensions (Fixed Size)
to match your output requirements
Right click on area to Crop or
Remember Save As to maintain
your original

Crop Tool

Define area to crop

Accept

Right click - Crop

Note: Use Save As and new file name to retain original.

Cropped image will be a smaller file size

Crop Tool
Try it Crop the photo
Use Save As and name the file
Filename_cropped
Close the file
Open the original again

Duplicate a Layer

Right mouse click on layer

Select duplicate layer
Note the active layer (highlighted)
Note the visible
Note the lock
Note the order

Add a new layer

Select Create a new layer

Note transparency
Note the active layer (highlighted)
Change visible
Change lock
Change active
Change order

Clone Stamp Tool

Alt click on source area

Move to area for duplication
Click and hold mouse button while
moving

Clone Tool
Try it Clone an area of the image
Use Save As and name the file
Filename_cloned
Close the file
Open the original again

Text tool and Layers

Put all text on a separate layer

Remember the duplicate layer
Remember the active layer
Remember layer order
Remember visible layers

1
3
2 - Draw text
box

3 - New layer is added

2

Both layers visible layer 1 active

Right click Blending Options layer 1

Layer 1 - invisible

Layer 1 - visible
Background layer - invisible

Add additional layers as needed to create web

buttons, various shades of backgrounds, various
captions, etc.
Save file in Photoshop Native format to retain
layers. Then use selective layers and Save As to
save images in jpg and gif format.

Text Tool and Layers

Try it Add text to the image
Save the file in Photoshop native file
format to preserve layers
Use Save As to same the file in .jpg
format and name the file
Filename_Text
Close the file
Open the original again

Colors and Filters

Foreground and Background colors
Double click to open Color picker and
eyedropper tool
Remember theme / purpose

Colors and Eyedropper

Colors and Eyedropper

Color Libraries

Filter

Colors and Filters

Try it select a different color or
even try Pantone 341
Use one of the filters
Use Save As and name the file
Filename_color
Close the file
Now compare the file sizes which
one is smaller.

Web Buttons
Create a brand new canvas 150 x 75
pixels, 96 ppi, 16 bit color
Duplicate the layer and name the layer
normal
Select the normal layer, right mouse click
on the layer and select Blending Options
Select Color Overlay and chose the color
you desire
Select Bevel and Emboss to create the
button effect
Lock the layer

Web Buttons
Duplicate the normal layer and call
the new layer light
Duplicate the normal layer again and
call this one dark

Web Buttons
Select the dark layer, unlock it, right
click to open Blending options, choose the
Color Overlay and set the color to a darker
shade of the same color, and lock the
layer.
Select the light layer, unlock it, right
click to open Blending options, choose the
Color Overlay and set the color to a lighter
shade of the same color, and lock the
layer.

Web Buttons
Use the text tool to add a new layer
and type the word Home
You may need to change the font,
font size and font color
Use the grid and move tool to align
the text on your button
You may need to use zoom
When satisfied, lock the layer

Web Buttons
Duplicate the Home layer and call
the new layer Resume
Select the resume layer, unlock it,
click on the text and replace Home
with Resume without changing the
alignment. Hint, you might want to
make the Home layer invisible.
Lock the layer

Web Buttons
Save this file in native Photoshop format .psd to
maintain the layers
Using the visible option, select the set of layers
that will produce a normal home button
Use Save for Web to make a .jpg image that you
will call homenormal.jpg
Using the visible option, select the set of layers
that will produce a dark home button
Use Save for Web to make a .jpg image that you
will call homedark.jpg
How do you make a homelight.jpg button?
Remember to always save the file in Photoshop
native format .psd as a final step.

Save, Save As or Save for

Web
Native Photoshop format - .psd

Output bitmap format - .jpg, .gif, .tiff