OpenGL 컴퓨터그래픽스 - Tistorycfs11.tistory.com/upload_control/download.blog?fhandle... ·...
Transcript of OpenGL 컴퓨터그래픽스 - Tistorycfs11.tistory.com/upload_control/download.blog?fhandle... ·...
![Page 1: OpenGL 컴퓨터그래픽스 - Tistorycfs11.tistory.com/upload_control/download.blog?fhandle... · 2015. 1. 21. · OpenGL로배우는 컴퓨터그래픽스 Part01. 기초다지기](https://reader033.fdocument.pub/reader033/viewer/2022051814/6036061049cfb27ab228ca25/html5/thumbnails/1.jpg)
OpenGLOpenGL로로배우는배우는
컴퓨터컴퓨터그래픽스그래픽스Part01. Part01. 기초기초다지기다지기
33장장. . 그래픽그래픽컬러처리컬러처리
Dong Hoon LeeDept. of Game, Dongseo University
2008, Fall
학습목표
색상, 명도, 채도의정의를명확히이해한다. RGB, CMY, HSV 컬러모델의차이점을이해한다. 컬러프로파일과컬러처리시스템의필요성을이해한다. RGB 컬러모드와인덱스컬러모드의차이점을이해한다. 하프토우닝기법과디더링기법을이해한다. 감마수정이필요한이유와수정방법을이해한다.
![Page 2: OpenGL 컴퓨터그래픽스 - Tistorycfs11.tistory.com/upload_control/download.blog?fhandle... · 2015. 1. 21. · OpenGL로배우는 컴퓨터그래픽스 Part01. 기초다지기](https://reader033.fdocument.pub/reader033/viewer/2022051814/6036061049cfb27ab228ca25/html5/thumbnails/2.jpg)
1. 컬러이론
색상, 명도, 채도빛 = 전자기파의일종주파수(Frequency) : 초당몇번이나장의세기가바뀌는가?파장(Wave Length) : 주파수의역수관계가시광선의파장 : 390nm – 720nm
색상, 명도, 채도1. 컬러이론
일반광(Light source) = 백색광(White Light)보라색부터적색에걸친모든주파수성분이내포
이빛이물체표면에부딪치면어떤주파수성분은물체내부로흡수되고, 어떤주파수성분은반사
우세주파수반사된빛중가장많은에너지를지닌파장의주파수
우세주파수의색 : 색상(Hue, Color)
![Page 3: OpenGL 컴퓨터그래픽스 - Tistorycfs11.tistory.com/upload_control/download.blog?fhandle... · 2015. 1. 21. · OpenGL로배우는 컴퓨터그래픽스 Part01. 기초다지기](https://reader033.fdocument.pub/reader033/viewer/2022051814/6036061049cfb27ab228ca25/html5/thumbnails/3.jpg)
색상, 명도, 채도
명도 : 파형아래의면적채도 : Ed – Ew채도증가 : Ed 증가또는 Ew감소Ew감소 : 명도저하, 색상인식이어려움
1. 컬러이론
색상, 명도, 채도
눈의구조홍채: 빛의양을조절수정체: 초점거리조절막대세포: 명암인식, 어두운환경에반응원추세포: 색상인식, 밝은환경에반응
1. 컬러이론
![Page 4: OpenGL 컴퓨터그래픽스 - Tistorycfs11.tistory.com/upload_control/download.blog?fhandle... · 2015. 1. 21. · OpenGL로배우는 컴퓨터그래픽스 Part01. 기초다지기](https://reader033.fdocument.pub/reader033/viewer/2022051814/6036061049cfb27ab228ca25/html5/thumbnails/4.jpg)
컬러 매칭
컴퓨터모니터에사용되는빛R, G, B 세가지파장의빛으로구성
이세가지파장의빛만으로다른파장의빛을어떻게표현할수있는가?파형이다르더라도사람눈에는동일한색으로인식
컬러매칭어떤파장의색을다른파장의색으로대치하는것
1. 컬러이론
컬러 매칭
580 nm 황색 = 적색광원(0.25) + 녹색광원(0.13) + 청색광원(0.0)500nm 근처에서적색광원은음의값
G, B를합성한색상에서적색성분을빼야함.현실적으로불가능
1. 컬러이론
![Page 5: OpenGL 컴퓨터그래픽스 - Tistorycfs11.tistory.com/upload_control/download.blog?fhandle... · 2015. 1. 21. · OpenGL로배우는 컴퓨터그래픽스 Part01. 기초다지기](https://reader033.fdocument.pub/reader033/viewer/2022051814/6036061049cfb27ab228ca25/html5/thumbnails/5.jpg)
컬러 매칭
CIE 컬러모델R, G, B 컬러매칭으로는모든자연색을표현할수없다!가상의삼원색, 수학적으로유도, 모두양의함수Y = 명도, X, Z가색을결정
1. 컬러이론
컬러 매칭
CIE 정규화x+y+z = 1이되도록 x, y, z를설정
x, y가결정되면 z는자동결정됨: x, y의함수로서색을표현CIE 색범위순색(단일파장): 경계선, 내부색: 순색의혼합, 보색: 예. A와 B
1. 컬러이론
![Page 6: OpenGL 컴퓨터그래픽스 - Tistorycfs11.tistory.com/upload_control/download.blog?fhandle... · 2015. 1. 21. · OpenGL로배우는 컴퓨터그래픽스 Part01. 기초다지기](https://reader033.fdocument.pub/reader033/viewer/2022051814/6036061049cfb27ab228ca25/html5/thumbnails/6.jpg)
컬러 매칭
CIE 정규화
1. 컬러이론
컬러 매칭
색범위(Color Gamut)
1. 컬러이론
![Page 7: OpenGL 컴퓨터그래픽스 - Tistorycfs11.tistory.com/upload_control/download.blog?fhandle... · 2015. 1. 21. · OpenGL로배우는 컴퓨터그래픽스 Part01. 기초다지기](https://reader033.fdocument.pub/reader033/viewer/2022051814/6036061049cfb27ab228ca25/html5/thumbnails/7.jpg)
RGB 컬러모델
삼중자극이론(Tri-Stimulus Theory)원추세포는파장 630nm(빨강), 530 nm(녹색), 450nm(청색)에가장민감하게반응
2. 컬러 모델
RGB 컬러모델
가산모델빛의합성(예: 모니터)R+G = Y, G+B = C, B+R = MRGB의보색은 CMY
2. 컬러 모델
![Page 8: OpenGL 컴퓨터그래픽스 - Tistorycfs11.tistory.com/upload_control/download.blog?fhandle... · 2015. 1. 21. · OpenGL로배우는 컴퓨터그래픽스 Part01. 기초다지기](https://reader033.fdocument.pub/reader033/viewer/2022051814/6036061049cfb27ab228ca25/html5/thumbnails/8.jpg)
CMY 컬러모델
감산모델물감의합성 (예: 프린터)W - G(Complement of Magenta) = R + B = Magenta(W - G) - R(Complement of Cyan) = Blue(W - G - R) - B(Complement of Yellow) = Black
2. 컬러 모델
CMY 컬러모델
RGB는 CMY의합성으로표현C+M+Y = Black cf. R+G+B물감의삼원색은 CMY. 빨강노랑파랑이아님.
2. 컬러 모델
![Page 9: OpenGL 컴퓨터그래픽스 - Tistorycfs11.tistory.com/upload_control/download.blog?fhandle... · 2015. 1. 21. · OpenGL로배우는 컴퓨터그래픽스 Part01. 기초다지기](https://reader033.fdocument.pub/reader033/viewer/2022051814/6036061049cfb27ab228ca25/html5/thumbnails/9.jpg)
CMYK 컬러모델
K for Chromatic (회색농도)C = 120, M = 80, Y = 200 C = 40, M = 0, Y = 120, K = 80
장점잉크건조시간, 잉크비용정밀한회색농도를표현(완벽한보색차단)
2. 컬러 모델
HSV 컬러모델
RGB 모델의단점직관적이지않다. 보라색 = R, G, B 각각얼마?
HSV(Hue, Saturation, Value) 또는 HSB(Hue, Saturation, Brightness)색상(Hue), 채도(Saturation), 명도(Value, Brightness) 화가의직관
셰이드 = 어떤색상에흑색을섞음. 채도와명도를동시에낮춤.틴트 = 어떤색상에백색을섞음. 채도는낮추고명도는높임.
2. 컬러 모델
![Page 10: OpenGL 컴퓨터그래픽스 - Tistorycfs11.tistory.com/upload_control/download.blog?fhandle... · 2015. 1. 21. · OpenGL로배우는 컴퓨터그래픽스 Part01. 기초다지기](https://reader033.fdocument.pub/reader033/viewer/2022051814/6036061049cfb27ab228ca25/html5/thumbnails/10.jpg)
HSV 컬러모델
육각뿔
2. 컬러 모델
HSV 컬러모델
대화상자예시, 적색단면예시
2. 컬러 모델
![Page 11: OpenGL 컴퓨터그래픽스 - Tistorycfs11.tistory.com/upload_control/download.blog?fhandle... · 2015. 1. 21. · OpenGL로배우는 컴퓨터그래픽스 Part01. 기초다지기](https://reader033.fdocument.pub/reader033/viewer/2022051814/6036061049cfb27ab228ca25/html5/thumbnails/11.jpg)
YUV 모델과 YIQ 모델
컬러 TV의흑백 TV 호환성Y = 0.213R + 0.715G + 0.072GY’ = 0.299R + 0.587G + 0.114B 명도
U = 0.492 (B - Y') V = 0.877 (R - Y') 색(색상, 채도)
디지털 TVY’CbCrCb = (B - Y')/1.772 + 0.5 Cr= (R - Y')/ 0.402 + 0.5
NTSC TV 표준
I는주황-청색(Orange –Blue), Q는자주-녹색(Purple-Green)축Y, I, Q 순서대로민감도가낮아짐
2. 컬러 모델
CIE L*a*b*
웨버의법칙자극이강할수록상대적감도는낮아짐
절대명도 I일때, 인지된명도는 Log (I)에비례CIE 모델의문제점인지된색차가그림의거리에비례하지않음
2. 컬러 모델
![Page 12: OpenGL 컴퓨터그래픽스 - Tistorycfs11.tistory.com/upload_control/download.blog?fhandle... · 2015. 1. 21. · OpenGL로배우는 컴퓨터그래픽스 Part01. 기초다지기](https://reader033.fdocument.pub/reader033/viewer/2022051814/6036061049cfb27ab228ca25/html5/thumbnails/12.jpg)
CIE L*a*b*
CIE의변형인지컬러모델(Perceptual Color Model)인지된색차가맵상의거리에비례하도록
CIE XYZ와 CIE L*a*b*와의비교
2. 컬러 모델
CIE L*a*b*
CIE XYZ를변형L*: 명도(Luminance)a*: 녹색에서적색, b*: 청색에서황색. a*,b* 합성에의해중간색표현
CIE L*a*b*컬러인쇄, cf. CIE L*u*v*: 컬러모니터
2. 컬러 모델
![Page 13: OpenGL 컴퓨터그래픽스 - Tistorycfs11.tistory.com/upload_control/download.blog?fhandle... · 2015. 1. 21. · OpenGL로배우는 컴퓨터그래픽스 Part01. 기초다지기](https://reader033.fdocument.pub/reader033/viewer/2022051814/6036061049cfb27ab228ca25/html5/thumbnails/13.jpg)
CMS(Color Management System)
컬러호환성컬러모델, 장비특성에따른오차를최소화개별장비의컬러모델, 장비특성을프로필형태로나타냄장비에무관한컬러공간으로사상
2. 컬러 모델
프로필 연결공간
일종의세계어에해당장비프로필정보를감안
sRGB(Standard RGB) 또는 CIE L*a*b*으로사상
2. 컬러 모델
![Page 14: OpenGL 컴퓨터그래픽스 - Tistorycfs11.tistory.com/upload_control/download.blog?fhandle... · 2015. 1. 21. · OpenGL로배우는 컴퓨터그래픽스 Part01. 기초다지기](https://reader033.fdocument.pub/reader033/viewer/2022051814/6036061049cfb27ab228ca25/html5/thumbnails/14.jpg)
RGB 컬러모드
프레임버퍼내용이색을결정용량에따라색종류가결정됨
하이컬러, 풀컬러, 트루컬러, …
예: 3 비트평면
3. 컬러 모드
인덱스 컬러모드
컬러번역기프레임버퍼내용은 CLUT의인덱스실제컬러는 CLUT의우측칼럼에의해결정
3. 컬러 모드
![Page 15: OpenGL 컴퓨터그래픽스 - Tistorycfs11.tistory.com/upload_control/download.blog?fhandle... · 2015. 1. 21. · OpenGL로배우는 컴퓨터그래픽스 Part01. 기초다지기](https://reader033.fdocument.pub/reader033/viewer/2022051814/6036061049cfb27ab228ca25/html5/thumbnails/15.jpg)
인덱스 컬러모드
컬러보기표한화면에보일수있는컬러는여전히 8가지그컬러가어디서왔는가의문제
3. 컬러 모드
인덱스 컬러모드
팔레트
3. 컬러 모드
![Page 16: OpenGL 컴퓨터그래픽스 - Tistorycfs11.tistory.com/upload_control/download.blog?fhandle... · 2015. 1. 21. · OpenGL로배우는 컴퓨터그래픽스 Part01. 기초다지기](https://reader033.fdocument.pub/reader033/viewer/2022051814/6036061049cfb27ab228ca25/html5/thumbnails/16.jpg)
인덱스 컬러모드
유사한 tone의표현에유리PNG, BMP, TGA, TIFF 파일내부에팔레트정보를포함
3. 컬러 모드
하프 토우닝
우리눈의종합적인식능력을이용
인쇄물의하프토우닝
흑백이지만회색처럼보임
화면화소에는이것이불가능
4. 하프 토우닝과 디더링
![Page 17: OpenGL 컴퓨터그래픽스 - Tistorycfs11.tistory.com/upload_control/download.blog?fhandle... · 2015. 1. 21. · OpenGL로배우는 컴퓨터그래픽스 Part01. 기초다지기](https://reader033.fdocument.pub/reader033/viewer/2022051814/6036061049cfb27ab228ca25/html5/thumbnails/17.jpg)
디지털 하프 토우닝
점의크기대신개수를조절우리눈이 4개의화소를한단위평균적밝기를인식실질적해상도는감소
4. 하프 토우닝과 디더링
감마수정
인점의밝기는전자빔의밝기에비선형적으로반응(0..255)에서 128은중간회색도가아님인점밝기와회색도와의관계
알파: 비례상수, 델타: 정규화회색도, 감마: 1이아니고 (1.7-2.8)
5. 감마수정
![Page 18: OpenGL 컴퓨터그래픽스 - Tistorycfs11.tistory.com/upload_control/download.blog?fhandle... · 2015. 1. 21. · OpenGL로배우는 컴퓨터그래픽스 Part01. 기초다지기](https://reader033.fdocument.pub/reader033/viewer/2022051814/6036061049cfb27ab228ca25/html5/thumbnails/18.jpg)
감마수정의 필요성
프로그래머의기대치대실제밝기회색도 128은실제로더욱어둡게나타남
5. 감마수정
감마수정
정규화회색도값을미리변형
5. 감마수정
![Page 19: OpenGL 컴퓨터그래픽스 - Tistorycfs11.tistory.com/upload_control/download.blog?fhandle... · 2015. 1. 21. · OpenGL로배우는 컴퓨터그래픽스 Part01. 기초다지기](https://reader033.fdocument.pub/reader033/viewer/2022051814/6036061049cfb27ab228ca25/html5/thumbnails/19.jpg)
감마수정
아이비엠피씨모니터일반적으로하드웨어감마수정기능없음
1/ γ = 1/2.5의감마수정: 시스템감마(소프트웨어감마) 매킨토시모니터
1/γ = 1/1.4의감마수정: 하드웨어감마1/ γ = 1/2.5의감마수정을원하면추가로 1/1.8의시스템감마를가해야함.
5. 감마수정