JRN 440 Adv. Online Journalism Resizing and resampling Monday, 2/6/12

Class Objectives Lecture Resizing and Resampling Homework P1 due Wednesday, 2/15, at 2:05 p.m.

About raster images Raster images are output device dependent; you should know your target output device before you start your project Another good thing to know is the dimensions of your file For print, how big will your raster image be on the page 5” x 7”, 8 x 10” … For web, how big will it be on a website 640 x 480 pixels

About raster images You also want to set your resolution to be compatible to your output device Resolution= Number of pixels in each unit of measurement Check your home printer, ask your commercial printer (150 or 300 dpi for color and grayscale images, 600 dpi for black and white images) Web or digital presentation (72, 96 ppi) Remember that if you are ultimately going to print something, do not trust what you see on your monitor for resolution If you do or do not change the resolution, the image will still appear sharp on the monitor

Attributes of Raster Images Resolution Number of pixels in each unit of measurement (dpi, ppi) Dimensions Refer to number of pixels wide and tall (we say width and height) 640 x 480 is normally for a standard computer screen Can be any size you specify  Problem is that dimensions of screens are not standardized in new products yet  Think about screen sizes of various cell phones What is dimension size limited to? Your patience, amount of storage space you have, limitations /capabilities of capturing and output devices

Image Size vs. Canvas Size Image Size Process of resampling (adding or deleting pixels) Canvas Size Changes the “paper size” around the image Also adds to overall size (memory) of file

Features in Image Size Dialog Box (<Image <Image Size) Pixel Dimensions The Image Dimensions (width and height) Under Document Size Image Resolution Number of pixels in each unit of measurement Under Document Size

Features in Image Size Dialog Box (<Image <Image Size) Image Size Mb, kb Why do you care about this? Is your image going to a website (may be downloaded) Do you carry multiple images around on a jump drive? Does your client want you to them an image?

Features in Image Size Dialog Box (<Image <Image Size) Resizing and Resampling checkbox Checked = resampling Unchecked = resizing This little box is VERY powerful!

Resizing Image Resizing: NOT changing the number of pixels Changing the size the raster image will print without changing the number of pixels in the image. Changing the resolution, not the number of pixels Overall file size (mb) does not change Think of it as a “tradeoff” between resolution and dimensions

Resizing: How to do In Image Size Dialog Box Uncheck the Resample box Notice what gets grayed or blocked out If you have a large lo-res file, increasing your resolution will decrease your width/height But overall file size (mb) will remain the same

Resizing your Image UNCHECK the “Resample Image” box Resizing let’s you make a trade off between resolution and dimensions So if you have a large and lo-res image, you can also have a small and high-res image

Resampling Image Resampling: Changing the number of pixels in the raster image. Can change it all, resolution, document width and height/ pixel dimensions Overall file size (mb) does change Think of it as “silly putty”

Resampling: How to do In Image Size Dialog Box Check the Resample box Everything can now be changed. But, again, be careful! Your monitor won’t show you what’s happening to your file!

Ways to Resample your Image Resampling: changing the # of pixels in an image <Image < Image Size What do you want to change? Keep Resample Image Box checked Resolution- increase or decrease Document Size (think of it as print size) – increase or decrease Changing either one of these also changes overall file size (kb, mb) of image  Which is confusingly placed on top of Image Size box next to Pixel Dimensions

Ways to Resample your Image Resampling: changing the # of pixels in an image <Image < Image Size What else do you want to change? Keep Resample Image Box checked Pixel Dimensions  Are used in building images for web pages  The display size of an image on-screen is determined by the pixel dimensions of the image plus the size AND the setting of a monitor  15 inch monitor displays 800 pixels horizontally by 600 vertically Changing this will also change the overall file size (kb, mb) of image

Calculations and Resampling With Resample box checked If you change the resolution, you change the overall file size. BUT, you keep the dimensions the same If you increase resolution, your file size will increase by the square of the value Resolution (x) =File size (x 2 ) If I double my 72 ppi resolution to 144 ppi, the file size will quadruple (2 squared or 2 x 2) If I triple my 72 ppi resolution to 216, the file size will be 9 times as large (3 squared or 3 x 3)

Details when Resampling your Image <Image < Image Size What do you want to change? Keep Resample Image box checked Constrain Proportions box keeps the image from being distorted Scale Styles box determines whether or not Layer Styles are scaled along with the layers they modify. Has no meaning if an image that does not use Layer Styles.

Up or Down Sampling General rule- don’t upsample Why? Can’t add details that weren’t there in the first place Silly putty comparison. Downsampling is better since it throws away data Three methods (under ‘Resample Image’ box) Nearest neighbor- fastest but least accurate Bilinear Bicubic- Creates best effects but takes the longest

3 Methods of Interpolation When you resample, Photoshop fills in missing pixel data or replaces groups of pixels using a Mathematical approximation process called Interpolation Nearest Neighbor Fastest and least accurate Copies the value of one pixel next to existing one Then uses that value to create a new pixel

3 Methods of Interpolation Bilinear Medium method in accuracy and speed Averages 4 neighboring pixels and then adds that average value to the image. Then uses a less sophisticated algorithm to smooth the transition between the added pixels and existing pixels Bicubic (3 versions of) Creates best effects but takes the longest Averages the color or gray values of the 16 surrounding pixels and adds that average value to the image. Then uses a calculation intensive algorithm to produce the smoothest tonal gradation around the image Sharper for downsampling; smoother for upsampling

Image Size Dialog Box Generally Speaking Resampling images by changing the width and height values in the Pixel Dimensions section of the Image Size dialog box is primarily used when optimizing images for the web. Resampling or resizing images by changing the width, height and/or resolution values in the Document Size section of the Image Size dialog box is used for print.

Summary Image resizing keeps the number of pixels in your image the same and affects only how large your image will print (the Document Size). Image resampling physically changes the number of pixels in your image (the Pixel Dimensions). The Resample Image option at the bottom of the Image Size dialog box controls whether you're resizing or resampling an image. With Resample Image checked, you're resampling the image. With it unchecked, you're simply resizing the image. It is always best to resample down.