Você está na página 1de 20

digital media

A R C H I T E C T U R E
01 . 18. 11

IMAGE BY http://ds13.uforg.net/page/2/
PIXEL + GRID
instructor | diaz
course | 590 - 599
Pixels
This lecture will focus on pixels and their relative order with respect to
image resolution, types, and basic Photoshop commands.

+ What is a pixel?
+ What is digital resolution?
+ File types
+ Photoshop and some commands.
Pixels
Pixel: short for “picture element”, is a single point in a graphic image. Most monitor today
have the ability to display over millions of pixels. The usually arrangement of these pixels
appear in rows and columns; hence the grid. How these pixels work are base on the determi-
nate device or programs used. For this lecture, we can visualize three concepts here; pro-
grams (like Photoshop), mathematicians, and digital devices.

1. For programs, a pixel is a tiny square. Where an image is host to grids of packed pixels with absolutely no variant
of gaps or overlapping. These pixels are numerically correct in their order with respect to their bit value.

2. Mathematicians: the pixel is a geometric point of zero size. It is an analog source image that is converted to digital
format. Is specific location is mapped by it’s color sample.

3. Digital devices: A pixel is a circular dot with soft edges. These pixels may appear or not larger than the pixel
defined grid. At this point, pixels are allowed to overlap. A digital image may have colors in the pixel region that are com-
bined, using a falloff curve that weights their contribution according to their distance from the center.
Pixels
Digital images are created by scanning photographs or slides, by directly capturing images
using a digital or video camera, or by importing files from another computer graphics applica-
tion. Before displaying or printing the images, they are usually processed using image-
editing programs, such as Adobe Photoshop. These programs generate bitmap or raster
images that use a grid of small squares known as 'pixels' to represent images. Each pixel is
assigned a specific location and a grayscale or color value (bit or pixel depth)
Pixels are arranged in Rows and Columns
a Bit and it’s pixel
If you were to zoom in on a image, the pixel is reveal at a power magnification. On a monitor,
the magnification will result in either a blur or “box-like” structure while the actual print will be
blurry. The actual size of the image depth is dependent on: (1) the total number of pixels in
the image (determined by multiplying pixel dimensions along the height and width of a
bitmap image) and (2) their bit depth.
These images represent the pixel depth of 1bit and 8 bit.
a Bit and it’s pixel
True black and white drawings have pixel depths of 1-bit (i.e., the pixel is either black or
white). Grayscale images have pixel depths that typically range from 5-bits (32 shades of
gray) to 8-bits (256 shades of gray).

Color images have pixel depths that typically range from 4-bit (16 colors) to 8-bit (256 colors)
to 24-bit (~16 million colors).

“This array is the size of the display window. For example, if the image is 100x100 pixels, there will be 10000 values and if the window is
200x300 pixels, there will be 60000 values. The index value defines the position of a value within the array. For example, the statment color
b = pixels[230] will set the variable b to be equal to the value at that location in the array” –Processing.org

a Bit represent each pixels that determines the arrangements of colors or shades of gays
displayed. For example, a 8-bit color mode will have 8 bits per pixel, making is possible to
display to the 8th power (256) different colors or shades of gray.
a dot per inch (dpi)

Dots per inch (DPI) in this context, refers to the smallest amount of ink that a given printer
can print. Put another way, the more dots that a printer (or imagesetter) can apply per inch,
the higher the resolution (and therefore quality of image reproduction) an imaging device can
reproduce.

Pixels per inch


Pixels per inch (PPI) is often used interchangeably with DPI. PPI is, arguably, where the con-
fusion started from in the first place. PPI a somewhat relative term. Once a photograph is
opened in a program such as Adobe Photoshop and displayed on a computer screen, its re-
lation to print paradigm concepts such as per inch are not always helpful. In many cases it is
actually more helpful to talk about the total width and height of the digital image in pixels,
rather than pixels per inch or dots per inch.
a dot per inch (dpi)

Digital devices:
When a digital image is described in inches, it is being calculated, based on the Monitors
Resolution. Or on the Printers Resolution. (Both of which are different and non-related, thus
causing a lot of confusion)

Most monitors are set at 96 dpi (dots per inch) If a digital image is 960 pixels wide, then that
digital image would be reported as being 10 inches wide. (960 divide by 96 = 10)

The same image, displayed on a monitor that is set at 72 dpi, would report that image as
being 13.3 inches wide.
iPod Touch (4th gen.) iPad iMac Pro
920x640 dpi 1020x768 dpi up to 1440x900 dpi
at 326 ppi at 138 ppi and up to 600 ppi
CRT monitor Samsung LED monitor Vizio LED flat screen
Resolution: 1024x768 Native Resol.: 1920 x 1080 p Native Panel Resolution: 1920 x 1080 pixels
max. 1600x1200 Signal Compatibility: 1080p (FHDTV)
Colors: 1.06 Billion
Computer Support: 640 x 480, 800 x 600,
1024 x 768, 1920 x 1080 via RGB or
1920 x 1080 via HDMI
a dot per inch (dpi)

So the more pixels you have in a set image dimension, the better the quality. For example, if
you have a 6 x 6inch picture with a 300 pixel compared to a 1000 pixel, the 1000 will result
in higher print quality results.
Let's say you bought a camera that produced pictures that were 6 x 6 pixels.
This camera would then be a 36 pixel camera! (6 x 6 = 36)

Let's say your camera produces pictures that are: 1280 x 960 pixels

1280 x 960 = 1,228,800 pixels = 1.2288 MegaPixels


But the manufacturers round up and call it a 1.3 MegaPixel Camera.
resolution (dpi)

The resolution is dependent on the degree of pixels it can display and the number of bits are
used to represent each pixel. Most systems can display 640x480 or about 300,000 pixels. In
other cases, some systems (most mobile devices) can display 800x600 pixzels. However, if
you have a 24 bit system, or 24 bits per pixel, then there is an ability of hold more than 16 mil-
lion different colors!

In each digital device, there are certain colors retained for maximum views. This colors are
set at certain color values set at grayscale, cmyk, and rgb.
grayscale
a grayscale or digital image is an image in
which the value of each pixel is a single
sample, that is, it carries only intensity infor-
mation. Images of this sort, also known as
black-and-white, are composed exclusively
of shades ofgray, varying from black at the
weakest intensity to white at the strongest.

cmyk
The CMYK color model (process color, four
color) is a subtractive color model, used in
color printing, and is also used to describe
the printing process itself. CMYK refers to
the four inks used in some color
printing:cyan, magenta, yellow, and key
black.

rgb
The RGB color model is an additive color
model in which red, green, and blue light are
added together in various ways to reproduce
a broad array of colors. The name of the
model comes from the initials of the three
additive primary colors, red, green, and blue.
resolution (dpi)

In a monitor display device, an image can reveal a variant degree of PPI (pixels per inch). A
pixel or “picture element” is a specific x,y coordinate (dot) on your screen. A high-resolution
setting displays more pixels per inch. In practical terms, the same picture on a low resolution
monitor looks larger than it does on a higher resolution monitor because the pixels are
spread out over a larger area.

If you were to change your image from a 300dpi and downsampled it, the result would create
a smaller image printout. For example, if you take the 300 dpi image at 300x300 to a
96x96dpi, the new image will go from a 3in. to a 1in size.
Resolution ratio chart
definitions
pixel
a pixel (or picture element)[1] is a single point in a raster image. The pixel is the smallest addressable screen element; it is the smallest unit
of picture that can be controlled. Each pixel has its own address. The address of a pixel corresponds to its coordinates. Pixels are normally
arranged in a two-dimensional grid, and are often represented using dots or squares. -wikipedia

bitmap
a bitmap is a type of memory organization or image file format used to store digital images. The term bitmap comes from thecomputer
programming terminology, meaning just a map of bits, a spatially mapped array of bits. Now, along with pixmap, it commonly refers to the
similar concept of a spatially mapped array of pixels. Raster images in general may be referred to as bitmaps or pixmaps, whether synthetic
or photographic, in files or memory.

grayscale
a grayscale or digital image is an image in which the value of each pixel is a single sample, that is, it carries only intensity information.
Images of this sort, also known as black-and-white, are composed exclusively of shades ofgray, varying from black at the weakest intensity
to white at the strongest.

cmyk
The CMYK color model (process color, four color) is a subtractive color model, used in color printing, and is also used to describe the print-
ing process itself. CMYK refers to the four inks used in some color printing:cyan, magenta, yellow, and key black.

rgb
The RGB color model is an additive color model in which red, green, and blue light are added together in various ways to reproduce a broad
array of colors. The name of the model comes from the initials of the three additive primary colors, red, green, and blue.

image types image types

jpg - compression (artifacts are cumulative with saves) best for psd - Photoshop file type
low filesize images without linework
AI - Adobe Illustrator file type
png - (compression cumulative)

tiff - (compression optional) maintains layers

Você também pode gostar