1. 핵심 주제

핵심 키워드:

픽셀
비트맵 / 벡터
아날로그 / 디지털 데이터
샘플링
해상도
색심도

즉, 컴퓨터가 이미지를 어떻게 표현하는지

2. 픽셀

픽셀이란 디지털 이미지의 가장 작은 기본 단위이다.

이미지를 멀리서 보면 자연스러운 선과 면처럼 보이지만, 확대해 보면 사실은 아주 많은 작은 점들로 이루어져 있다.
그 점 하나하나가 바로 픽셀이다.

하나의 디지털 이미지 = 수많은 픽셀의 집합

픽셀의 의미

예를 들어 어떤 사진이 있다고 하자.

가로 1920
세로 1080

이면,

1920 × 1080 = 2,073,600개

의 픽셀로 이루어진 것이다.

각 픽셀은 보통 다음 정보를 가진다.

색상
밝기
경우에 따라 투명도(alpha)

즉, 컴퓨터는 그림 전체를 한 번에 이해하는 것이 아니라 각 점마다 숫자로 저장된 색 정보를 보고 이미지를 표현한다.

왜 확대하면 깨져 보이나

픽셀 기반 이미지를 크게 확대하면 원래 작은 점들이 눈에 보이기 시작한다.

그래서

원래는 부드러운 선처럼 보이던 것이
확대하면 계단처럼 보이고(에일리어싱, Aliasing)
네모난 점이 드러난다

이 현상을 흔히 픽셀이 보인다, 깨진다고 표현한다.

3. 비트맵 이미지와 벡터 그래픽

이미지를 표현하는 방식은 크게 두 가지다.

비트맵(bitmap) 또는 래스터(raster)
벡터(vector)

3-1. 비트맵 이미지

정의

비트맵 이미지는 이미지 정보를 픽셀(점) 단위로 저장하는 방식이다.

여러 개의 픽셀로 하나의 그림을 표현하는 방식

래스터(raster) 이미지라고도 부른다.

특징

비트맵은 다음 특징이 있다.

점들의 집합으로 구성된다
사진 표현에 유리하다
색의 미세한 변화 표현에 강하다
확대하면 화질이 급격히 나빠진다

예를 들어 사진은 사람 얼굴, 하늘, 그림자처럼 색이 매우 부드럽게 바뀌는 부분이 많다.
이런 표현은 비트맵이 매우 잘한다.

비트맵이 유리한 경우

사진
영상의 한 프레임
질감이 풍부한 그림
텍스처 이미지
스캔한 그림

즉, 현실 세계를 그대로 담아내는 데 강한 방식이다.

비트맵의 단점

비트맵 이미지는 확대할수록 문제점이 드러난다.

예를 들어 100 × 100 이미지를 크게 늘리면 원래 없던 세부 정보가 새로 생기는 것이 아니라 기존 픽셀을 억지로 늘려 보여주게 된다.

그래서

선이 거칠어진다
경계가 깨진다
흐릿하거나 뭉개진다

3-2. 벡터 그래픽

정의

벡터 그래픽은 이미지를 점으로 저장하는 것이 아니라 도형 정보와 수식으로 (코드화 해서) 표현하는 방식이다.

예를 들어 원 하나를 저장할 때도 픽셀 하나하나를 저장하는 것이 아니라

중심 좌표
반지름
선 색상
채우기 색상

같은 식으로 저장한다.

벡터 그래픽 = 도형을 수학적으로 표현한 그래픽

특징

벡터 그래픽은 다음 특징이 있다.

확대·축소해도 형태가 깨지지 않는다
선과 도형이 매끄럽다
로고, 아이콘, 일러스트에 적합하다
사진처럼 색이 미세하게 변하는 표현은 어렵다
객체 수가 많아질수록 복잡해질 수 있다

벡터가 유리한 경우

로고
아이콘
포스터용 글자
일러스트
도면
UI 아이콘
SVG 그래픽

즉, 선명한 선과 도형 중심의 작업에 적합하다.

3-3. 비트맵과 벡터 비교

비트맵

픽셀 기반
사진 표현에 강함
확대하면 깨짐
색 변화가 자연스러움

벡터

수식/도형 기반
로고나 도형 표현에 강함
확대해도 안 깨짐
사진 같은 표현은 불리함

아주 쉽게 정리하면

비트맵 - “그림을 점으로 찍어 놓은 것”

벡터 - “그림을 수학 공식으로 그려 놓은 것”

4. 비트맵 폰트와 벡터 폰트

글자도 결국 화면에 보이려면 모양 정보가 필요하다.

컴퓨터는 문자 자체를 이해하는 것이 아니라

문자 코드
글자의 모양(폰트)

을 같이 이용한다.

비트맵 폰트

비트맵 폰트는 글자 모양을 픽셀 단위로 저장한 방식이다.

특징:

특정 크기에서는 또렷할 수 있음
크기를 키우면 깨질 수 있음
과거 저해상도 환경에서 많이 사용됨

예:

옛날 게임 폰트
픽셀 아트 폰트

벡터 폰트

벡터 폰트는 글자를 수식과 곡선 정보로 저장한 방식이다.

특징:

확대해도 깨지지 않음
다양한 크기에서 유연하게 사용 가능
현대 운영체제와 디자인 소프트웨어에서 기본

즉, 오늘날 대부분의 일반 폰트는 벡터 기반이라고 보면 된다.

5. 아날로그 데이터와 디지털 데이터

이 부분은 이미지뿐 아니라 영상, 소리까지 이어지는 매우 중요한 개념이다.

5-1. 아날로그 데이터

아날로그 데이터는
자연 그대로 연속적으로 변화하는 형태의 데이터이다.

예를 들면:

실제 풍경
종이 사진
사람 목소리의 실제 파형
필름 영상

아날로그는 값이 끊기지 않고 연속적으로 변한다.

예를 들어 밝기가 0 아니면 1만 있는 것이 아니라 그 사이의 무수히 많은 값을 연속적으로 가진다.

5-2. 디지털 데이터

디지털 데이터는 컴퓨터가 처리할 수 있도록 숫자로 끊어서 표현한 데이터이다.

이미지를 디지털로 바꾸려면

화면을 작은 점으로 나누고
각 점의 대표 색을 숫자로 기록해야 한다

현실의 연속적인 정보
→ 잘게 나눔
→ 숫자로 저장

하는 과정이 필요하다.

왜 디지털로 바꿔야 하나

컴퓨터는 자연 그대로의 연속적인 정보를 직접 다루지 못하고 결국 수치화된 데이터만 처리할 수 있다.

그래서 사진이나 그림도 결국은

픽셀로 나누고
각 픽셀에 색 번호를 주고
그 숫자들을 저장하는 방식

으로 바뀌어야 한다.

스캐너의 역할

스캐너는 대표적인 변환 장치다.

종이 사진(아날로그)
→ 스캔
→ 디지털 이미지 파일

즉, 스캐너는 아날로그 이미지를 디지털 데이터로 바꾸는 도구다.

6. 샘플링

정의

샘플링(sampling)은 아날로그 데이터를 디지털로 바꿀 때 전체를 연속적으로 다 저장하지 않고 일정 간격으로 일부를 뽑아 저장하는 것이다.

쉽게 말하면, 연속적인 원본을 일정 간격으로 잘라서 대표값만 기록하는 것이다.

이미지에서의 샘플링

사진 전체를 무한히 세밀하게 저장하는 것은 불가능하다.
그래서 이미지를 디지털화할 때는

가로세로 격자를 만들고
각 칸의 대표 색을 하나씩 기록한다

즉, 원래의 연속적인 이미지 정보를 부분적으로만 추출해서 저장한다.

왜 중요한가

샘플링이 너무 거칠면

이미지가 흐릿해짐
세부 묘사가 사라짐
계단 현상이 생김

샘플링이 더 촘촘하면

더 세밀하게 표현 가능
용량은 더 커짐

즉, 샘플링은 품질과 용량의 균형 문제와 연결된다.

7. 해상도

해상도란

해상도(resolution)는 이미지가 얼마나 세밀하게 표현되는가를 나타내는 개념이다.

쉽게 말해:

이미지를 구성하는 점(픽셀)의 촘촘함, 정밀도

이다.

점의 수가 많을수록 더 세밀하게 보인다.

예시

97 × 120 이미지보다 198 × 240 이미지가 일반적으로 더 많은 픽셀을 가지므로 더 정밀하게 표현할 수 있다.

해상도의 3가지 측면

강의에서는 해상도를 세 가지로 구분한다.

1) 입력 시의 해상도

이미지를 처음 디지털로 가져올 때의 해상도다.

예:

사진 원본의 선명도
스캐너의 성능
스캔 설정 값

즉, 처음 얼마나 세밀하게 읽어들였는가의 문제다.

2) 모니터 해상도

화면에 표시되는 해상도다.

예:

640 × 480
1024 × 768
1280 × 768
1600 × 900

등처럼 화면이 가로 몇 픽셀, 세로 몇 픽셀로 이루어지는지를 말한다.

즉, 모니터가 한 화면에 얼마나 많은 픽셀을 표시할 수 있는가의 개념이다.

3) 출력 시의 해상도

프린터나 출력 장치가 얼마나 정밀하게 결과물을 인쇄할 수 있는가를 의미한다.

즉, 같은 이미지라도 어떤 프린터로 출력하느냐에 따라 결과 품질이 달라질 수 있다.

8. 업샘플링과 다운샘플링

이 부분은 해상도 조절에서 매우 중요하다.

업샘플링

업샘플링(upsampling)은 이미지의 픽셀 수를 늘리는 것이다.

하지만 주의할 점은 원래 없던 진짜 정보가 생기는 것은 아니다는 점이다.

그래서 단순히 크게만 하면 화질은 좋아지지 않는다.

인터폴레이션

인터폴레이션(interpolation)은 기존 픽셀 사이를 계산해서 중간 값을 만들어 넣는 방식이다.

즉, 기존 픽셀 사이에 추정값을 넣어서 더 부드럽게 보이게 하는 것이다.

이 방식은 확대를 좀 더 자연스럽게 보이게 해주지만, 없는 디테일을 진짜로 복원하는 것은 아니다.

다운샘플링

다운샘플링(downsampling)은 픽셀 수를 줄이는 것이다.

즉, 이미지를 더 작은 해상도로 줄이는 과정이다.

장점:

용량 감소
처리 속도 향상

단점:

세부 정보 손실

9. 색심도

정의

색심도(color depth)는 픽셀 하나를 표현하기 위해 몇 비트의 정보를 사용하는가를 뜻한다.

즉, 픽셀 1개당 할당된 비트 수이다.

이 값에 따라 한 픽셀이 표현할 수 있는 색의 수가 달라진다.

기본 원리

비트는 2진수이므로 n비트로 표현 가능한 경우의 수는 다음과 같다.

2^n

이다.