Niall Doherty

Photoshop - The Essentials

November 6th, 2008 by Niall Doherty

The University Webteam held a Photoshop Tutorial on Friday, October 31, from 1:30 to 3 p.m. Staff members from the following departments were in attendance: the Office of Public Affairs, the Office of Scholarships & Financial Aid, the School of Mass Communication, and the Loyola Institute for Ministry. Web Designers Niall Doherty and Jacee Brown presented essential tools for improving web photos using Adobe Photoshop. The concepts covered in the tutorial included cropping photos, adding text, and resizing images.

Here we present what was covered in the tutorial.

1. Workspace

  • Window > Workspace > Default Workspace
  • Tools on the left
  • Options on top
  • Layers bottom right

The Photoshop Workspace

2. Resizing entire image

Image > Image Size

Resize Photoshop image

3. Resize part of an image

  • Select your layer, then Edit > Free Transform
  • Hold down the shift key while dragging a corner to maintain proportions.

Resize part of the image using Photoshop's transform tool

4. Cropping

Use the select tool to outline what you want to keep, then Image > Crop

Cropping an image in Photoshop

5. Transformations

  • Edit > Transform > go nuts!
  • You can always Edit > Undo

Transformations in Photoshop

6. Color Adjustments

  • Image > Adjustments > several options for adjusting image color, contrast, brightness, etc.
  • Trial and error
  • Use Desaturate to make the selected layer black and white.

Adjusting Brightness/Contrast in Photoshop

7. Shapes

  • Choose the shape tool, then click and drag to create your shape.
  • Hold down shift for a perfect square, circle, etc.
  • Double click the color in the layer to change color.

Adding shapes in Photoshop

8. Transparency/Opacity

Choose your layer, then adjust the opacity slider.

Transparency/Opacity in Photoshop

9. Add text

  • Choose the text tool, then click on the image and type your text.
  • Click on a layer or another tool to exit text edit mode.
  • Adjust your text by selecting the correct layer, then Window > Character, or Window > Paragraph.

Adding text to an image in Photoshop

Aligning text in Photoshop

10. Effects

  • Layer > Layer Style > Blending Options
  • Use effects in moderation
  • Never bevel anything. It’s evil.

Adding effects in Photoshop

12. Saving your Photoshop document

  • File > Save
  • Make sure you save the file as a .psd document so you can come back and make changes later.

Saving your Photoshop document

13. Saving for web

  • File > Save for Web & Devices
  • GIF for small icons or images with few colors
  • JPEG for photographs
  • PNG is versatile, sometimes a better choice than GIF and JPEG. Best for transparent images.
  • Compare quality and file sizes

Save for Web & Devices in Photoshop

Jump to comments | This entry was posted on Thursday, November 6th, 2008 at 10:19 am.
Tags: , ,

Possibly related posts:

Syntax Highlighter test »

Comments are closed.