Image characteristics

1. Image characteristics • Skills: none • IT concepts: image characteristics: size, shape (aspect ratio), number of pixels, resolution and file type, pixel This work is licensed under a Creative Commons Attribution-Noncommercial-Share Alike 3.0 License.

2. Where does this topic fit? Internet concepts Applications Technology Implications Internet skills Application development Content creation (images)

3. image size

4. Image shape

5. aspect ratio – width:height 2 1 1 1 2:1 aspect ratio 1:1 aspect ratio

6. 4 common aspect ratios 3 4:3 16 6 9 4 6:4 16:9

7. resize, same aspect ratio

8. resize, different aspect ratio

9. images are made of dots called “pixels”

10. Number of pixels 100 x 100 = 10,000 pixels 200 x 200 = 40,000 pixels 50 x 50 2,500 pixels

11. Resolution 100 x 100 = 10,000 pixels 200 x 200 = 40,000 pixels 50 x 50 2,500 pixels The images are all the same size, but the high resolution image on the left has the most pixels.

12. Coffee cup pixels

13. Flat versus photographic images Logos and other images with a limited color palette Photographic images with continuous tone variation

14. Common Internet image file types .gif: Graphic Interchange Format, used for logos, cartoons and other flat art with up to 256 different colors .png: Portable Network Graphics, gif replacement (more colors), but cannot do animation .bmp: Microsoft Bitmap, an uncompressed format used for photographic images .jpeg (or .jpg): Joint Photographers Expert Group, a compressible format used for photographic images Compression – making the file smaller, but reducing image quality. More on this later.

15. Which to use .png (use .gif if animation or compatibility is an issue) .jpg (use .bmp if file size is not an issue)

16. A few questions

17. We covered five characteristics of an image – without looking back, do you recall them? More important – do you know what each means? Two images have the same aspect ratio, but they are different sizes. How can that be?

18. If you try to take a picture immediately after taking another, there is a slight delay. Why? If you are looking through some pictures you just took, why is there a slight delay as it advances from one to another? (Hint – go back to our presentation on the components of a computer system).

19. Which of these images has the largest pixels? 100 x 100 = 10,000 pixels 200 x 200 = 40,000 pixels 50 x 50 2,500 pixels

20. The resolution of an image is determined by the number of pixels it contains and ___.

21. An image is 800 pixels wide and 200 pixels high. What is its aspect ratio? An image is 640 pixels wide and 480 pixels high. What is its aspect ratio? An image is 800 pixels wide and 400 pixels high, and I resize it to 100 pixels high, while maintaining the aspect ratio. What is the new width?

22. If an image has a 1:1 aspect ratio, and it is 10 inches wide, how tall is it? If an image has a 2:1 aspect ratio, and it is 10 inches wide, how tall is it? If an image has a 4:3 aspect ratio, and it is 10 inches wide, how tall is it? If an image has a 16:9 aspect ratio, and it is 10 inches wide, how tall is it?

23. Image characteristics • Skills: none • IT concepts: image characteristics: size, shape (aspect ratio), number of pixels, resolution and file type, pixel This work is licensed under a Creative Commons Attribution-Noncommercial-Share Alike 3.0 License.