Display and Print

Now that we've got a good foundation of image and display resolution, 0:00 let's take a look at a more traditional method to view images, print. 0:03 When browsing the web, we often see images that appear high quality and look great. 0:08 However, I'm sure everyone has seen just the opposite 0:13 when you've gone to print that high quality image. 0:16 Perhaps it's smaller than you thought. 0:18 Perhaps it's blurry or chunky. 0:21 When we print something, we have to work with ink and 0:24 need to translate pixels into something else, dots. 0:27 A single pixel's illuminated on a screen with subpixels, which give us the colors. 0:31 These subpixels emit a combination of red, green, and blue light, or RGB. 0:37 Similar to a pixel, a dot on paper is made up of colors, but 0:44 that's where the similarities end. 0:49 A combination of ink spots in the colors of cyan, magenta, yellow, and 0:51 black, or CMYK, are used to replicate colors. 0:55 The shape of a dot is slightly different and depends on the type or 1:01 printing technique being used. 1:05 We won't get into all the nitty-gritty details here but, 1:07 as we can see already, the transition from screen to paper is quite different. 1:10 The quality of a printed image depends on, one, the image resolution, or 1:16 pixel density. 1:21 And two, the capabilities of the printer. 1:22 The pixel density of images, or PPI, 1:26 has a cousin in the offset printing world, dots per inch, or DPI. 1:29 Offset printing is a process typically used by printing press companies 1:35 that transfers each color in a graphic file into individual plates. 1:39 Then the plates are used to imprint each color onto a sheet of paper. 1:43 Now I'm gonna stop here for a minute, PPI and DPI are often used interchangeably. 1:47 Generally, we'll use PPI since we're working with pixels first in 1:54 our applications. 1:58 DPI is mostly concern for a print shop, where you may take your design to be 1:59 professionally printed on an offset printing press. 2:04 It's still an important consideration, but for 2:08 most purposes of creators today, we can think in PPI. 2:10 So I'm gonna continue using PPI in this course. 2:14 Now let's take a look at what goes into making a quality print and 2:18 how PPI affects our printed graphic. 2:22 So let's take a look at our LCD monitor again. 2:25 Remember, this display is running at a resolution of 1920 by 1080. 2:28 LCD display pixel density is typically somewhere between 67 and 130 ppi. 2:33 We're not able to increase or 2:41 decrease the size of an individual pixel on the display. 2:42 So generally we see images with a default ppi of 72. 2:46 However, if this number is different and you're designing something for 2:51 the web or an app, that's okay. 2:55 Remember pixel density, or 2:58 ppi, won't affect the quality of the image on a display. 3:00 Now when we print out this creation 3:05 we need to tell the printer the size of the pixel to print as a dot. 3:08 When we increase the ppi, we actually decrease the size in inches of the image. 3:12 However, it should result in a higher density printed image. 3:18 If we decrease the ppi, we actually increase the printed size. 3:22 Say, 10 pixels per inch would result in a huge print. 3:27 So let's see an example. 3:31 Here we have an image that is 300 pixels by 300 pixels and 3:34 currently set to 100 ppi, resulting in a printed image of 3" x 3". 3:38 If we increase the ppi to 300, the printed image will result in a 1" x 1" graphic. 3:45 And the opposite, 10 ppi would result in a larger 30" x 30" printed graphic. 3:53 And just to drive it home, 4:00 even though we've changed the ppi of the image it's still 300 pixels by 300 pixels. 4:02 Changing the ppi won't change the pixel value and how it shows up on our screen, 4:08 even if we're looking at a high density or retina display. 4:14 Here's a quick grid for reference. 4:19 Print and display. 4:21 Printed assets, and let's limit this to an 8 and a half by 11 sheet of paper, 4:22 should have an output ppi of about 150 for home printers. 4:27 For offset printing, 300 is a good number. 4:32 But I encourage you to reach out to your printer and work with them directly. 4:35 If you're printing photos, this should still apply. 4:40 But you can check with your vendor. 4:43 For color, ensure you've either started your graphic file in CMYK or 4:46 converted your photo into CMYK, to get the most accurate representation. 4:50 We'll get into this deeper in the next video. 4:56 For displays, we don't need to worry about ppi. 4:59 Most applications and images from devices use 72. 5:03 And that's fine, one less thing to worry about. 5:06 For our color we'll want to stick with RGB. 5:10 Hopefully, that gives you a base to work from and 5:14 the grid gives you a reference point. 5:17 In the next video, we'll take a brief dive into color and color spaces. 5:19