---

Intro to Photoshop

Adobe Photoshop is the industry standard tool for working with digital images. Whether the image comes from a digital camera, scans, stock imagery, Web-ready artwork, or even vector graphics, all of them can be manipulated in Photoshop. Used for both enhancing and manipulating photographs as well as creating original artwork, Photoshop is used by photographers, designers, videographer and 3d artists.

---

Adobe Photoshop Overview

Adobe Photoshop CAN:

• Rotate an image
• The Crop  Tool: Crop or resize images
• Modifying Color
• Crop an image
• Align an image
• Correcting Exposures
• Adjust tonal properties such as lightening a dark image
• Restoring and Retouching Images
• Combining multiple images into composites
• Simulating a variety of lens effects
• Color correction of images
• Dust and scratch removal
• Opening or saving in a variety of file formats

• Textures for website backgrounds
• Manulapiting type
• Creating comps of website and mobile applications

• Assembling image sequences into timeline animation
• Removing unwanted objects from frames in their video
• Repairing video using the cloning and healing tool
• Creating frame by frame animations

• Creating 3 dimensional shapes used in other applications
• Creating 3d objects
• Painting 3d environments

---

You’ll see a graph showing the values across the spectrum of the image called a histogram. To simplify it:, the left side of the graph is the shadows and blacks and the right side displays the highlights and whites. You note in the graph that there are few black or white tones, as the graph is rather flat on the edges. To adjust the image, move the three slider arrows at the bottom to their appropriate settings. The black slider arrow defines the black point, that is the darkest part of the photo. The white slider defines the white point, the brightest part of the photo that is white. The middle slider adjusts what are called the mid-tones. Drag the outside sliders inward until the are lined up with the edge of the histogram.

Right away the contrast picks because the image didn’t have a very solid white or black point. Next, adjust the middle slider to set the mid-tones of the image. Mid-tones adjusts the overall brightness of the image.

Adjusting Colors Using Levels

You can also adjust the colors of an image using levels. Simply select the Channel option at the top to choose one of the three primary colors. Your choice allows you to either increase or decrease that particular color from the image (sliding either the white point, black point, or mid-tones). If you subtract a particular color, it’s relative secondary color will start to emerge in the image. If ou want to add some yellow to your image, you would subtract blue. Set the channel to blue, and slide the black slider inward.

Variations

Variations is another way to adjust the levels of a photo. It’s much less precise, but sometimes its all you need. Variations presents you with a window dialogue that shows several copies of your image.

Auto Corrections Video

Correction and Adjustments in Photoshop Video

Using Adjustment Layers Video

---

Dodging and Burning

Dodging and burning refers to “lightening” and “darkening” portions of the photograph.  The dodge tools looks like a black lollipop while the burning tool looks like a hand forming a circle. When you select the dodge or burn tools, the option bar at the top will give you a new set of parameters to adjust the tool’s usage.

Adjust these settings so that you only change the photo in small increments so that nothing stands out too quickly. Use the exposure setting to adjust the amount of dodging or burning that occurs with each pass. The range will specify the range of tones that will be affected. You want to lighten highlights and darken shadows. If your goal is to brighten shadows or darken highlights, then use the mid-tones setting. The brush size will specify the size of the tool you will be using.

The master diameter is the size of what Photoshop calls the “brush” size.  The hardness refers to how soft the brush’s edges are. When using dodging or burning, you want a low hardness setting to offer the softest brush. If you are trying to be more exact, you can increase the brush hardness, but increase the chance that the touch-up will be noticeable.

---

Sharpen

---

Adjustment Layers

When you open an image  background layer is your primary layer. Adding additional layers allows you add elements (contained within those layers) to your image. This allows you to add additional information to your document without affecting the other layers. Each layer is superimposed over the other and can be modified without affecting the other layers.

To add a new layer, click on the layer icon located at the bottom of the layers palette. Rename your layers by double clicking on it and typing the new layer name. Once you added a new layer, now it’s time to add information to that layer.

Here’s a quick step by step on how to add text to an image.

1. Create a new layer
2. Rename your new layer “Text”,  indicating that the layer will contain text.
3. Select the text tool.
4. Click on the image and the text box will appear.
5. Type in your text and click OK.
6. To position the text, select the move tool and drag your text.
7. Your text is now on a separate layer you can manipulate it without affecting the original image.

---

Flattening/Saving Images 

Once you’ve finished manipulating your image, you’ll need to save them. There are two ways I recommend saving images. First, save a copy of the image that retains the individual layers. To do that, you’ll need to save it as a PSD file. Saving a copy of the image as a PSD fil, you’ll retain the individual layers which allows you to reopen the image in Photoshop and manipulate those layers at a later time. To save your image as a PSD file, go to File, Save As and make sure you save click PSD.

Note that once you flatten the image, the individual layers will no longer be available. All of the layers will be flattened into one layer. This will prevent you from manipulating any of the data. For example you will no longer be able to move the text around.

If you want to use your image on the Web, you need to flatten the image so that it consists of only one layer which consists of all the data from each of the layers. You to flatten the image first, and save a copy of your image as a .jpg, .gif or .png file. Note that once you flatten the image, you won’t be able to manipulate the individual layers. All of the layers will be flattened into one layer.

Step 1: Go to the Layer menu and select Flatten Image.

---

PSD vs JPG vs GIF vs PNG

PSD preserves all the layers in your file. You should ALWAYS save a copy of your image as a PSD. Once you’ve done that, then consider which file format below best fits your needs.

Image File Formats: There are three primary image file formats used for graphics viewed on the web. Each of these file types were designed for the purpose of compressing memory usage. Each file type does this a different way.

Jpeg 
Jpegs work well on photographs, naturalistic artwork, and similar material; not so well on lettering, simple cartoons, or line drawings. JPEG is “lossy,” meaning that the decompressed image isn’t quite the same as the one you started with. (There are lossless image compression algorithms, but JPEG achieves much greater compression than is possible with lossless methods.) JPEG is designed to exploit known limitations of the human eye, notably the fact that small color changes are perceived less accurately than small changes in brightness.

Gif
Graphics Interchange Format. A format used for displaying bitmap images on World Wide Web pages, usually called a “gif” because .gif is the filename extension. These files use “lossless” compression and can have up to 256 colors.

Png-8 and Png-24
PNG is a compression scheme that has two main benefits: it is a lossless compression image format and it holds alpha channel information. Originally, the Portable Network Graphics (PNG) format was designed as a royalty-free format, which would replace GIF and JPEG. Png-24 allows for smooth blending between alpha and opaque.

Image Size
When speaking about image size on the web, there are three possible interpretations of this that you must take into account.

File Size refers to the amount of disk space an image occupies (in KB or MB)
Image Dimensions refers to the physical size of the image, expressed in height and width.

Resolution refers the pixel density of an image. This is expressed in pixels per inch (ppi). Images are displayed on the web at 72 dpi. Printed images are generally of higher resolution.

Compression

Compression shrinks down the file size of the photo so that it loads on the user’s computer quickly, but maintains a certain level of quality.

Saving

Click the Save button to save your image. ALWAYS ave your original photo for archiving, or if you intend to reopen it later PRIOR to using the save for web.

---

Save and Export

There are two ways of saving a photo in Photoshop. The first is to use the Save As… dialogue, the other is called Save for Web & Devices… which is used to save your photos in preparation for publication to the Web.

1) Save as: I recommend saving the file type as a Photoshop or .PSD file, which will also save extra Photoshop-specific information about your photo and allows you to go back to the file at a later date and manipulate all layers. You will not lose any quality when you re-save it multiple times. Saving as a .jpg, .png or .gif compresses the photo allowing you to use it on the web.

2) Save for Web: Use this when you are ready to export your photo for publication to the Web.  The Save for Web allows you to see how your photo will appear once it’s published to a Web site. Optimized will show you how your photo will appear once it’s published on a Web site, and 2-up/4-up will show you comparisons so you can see how the different levels of compression will affect your photo when saving. These are automated ways to save your image for the Web.

 digitalmediaproductionramapo2013 AS WELL AS add additional tags. 

Cloning your new snowflake

Adding text layers from another document

Making the Best Selections

•  ASSIGNMENT | Marquee Tool #8

Open image ps0501 here. Open image ps0501_done here.

Use the image above to create an overlay with text.

1. Select the Rectangualr Marquee tool, (the square with the dashed lines). Choose View > Snap and make sure it’s checked.
2. Position your cursor in the upper-left side of the guide in the care image, and drag a rectangular selection down toward the lower-right corner of the guide. A rectangular selection appears as ou drag, and it stays active when you release the mouse. You’ll now apply an adjustment layer to lighten just the selected area of the image. You are lightening this region so that a text overlay can be placed over that part of the image.
3. If the Adjustments panel is not visible, choose Window > Adjustments and click on the Curves icon;the Properties panel appears. (Click on the Curves button to create a new Curves adjustment layer.)
4. Click and drag the upper-right anchor point (shadow) straight down, keeping it flush with the right side of the curve window, until the Output text field. The rectangular selection in the image is lightened to about 20% of it’s original value.
5. Go back to the Layers panel, click the box to the left of the text layer named poster text; the Visibility icon (the eye) appears, and the layer is now visible. The text appears over the lightened area.
6. Save your file and name it as follows: 2013.10.16.Smith_John_Text_MarqueeTool
7. Upload to your blog and Flickr and save your .psd file.

•  ASSIGNMENT | Creating a Square Selection #9

 ASSIGNMENT | Changing a selection into a layer #11

---

Homework | Week 7  

• Complete all assignments listed in this class post.

• Describe two ways to combine one image or another.
• What is created in the destination image when you cut and paste or drag and drop another image file into it?
• What are the best formats (for prints) in which to save a file that contains text or another vector objects?

• Homework 7: | Photo Composition/Selection

If you did NOT finish the photo composition assignments in class, please finish it for homework. Title it in the following format:

NOTE: You have a choice to use the SAME ski picture OR any photo of your choice and recreate a second version of the PHOTO COMPOSITION. Use a different gradient, custom shape tool, text, font color, etc. Save it as v2.

• Homework 7: | On your blog, answer the following technical questions:

1. How do you create a dashed stroke in Photoshop CS 6?
2. How do you make a vector shape into an exact size?
3. What feature can you use to move multiple layers from one file to another?
4. What is the difference between a Paragraph and a Character Style