2. teori warna.ppt - gunadarma...
TRANSCRIPT
Teori Warna
Grafik Komputer 2
Grafik Komputer 2Hal.: 1 Isikan Judul Halaman
Apa itu Warna?p
Warna adalah elemen terpenting dalam desain grafis Warna dalam desain grafis. Warna menjadi indikator pembeda antara satu objek dengan yang lain lain.
Dari sudut pandang ilmu fisika, warna dihasilkan dari representasi sinar putih yang dihasilkan oleh matahari atau bola lampu pada spektrum p p pprisma.
Grafik Komputer 2Hal.: 2 Isikan Judul Halaman
Teori Warna
Warna di Komputer
Di dunia komputer ada banyak sistem warna antara lain sistem warna, antara lain RGB (Red-Green-Blue), CMYK (Cyan-Magenta-Yellow-Black), LAB Color (lightnessA (Green-red axis) B(blueyellow axis)) HLS B(blueyellow axis)), HLS (Hue-Lightness-Saturation). Banyaknya sistem warna karena ada perbedaan dalam aplikasi saat cetak.
Grafik Komputer 2Hal.: 3 Isikan Judul Halaman
Teori Warna
Berdasarkan fungsinya, aplikasi warna di layar komputerg y , p y pdibedakan menjadi dua, yaitu :
1. warna additivedd d k k d l d lWarna additive digunakan untuk desain tampilan di layar monitor,
tidak untuk kebutuhan cetak. Di antara sistem warna additiveadalah RGB, LAB Color dan HLS. Desain yang menggunakanmodel warna additive, misalnya game, wallpaper, web danvideo.
2. warna subtractive.Warna ini merupakan perpaduan beberapa warna primer. Warna
subtractive digunakan untuk kebutuhan cetak. Sistem warnayang digunakan adalah CMYK. Sistem warna ini berasal daritiga warna primer dan perpaduan ketiganya menghasilkan
Grafik Komputer 2Hal.: 4 Isikan Judul Halaman
g p p p g y gwarna hitam.
Spektrum warnap
Cahaya matahari yang dilewatkan pada prisma Cahaya matahari yang dilewatkan pada prisma menghasilkan spetrum warna.
‘warna’ objek yang diterima oleh penglihatan manusia ditentukan oleh cahaya dipantulkan manusia ditentukan oleh cahaya dipantulkan oleh objek tersebut.
Grafik Komputer 2Hal.: 5 Isikan Judul Halaman
Akromatik vs Kromatik
Cahaya akromatik: tidak berwarna hanya Cahaya akromatik: tidak berwarna, hanya menggunakan intensitas yang diukur dengan tingkat dengan tingkat
keabuan. Contoh: TV hitam-putih, citra monokrom yang kita gunakany g g
Cahaya kromatik: panjang gelombang 400~700 nm. Tiga satuan yang digunakan untuk mendeskripsikan kualitas dari sumber cahaya akromatik:
R di Radiance Luminance Brightness
Grafik Komputer 2Hal.: 6 Isikan Judul Halaman
Brightness
Cahaya Kromatiky
Radiansi: jumlah energi yang memancar dari sumber cahaya (dalam
satuan watt) Luminasi: Luminasi:
jumlah energi yang diterima oleh observer dari sumber cahaya (dalam satuan lumens, lm). contoh: sinar inframerah memiliki
di i b t i i tid k d t dilih t l h bradiansi yang besar tapi nyaris tidak dapat dilihat oleh observer Brightness:
Deskriptor yang subjektif mirip dengan pengertian intensitas Deskriptor yang subjektif, mirip dengan pengertian intensitas pada akromatik, walah satu faktor penentu dalam menggambarkan sensasi warna
Grafik Komputer 2Hal.: 7 Isikan Judul Halaman
Gelombang warnag
Grafik Komputer 2Hal.: 8 Isikan Judul Halaman
Pemrosesan Informasi oleh Observer ManusiaObserver Manusia
Persepsi visual Berhubungan dg bagaimana persepsi thd citra oleh observer manusia Berhubungan dg bagaimana persepsi thd citra oleh observer manusia
• Pemrosesan awal oleh mata• Pemrosesan lebih jauh oleh otak
Penting utk mengembangkan image fidelity measure Penting utk mengembangkan image fidelity measure• Diperlukan utk perencanaan & evaluasi algoritma & sistem DIP/DIV
Trichromatic color theory (Thomas Young): color vision adalah hasil dari tiga photoreceptors berbeda
Grafik Komputer 2Hal.: 9 Isikan Judul Halaman
adalah hasil dari tiga photoreceptors berbeda
Anatomi Matam
Grafik Komputer 2Hal.: 10 Isikan Judul Halaman
Mata vs KameraMata vs Kamera
Grafik Komputer 2Hal.: 11 Isikan Judul Halaman
Persepsi Warna ManusiaPersepsi Warna Manusia Retina berisi photo receptors
Cones: day vision dp melihat (persepsi) color tone (Hue)
• Tiga tipe cones (Red, green & blue cones) overlapping passband dg puncak sekitar merah (560
) h (530 ) d b (440 )pp g p g p
nm), hijau (530 nm) dan biru (440 nm)• Teori Tri-receptors color vision [Young 1802]
Rods: night vision, persepsi hanya brightness
Sensasi color dikarakteristikkan oleh Luminance (brightness) Chrominance
H ( l )• Hue (color tone)• Saturation (color purity)
• Respon dari suatu cone bergantung pd panjang gelombang dani t itintensitasnya
• Interaksi diantara paling sedikit 2 tipe cone diperlukan utkmendpka kemmampuan mempersepsi warna
• Diperkirakan masing2 dari tipe cone HVS dp membedakan 100
Grafik Komputer 2Hal.: 12 Isikan Judul Halaman
• Diperkirakan masing2 dari tipe cone HVS dp membedakan 100 gradasi berbeda, otak mengkombinasikan variasi ini shg manusi dpmembedakan sekita 1 juta warna berbeda
Trichromatic Color Mixingm g Dari struktur mata manusia, semua warna dipandang sebagai p g g
kombinasi variabel dari primary color: red (R), green (G) dan blue (B)
Utk standarisasi CIE (Commission Internationale de Utk standarisasi CIE (Commission Internationale de l’Eclairage – the International Commission on Illumination): Blue = 435,8 nm Green = 546 1 Green = 546,1 Red = 700 nm
Nilai R, G, dan B yg diperlukan utk membentuk sembarang Nilai R, G, dan B yg diperlukan utk membentuk sembarang color disebut nilai tristimulus: X, Y, Z Suatu color dispesifikasikan oleh trichromatic coefficient:
x = Z/(X+Y+Z)x = Z/(X+Y+Z)y = Y/(X+Y+Z) x + y + z =1z = Z/(X+Y+Z)
Grafik Komputer 2Hal.: 13 Isikan Judul Halaman
Bagaimana Warna DinyatakanBagaimana Warna Dinyatakan
Warna dinyatakan dalam komponen RGB (red, green, blue), CMYK (cyan, magenta, yellow, black), HSV HLS atau YIQHSV, HLS atau YIQ.
Mengubah RGB ke CMYK:g
C = 1 - RM = 1 - GM 1 GY = 1 - BK = min(C,M,Y)C’ = C - K
RGB color cube
C = C - KM’ = M - KY’ = Y - K
Grafik Komputer 2Hal.: 14 Isikan Judul Halaman
CIE ColorspaceCIE Colorspace
CIE (Commision Internationale d’Eclairage) mendefinisikan spektrum warna seperti gambar berikut:berikut:
Grafik Komputer 2Hal.: 15 Isikan Judul Halaman
CIE Chromacity DiagramCIE Chromacity Diagram
Lebih mudah melihat warna CIE dalam diagram berikut
Grafik Komputer 2Hal.: 16 Isikan Judul Halaman
Color GamutColor Gamut
Beberapa device hanya bisa menampilkan Beberapa device hanya bisa menampilkan spektrum warna yang terbatas
Grafik Komputer 2Hal.: 17 Isikan Judul Halaman10
DitheringDithering
Classical halftone pada
suratkabar
Dithering dilakukan untuk mensimulasikan warna Dithering dilakukan untuk mensimulasikan warna yang lebih banyak daripada yang bisa dihasilkan suatu device
Dibutuhkan saat kapan?
Grafik Komputer 2Hal.: 18 Isikan Judul Halaman11
Dither PatternDither Pattern
Pada komputer, dithering merupakan trade-offantara spatial resolution dan warna.
Grafik Komputer 2Hal.: 19 Isikan Judul Halaman
Membuat Dither PatternMembuat Dither Pattern
Pattern ukuran berapapun dapat dibuat dengan rule di atas. Lihat contoh pattern 8x8 di atas!
Grafik Komputer 2Hal.: 20 Isikan Judul Halaman
Warna primer vs warna sekunder (pada cahaya)(pada cahaya)
Warna primer: Warna primer: red (R), green (G), blue (B) perhatikan bahwa komponen RGB saja tidak bisa perhatikan bahwa komponen RGB saja tidak bisa
menghasilkan semua spektrum warna, kecuali jika panjang gelombangnya juga dapat bervariasip j g g g y j g p
Warna sekunder: Magenta (R+B) cyan (G+B) yellow(R+G) Magenta (R+B), cyan (G+B), yellow(R+G)
Campuran 3 warna primer: putih
Grafik Komputer 2Hal.: 21 Isikan Judul Halaman
Warna primer vs warna sekunder pada pigmenpada pigmen
Warna primer: Warna primer: magenta, cyan, yellow Definisi: menyerap warna primer cahaya dan Definisi: menyerap warna primer cahaya dan
merefleksikan/mentransmisikan dua warna lainnyalainnya
Warna sekunder: R G B R,G,B
Campuran ketiga warna: hitam
Grafik Komputer 2Hal.: 22 Isikan Judul Halaman
Grafik Komputer 2Hal.: 23 Isikan Judul Halaman
Brightness, hue, saturationg , ,
Tiga karakteristik yang digunakan untuk g y g gmembedakan satu warna dengan lainnya
Brightness: intensitas kromatik Hue: panjang gelombang dominan dalam Hue: panjang gelombang dominan dalam
campuran gelombang cahaya (warna dominan yang diterima oleh observer). Kita menyebut suatu benda ‘merah’ atau ‘biru’ > berarti kita suatu benda merah atau biru -> berarti kita menyebutkan hue-nya
Saturasi: kemurnian relatif (pada spektrum (p pwarna murni: merah, oranye, kuning, hijau, biru, dan violet tersaturasi penuh, sedangkan pink saturasinya lebih rendahy
Hue + saturasi kromatisitas
Grafik Komputer 2Hal.: 24 Isikan Judul Halaman
Model Warna
Memfasilitasi spesifikasi warna Memfasilitasi spesifikasi warna, model warna digunakan untuk menspesifikasikan sebuah sistem menspesifikasikan sebuah sistem koordinat 3D untuk representasi warnawarna Model warna berorientasi hardware: model
RGB untuk monitor warna dan kamera videoRGB untuk monitor warna dan kamera video, model CMY untuk printer warna, model YIQ untuk siaran TV warnauntuk siaran TV warna
Grafik Komputer 2Hal.: 25 Isikan Judul Halaman
Model RGB- unit cube
Grafik Komputer 2Hal.: 26 Isikan Judul Halaman
Model RGB: kubus warna
Grafik Komputer 2Hal.: 27 Isikan Judul Halaman
Grafik Komputer 2Hal.: 28 Isikan Judul Halaman
Safe RGB Colors
Banyak sistem terbatas pada 256 Banyak sistem terbatas pada 256 warna walaupun 24-bit citra RGB tersediatersedia
Dibentuklah kumpulan warna RGB aman (dapat digunakan pada semua aman (dapat digunakan pada semua sistem: all-systems-safe)
D i 256 t b t 40 Dari 256 warna tersebut, 40 warna diproses dengan cara yang berbeda
l h b OS i ti l oleh bermacam OS, sisanya tinggal 216 warna yang berlaku umum bagi
i tGrafik Komputer 2Hal.: 29 Isikan Judul Halaman
semua sistem.
Safe RGB Colors
216 warna ini telah menjadi standar de facto untuk safe colors terutama untuk facto untuk safe colors, terutama untuk aplikasi internet.
Setiap 216 warna ini terdiri dari 3 pkomponen RGB, tapi masing-masing hanya boleh bernilai 0,51,102, 153, 204, 255 (lihat tabel di bawah)255 (lihat tabel di bawah)
Warna merah murni: FF0000, biru murni: 0000FF, hitam: 000000, putih: , , pFFFFFF
Grafik Komputer 2Hal.: 30 Isikan Judul Halaman
216 safe colors
Grafik Komputer 2Hal.: 31 Isikan Judul Halaman
Model CMY
Asumsikan semua nilai warna dinormalisasi menjadi [0 1]dinormalisasi menjadi [0,1]
Model CMY digunakan untuk membuat output hardcopyoutput hardcopy
CMYK K adalah warna keempat: hitam; karena CMY yang dicampur id k d h ilk hitidak dapat menghasilkan warna hitam
pekat, sedangkan seringkali kita harus mencetak dengan warna hitam pekat mencetak dengan warna hitam pekat.
Rumusan: C = 1 – R
Grafik Komputer 2Hal.: 32 Isikan Judul Halaman
C 1 R M = 1 – G Y = 1 – B
Model HSI
RGB dan CMY tidak cocok untuk RGB dan CMY tidak cocok untuk mendeskripsikan colors berdasarkan interpretasi manusiainterpretasi manusia
Hue (H), Saturation (S), Intensitas (I)(I) Hue: mendeskripsikan warna murni
S t i d j t b k i dil kk Saturasi: derajat banyaknya warna murni dilunakkan dengan warna putih
Intensitas: menggabungkan informasi warna dari H Intensitas: menggabungkan informasi warna dari H dan S
Grafik Komputer 2Hal.: 33 Isikan Judul Halaman
Model HSI
I (intensity) garis yang menghubungkan I (intensity) garis yang menghubungkan titik black dan white
Semua titik pada garis ini adalah abu-abu.p g
Grafik Komputer 2Hal.: 34 Isikan Judul Halaman
Model HSI
H (hue) semua titik pada bidang ( ) p gyang dibatasi oleh titik black, white dan warna-x, memiliki hue yang sama yaitu warna x sama, yaitu warna-x.
Contoh pada gambar sebelumnya: warna-x: cyanwarna x: cyan
S (saturasi) untuk menentukan saturasi (kemurnian) dari warna-x: ( )buat bidang dari titik warna-x tegak lurus dengan sumbu intensitas dan memiliki hue yang sama Saturasi memiliki hue yang sama. Saturasi adalah jarak terdekat antara titik warna-x dengan sumbu intensitas
Grafik Komputer 2Hal.: 35 Isikan Judul Halaman
g
Grafik Komputer 2Hal.: 36 Isikan Judul Halaman
Grafik Komputer 2Hal.: 37 Isikan Judul Halaman
Model YIQ
YIQ (Y for luminance, I for in-phase and Q for quadrature), like YUV, is a color space used in television signals YIQ is used predominantly bya color space used in television signals. YIQ is used predominantly by the NTSC television standard for encoding color information. The Y component, like in YUV, is used to encode luminance information, and is the only component used by black and white television receiversis the only component used by black-and-white television receivers. The I and Q signals contain the actual color information. The YIQ color space is actually exactly the same as YUV, except the I-Q plane differs from the U-V plane by a simple 33-degree rotation and axis-swap Thisfrom the U V plane by a simple 33 degree rotation and axis swap. This rotation puts the I color axis in the orange region of the color space, which is where flesh tones are found. Since the human eye notices incorrect flesh tones more easily than other color defects, I can then beincorrect flesh tones more easily than other color defects, I can then be given a higher bandwidth than Q in a severely limited-bandwidth video signal such as NTSC by modifing the circle-based quadrature modulation into an ellipse-based variant, where the I axis is the major
Grafik Komputer 2Hal.: 38 Isikan Judul Halaman
p , jaxis of the ellipse and the Q axis is the minor axis.
Model YIQQ
Most newer systems from PAL onward, that don't suffer from such tight bandwidth li it f th t h i ll i t limits, prefer the technically easier-to-use YUV color space.
A formula exists for converting colors from the RGB color space to YIQ This formula the RGB color space to YIQ. This formula, where R, G, and B are defined on a scale from zero to one, is shown below.
The approximate value of the matrix is: The approximate value of the matrix is:
Grafik Komputer 2Hal.: 39 Isikan Judul Halaman