본문 바로가기
포토샵 강좌

해상도(PPI)와 픽셀(Pixels) 이해하기 포토샵 기초 강좌

by 이커머스 마스터 2024. 1. 10.
반응형

01. 포토샵과 일러스트레이터 프로그램

1-1. 포토샵(Photoshop)
- 포토샵은 주로 사진편집에 많이 활용되는 프로그램입니다.
  주로 촬영된 이미지를 사용하는 온라인쇼핑몰과 디자인 파트에서 많이 사용됩니다.

- 사진(Photos), 아트워크(Artwork), 웹그래픽(Web graphics), 목업(Mock-up)에서 많이 사용됩니다.


1-2. 일러스트레이터(Illustrator)
- 일러스트레이터는 로고 디자인에 주로 활용되는 프로그램입니다. 보통 일러스트라고 줄여서도 말합니다.
  포토샵은 사진으로 시작된다면 일러스트레이터는 백지상태에서 디자인을 시작합니다.

- 로고, 캐릭터(Logos), 마스코트(Mascots), 아이콘(Icons), 페이지(Page docs)에 많이 사용됩니다.

 

02 포토샵과 일러스트레이터 특징과 차이점

2-1. 포토샵(Photoshop)
- 포토샵은 비트맵(Bitmap)파일이라 부른다. 가장 큰 특징은 확대 시 계단 현상이 생긴다는 점이다.
- 픽셀 기반으로 편집
- 이미지와 촬영 사진
- 원하는대로 편집 가능
- 주로 웹용으로 사용

*비트맵 방식은 여러 개의 픽셀이 모여서 하나의 이미지를 만드는 방식을 말한다. 그래픽에서 가장 많이 사용되는 이미지를 픽셀 단위로 보여준다.
디지털 카메라나 스캐너 이미지는 모두 비트맵 이미지라 할 수 있다. 비트맵 방식의 대표적인 이미지 포맷에는 JPG, GIF, PNG, BMP, TIF 등이 있다.

장점 : 작은 픽셀로 이루어져 있어, 사진과 같이 사실적인 이미지 표현이 가능하다.

단점 : 이미지 확대 시 계단현상(이미지 깨짐)이 발생한다.

2-2. 일러스트레이터(Illustrator)
- 일러스트레이터는 벡터(Vector)파일이라 부른다. 가장 큰 특징은 확대 시 계단 현상이 없는 것이 특징이다.
- 백지 상태에서 시작
- 로고, 캐릭터, 명함 등
- 큰 해상도에 적합
- 주로 인쇄물에서 사용

*점과 선의 좌표와 직선 또는 곡선의 기울기를 수치적 연산을 통해 이미지를 보여준다. 비트맵 이미지에 비해 사실적인 표현이 불가능하기 때문에 사진과 같은 이미지 보다는 글자, 로고, 캐릭터, 클립 아트 등의 이미지 제작에 적합하다.

장점 : 이미지를 확대하여도 계단 현상이 없다. 즉 확대 축소에 영향을 받지 않는다
         비트맵 이미지에 비해서 수정, 변형이 용이하다
         파일 사이즈가 상대적으로 적다.
         깨끗한 출력물을 얻을 수 있다.

단점 : 사진과 같이 사실적인 느낌 표현이 어렵다.

 

03 픽셀(Pixel)이란?

- 픽셀(Pixel)은 Picture(그림) Element(원소)의 줄임 말로 비트맵 이미지의 최소 단위이며 ‘화소’라고 불리며, 컴퓨터, TV, 모바일 기기 화면의 이미지를 구성하는 최소 단위이다. 디지털 이미지들을 크게 확대해보면, 그림의 경계선마다 부드러운 곡선이 아닌 계단같이 연결된 작은 사각형들이 모여서 이미지를 형성한다. 픽셀수가 많을 수록 정교하고 매끄럽고 이미지의 퀄러티가 결정된다.

ex)1024x768 - 컴퓨터 해상도는 가로 1024픽셀x세로 768픽셀

 

04 픽셀, PPI, 해상도의 관계

- 온라인 콘텐츠를 제작하거나 상세페이지등을 제작할 때 가장 중요한건 웹형식에 맞게 디자인 하는 것입니다. 그 중에서 무엇보다 중요한건 해상도를 정확히 알고 디자인하는 것 입니다. 여기서 PPI는 무엇이고 해상도는 픽셀과 어떤 관계가 있는지 살펴 보겠습니다.

4-1. PPI(Pixel Per Inch)란?
- PPI는 1인치 안에 들어오는 픽셀수를 의미한다.  PPI가 높을수록 표현할 수 있는 픽셀 수가 많아지고 더 세밀한 이미지 표현이 가능하다.

4-2. 해상도(Resolution)란?
- 해상도(resolution)’는 한 화면에 ‘픽셀’이 몇개나 포함되는지를 의미한다. 가로 픽셀수와 세로 픽셀수를 곱한 형태로 표현하며, 픽셀이 많을 수록 고해상도의 선명한 이미지 표현이 가능하다.

 

 

그림에서 확인가능하듯이 PPI가 높을수록 고해상도라고 부른다. 

* 해상도와 픽셀의 관계를 꼭 알고 디자인해서 웹에 업로드하거나 출력했을 때 문제가 없게 됩니다. 꼭 알아야 할 해상도는 72(PPI)와 300(PPI)입니다.
72(PPI)는 웹용 해상도라 부른다. 웹에 업로드할 작업물이라면 꼭 72PPI로 디자인해서 업로드 해야 한다. 반대로 인쇄물에 사용할거라면 300PPI로 작업해야 출력했을 때 이미지의 화질에 문제가 없다. 다만 고해상도일수록 용량이 커진다고 생각하시면 됩니다.

 

 

 

반응형