연구를 따라 배우기 / 개념과 실험 직접 조작하며 배우기
사진에서 시작하기

이 사진을 계속 확대하면,
무엇이 보일까요?

자동차 사진 한 장을 준비했습니다.
어려운 말은 잠시 두고, 가까이 들여다보고 한 칸을 바꿔 보세요.

사진을 가까이 들여다보기

사진 속 자동차를 더 가까이 들여다보세요.

사진을 준비하고 있습니다… 지금 조작하는 사진
사진 전체
학습용 생성 사진 · 작은 크기로 준비한 사진을 확대합니다.

사진을 준비하고 있습니다.

먼저 해보고, 이름을 붙여 보세요.
사진 한 장에서 출발한 개념 가지궁금한 가지부터 살펴보세요.
02 IMAGE BASICS

숫자의 범위를 펼치면,
차이가 더 잘 보입니다.

50부터 200 사이에 모여 있는 값을 검정부터 흰색까지 펼쳐 보세요.
그림의 명암과 픽셀의 숫자를 함께 살펴봅니다.

먼저 생각해 보기

50을 검정, 200을 흰색으로 바꾸면, 중간값 125는 얼마가 될까요?

검정점과 흰점을 움직여 보세요

변환 전원본 6픽셀
변환 후같은 위치, 바뀐 값
어떤 값이 몇 개 있을까? 전 / 후 히스토그램
변환 전변환 후각각 총 6픽셀
입력과 출력의 관계 전달함수
125를 따라가기

차이를 드러내는 것과
정보를 복원하는 것은 다릅니다.

검정점은 0으로, 흰점은 255로 바꿉니다. 두 점 사이의 값은 비례해서 펼칩니다. 검정점 아래는 모두 0, 흰점 위는 모두 255로 제한하는 것이 클리핑입니다.

히스토그램은 값별 픽셀 개수를 셉니다. 같은 값들을 다른 위치에 놓아도 히스토그램은 같습니다. 어디에 있는지는 알려주지 않습니다.

계산과 반올림 살펴보기

t = (입력 − 검정점) ÷ (흰점 − 검정점)
t를 0~1로 제한하고, 255를 곱한 뒤 정수로 반올림합니다.

기본 예제의 125는 (125−50)÷150 = 0.5입니다. 255를 곱하면 127.5, 반올림한 정수는 128입니다. 검정점과 흰점이 같거나 역전되면 계산할 수 없습니다.

03 IMAGE BASICS

하나의 색을,
두 가지 좌표로 읽습니다.

RGB는 빨강·초록·파랑의 세 값으로, HSV는 색상·채도·V로 표현합니다.
숫자와 공간 속 점이 어떻게 연결되는지 움직여 보세요.

선수개념: 한 픽셀의 값 ↗RGB 정육면체 · HSV 원기둥
먼저 생각해 보기

채도 S가 0인 회색에서, 색상 H만 바꾸면 색이 달라질까요?

같은 색을 연결해 보세요

선택한 한 픽셀#FF0000RGB (255, 0, 0)
RGB 채널 값 0–255
HSV H: 도 · S,V: 0–1

색상 방향 H와 채도 S, 높이 V를 함께 살펴보세요.

35°
RGB 정육면체R · G · B 세 축
HSV 원기둥H 각도 · S 반지름 · V 높이
같은 색의 좌표

공간의 거리는 사람이 느끼는 색 차이와 같지 않습니다. V도 지각적 밝기와 같은 양은 아닙니다.

색을 바꾸는 것이 아니라,
표현하는 방식을 바꿉니다.

RGB의 세 값은 한 픽셀에 있는 세 채널입니다. 픽셀이 세 개라는 뜻이 아닙니다. 이 실험에서 (255, 0, 0)은 빨강, (128, 128, 128)은 회색입니다.

HSV에서 V는 정규화한 R·G·B 중 최댓값입니다. S=0이면 회색 계열이라 색상 방향 H는 의미가 없습니다. V=0이면 검정입니다.

수식과 단위 살펴보기

RGB를 255로 나눈 값의 최댓값을 M, 최솟값을 m이라고 하면 V=M입니다. M이 0보다 클 때 S=(M−m)/M이고, M=0이면 S=0입니다.

이 화면의 H는 0~360도(360도는 0도), S,V는 0~1입니다. 일반 OpenCV 8비트 HSV는 H=0~179, S,V=0~255를 사용합니다. 그 형식의 초록 H=60은 이 화면의 120도에 대응합니다.

8비트 RGB는 정수이므로 HSV에서 왕복 변환할 때 반올림 차이가 생길 수 있습니다. 이 실험은 HSV로 입력한 연속 좌표를 유지하고 RGB 표시만 정수로 반올림합니다.