Understanding image rendering (digital image theory)

– When we come close to the TV for example, we can see the little squares. These squares are actually pixels if we then approach really close to a smartphone e.g iPhone 4s we will see that we can’t actually see these little squares or maybe we can but with trying really hard. From this, we can conclude that the iPhone has a GREATER PPI (points per inch) inch=2.54cm. So in the case of the iPhone pixels are really tiny, if talking about the TV the pixels are BIGGER! The TV doesn’t t have the equal density as the iPhone because we are watching it at greater range.

– When you are looking at TV at a close range you cannot actually see the pixels but you can see the sub pixels (group of pixels).

– The greater density of the pixels inside an image the more alive the image looks (great density-better picture).

– There exists a gap between pixels.

– Calculating the ppi (pixels per inch) –> first row * column to get the pixel size and then multiply the x inch width and y inch height and you get the area of the display . And now to get the PPI you divide the pixel size with display surface.

– Dots per inch refers to the resolution of a computer printer.

– When talking about PPI in printing 300 is outstanding, as sharp as most printers can print 100 is adequate everything below isn’t good.

All displays are made of from pixels whether it’s a laptop monitor, TV, smartphone etc… Likewise, if we can see the display in color it means that we are at least talking about rgb (red, green, blue channels) each of them has 8 bits and each channel has 2 to the power of 8 possible combinations by mixing these combinations we can get every of the 16 mil colors, also there is the argb mode where a represents a channel as well but more on that later.

Digital image is a rectangular grid of pixels  or “picture elements” it exists as an array of BYTES in the computer’ s RAM memory (this means that every array cell starting from num. 0 to array-length-1 has 1 byte inside of each cell! Important for programming. Fetching the amount of bytes can be done by using the Length property in C# for example).

Pixels are small tiny dots, rectangles or squares they can’t be physically measured and neither can be the distance between them, well it can but it’s not the case for every image that the distance between each pixel will be the same, they are considered as abstract (it doesn’t exist, well it does exist but in a digital way and can be modified and deleted).

Image resolution: refers to image quality and image size specified by the number of pixels but in fact the only attribute that counts is the number of pixels.

Pixels per centimeter (ppcm), Pixels per inch (PPI) or pixel density is a measurement of the resolution of devices in various contexts: typically computer displaysimage scanners, and digital camera image sensors. For example, a 15 inch (38 cm) display whose dimensions work out to 12 inches (30.48 cm) wide by 9 inches (22.86 cm) high, capable of a maximum 1024×768 (or XGA) pixel resolution, can display around 85 PPI in both the horizontal and vertical directions.

Important hints

  • re-sampling = pixels change
  • resizing = pixels do not change, changing the width and the height but the pixels stay the same, they group together
  • aspect ratio 16:9 in units


  • our eye can distinguish 10 mil. Colors rgb gives us more than 16 mil.
  • image compression 8×8 pixels in blocks, more is not good
  • you can resize the picture by decreasing the width and height but you can’t reverse the process, well you can but it will be blurred.
  • 720, 1080 YouTube.