4
Most read
12
Most read
18
Most read
Pixels, resolution and Image size
Lecturer: Fran Jackson
Definition: Resolution is the term used to describe the number of dots, or
pixels, used to display an image.
Some examples...
picture Fran Jackson
PPI = (pixels per inch) refers to screen resolution
DPI = (dots per inch) refers to print resolution
The two are interchangeable
Often images are referred to as high resolution (hi-res) or low resolution
(low-res).
High resolution would be an image intended for print, generally having
300 dpi or more.
Low resolution refers to images only intended for screen display, generally
having 72 - 150 dpi.
Image enlarged so that you can see the individual pixels, each pixel is a
solid square of colour.
Standard screen resolution is 72 dpi and standard print resolution is 300 dpi
Circle at 72 dpi enlarged to see individual pixels
Standard screen resolution is 72 dpi and standard print resolution is 300 dpi
Same circle at 300 dpi enlarged to see individual pixels
Image types
Resolution
Raster (Bitmap)
• Made of pixels; tiny dots or squares* of colour
• Represents and edits photo and photo-like elements
better than vector programs with the use of
continuous tones. The use of different colour pixels
allows for smooth blends of colours.
Disadvantages
• Is bound by the number of pixels in the image. It
cannot be scaled up without losing quality.
•Large (dimension) & detailed images equal large file
size
• Some service providers like engravers, stencil-cut
signs, etc, must have vector art.
• It is more difficult to print raster images using a
limited amount of spot colors
• Depending on the complexity of the image,
conversion to vector may be time consuming
Vector
• Made of mathematical calculations that form
objects and lines
• Can be scaled to any size without losing quality
• Resolution-independent: Can be printed at any
resolution
• Number of colours can be easily increased or
reduced to adjust printing budget.
• A large dimension vector graphic can maintain
a small file size.
• Vector art is required by many service
providers
• Can be easily converted to raster
Disadvantages
• It is not the best format for photographs or
photo-like elements with blends of colour
Image scaled 600%
On the left the vector image is still sharp
But
On the left the bitmap image is blurry
Examples of Bitmap of Raster images
All jpg’s are Bitmap or Raster images,
they are made from a mosaic of pixels
jpg file
Characteristics of a jpg file:
• Small file size - compressed file format,
makes the original file a smaller files size
due to lossy compression.
• Smooth gradients like are found in a
typical photograph
• Be careful not to over compress a jpg file
picture Fran Jackson
Too much jpg compression will distort your image
jpg distortion
picture Fran Jackson
RAW is not an acronym for anything, is simply is the raw unprocessed data from your image sensor
JPEG = Joint Photographic Experts Group, nowadays shortened to jpg or JPG
PNG = Portable Network Graphics
GIF = Graphics Interchange Format
TIFF = Tagged Image File Format
Resolution
Examples of Vector images
Vector is a series of lines filled with colour, it is created by the computer.
Therefore the computer is able to manipulate it’s size and properties
easily and without loosing any quality or edge definition
Vector graphics generally have simple outlines and solid colour fill
Vector graphics are small file size also, they are not good for complex images
Vector graphics are commonly used for things like logos
All text in Photoshop is vector
Tools like the shape tool can be used in a vector mode or a bitmap mode
Just make sure you choose the shape layer mode for vector
You can’t mix vector and bitmap on the same
layer, or use bitmap tools on a vector

More Related Content

PPT
Color Gamuts and Spot Colors
PPT
Digital Image Processing
PPT
Raster vs vector graphics
PPT
Raster graphics
PPTX
Raster vs vector
PPTX
Types of Images & File Types
PPTX
Digital image formats
PPT
Image formation
Color Gamuts and Spot Colors
Digital Image Processing
Raster vs vector graphics
Raster graphics
Raster vs vector
Types of Images & File Types
Digital image formats
Image formation

What's hot (20)

PPTX
Resolution
PPT
Vector graphics
PPT
Screen and image resolution
PPT
Digital Image File Formats
PPTX
computed and digital radiography(2)
PPTX
Fundamental Steps Of Image Processing
PPTX
Introduction to Image Compression
PPSX
Color Image Processing: Basics
PPT
Image enhancement ppt nal2
PPTX
GIS Based Project Planning and Management
PPTX
Basic Principles and Types of Animations
PPTX
Basic Introduction To Graphic File Formats
DOC
Multimedia And Animation
PPTX
Color image processing
PPTX
Image processing
PPT
4 multimedia basics
PDF
PPT
Digital Image Processing (DIP)
PPTX
Animation & Animation Techniques
Resolution
Vector graphics
Screen and image resolution
Digital Image File Formats
computed and digital radiography(2)
Fundamental Steps Of Image Processing
Introduction to Image Compression
Color Image Processing: Basics
Image enhancement ppt nal2
GIS Based Project Planning and Management
Basic Principles and Types of Animations
Basic Introduction To Graphic File Formats
Multimedia And Animation
Color image processing
Image processing
4 multimedia basics
Digital Image Processing (DIP)
Animation & Animation Techniques
Ad

Similar to Resolution (20)

PPTX
Digital graphics pro forma
DOCX
Pixel and resolution
PPT
L3 cmp technicalfile_180911
PPTX
File types pro forma
PPT
Techinal file raster and vector images
PPTX
Bitmap and vector
PPTX
File types pro forma
DOCX
PPT
L3 cmp technicalfile_180911
PPTX
Vector and bitmap
PPTX
Vector and bitmap
PPTX
File types pro forma(1)
DOCX
DOCX
PPTX
Unit 54 Task1
PPT
Power point x
PPT
Power point x
PPTX
Technical file
PPT
L3 cmp technicalfile_180911
PDF
Raster vs vector
Digital graphics pro forma
Pixel and resolution
L3 cmp technicalfile_180911
File types pro forma
Techinal file raster and vector images
Bitmap and vector
File types pro forma
L3 cmp technicalfile_180911
Vector and bitmap
Vector and bitmap
File types pro forma(1)
Unit 54 Task1
Power point x
Power point x
Technical file
L3 cmp technicalfile_180911
Raster vs vector
Ad

Recently uploaded (20)

PDF
Windows 11 Pro With Office 2024 Pro Crack Plus Download (Latest 2025)
PPTX
F.Y.B.COM-B-ACC25359.pptxFor a job or role? (e.g., Marketing Manager, Chief E...
PPTX
Why is digital marketing essential for any business?
PPTX
carcinogenic agevcccvvvvhhgxdsxcgjnts.pptx
PPTX
DIGITAL DESIGN AND.pptxttttttttttttttttttt
PPTX
Chapter7 design and Implementation.pptx
PDF
xử lý ảnh thu nhận và xử lý trên FPGA ứng dụng
PDF
APPLICATION OF MATRIX PROFILE TECHNIQUES TO DETECT INSIGHTFUL DISCORDS IN CLI...
PPTX
6. HR and Talent Management Toolkit - Overview.pptx
PPT
1 Introduction Product Design and Development
PPTX
2. Introduction to oral maxillofacial surgery .pptx
PPT
2 Development_Processes_and Organizations.ppt
PPTX
History.pptxjsjsiisjjsjsidididididididksk
PPT
Sustainable cities- concepts and approaches
PPTX
436545997-Curriculum-Design.pptxmamissug
PDF
Medical diagnostic centre case study Live
PDF
Major ppt for aakin cancer and Abhay.pdf
PDF
C462831.pdf American Journal of Multidisciplinary Research and Review
PPTX
19th March ggggghhhgggyhyffhhygg DCA.pptx
PPTX
Best Web Design Agencies in Europe [2025]
Windows 11 Pro With Office 2024 Pro Crack Plus Download (Latest 2025)
F.Y.B.COM-B-ACC25359.pptxFor a job or role? (e.g., Marketing Manager, Chief E...
Why is digital marketing essential for any business?
carcinogenic agevcccvvvvhhgxdsxcgjnts.pptx
DIGITAL DESIGN AND.pptxttttttttttttttttttt
Chapter7 design and Implementation.pptx
xử lý ảnh thu nhận và xử lý trên FPGA ứng dụng
APPLICATION OF MATRIX PROFILE TECHNIQUES TO DETECT INSIGHTFUL DISCORDS IN CLI...
6. HR and Talent Management Toolkit - Overview.pptx
1 Introduction Product Design and Development
2. Introduction to oral maxillofacial surgery .pptx
2 Development_Processes_and Organizations.ppt
History.pptxjsjsiisjjsjsidididididididksk
Sustainable cities- concepts and approaches
436545997-Curriculum-Design.pptxmamissug
Medical diagnostic centre case study Live
Major ppt for aakin cancer and Abhay.pdf
C462831.pdf American Journal of Multidisciplinary Research and Review
19th March ggggghhhgggyhyffhhygg DCA.pptx
Best Web Design Agencies in Europe [2025]

Resolution

  • 1. Pixels, resolution and Image size Lecturer: Fran Jackson
  • 2. Definition: Resolution is the term used to describe the number of dots, or pixels, used to display an image. Some examples...
  • 4. PPI = (pixels per inch) refers to screen resolution DPI = (dots per inch) refers to print resolution The two are interchangeable Often images are referred to as high resolution (hi-res) or low resolution (low-res). High resolution would be an image intended for print, generally having 300 dpi or more. Low resolution refers to images only intended for screen display, generally having 72 - 150 dpi.
  • 5. Image enlarged so that you can see the individual pixels, each pixel is a solid square of colour.
  • 6. Standard screen resolution is 72 dpi and standard print resolution is 300 dpi Circle at 72 dpi enlarged to see individual pixels
  • 7. Standard screen resolution is 72 dpi and standard print resolution is 300 dpi Same circle at 300 dpi enlarged to see individual pixels
  • 10. Raster (Bitmap) • Made of pixels; tiny dots or squares* of colour • Represents and edits photo and photo-like elements better than vector programs with the use of continuous tones. The use of different colour pixels allows for smooth blends of colours. Disadvantages • Is bound by the number of pixels in the image. It cannot be scaled up without losing quality. •Large (dimension) & detailed images equal large file size • Some service providers like engravers, stencil-cut signs, etc, must have vector art. • It is more difficult to print raster images using a limited amount of spot colors • Depending on the complexity of the image, conversion to vector may be time consuming
  • 11. Vector • Made of mathematical calculations that form objects and lines • Can be scaled to any size without losing quality • Resolution-independent: Can be printed at any resolution • Number of colours can be easily increased or reduced to adjust printing budget. • A large dimension vector graphic can maintain a small file size. • Vector art is required by many service providers • Can be easily converted to raster Disadvantages • It is not the best format for photographs or photo-like elements with blends of colour
  • 12. Image scaled 600% On the left the vector image is still sharp But On the left the bitmap image is blurry
  • 13. Examples of Bitmap of Raster images
  • 14. All jpg’s are Bitmap or Raster images, they are made from a mosaic of pixels jpg file Characteristics of a jpg file: • Small file size - compressed file format, makes the original file a smaller files size due to lossy compression. • Smooth gradients like are found in a typical photograph • Be careful not to over compress a jpg file picture Fran Jackson
  • 15. Too much jpg compression will distort your image jpg distortion picture Fran Jackson
  • 16. RAW is not an acronym for anything, is simply is the raw unprocessed data from your image sensor
  • 17. JPEG = Joint Photographic Experts Group, nowadays shortened to jpg or JPG
  • 18. PNG = Portable Network Graphics
  • 19. GIF = Graphics Interchange Format
  • 20. TIFF = Tagged Image File Format
  • 23. Vector is a series of lines filled with colour, it is created by the computer. Therefore the computer is able to manipulate it’s size and properties easily and without loosing any quality or edge definition Vector graphics generally have simple outlines and solid colour fill Vector graphics are small file size also, they are not good for complex images Vector graphics are commonly used for things like logos
  • 24. All text in Photoshop is vector Tools like the shape tool can be used in a vector mode or a bitmap mode Just make sure you choose the shape layer mode for vector You can’t mix vector and bitmap on the same layer, or use bitmap tools on a vector