J321C Fundamental of Multimedia Journalism Tutorial:

Photoshop (Photo Editing)

1. Creating a new image in Photoshop
2. Opening an existing image in Photoshop
3. Undo and History
4. The Toolbar

Move Tool
Marquee Tool
Lasso Tool
Zoom in Zoom out
Crop Tool

5. Rotate and resize images

6. Layers
7. Photo retouching basics
8. Sharpening an image
9. Saving an image

Prepared by:
Sung Woo Yoo

1. CREATING A NEW IMAGE IN PHOTOSHOP

Click File in the menu bar on top of the Photoshop window and then click New

The following window then appears. Enter details such as, the image size (which is
normally in pixels while dealing with the web). You can also set other image details such
as, resolution (which is normally 72 for the web), color mode and background contents,
along with several other presets.

The above window is of 800*600 pixels and has a resolution of 72 pixels/inch. This
image is in 8 bit, RGB color mode (i.e. in this image, red, blue and green colors are
mixed in various ways to form several other colors). Also, the background of this image
will be white.
Click OK and create a new image, to get a white canvas of 800*600 pixels. This is the
newly created image.

2. OPENING AN EXISTING IMAGE

In order to open an image in Photoshop, click on File in the top menu bar and select the
second option there - Open.
You can variety of file types in Photoshop, and these are represented in the drop down
menu in the Open window. But, for most parts you will be concerned with '.jpg' '.gif'
'.png' and '.psd' files types - most images used for the web will be in jpg, gif, or png
formats. And it is important to remember that '.psd' is the default Photoshop format.
3. UNDO AND HISTORY
Photoshop allows you to undo any changes you make to your image. The undo option can
be accessed from the Edit menu by clicking on Undo ___.

The short cut keys for undoing a change are ctrl + z.

ctrl + alt + z allows you to undo multiple changes.
Photoshop offers another option to access the history of changes made while editing an
image. This option is called the history option. This can be accessed from the Window
menu.

Clicking on the History option will pop open the following window that allows you to
backtrack several steps in your image editing.

4. THE TOOLBAR

http://www.lynda.com/Photoshop-tutorials/Introducing-Tools-panel/124075/1367874.html
The following toolbar is located on the left-hand side of the Photoshop window.

Here are some important tools on this toolbar Move Tool

This is the most basic tool on the toolbar (it is highlighted in the above toolbar). It is used
to move various elements in a Photoshop image (or canvas). It is selected by clicking on
it. After that, you need to click and drag the element in your image that you need to
move.
Marquee Tool:
This tool (pictured below as selected) is used to select a portion of your image. When you
click at the bottom right side of this icon, four options appear. These indicate four
5

different ways in which you can make your selection.

The Rectangular Marquee Tool makes a rectangular selection across a desired area.
Similarly, the Elliptical Marquee Tool enables you to select an elliptical (or oval) area.
Whereas, the Single Row and Column Marquee Tools are used to select a row or a
column that is one pixel wide or long.
To use any of these tools you need to select them first, and then you need to CLICK and
DRAG them across the desired area on your image.
Another important thing to remember is that whenever you want to make a perfect square
selection, you should select the Rectangular Marquee Tool and then hold down the Shift
key on your keyboard and simultaneously click and drag across the desired area on your
image. The same logic applies while making a circular selection. All you have to do is
select the Elliptical Marquee Tool and hold the Shift key of your keyboard and
simultaneously click and drag. Try it!
Here's how the Marquee Tool's function can combine with the function of the Move Tool
we reviewed a little while earlier: In order to place your selection (or marquee) at a
desired spot on your image, you simply need to click on the Move Tool to select it and
then click and drag the marquee to place it at a desired spot.
This is illustrated with the Rectangular Marquee Tool Below In the first image, a portion of the image is selected using the Rectangular Marquee Tool.
The second image illustrates how the marquee (or selection) is moved to the right hand
corner of the image using the Move Tool.

Lasso Tool
The Lasso Tool is the next tool on the Photoshop toolbar. It is another way to make

specific selections in an image. There are three types of Lasso Tools - the regular Lasso
Tool, the Polygonal Lasso Tool and the Magnetic Lasso Tool. Either of these tools can be
activated by simply clicking on the small arrow at the right hand bottom of this tool and
selecting the appropriate tool form the drop down menu (similar to the one in the
Marquee Tool).

Zoom in Zoom out + Hand

-Zoom and Hand tools are place together because they are used together.
-Hit Zoom tool or Z, it will zoom in, and then you use hand tool to move around.
-Take a look at navigation window at the upper right corner (or Window + navigation)
-Red rectangle will show you your spot.
-Alt or Opt + Zoom tool will zoom out
Double click zoom is 100% size. Double click hand is original size.
Crop Tool
This is one of the most important on the toolbar. It is used to edit out excessive areas
from an image. We will do some exercises here.
An example of how this tool works Open one of crop files from class folder.

Then select the Crop Tool and click and drag it over the area of the image that you want.

Now, that you have selected the part of the image that you want to keep, simply hit Enter
on your keyboard. This will crop your image and itll look something like this

The above tools are the most basic tools required to edit images in Photoshop.
***More exercise***
A. Ratios and Rotate: Use crop shaun

10

-To repeat trials, uncheck delete cropped pixels

-Adjust Ratio at the top bar. Try original ratio first. And then try other pre-set ratios.
-To reactivate cropped area, turn the cursor to crop and click the photo
-Bring the cursor to corner and rotate the photo
-Try it with crop diana
B. Straighten the horizon
-Click Straighten icon at the top
-Drag a horizontal line
-Adjust further by rotating with the crop cursor
-Try it with crop straighten
C. Use Marquees for cropping
-Try it with crop diana
D. How can I crop a circle?
-We will learn with layers.
5. Using layers
-It is one of the most powerful tool. You can use it to retouch, shapes and special effects.
A. Replicating layers for adjustment and filter. Lets use shaun.
-Go to the layer panel in the right bottom corner. (Or Window layers)
-Drag the layer to the new layer icon at the bottom.
-Try Black and white. Go to Image at the top adjustments black and white
-Try grains. Go to filter at the top gallery grains.
B. Rearrange layers.
-Try hide
-Try adjusting Opacity.
C. Circle or other shapes with layers.
-Open photo
-layer unlock
-Select path at the top
-Select shape tool (circle of polygon/ custom shape)
-Shift and drag
-Right click on the circle line
-Make selection > OK(0 pixels)
-Select> inverse
-Edit> clear
-Crop image
-Save image. (PNG with transparency)
-Add layer
-Edit> fill> choose color
https://www.youtube.com/watch?v=v4Jq2nIX9eE
6. ROTATE AND RESIZE IMAGES
Your image (canvas) can be rotated by accessing the Rotate Canvas option in the Image
menu.

11

This enables you to rotate the canvas in any direction, by proving a host of options, such
as Flip Canvas Horizontal and Flip Canvas Vertical. It also allows for the canvas to be
rotated in an arbitrary angle by choosing the Arbitrary option.
Images can be resized in Photoshop using the Image Size option under the Image menu.

12

When you click on Image Size, the following window will appear. This window will
allow you to adjust the width and height of the image. It allows you to reduce or increase
the overall size of your image (but dont try to enlarge any image it will result in poor
quality). Always keep the Constrain Proportions option active.

7. PHOTO RETOUCHING BASICS

Open an image in Photoshop. Click Image in the top menu. Then go to Adjustments and
then to Levels.

You will get the following window in which you can move the gray slidebar to get the
desired color effect. This can cure typical issues such as, brightness and contrast.

13

Another important option in the Adjustments menu is Curves. Clicking on this option
opens the following window.

You can adjust the curve in order to adjust the brightness and contrast of the image. This
curve can be moved by clicking and dragging to achieve the desired effect.

14

Also, under the Adjustments menu, there is the Exposure option, which is often used for
image correction. It helps adjust the exposure levels of your image.

The following window opens when you click on Exposure.

You can adjust the exposure, offset and gamma levels to the appropriate ones by simply
dragging the corresponding gray arrows, or you can simply enter the desired values in the
adjacent boxes.
You can also adjust the color balance of your image by accessing the Color Balance
option in under the Adjustments menu.

15

The following window opens when you click on Color Balance.

Here you can adjust the levels of Red, Blue and Green (which are the component colors
of your image). The following image illustrates how a change in one of these component
colors affects the image.

16

This image illustrates how increasing the level of Green gives a greenish tint to the
image. You can apply such tints of various colors by adjusting the three component in
different combinations.
Similarly, there are other options under the Adjustments menu that help in retouching an
image. These options help in retouching an image and correcting any color defects it
might have.

17

7. SHARPENING AN IMAGE
You can sharpen images in Photoshop using the Sharpen option under the Filter menu.

The Sharpen option allows you to four options Sharpen, Sharpen Edges, Sharpen More,
Smart Sharpen, and Unsharp Mask to sharpen your image to your desired level.
Almost all website photos need sharpening.
First set a new layer.
-Filter > Sharpen > Select smart sharpen
A general (all-purpose) setting is as follows (it depends on each photo though):
Amount: Intensity of sharpening. 150-300% works best
Radius: Prevents halo effect. Usually less than 1.
Reduce noise: 20%
-Enlarge the window. Check preview
-Increase amount till image breaks. Reduce it.
-Adjust Radius
-Adjust Reduce Noise
The tools mentioned in this tutorial will help you in improving the quality of a picture or
image and getting results.

18

8. SAVING AN IMAGE
Photoshop allows you to save your images in a variety of file formats. But, the most basic
file formats that are pertinent to the web are .jpg, .gif, and .png. You can save your file in
either of these formats using the Save for Web & Devices option from the File > export
menu.

When you click on Save for Web & Devices, the following window will pop open.

19

This window allows you to choose the format you want to save you image in, with a drop
down menu on the right.

You can also choose the quality of the image by choosing the appropriate option from the
following menu.

20

If you want to compare the image quality across different settings (formats, quality, and
file size), choose the 2-up or 4-up tab on the upper left corner.
Finally, you can also adjust the image size by clicking on the Image Size tab on the right
hand side of this pop up window. This enables you to adjust the size of the image, just
like the Image Size option discussed earlier in this tutorial.

21

Once you are done with choosing the appropriate options, you can save your image by
clicking on the Save button on the top right hand corner. This enables you to save your
image in at a location of your choice (just like MS Word or Excel).
Keep in mind that NO IMAGES SHOULD BE LARGER THAN 100KB if served on the
web.

22