1. IS502:Multimedia Design for Information System color space For Image and Video
Presenter Name: Mahmood A.Moneim
Supervised By: Prof. Hesham A.Hefny
Winter 2013
This template can be used as a starter file for presenting training materials in a group setting.
Sections
Right-click on a slide to add sections. Sections can help to organize your slides or facilitate collaboration between multiple authors.
Notes
Use the Notes section for delivery notes or to provide additional details for the audience. View these notes in Presentation View during your presentation.
Keep in mind the font size (important for accessibility, visibility, videotaping, and online production)
Coordinated colors
Pay particular attention to the graphs, charts, and text boxes.
Consider that attendees will print in black and white or grayscale. Run a test print to make sure your colors work when printed in pure black and white and grayscale.
Graphics, tables, and graphs
Keep it simple: If possible, use consistent, non-distracting styles and colors.
Label all graphs and tables.

2. Revision
Example: A 3 Megapixel camera what are the images dimensions can produce if the aspect ratio is set to (4:3) and if is the aspect ratio is set to (3:2)
Hint: Camera color bits is same image color bits.
By Mahmood A.Moneim

3. Outline Introduction Additive Color Mixing Subtractive Color Mixing
Image Color Space
Video Color Space
By Mahmood A.Moneim

4. 1.Introduction Three Characteristics of Color: hue
brightness: the luminance of the object
saturation: the blue sky
Give a brief overview of the presentation. Describe the major focus of the presentation and why it is important.
Introduce each of the major topics.
To provide a road map for the audience, you can repeat this Overview slide throughout the presentation, highlighting the particular topic you will discuss next.
By Mahmood A.Moneim

5. 2.Additive Color Mixing The mixing of “light”
Primary: Red, Green, Blue
The complementary color
“White” means
By Mahmood A.Moneim

6. 3.Subtractive Color Mixing
The mixing of “pigment”
Primary: Cyan, Magenta, Yellow
The complementary color
Why black?
By Mahmood A.Moneim

7. 4.Image Color Space Image Color Space: RGB CMYK HSV and HSL
By Mahmood A.Moneim

8. 4.Color Space What is color space?
A 3D model used to define a specified color
The difference between color spaces:
The choice of axes
By Mahmood A.Moneim

9. 4.Color Space – RGB RGB: The simplest color space
Axes: Red, green, blue
Advantages: simple
By Mahmood A.Moneim

10. 4.Color Space – CMYK Used for: printer printing
Use the subtractive color mixing
Axes:
Cyan
Magenta
Yellow
K: black
By Mahmood A.Moneim

11. CMYK from RGB C=1-(R/255) M=1-(G/255) Y=1-(B/255) K= min(C,M,Y)
cyan=100*(C-K)/(1-K) magenta=100*(M-K)/(1-K) yellow=100*(Y-K)/(1-K) black=100*K
By Mahmood A.Moneim

12. RGB From CMYK R= (1-C) *255 G=(1-M)*255 B= (1-Y)*255
By Mahmood A.Moneim

13. 4- Color Space- HSV HSV cylindrical geometries same as HSL
Axes: Hue, Saturation, Value component
The components of the HSV, saturation (s) and value (v) should have values in the range [0,1], while the hue (h) should have values in the range [0,360]
By Mahmood A.Moneim

14. RGB to HSV Transformation
The conversion from a RGB to a HSV model is described by these formulas:
v = max
Max= max (r,g,b)
min = min(r,g,b)
s = c/v where: c = chroma = max (r,g,b) - min (r,g,b)
h = depends on which of r,g,b is the maximum
By Mahmood A.Moneim

15. HSV to RGB Transformation
The conversion from a HSV to RGB a model is described by these formulas:
By Mahmood A.Moneim

16. 4- Color Space- HSL Axes: Hue, Saturation and Lightness
Hue Same as Hue of HSV
S= C/(1-|2L-1|) if C≠0 and 0 otherwise
L = ½ (Max + Min)
By Mahmood A.Moneim

17. 5.Video Color Space – YCbCr &YPbPr
Used for: digital video encoding, digital camera, and analog video.
Axes:
Y: luma
Cb: blue chroma
Cr: red chroma
By Mahmood A.Moneim

18. 4.Video Color Space – YCbCr &YPbPr
Conversion from RGB:
Y=0.299(R-G) + G (B-G)
Cb=0.564(B-Y)
Cr=0.713(R-Y)
The Matrix form:
By Mahmood A.Moneim

19. 4.Color Space – YUV
YUV
Used for: video encoding for some standard such as NTSC, PAL, SECAM
Axes:
Y: luma
U: blue chroma
V: red chroma
By Mahmood A.Moneim

20. 4.Color Space – YUV Conversion from RGB: Y=0.299R+0.587G+0.114B
U=0.436(B-Y)/( )
V=0.615(R-Y)/( )
The Matrix form:
By Mahmood A.Moneim

21. 4.Color Space – YIQ
YIQ
Used for: video encoding for some standard such as NTSC
Axes:
Y: luma
I: blue chroma
Q: red chroma
I-Q channels are rotated from the U-V channels in YUV
By Mahmood A.Moneim

22. 4.Color Space – YIQ
Conversion from RGB:
By Mahmood A.Moneim

23. 4.Color Space – CMYK Conversion from YCbCr:
C = 255 -Y (Cr-128)
M = Y (Cb-128) (Cr-128)
Y = Y (Cb -128)
K = min (C, M, Y)
By Mahmood A.Moneim

24. 4.Color Space – Comparison
Color mixing
Primary parameters
Used for
Pros and cons
RGB
Additive
Red,
Green, Blue
Easy but wasting bandwidth
CMYK
Subtractive
Cyan, Magenta, Yellow, Black
Printer
Works in pigment mixing
YCbCr
YPbPr
additive
Y(luminance), Cb(blue chroma), Cr(red chroma)
Video encoding, digital camera
Bandwidth efficient
YUV
Y(luminance),
U(blue chroma), V(red chroma)
Video encoding for NTSC, PAL, SECAM
YIQ
I(rotated from U),
Q(rotated from V)
Video encoding for NTSC
By Mahmood A.Moneim

25. Problem set
When using CSS, colors are defined using a hexadecimel (hex) notation for the combination of Red, Gree, and Blue color values (RGB). The hex values are written as 3 double digit numbers, starting with a # sign. How would you represent the following colors in CSS?
1. Red
2. Blue
3. Black
4. White
5. A mixture of colors that uses 25% of Red, 75% of Green and 50% of Blue.
By Mahmood A.Moneim

26. Problem set
How can we convert from HLS color space to RGB color space?
How can we convert between RGB and CMY color spaces?
By Mahmood A.Moneim

27. Problem Set
Convert the following HLS colors to RGB color space expressed in both the [0, 1] and the[0,255] ranges.
By Mahmood A.Moneim

28. Problem Set
By Mahmood A.Moneim

29. Problem Set
By Mahmood A.Moneim

30. Problem Set What is the hue of the color when MAX==MIN?
Convert the HSV color [110.7,0.3,0.5] to CMY color space.
By Mahmood A.Moneim

31. Problem Set
Consider the 3x3 image shown below. Draw the new image if the original image is zoomed 2 times along both rows and columns (i.e. to size 6x6) using
A) Nearest Neighbor Interpolation.
B) Bilinear Interpolation.
By Mahmood A.Moneim

32. Microsoft Engineering Excellence
By Mahmood A.Moneim
Microsoft Confidential