비트맵과 벡터의 차이는 무엇일까?

벡터 방식과 비트맵 방식의 차이는 무엇일까요?

이미지를 표현하는 방식에 대표적으로 비트맵 방식과 벡터 방식이 있습니다. 그렇다면 두 표현방법의 차이는 무엇일까요?

---

비트맵 방식

비트맵 방식을 설명하기 전에 먼저 픽셀이라는 개념을 알아야 합니다. 픽셀이란 Picture(그림) + Element(원소)의 합성어로서 화소라고도 하는 화면을 구성하는 가장 기본이 되는 단위입니다. 이 점 하나에 해당 색의 정보(빨간색, 녹색, 파란색, 투명도 등)가 담겨져 있으며, 이는 곧 그림의 용량과 직결됩니다.
그렇다면 비트맵 방식이라는 건 무엇일까요?

비트맵 방식 :
비트맵 방식은 '비트의 지도(Map of bits)'라는 뜻으로, 각 픽셀에 저장된 비트 정보가 집합된 것입니다. 비트맵은 벡터와 다르게 픽셀의 점 하나하나가 이미지를 이루는 요소이기 때문에 벡터보다 정교한 이미지 표현이 가능합니다. 디스플레이는 픽셀의 배열로 구성되어 있는데요. 픽셀들의 배열 방식과 픽셀의 숫자와 비율이 디스플레이의 해상도를 결정한다고 할 수 있습니다. 1920x1080의 해상도를 가진 디스플레이의 경우 가로 1920개, 세로 1080개의 픽셀들로 구성되어 있어, 이렇게 가로와 세로를 곱하면 디스플레이가 가진 총 픽셀의 개수를 알 수 있습니다. 픽셀의 수가 많아질수록 화질은 뛰어나지만, 용량 또한 커지게 되고 비트맵 이미지는 크기를 확대하거나 축소하면 기존 이루고 있던 픽셀의 수가 변하여 원본 이미지에 손상이 가게 되는데, 이로 인해 깨짐 현상과 이미지 품질 저하가 발생하게 됩니다. 바로 이것을 '이미지가 깨졌다'라고 표현하죠. 비트맵은 다른 표현으로 픽스맵(Pixmap)이나 레스터(Raster) 이미지로도 불립니다. 대표적인 프로그램으로는 어도비 포토샵이 있습니다.

---

벡터 방식

벡터 방식 :
벡터 방식은 비트맵과는 반대로 표현되는 그래픽의 형태들이 수학적 공식으로 이루어져 있습니다. 다시말해 벡터 방식의 그래픽은 고정된 비트맵을 가지고 있는 것이 아니라, 수학적 공식으로 이루어진 오브젝트들이 그때그때 디스플레이에 비트맵화 되어 스크립에 표시됩니다. 점과 점을 연결함으로써 수학적 함수관계에 의해 이미지를 표현하여 선과 면을 만들어내는 매커니즘을 가지고 있습니다. 이렇게 만들어진 선이 두껫값과 색상 값, 곡률값을 갖거나 면이 색상 값을 가질 수 있습니다. 이런 점, 선, 면의 기본적 벡터 그래픽 요소들이 모여 다양하고 복잡한 벡터 그래픽을 만들게 되는 것입니다.

특징 :
벡터의 점은 좌표계(x,y)로 구성되기 때문에 비트맵의 픽셀과 달리 이미지의 크기 조절이나 변형 때문에 해상도가 깨지지 않습니다. 보기로 봐야 할 만큼 크기를 줄이고, 건물 외벽에 붙일 만큼 크기를 키워도 깨짐현상이 없습니다. 그래서 벡터 방식은 여기저기 적용하는 부분이 많아, 크기조절이 자유로워야 하는 로고나 여러 포인트로 조정되어야 하는 서체, 다양한 크기로 여러 곳에 응용되어야 하는 캐릭터 등을 제작할 때 사용합니다. 그리고 픽셀로 구성되는 비트맵보다 용량이 현저히 적기 때문에 파일을 관리하기도 편리합니다. 용량이 너무 크면 USB나 외장하드 등에서 너무 큰 공간을 차지해서 불편하죠. 벡터 방식을 사용하는 대표적인 프로그램은 어도비 일러스트레이터가 있습니다.

---

어떤 방식이 어디에 효과적일까?

BMP, GIF, JPEG, PNG가 픽셀을 사용하는 대표적인 포맷으로 비트맵 방식을 사용을 합니다. 또, WEBP라는 비교적 최근에 나온 포맷이 있는데, 중요해서 잠시 밑에서 설명하겠습니다. 연속적인 값으로 그림을 그리는 벡터 이미지와는 대비되죠. 또한 컴퓨터 그래픽에서 이미지의 크기를 나타내는 도량형으로 쓰이기도 합니다. 그래픽 요소들을 만들 때는 벡터 방식의 프로그램으로 제작하고, 사진과 같은 이미지를 제작할 때는 비트맵 방식으로 제작합니다. 어떤 작업이든 일러스트레이터 혹은 포토샵이 편하다고 무조건 그 프로그램만 지향하는 것은 안 좋은 방법입니다. 이 두 방식의 차이를 알고 계시면, 자신이 작업할 때 해당 작업물에 적한합 방식으로 작업하시기에 편하실 것입니다.

---

반응형

WEBP가 뭐죠?

WebP(Web + Picture)라는 단어에서 알 수 있듯이 웹에서 사용되는 기존의 GIF, JPG, PNG 이미지 포맷을 대치하기 위해 개발되었습니다. WebP의 가장 큰 장점은 같은 품질의 이미지를 만들 때 기존의 이미지 포맷보다 파일 크기가 더 작아집니다. WebP를 사용하면 JPG는 기존 대비 25~34%, PNG는 비손실의 경우 평균 26%(손실 방식의 경우 60~70%) 정도 기존 파일 대비 작아집니다. 특히 움짤의 경우 기존의 GIF를 동일한 화질의 WebP로 변경하면 파일 크기가 절반 이하로 줄어들기도 합니다. 현재 구글의 크롬, MS의 엣지, 애플의 사파리 등 거의 모든 브라우저에서 WebP를 지원하고 있기 때문에 점점 더 널리 쓰일 것으로 예상됩니다.

---

총 정리

	비트맵 방식	벡터 방식
구성	수학적으로 정의된 점과 선	색상 정보를 가진 픽셀 정보
해상도	오브젝트 변경에 무관	이미지 변형에 영향을 받음
특징	아주 작은 이미지 표현 가능하나 자연스러운 색상표현이 어려움	자연스러운 색상은 표현 가능하나 아주작은 이미지는 알아보기 힘듬
저장방식	수학적인 계산식으로 저장	고정된 해상도에서 픽셀의 분포를 데이터로 저장
디스플레이	크기에 상관없이 선명함	이미지를 확대하면 계단현상이 나타남
프린터 출력	자동으로 크기 조절하여 선명함	고해상도로 출력해야 선명함
프로그램	일러스트레이터, 코렐드로우, 프리핸드	포토샵, 페인터, 페인트 샵