SlideShare a Scribd company logo
 Describe the various graphic formats used in digital media.
In This Chapter, you’ll learn on:
 The Basics of Digital Image Formation
 Identifying of the Various file types such as JPEG,
GIF, AI, PDF and etc
 The Characteristics and use of the Various Graphic
Formats
In this chapter, we will look at the basic types of digital
images and file formats. Images, such as pictures, clip
art, 3-D graphics, and animation, are commonly used
in designing for both multimedia and the Web.
Regardless of their forms, multimedia images are
generated by the computers in two ways: as vector-
based graphics and bitmap images
The Basics of Digital Image Formation
Vector graphics
 Vector-based images are defined by mathematical
relationships between points and the paths connecting
them to describe an image.
 Graphical elements in a vector file are called objects.
Each object is an independent entity with properties,
such as color, shape, size, outline, and position on the
screen, by its definition. Since each object is a self-
contained entity, you can easily move and change its
properties while maintaining its original clarity, and
without affecting other objects in the illustration.
 Object graphics are very little memory because
only the location and design information must be
defined – very simple values. This also applies to the
colors used in object graphics, which are also
expressed numerically.
 These characteristics make vector-based programs
ideal for illustration and 3D modeling, where the
individual objects usually need to be created and
manipulated through the design process.
Figure 1. Vector-based graphic: the image itself on
the left and the actual lines that make up the drawing
on the right.
Working with Vector Graphics
Outlines and Lines
 Lines and outlines in object
graphics can assume any
color.
 You can also specify how
thick the lines should be, the
style of the lines (solid,
dotted, etc) and the shape
of the corners (curved,
squared, etc).
Fill
 Curved and closed objects
can be filled with colors,
color shifts and patterns.
 The colors are expressed
numerically in terms of the
ink coverage required for
the respective printing inks.
 You can select fill patterns
and color shifts from a
predetermined menu.
Patterns
 A pattern consists of a small group of objects repeated in a
square pattern. It is easy to make your own patterns.
Gradients
 Color shifts are transitions among several colors at set distances.
 Gradients can either be linear or circular
Compound Path (Knockouts)
 Also known as knockouts, A curve that is placed
within a closed object – a star within a square, for
example – can be selected as a knockout.
 In this example, the selection means that a star
knocks out a transparent hole in the square. As a
result, whatever you put behind the square will be
visible through the star hole.
Applications for Object Graphics
 Object graphics are created in illustration software
such as Adobe Illustrator
 Adobe Streamline is one example. They are usually
used to convert pixel-based logotypes into object
graphics so they can be used in all possible sizes.
 Object graphics are usually saved in the image
format Encapsulated Postscript (EPS). You can also
save them in whatever format the software uses,
but then the object may not be able to be placed
in a page layout application.
Raster Graphics
 Raster graphics also known as bitmap images are made of individual dots
called pixels that are arranged and colored differently to form a pattern. The
individual squares that make up the total image can be seen when zoomed
in. However, from a greater distance the color and shape of a bitmap image
appear continuous.
 Since each pixel is colored individually, you can easily work with photographs
with so many colors and can create photo-realistic effects such as shadowing
and increasing color by manipulating select areas, one pixel at a time.
Pixel Graphics
Digitalized photographic images
consist of tiny squares of a color,
called pixels. The eye cannot
perceive the pixels unless the
image is greatly enlarged.
Bitmap programs are ideal to retouch photographs,
editing images and video files and creating original
artwork. Variety of changes to photographs can be
made, such as adjusting the lighting, removing
scratches, people, and things, swapping details
between images, adding text and objects, adjusting
color, and applying combinations of special effects.
Working with Graphics
 When photographs or illustrations are scanned into
a computer, pixel-based images, or pixel graphics,
are created. Another term of pixel is raster.
 A pixel graphic is a divided into tiny squares of
color, almost like a mosaic. These tiny squares of
color are referred to as pixels.
 Pixel graphics can also be created directly in the
computer or by a digital camera.
Resolution
 If you assume that a pixel-based image is printed in
a certain size, the image will consist of a certain
number of pixels per centimeter or per inch (ppi).
 The resolution of an image is measured in ppi. This
refers to the number and size of the pixels that
make up a particular image.
 Sometimes the unit dpi is used (incorrectly) instead
of ppi. Dpi, which means dots per inch, is the unit
used to describe the output resolution in printers.
 If the resolution of an image is low, the pixels will be large, and you will clearly
see that the graphic consists of a mosaic-like pattern. At a higher resolution,
however, the eye cannot perceive that the image is made up of pixels.
 There is an appropriate high-level resolution for most images; if you make the
resolution higher than that, you will not get a better quality image but it will
take up more storage space
Image Resolution
A pixel-based image always has a
set resolution (pixels per inch, or
ppi).
In the example, the image has 8
pixels/0.0228 inches = 350 pixels per
inch, or 350 ppi.
Color Modes, Channels and Bit Depth
 Bit Depth
o For now, I believed that you have a better understanding
of what is object and pixel graphics. As to let you know, in
vector-based programs, such as Adobe Illustrator and
CorelDraw Graphics Suite, the drawing tools make shapes
based on mathematical formulas.
o As to recap, vector objects have smooth lines and
continuous colors even when you magnify the image.
Vector drawings are resolution independent, meaning that
when print a vector-based drawing, the quality depends
only on the resolution of the printer.
A vector drawing looks the
same whether viewed at its
actual size or magnified.
 In pixel-based programs, such as Photoshop,
images are made up of tiny pixels that are
arranged and colored to form a pattern. Each pixel
represents a color.
 When you view a pixel-based image at its intended
size and resolution, the colors and shapes appear
smooth, but if you magnify the image, tiny
individual squares become more evident. You can
edit a pixel-based image pixel by pixel, and pixel-
based images depend on the resolution at which
they are saved for quality when printing the image.
 Color depth sets how many colors are available in
each pixel. The number of colors available in a pixel
can range from two colors to millions.
A pixel-based image
looks smooth at its
actual size but shows its
pixels when magnified.
 A color mode determines how the channels in each pixel
create the colors in an image. And each channel in a pixel
represents a primary color.
 Typically, color information is saved in a measurement called
bit depth or color depth.
 This color depth measures how much color information is
available in each pixel. The more bit depth that an image has,
the more colors are available. More color depth translates to
more accurate representation of color on-screen as well as on
the printed page.
 Typical color depth values are 1-bit, 8-bit, 16-bit and 24-bit. For
instance, a pixel with a 1-bit color depth has two possible
color values – black and white. An 8-bit pixel has 256 possible
color values and a 24-bit pixel has about 16 million possible
color values.
Channels
 Every image you create in Photoshop contains
channels. Channels store an image’s color
information.
 Each pixel in an image can have as few as one and
as many as four channels. The number of channels
in an image depends upon the color mode in
which the image is set.
 To view the channels in a
color image, use the
Channels palette to display
the image’s channels. Click
on one of the channels to
display only that channel.
Clicking RGB would restore
the full channel display).
 A special grayscale
channel that is used to save
selections is known as an
alpha channel.
Color Modes
 A color model is a scheme used to break colors
down into their component primary parts. Color
models are used to represent color in images in a
standardized way.
 In Photoshop, color models are applied to images
as color modes.
 Photoshop supports eight color modes: Bitmap,
Grayscale, Duotone, Indexed Color, RGB, CMYK,
Lab and Multichannel.
 Any image can be converted to or edited in any
one of the eight color modes. To convert an image
to another color mode, choose Image > Mode and
select a color mode from the submenu
 The different color modes contain a different
number of channels. Table 1 shows the number of
channels per mode.
Table 1
The Number of Channels in a Color Mode
One Channel Three Channels Four Channels
Bitmap RGB CMYK
Grayscale Lab
Duotone Multichannel
Indexed Color
 If you want to convert an image to a color mode
that is unavailable on the submenu (unavailable
options are grayed out), you need to convert the
image to another color mode before converting it
to the desired color mode.
 For instance, if you want to convert an RGB color
image to Bitmap mode, you have to convert the
image to Grayscale first. You will learn more about
the various color modes in the later chapters
The Various File Types and its Characteristics
 Pixel-based images can be saved in a number of
file formats. Some of them have more or less
becomes industry standards. They are primarily
differentiated by which color modes they can
handle as well as the level of features they are
capable of.
The most common image file formats are Photoshop, EPS,
TIFF, PICT, GIF and JPEG. Some are only used on Macintosh
and others only on Windows. The two formats generally
used in graphic production are TIFF and EPS.

More Related Content

What's hot

Technical concepts for graphic design production 2
Technical concepts for graphic design production 2Technical concepts for graphic design production 2
Technical concepts for graphic design production 2
Ahmed Ismail
 
WEB I - 08 - Digital Media
WEB I - 08 - Digital MediaWEB I - 08 - Digital Media
WEB I - 08 - Digital Media
Randy Connolly
 
Spatial and tonal resolution
Spatial and tonal resolutionSpatial and tonal resolution
Spatial and tonal resolution
SIES GST
 
of Pixels and Bits
of Pixels and Bitsof Pixels and Bits
of Pixels and Bits
Shawn Calvert
 
Digital image processing ppt
Digital image processing pptDigital image processing ppt
Digital image processing ppt
khanam22
 
Bitmap graphics
Bitmap graphicsBitmap graphics
Bitmap graphics
SabahtHussein
 
الوسائط المتعددة Multimedia تاج
الوسائط المتعددة  Multimedia تاجالوسائط المتعددة  Multimedia تاج
الوسائط المتعددة Multimedia تاج
maaz hamed
 
Glossary dip
Glossary dipGlossary dip
Glossary dip
Upendra Pratap Singh
 
Image processing fundamentals
Image processing fundamentalsImage processing fundamentals
Image processing fundamentals
A B Shinde
 
Image & Graphics
Image & GraphicsImage & Graphics
Image & Graphics
Shafiqul Islam Tuhin
 
Image processing
Image processingImage processing
Image processing
Mohammed Abraruddin
 
Ch2
Ch2Ch2
2012 13 raster vs vector
2012 13 raster vs vector2012 13 raster vs vector
2012 13 raster vs vectorbj43950
 
Digital graphics technology
Digital graphics technologyDigital graphics technology
Digital graphics technologyBeckyJRitchie
 

What's hot (18)

Technical concepts for graphic design production 2
Technical concepts for graphic design production 2Technical concepts for graphic design production 2
Technical concepts for graphic design production 2
 
Power point x
Power point xPower point x
Power point x
 
Ha1 technical file
Ha1  technical fileHa1  technical file
Ha1 technical file
 
WEB I - 08 - Digital Media
WEB I - 08 - Digital MediaWEB I - 08 - Digital Media
WEB I - 08 - Digital Media
 
Spatial and tonal resolution
Spatial and tonal resolutionSpatial and tonal resolution
Spatial and tonal resolution
 
of Pixels and Bits
of Pixels and Bitsof Pixels and Bits
of Pixels and Bits
 
Digital image processing ppt
Digital image processing pptDigital image processing ppt
Digital image processing ppt
 
d_vbp_print
d_vbp_printd_vbp_print
d_vbp_print
 
Bitmap graphics
Bitmap graphicsBitmap graphics
Bitmap graphics
 
الوسائط المتعددة Multimedia تاج
الوسائط المتعددة  Multimedia تاجالوسائط المتعددة  Multimedia تاج
الوسائط المتعددة Multimedia تاج
 
Glossary dip
Glossary dipGlossary dip
Glossary dip
 
Image processing fundamentals
Image processing fundamentalsImage processing fundamentals
Image processing fundamentals
 
Image & Graphics
Image & GraphicsImage & Graphics
Image & Graphics
 
Image processing
Image processingImage processing
Image processing
 
Ch2
Ch2Ch2
Ch2
 
Seminar5.1
Seminar5.1Seminar5.1
Seminar5.1
 
2012 13 raster vs vector
2012 13 raster vs vector2012 13 raster vs vector
2012 13 raster vs vector
 
Digital graphics technology
Digital graphics technologyDigital graphics technology
Digital graphics technology
 

Viewers also liked

Viewers also liked (6)

Chap29
Chap29Chap29
Chap29
 
Chap4
Chap4Chap4
Chap4
 
Chap27
Chap27Chap27
Chap27
 
Chap25
Chap25Chap25
Chap25
 
Happy, happy
Happy, happyHappy, happy
Happy, happy
 
Chap72&73
Chap72&73Chap72&73
Chap72&73
 

Similar to Chap9 10

multimedia image.ppt
multimedia image.pptmultimedia image.ppt
multimedia image.ppt
JoyFatimaVergara
 
Digital Image File Formats
Digital Image File FormatsDigital Image File Formats
Digital Image File Formats
indiangarg
 
Techinal file raster and vector images
Techinal file   raster and vector imagesTechinal file   raster and vector images
Techinal file raster and vector imagesFirstClassProductions
 
Introduction to Image Processing_Lecture01
Introduction to Image Processing_Lecture01Introduction to Image Processing_Lecture01
Introduction to Image Processing_Lecture01
jim142
 
Unit iv graphics
Unit iv  graphicsUnit iv  graphics
Unit iv graphics
Arnav Chowdhury
 
Higher - Storing graphics
Higher - Storing graphicsHigher - Storing graphics
Higher - Storing graphics
missstevenson01
 
Basics Of Photoshop
Basics Of PhotoshopBasics Of Photoshop
Basics Of Photoshopkarimnadir
 
Fundamentals Image and Graphics
Fundamentals Image and GraphicsFundamentals Image and Graphics
Fundamentals Image and Graphics
Shrawan Adhikari
 
Computer image
Computer imageComputer image
Computer image
M. Dastagir Ansari
 
Digital Coding of Images.pptx
Digital Coding of Images.pptxDigital Coding of Images.pptx
Digital Coding of Images.pptx
emsResulzade1
 
Sesion 2.1 introduction to photoshop (basic)
Sesion 2.1   introduction to photoshop (basic)Sesion 2.1   introduction to photoshop (basic)
Sesion 2.1 introduction to photoshop (basic)
John Josef Jimenez
 

Similar to Chap9 10 (20)

multimedia image.ppt
multimedia image.pptmultimedia image.ppt
multimedia image.ppt
 
Digital Image File Formats
Digital Image File FormatsDigital Image File Formats
Digital Image File Formats
 
Techinal file raster and vector images
Techinal file   raster and vector imagesTechinal file   raster and vector images
Techinal file raster and vector images
 
Introduction to Image Processing_Lecture01
Introduction to Image Processing_Lecture01Introduction to Image Processing_Lecture01
Introduction to Image Processing_Lecture01
 
Unit iv graphics
Unit iv  graphicsUnit iv  graphics
Unit iv graphics
 
Higher - Storing graphics
Higher - Storing graphicsHigher - Storing graphics
Higher - Storing graphics
 
Graphics
GraphicsGraphics
Graphics
 
Basics Of Photoshop
Basics Of PhotoshopBasics Of Photoshop
Basics Of Photoshop
 
Fundamentals Image and Graphics
Fundamentals Image and GraphicsFundamentals Image and Graphics
Fundamentals Image and Graphics
 
Power point x
Power point xPower point x
Power point x
 
Computer image
Computer imageComputer image
Computer image
 
Digital Coding of Images.pptx
Digital Coding of Images.pptxDigital Coding of Images.pptx
Digital Coding of Images.pptx
 
Sesion 2.1 introduction to photoshop (basic)
Sesion 2.1   introduction to photoshop (basic)Sesion 2.1   introduction to photoshop (basic)
Sesion 2.1 introduction to photoshop (basic)
 
L3 cmp technicalfile_180911
L3 cmp technicalfile_180911L3 cmp technicalfile_180911
L3 cmp technicalfile_180911
 
graphics
graphicsgraphics
graphics
 
Digital image
Digital imageDigital image
Digital image
 
HA1 Technical File
HA1 Technical FileHA1 Technical File
HA1 Technical File
 
Technical File
Technical FileTechnical File
Technical File
 
Ha1 technical file
Ha1  technical fileHa1  technical file
Ha1 technical file
 
Ha1 technical file
Ha1  technical fileHa1  technical file
Ha1 technical file
 

More from dkd_woohoo (20)

Chap70
Chap70Chap70
Chap70
 
Chap67
Chap67Chap67
Chap67
 
Chap66
Chap66Chap66
Chap66
 
Chap65
Chap65Chap65
Chap65
 
Chap62
Chap62Chap62
Chap62
 
Chap61
Chap61Chap61
Chap61
 
Chap69
Chap69Chap69
Chap69
 
Chap60
Chap60Chap60
Chap60
 
Chap59
Chap59Chap59
Chap59
 
Chap55
Chap55Chap55
Chap55
 
Chap54
Chap54Chap54
Chap54
 
Chap52
Chap52Chap52
Chap52
 
Chap50
Chap50Chap50
Chap50
 
Chap49
Chap49Chap49
Chap49
 
Chap48
Chap48Chap48
Chap48
 
Chap46
Chap46Chap46
Chap46
 
Chap45
Chap45Chap45
Chap45
 
Chap44
Chap44Chap44
Chap44
 
Chap43
Chap43Chap43
Chap43
 
Chap42
Chap42Chap42
Chap42
 

Recently uploaded

Bits & Pixels using AI for Good.........
Bits & Pixels using AI for Good.........Bits & Pixels using AI for Good.........
Bits & Pixels using AI for Good.........
Alison B. Lowndes
 
GraphRAG is All You need? LLM & Knowledge Graph
GraphRAG is All You need? LLM & Knowledge GraphGraphRAG is All You need? LLM & Knowledge Graph
GraphRAG is All You need? LLM & Knowledge Graph
Guy Korland
 
Mission to Decommission: Importance of Decommissioning Products to Increase E...
Mission to Decommission: Importance of Decommissioning Products to Increase E...Mission to Decommission: Importance of Decommissioning Products to Increase E...
Mission to Decommission: Importance of Decommissioning Products to Increase E...
Product School
 
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
Product School
 
JMeter webinar - integration with InfluxDB and Grafana
JMeter webinar - integration with InfluxDB and GrafanaJMeter webinar - integration with InfluxDB and Grafana
JMeter webinar - integration with InfluxDB and Grafana
RTTS
 
Connector Corner: Automate dynamic content and events by pushing a button
Connector Corner: Automate dynamic content and events by pushing a buttonConnector Corner: Automate dynamic content and events by pushing a button
Connector Corner: Automate dynamic content and events by pushing a button
DianaGray10
 
Essentials of Automations: Optimizing FME Workflows with Parameters
Essentials of Automations: Optimizing FME Workflows with ParametersEssentials of Automations: Optimizing FME Workflows with Parameters
Essentials of Automations: Optimizing FME Workflows with Parameters
Safe Software
 
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdfFIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
FIDO Alliance
 
IOS-PENTESTING-BEGINNERS-PRACTICAL-GUIDE-.pptx
IOS-PENTESTING-BEGINNERS-PRACTICAL-GUIDE-.pptxIOS-PENTESTING-BEGINNERS-PRACTICAL-GUIDE-.pptx
IOS-PENTESTING-BEGINNERS-PRACTICAL-GUIDE-.pptx
Abida Shariff
 
Search and Society: Reimagining Information Access for Radical Futures
Search and Society: Reimagining Information Access for Radical FuturesSearch and Society: Reimagining Information Access for Radical Futures
Search and Society: Reimagining Information Access for Radical Futures
Bhaskar Mitra
 
Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024
Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024
Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024
Tobias Schneck
 
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdfFIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
FIDO Alliance
 
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
Ramesh Iyer
 
Accelerate your Kubernetes clusters with Varnish Caching
Accelerate your Kubernetes clusters with Varnish CachingAccelerate your Kubernetes clusters with Varnish Caching
Accelerate your Kubernetes clusters with Varnish Caching
Thijs Feryn
 
From Siloed Products to Connected Ecosystem: Building a Sustainable and Scala...
From Siloed Products to Connected Ecosystem: Building a Sustainable and Scala...From Siloed Products to Connected Ecosystem: Building a Sustainable and Scala...
From Siloed Products to Connected Ecosystem: Building a Sustainable and Scala...
Product School
 
Epistemic Interaction - tuning interfaces to provide information for AI support
Epistemic Interaction - tuning interfaces to provide information for AI supportEpistemic Interaction - tuning interfaces to provide information for AI support
Epistemic Interaction - tuning interfaces to provide information for AI support
Alan Dix
 
Transcript: Selling digital books in 2024: Insights from industry leaders - T...
Transcript: Selling digital books in 2024: Insights from industry leaders - T...Transcript: Selling digital books in 2024: Insights from industry leaders - T...
Transcript: Selling digital books in 2024: Insights from industry leaders - T...
BookNet Canada
 
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdfFIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
FIDO Alliance
 
AI for Every Business: Unlocking Your Product's Universal Potential by VP of ...
AI for Every Business: Unlocking Your Product's Universal Potential by VP of ...AI for Every Business: Unlocking Your Product's Universal Potential by VP of ...
AI for Every Business: Unlocking Your Product's Universal Potential by VP of ...
Product School
 
Empowering NextGen Mobility via Large Action Model Infrastructure (LAMI): pav...
Empowering NextGen Mobility via Large Action Model Infrastructure (LAMI): pav...Empowering NextGen Mobility via Large Action Model Infrastructure (LAMI): pav...
Empowering NextGen Mobility via Large Action Model Infrastructure (LAMI): pav...
Thierry Lestable
 

Recently uploaded (20)

Bits & Pixels using AI for Good.........
Bits & Pixels using AI for Good.........Bits & Pixels using AI for Good.........
Bits & Pixels using AI for Good.........
 
GraphRAG is All You need? LLM & Knowledge Graph
GraphRAG is All You need? LLM & Knowledge GraphGraphRAG is All You need? LLM & Knowledge Graph
GraphRAG is All You need? LLM & Knowledge Graph
 
Mission to Decommission: Importance of Decommissioning Products to Increase E...
Mission to Decommission: Importance of Decommissioning Products to Increase E...Mission to Decommission: Importance of Decommissioning Products to Increase E...
Mission to Decommission: Importance of Decommissioning Products to Increase E...
 
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
 
JMeter webinar - integration with InfluxDB and Grafana
JMeter webinar - integration with InfluxDB and GrafanaJMeter webinar - integration with InfluxDB and Grafana
JMeter webinar - integration with InfluxDB and Grafana
 
Connector Corner: Automate dynamic content and events by pushing a button
Connector Corner: Automate dynamic content and events by pushing a buttonConnector Corner: Automate dynamic content and events by pushing a button
Connector Corner: Automate dynamic content and events by pushing a button
 
Essentials of Automations: Optimizing FME Workflows with Parameters
Essentials of Automations: Optimizing FME Workflows with ParametersEssentials of Automations: Optimizing FME Workflows with Parameters
Essentials of Automations: Optimizing FME Workflows with Parameters
 
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdfFIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
 
IOS-PENTESTING-BEGINNERS-PRACTICAL-GUIDE-.pptx
IOS-PENTESTING-BEGINNERS-PRACTICAL-GUIDE-.pptxIOS-PENTESTING-BEGINNERS-PRACTICAL-GUIDE-.pptx
IOS-PENTESTING-BEGINNERS-PRACTICAL-GUIDE-.pptx
 
Search and Society: Reimagining Information Access for Radical Futures
Search and Society: Reimagining Information Access for Radical FuturesSearch and Society: Reimagining Information Access for Radical Futures
Search and Society: Reimagining Information Access for Radical Futures
 
Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024
Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024
Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024
 
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdfFIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
 
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
 
Accelerate your Kubernetes clusters with Varnish Caching
Accelerate your Kubernetes clusters with Varnish CachingAccelerate your Kubernetes clusters with Varnish Caching
Accelerate your Kubernetes clusters with Varnish Caching
 
From Siloed Products to Connected Ecosystem: Building a Sustainable and Scala...
From Siloed Products to Connected Ecosystem: Building a Sustainable and Scala...From Siloed Products to Connected Ecosystem: Building a Sustainable and Scala...
From Siloed Products to Connected Ecosystem: Building a Sustainable and Scala...
 
Epistemic Interaction - tuning interfaces to provide information for AI support
Epistemic Interaction - tuning interfaces to provide information for AI supportEpistemic Interaction - tuning interfaces to provide information for AI support
Epistemic Interaction - tuning interfaces to provide information for AI support
 
Transcript: Selling digital books in 2024: Insights from industry leaders - T...
Transcript: Selling digital books in 2024: Insights from industry leaders - T...Transcript: Selling digital books in 2024: Insights from industry leaders - T...
Transcript: Selling digital books in 2024: Insights from industry leaders - T...
 
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdfFIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
 
AI for Every Business: Unlocking Your Product's Universal Potential by VP of ...
AI for Every Business: Unlocking Your Product's Universal Potential by VP of ...AI for Every Business: Unlocking Your Product's Universal Potential by VP of ...
AI for Every Business: Unlocking Your Product's Universal Potential by VP of ...
 
Empowering NextGen Mobility via Large Action Model Infrastructure (LAMI): pav...
Empowering NextGen Mobility via Large Action Model Infrastructure (LAMI): pav...Empowering NextGen Mobility via Large Action Model Infrastructure (LAMI): pav...
Empowering NextGen Mobility via Large Action Model Infrastructure (LAMI): pav...
 

Chap9 10

  • 1.  Describe the various graphic formats used in digital media.
  • 2. In This Chapter, you’ll learn on:  The Basics of Digital Image Formation  Identifying of the Various file types such as JPEG, GIF, AI, PDF and etc  The Characteristics and use of the Various Graphic Formats
  • 3. In this chapter, we will look at the basic types of digital images and file formats. Images, such as pictures, clip art, 3-D graphics, and animation, are commonly used in designing for both multimedia and the Web. Regardless of their forms, multimedia images are generated by the computers in two ways: as vector- based graphics and bitmap images
  • 4. The Basics of Digital Image Formation Vector graphics  Vector-based images are defined by mathematical relationships between points and the paths connecting them to describe an image.  Graphical elements in a vector file are called objects. Each object is an independent entity with properties, such as color, shape, size, outline, and position on the screen, by its definition. Since each object is a self- contained entity, you can easily move and change its properties while maintaining its original clarity, and without affecting other objects in the illustration.
  • 5.  Object graphics are very little memory because only the location and design information must be defined – very simple values. This also applies to the colors used in object graphics, which are also expressed numerically.  These characteristics make vector-based programs ideal for illustration and 3D modeling, where the individual objects usually need to be created and manipulated through the design process.
  • 6. Figure 1. Vector-based graphic: the image itself on the left and the actual lines that make up the drawing on the right.
  • 7. Working with Vector Graphics Outlines and Lines  Lines and outlines in object graphics can assume any color.  You can also specify how thick the lines should be, the style of the lines (solid, dotted, etc) and the shape of the corners (curved, squared, etc).
  • 8. Fill  Curved and closed objects can be filled with colors, color shifts and patterns.  The colors are expressed numerically in terms of the ink coverage required for the respective printing inks.  You can select fill patterns and color shifts from a predetermined menu.
  • 9. Patterns  A pattern consists of a small group of objects repeated in a square pattern. It is easy to make your own patterns. Gradients  Color shifts are transitions among several colors at set distances.  Gradients can either be linear or circular
  • 10. Compound Path (Knockouts)  Also known as knockouts, A curve that is placed within a closed object – a star within a square, for example – can be selected as a knockout.  In this example, the selection means that a star knocks out a transparent hole in the square. As a result, whatever you put behind the square will be visible through the star hole.
  • 11.
  • 12. Applications for Object Graphics  Object graphics are created in illustration software such as Adobe Illustrator  Adobe Streamline is one example. They are usually used to convert pixel-based logotypes into object graphics so they can be used in all possible sizes.  Object graphics are usually saved in the image format Encapsulated Postscript (EPS). You can also save them in whatever format the software uses, but then the object may not be able to be placed in a page layout application.
  • 13. Raster Graphics  Raster graphics also known as bitmap images are made of individual dots called pixels that are arranged and colored differently to form a pattern. The individual squares that make up the total image can be seen when zoomed in. However, from a greater distance the color and shape of a bitmap image appear continuous.  Since each pixel is colored individually, you can easily work with photographs with so many colors and can create photo-realistic effects such as shadowing and increasing color by manipulating select areas, one pixel at a time. Pixel Graphics Digitalized photographic images consist of tiny squares of a color, called pixels. The eye cannot perceive the pixels unless the image is greatly enlarged.
  • 14. Bitmap programs are ideal to retouch photographs, editing images and video files and creating original artwork. Variety of changes to photographs can be made, such as adjusting the lighting, removing scratches, people, and things, swapping details between images, adding text and objects, adjusting color, and applying combinations of special effects.
  • 15. Working with Graphics  When photographs or illustrations are scanned into a computer, pixel-based images, or pixel graphics, are created. Another term of pixel is raster.  A pixel graphic is a divided into tiny squares of color, almost like a mosaic. These tiny squares of color are referred to as pixels.  Pixel graphics can also be created directly in the computer or by a digital camera.
  • 16. Resolution  If you assume that a pixel-based image is printed in a certain size, the image will consist of a certain number of pixels per centimeter or per inch (ppi).  The resolution of an image is measured in ppi. This refers to the number and size of the pixels that make up a particular image.  Sometimes the unit dpi is used (incorrectly) instead of ppi. Dpi, which means dots per inch, is the unit used to describe the output resolution in printers.
  • 17.  If the resolution of an image is low, the pixels will be large, and you will clearly see that the graphic consists of a mosaic-like pattern. At a higher resolution, however, the eye cannot perceive that the image is made up of pixels.  There is an appropriate high-level resolution for most images; if you make the resolution higher than that, you will not get a better quality image but it will take up more storage space Image Resolution A pixel-based image always has a set resolution (pixels per inch, or ppi). In the example, the image has 8 pixels/0.0228 inches = 350 pixels per inch, or 350 ppi.
  • 18. Color Modes, Channels and Bit Depth  Bit Depth o For now, I believed that you have a better understanding of what is object and pixel graphics. As to let you know, in vector-based programs, such as Adobe Illustrator and CorelDraw Graphics Suite, the drawing tools make shapes based on mathematical formulas. o As to recap, vector objects have smooth lines and continuous colors even when you magnify the image. Vector drawings are resolution independent, meaning that when print a vector-based drawing, the quality depends only on the resolution of the printer.
  • 19. A vector drawing looks the same whether viewed at its actual size or magnified.
  • 20.  In pixel-based programs, such as Photoshop, images are made up of tiny pixels that are arranged and colored to form a pattern. Each pixel represents a color.  When you view a pixel-based image at its intended size and resolution, the colors and shapes appear smooth, but if you magnify the image, tiny individual squares become more evident. You can edit a pixel-based image pixel by pixel, and pixel- based images depend on the resolution at which they are saved for quality when printing the image.
  • 21.  Color depth sets how many colors are available in each pixel. The number of colors available in a pixel can range from two colors to millions. A pixel-based image looks smooth at its actual size but shows its pixels when magnified.
  • 22.  A color mode determines how the channels in each pixel create the colors in an image. And each channel in a pixel represents a primary color.  Typically, color information is saved in a measurement called bit depth or color depth.  This color depth measures how much color information is available in each pixel. The more bit depth that an image has, the more colors are available. More color depth translates to more accurate representation of color on-screen as well as on the printed page.  Typical color depth values are 1-bit, 8-bit, 16-bit and 24-bit. For instance, a pixel with a 1-bit color depth has two possible color values – black and white. An 8-bit pixel has 256 possible color values and a 24-bit pixel has about 16 million possible color values.
  • 23. Channels  Every image you create in Photoshop contains channels. Channels store an image’s color information.  Each pixel in an image can have as few as one and as many as four channels. The number of channels in an image depends upon the color mode in which the image is set.
  • 24.  To view the channels in a color image, use the Channels palette to display the image’s channels. Click on one of the channels to display only that channel. Clicking RGB would restore the full channel display).  A special grayscale channel that is used to save selections is known as an alpha channel.
  • 25. Color Modes  A color model is a scheme used to break colors down into their component primary parts. Color models are used to represent color in images in a standardized way.  In Photoshop, color models are applied to images as color modes.  Photoshop supports eight color modes: Bitmap, Grayscale, Duotone, Indexed Color, RGB, CMYK, Lab and Multichannel.
  • 26.  Any image can be converted to or edited in any one of the eight color modes. To convert an image to another color mode, choose Image > Mode and select a color mode from the submenu  The different color modes contain a different number of channels. Table 1 shows the number of channels per mode.
  • 27. Table 1 The Number of Channels in a Color Mode One Channel Three Channels Four Channels Bitmap RGB CMYK Grayscale Lab Duotone Multichannel Indexed Color
  • 28.  If you want to convert an image to a color mode that is unavailable on the submenu (unavailable options are grayed out), you need to convert the image to another color mode before converting it to the desired color mode.  For instance, if you want to convert an RGB color image to Bitmap mode, you have to convert the image to Grayscale first. You will learn more about the various color modes in the later chapters
  • 29. The Various File Types and its Characteristics  Pixel-based images can be saved in a number of file formats. Some of them have more or less becomes industry standards. They are primarily differentiated by which color modes they can handle as well as the level of features they are capable of.
  • 30.
  • 31.
  • 32.
  • 33.
  • 34.
  • 35. The most common image file formats are Photoshop, EPS, TIFF, PICT, GIF and JPEG. Some are only used on Macintosh and others only on Windows. The two formats generally used in graphic production are TIFF and EPS.