SlideShare a Scribd company logo
Chapter 3: Images
IT-204
Safi Ullah Marwat
Outline
Plan your approach
“The organizing and creative process begins
with drawings in pen or pencil on paper.
Too many times we are enthused about the color
and the computer graphics tools, but they can
overwhelm the creative design process”.
- Dennis Woytek, Assistant Professor, Duquesne
University
Organize your tools
O Many multimedia designers do not limit
their toolkits to the features of a single
authoring platform.
O They employ a variety of applications
and tools to accomplish many specialized
tasks.
Configure Your Computer
Workspace
O Have more than
one monitor to
provide lots of
screen real estate
(viewing area).
Making Still Images
O Still images are generated in two ways:
O Bitmaps
O Vectors
Bitmaps
O Used for photo-realistic images and for
complex drawings requiring fine detail.
O Uses ‘Painting’ software i.e. Adobe
Photoshop, Paint, etc.
O Are used in many file formats including:
.BMP, .GIF, .JPG, .PNG
Bitmaps
Bitmap sources
O Make a bitmap from scratch with a paint
or drawing program.
O Grab a bitmap from an active computer
screen with a screen capture.
Bitmap sources
O Capture a bitmap from a photo or other
artwork using a scanner to digitize the
image.
O Once made, a bitmap can be copied,
altered, e-mailed, and otherwise used in
many creative ways.
Morphing
O http://youtu.be/KVRQ0v15lrc
Morphing
Vector Drawing
O A vector is a line that is described by the
location of its two endpoints.
Try @ Home
Type the following in Notepad:
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
width="200" height="200" viewBox="-100 -100 300
300">
<rect x="0" y="0" fill="yellow" stroke="red"
width="2002" height="100"/>
<text transform="matrix(1 0 0 1 60 60) " font-family="
'TimesNewRomanPS-BoldMT' " font-
size="36">SVG</text>
</svg>
Save as (.svg) file then open on an HTML 5 compatible
browser
SVG
O SVG: Scalable Vector Graphic
O Small in size and can be scaled without
distortion.
O Supported by mobile browser as an
alternative to Flash.
Converting between Bitmaps
and Vectors
O From Vector to
Bitmap  Easy
to do with
drawing
software
O Bitmap to Vector
 Autotracing (
Can cause great
inflation of file
size!)
3D Drawing and Rendering
Z axis
Working in 3D
O 3D applications create
scenes.
O Scenes consist of
numerous objects,
the more objects in
the scene, the more
complex and realistic
the scene is.
O Objects are created
by modeling them.
3d Modeling
Making models realistic
O Texturing: Applying images as a skin to
models to make them look real.
Making models realistic
O Lighting: Setting the mood of the scene or
to simulate the environment in a realistic
manner.
Making models realistic
O Rendering:
When the
computer uses
intricate
algorithms to
apply the
effects you have
have specified
on the objects
you have
created.
Computerized Colours
Additive Colours
O a color is created by combining colored
light sources in three primary colors: red,
green, and blue (RGB).
Subtractive Colours
O Colour is created by combining colored
media such as paints or ink that absorb
(or subtract) some parts of the color
spectrum of light and reflect the others
back to the eye.
O Subtractive color is the process used to
create color in printing (CYMK).
CMYK
Computer Colour Models
O RGB hexidecimal
Computer Colour Models
O HSB (Hue, Saturation, Brightness)
Computer Colour Models
O HSL
(Hue,
Saturation
,
Lightness)
Colour Palettes
O Palettes are mathematical tables that
define the color of a pixel displayed on the
the screen
Microsoft Macintosh Web Safe
Color Depth
Dithering
Image Formats
Format Color Depth Compressio
n
Transparency Uses
.JPG 24 bit
(16.7 million
colours)
Lossy Does not support • Rich color
photographs
• Gradients
• Web images
.BMP 24 bit Lossless Does not support • Native format
for Windows
.PNG 8 bit – 24 bit Lossless Supports • Logos
• Free format
• Does not
support
Animation
.GIF 8 bit (256 colors) Lossless Supports • Logos
• Animation

More Related Content

PPT
Ch06
PPT
PDF
Specialized Application.pdf
PPTX
Computer Graphics Power Point using Open GL and C Programming
DOCX
Digital graphics
PPTX
Computer Graphics Unit 1 for BCA IV SEM.pptx
PPTX
Computer Graphics Introduction, Open GL, Line and Circle drawing algorithm
Ch06
Specialized Application.pdf
Computer Graphics Power Point using Open GL and C Programming
Digital graphics
Computer Graphics Unit 1 for BCA IV SEM.pptx
Computer Graphics Introduction, Open GL, Line and Circle drawing algorithm

Similar to Chapter 3.pptx multimedia and conquer the same thing (20)

PPT
Computer graphics1
PPTX
Digital art
DOCX
Digital graphics technology
PPTX
grade8 graphice chaper 3 lession 03.pptx
PPTX
Digital arts
PPTX
Photoshop
PPT
Digital design
PPTX
YCIS_Forensic PArt 1 Digital Image Processing.pptx
PPTX
Computer graphics.
PPTX
MultimediaLecture5.pptx
PPT
Introduction to graphics
PPTX
3D Technology
PDF
Computer Graphics Notes
PPTX
MIL-PRESENTATION.pptx grade 12 MIL 20-203
DOCX
Digital graphics
PPTX
foedumed:Computer graphics 11_16
PPTX
Chapter 1 fundamentals of digital imaging
PPT
Topic 8 Geometrical Objects and Transformations in 2D and 3D Graphics.ppt
PPT
Geometrical Objects and Transformations in 2D and 3D Graphics.ppt
PPTX
Q2-Digital Art Applications.pptx
Computer graphics1
Digital art
Digital graphics technology
grade8 graphice chaper 3 lession 03.pptx
Digital arts
Photoshop
Digital design
YCIS_Forensic PArt 1 Digital Image Processing.pptx
Computer graphics.
MultimediaLecture5.pptx
Introduction to graphics
3D Technology
Computer Graphics Notes
MIL-PRESENTATION.pptx grade 12 MIL 20-203
Digital graphics
foedumed:Computer graphics 11_16
Chapter 1 fundamentals of digital imaging
Topic 8 Geometrical Objects and Transformations in 2D and 3D Graphics.ppt
Geometrical Objects and Transformations in 2D and 3D Graphics.ppt
Q2-Digital Art Applications.pptx
Ad

More from IqraHanif27 (18)

PPT
personalitymaslow.ppt important notes and
PPTX
permissions.pptx computer science and tec
PDF
Lecture-02.pdf computer relationship easy
PDF
Lecture-01.pdf good lecture important notes
PPT
Quality Management.ppt in detail with notes
PPT
SPM.ppt details of spm project management
PPT
1588095888-intro.pptWeb Technologies and Tools (such as scripting tools) for ...
PPTX
link list.pptx complete notes detailed ans
PPTX
Lec10-Binary-Heaps-19122022-113509am.pptx
PPTX
Lec5-Doubly-Linked-List-24102022-110112am.pptx
PPTX
Lec12-Hash-Tables-27122022-125641pm.pptx
PPTX
NevigationMenu.pptx complete notes and types
PPTX
Chapter 2.pptx multimedia and the uses inlife
PPTX
Chapter 1.pptx multimedia and its uses in
PPTX
economics.pptx gross domastic product uses
PPT
Week 10-11 Managing Tablespaces and Data Files.ppt
PDF
Intro_Chapter_03B.pdf types of printers with example
PPT
ch1.ppt operating system from computer science for BSCs
personalitymaslow.ppt important notes and
permissions.pptx computer science and tec
Lecture-02.pdf computer relationship easy
Lecture-01.pdf good lecture important notes
Quality Management.ppt in detail with notes
SPM.ppt details of spm project management
1588095888-intro.pptWeb Technologies and Tools (such as scripting tools) for ...
link list.pptx complete notes detailed ans
Lec10-Binary-Heaps-19122022-113509am.pptx
Lec5-Doubly-Linked-List-24102022-110112am.pptx
Lec12-Hash-Tables-27122022-125641pm.pptx
NevigationMenu.pptx complete notes and types
Chapter 2.pptx multimedia and the uses inlife
Chapter 1.pptx multimedia and its uses in
economics.pptx gross domastic product uses
Week 10-11 Managing Tablespaces and Data Files.ppt
Intro_Chapter_03B.pdf types of printers with example
ch1.ppt operating system from computer science for BSCs
Ad

Recently uploaded (20)

PDF
O5-L3 Freight Transport Ops (International) V1.pdf
PPTX
202450812 BayCHI UCSC-SV 20250812 v17.pptx
PPTX
Final Presentation General Medicine 03-08-2024.pptx
PPTX
Microbial diseases, their pathogenesis and prophylaxis
PPTX
Pharma ospi slides which help in ospi learning
PDF
01-Introduction-to-Information-Management.pdf
PPTX
Lesson notes of climatology university.
PDF
Chinmaya Tiranga quiz Grand Finale.pdf
PDF
FourierSeries-QuestionsWithAnswers(Part-A).pdf
PDF
ANTIBIOTICS.pptx.pdf………………… xxxxxxxxxxxxx
PDF
Black Hat USA 2025 - Micro ICS Summit - ICS/OT Threat Landscape
PDF
VCE English Exam - Section C Student Revision Booklet
PDF
Microbial disease of the cardiovascular and lymphatic systems
PDF
Complications of Minimal Access Surgery at WLH
PPTX
IMMUNITY IMMUNITY refers to protection against infection, and the immune syst...
PDF
OBE - B.A.(HON'S) IN INTERIOR ARCHITECTURE -Ar.MOHIUDDIN.pdf
PDF
Computing-Curriculum for Schools in Ghana
PPTX
Introduction-to-Literarature-and-Literary-Studies-week-Prelim-coverage.pptx
PDF
3rd Neelam Sanjeevareddy Memorial Lecture.pdf
PDF
Anesthesia in Laparoscopic Surgery in India
O5-L3 Freight Transport Ops (International) V1.pdf
202450812 BayCHI UCSC-SV 20250812 v17.pptx
Final Presentation General Medicine 03-08-2024.pptx
Microbial diseases, their pathogenesis and prophylaxis
Pharma ospi slides which help in ospi learning
01-Introduction-to-Information-Management.pdf
Lesson notes of climatology university.
Chinmaya Tiranga quiz Grand Finale.pdf
FourierSeries-QuestionsWithAnswers(Part-A).pdf
ANTIBIOTICS.pptx.pdf………………… xxxxxxxxxxxxx
Black Hat USA 2025 - Micro ICS Summit - ICS/OT Threat Landscape
VCE English Exam - Section C Student Revision Booklet
Microbial disease of the cardiovascular and lymphatic systems
Complications of Minimal Access Surgery at WLH
IMMUNITY IMMUNITY refers to protection against infection, and the immune syst...
OBE - B.A.(HON'S) IN INTERIOR ARCHITECTURE -Ar.MOHIUDDIN.pdf
Computing-Curriculum for Schools in Ghana
Introduction-to-Literarature-and-Literary-Studies-week-Prelim-coverage.pptx
3rd Neelam Sanjeevareddy Memorial Lecture.pdf
Anesthesia in Laparoscopic Surgery in India

Chapter 3.pptx multimedia and conquer the same thing

  • 4. “The organizing and creative process begins with drawings in pen or pencil on paper. Too many times we are enthused about the color and the computer graphics tools, but they can overwhelm the creative design process”. - Dennis Woytek, Assistant Professor, Duquesne University
  • 5. Organize your tools O Many multimedia designers do not limit their toolkits to the features of a single authoring platform. O They employ a variety of applications and tools to accomplish many specialized tasks.
  • 6. Configure Your Computer Workspace O Have more than one monitor to provide lots of screen real estate (viewing area).
  • 7. Making Still Images O Still images are generated in two ways: O Bitmaps O Vectors
  • 8. Bitmaps O Used for photo-realistic images and for complex drawings requiring fine detail. O Uses ‘Painting’ software i.e. Adobe Photoshop, Paint, etc. O Are used in many file formats including: .BMP, .GIF, .JPG, .PNG
  • 10. Bitmap sources O Make a bitmap from scratch with a paint or drawing program. O Grab a bitmap from an active computer screen with a screen capture.
  • 11. Bitmap sources O Capture a bitmap from a photo or other artwork using a scanner to digitize the image. O Once made, a bitmap can be copied, altered, e-mailed, and otherwise used in many creative ways.
  • 14. Vector Drawing O A vector is a line that is described by the location of its two endpoints.
  • 15. Try @ Home Type the following in Notepad: <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200" viewBox="-100 -100 300 300"> <rect x="0" y="0" fill="yellow" stroke="red" width="2002" height="100"/> <text transform="matrix(1 0 0 1 60 60) " font-family=" 'TimesNewRomanPS-BoldMT' " font- size="36">SVG</text> </svg> Save as (.svg) file then open on an HTML 5 compatible browser
  • 16. SVG O SVG: Scalable Vector Graphic O Small in size and can be scaled without distortion. O Supported by mobile browser as an alternative to Flash.
  • 17. Converting between Bitmaps and Vectors O From Vector to Bitmap  Easy to do with drawing software O Bitmap to Vector  Autotracing ( Can cause great inflation of file size!)
  • 18. 3D Drawing and Rendering
  • 20. Working in 3D O 3D applications create scenes. O Scenes consist of numerous objects, the more objects in the scene, the more complex and realistic the scene is. O Objects are created by modeling them.
  • 22. Making models realistic O Texturing: Applying images as a skin to models to make them look real.
  • 23. Making models realistic O Lighting: Setting the mood of the scene or to simulate the environment in a realistic manner.
  • 24. Making models realistic O Rendering: When the computer uses intricate algorithms to apply the effects you have have specified on the objects you have created.
  • 26. Additive Colours O a color is created by combining colored light sources in three primary colors: red, green, and blue (RGB).
  • 27. Subtractive Colours O Colour is created by combining colored media such as paints or ink that absorb (or subtract) some parts of the color spectrum of light and reflect the others back to the eye. O Subtractive color is the process used to create color in printing (CYMK).
  • 28. CMYK
  • 29. Computer Colour Models O RGB hexidecimal
  • 30. Computer Colour Models O HSB (Hue, Saturation, Brightness)
  • 31. Computer Colour Models O HSL (Hue, Saturation , Lightness)
  • 32. Colour Palettes O Palettes are mathematical tables that define the color of a pixel displayed on the the screen Microsoft Macintosh Web Safe
  • 35. Image Formats Format Color Depth Compressio n Transparency Uses .JPG 24 bit (16.7 million colours) Lossy Does not support • Rich color photographs • Gradients • Web images .BMP 24 bit Lossless Does not support • Native format for Windows .PNG 8 bit – 24 bit Lossless Supports • Logos • Free format • Does not support Animation .GIF 8 bit (256 colors) Lossless Supports • Logos • Animation