DPI Demo dilemma

May 28, 2007 5:27 PM

Somewhere on the web there must be an interactive explanation/demonstration for DPI (pixel density) help me find it.

I'm teaching a digital photo class soon. I could build my own demo in Flash, but why do all that work if someone else already has. Currently I use balloons and have the students draw on them, then blow them up (see, the number of dots didn't change !!! ....)

posted by cccorlew to computers & internet (9 comments total)

Why not just print the same image (at relatively low resolution) at two different sizes? Seems like it should get the point across. You might also consider having the same large size at a higher resolution.

Conceptually, is DPI really hard for people?
posted by JMOZ at 5:37 PM on May 28, 2007

This might help, complete with a pop quiz at the end.
posted by jamaro at 6:13 PM on May 28, 2007

If you have a Mac, you can use the built-in zoom feature (command-alt-plus/minus). Command-alt-backslash toggles between blocky (nearest-neighbour) and blurry (bilinear/bicubic/whatnot). If it is disabled, you can enable it with cmd-alt-8.

Just show them some vector graphics in Flash, and use the built-in zoom in Flash (nice and smooth), then try the same thing with the screen zoom (blocky or blurry).
posted by you at 6:13 PM on May 28, 2007

Yes, somehow all kinds of people manage to totally misunderstand it. It seems so simple, but some people are morons, especially programmers when it comes to representing images on a screen:

"Oh, it appears someone set the DPI metadata attribute for this jpeg to 300. Since I read on Wikipedia that PCs are 96 dpi, I'll show this image at %32 of it's actual resolution, because that's totally helpful."

posted by blasdelf at 6:13 PM on May 28, 2007 [1 favorite]

Or bring along a 2-dpi printout from Rasterbator.
posted by you at 6:19 PM on May 28, 2007

The problem with interactive demonstrations is that, conceptually, DPI is everything to do with the physical output (or input) - because a computer screen has a fixed DPI, simply "zooming" the image might confuse people (I'm assuming people who don't get DPI are easily confused).

As JMOZ said, I think using different physical printouts might help people. Some people are only vaguely aware that digital images are made of discrete pixels - boxes of colour - and that changing the size of the image necessitates making those boxes bigger or smaller, that is, fitting more or less of them in an inch.

Start with an image of some fixed, resolution, say, 500 x 500 pixels.

- Show them that image on a computer screen, at 100% zoom.
-Print it out at 50dpi.
-Print it out at 300dpi.

Take an image of a different resolution, say 1000 x 1000. Show them that on the screen, and at different print-out DPIs.

Note that the image always has the same number of "pixels" - the same resolution, but the DPI and the actual physical size of the image are related, and in turn DPI is related to the quality of the image. The 50dpi print will be big, but if you look closely you can probably see the individual pixels on the paper. The 300dpi print will be small, but you probably won't be able to see the dots that make it up. Therefore, show them that if you want a big image that has high quality, you will need a much greater resolution in terms of the number of pixels.

You could probably do the same thing with a scanner - scan something at 50dpi, scan something at 300dpi, and note how their sizes are different on a monitor.
posted by Jimbob at 6:46 PM on May 28, 2007

It may be helpful to bring some physical props that demonstrate the theory on a macro scale. For example, bring in a 1' square of each of the following:

Mosquito Netting

Screen Door

Chickenwire

Explain that the squares in each are like pixels in an image. Only one color can go in each box. What kind of picture can you make by filling in boxes the size of chickenwire? What about the screen door? Even though each piece occupies the same total physical area, the quality of the picture you can make is directly related to how small the pixels are.

Physically controlling one of the variables (total size) while allowing the DPI to change demonstrates why you get better quality pictures with a higher DPI.
posted by odinsdream at 6:38 AM on May 29, 2007

er...except don't call the boxes pixels... since you can confuse pixels with the dots.
posted by odinsdream at 6:39 AM on May 29, 2007

Show them a horizontal line that crosses the images and tilts up by one or two pixels, using different DPI settings as mentioned above. This way you can see that the issue is not just blurry fields around dots of image, but has an effect across the whole image, as the line is seen with one, two, etc, steps occurring along the incline.
posted by StickyCarpet at 8:15 AM on May 29, 2007