본문 바로가기

디자인 공부

PPI와 DPI의 차이





PPI와 DPI의 차이


안녕하세요? :) 오늘은 PPI와 DPI의 차이가 무엇인지 알아보겠습니다.

우선 설명에 앞서 Pixel의 개념부터 알고 나면, 더 이해가 빠르므로 간단하게 Pixel부터 설명하겠습니다.


Pixel은 picture element의 단축형으로 우리나라 말로는 '화소(畵素)'라고 하며, 이미지를 이루는 가장 작은 단위인 네모 모양의 작은 점들을 'Pixel'이라고 합니다. 


(Pixel 예시)




그럼 PPI는 무엇일까요?




PPI는 pixel per inch의 약자로 1인치당 픽셀이 몇 개로 이루어졌는지를 나타내는 디스플레이 장치의 해상도 밀도 단위입니다.

10PPI면 정사각형의 한 면 1inch(2.54cm)에 10개의 픽셀이 있고, 총 10x10 = 100개의 픽셀로 이루어져 있다는 뜻입니다.


한 번쯤은 Pixel의 낱개 크기는 다른 cm, mm로 몇 크기일까 생각해보신분이 있을 수도 있는데 (언젠가 한 번쯤 생각해봤던 1인..) PPI를 어떻게 지정하느냐에 따라 픽셀의 크기는 달라집니다.


픽셀의 면적을 다른 말로는 Pixel Pitch라 하는데 인치당 PPI가 구성되는 숫자가 바뀌기 때문에, PPI가 몇이냐에 따라서 pixel pitch가 달라집니다. ( 1pixel = 1cm 이런 고정된 면적이 아니란 뜻 )






그럼 DPI는 무엇일까요?






DPI는 (dots per inch)의 약자로 1인치당 점이 몇 개가 들어갔는지를 말합니다. 흔히 프린터의 성능 등 출력물에 대한 해상도를 나타낼 때 쓰는 단위입니다. PPI와 같이 10DPI면 정사각형의 한 면 1inch(2.54cm)에 10개의 점이 있고, 총 10x10 = 100개의 점으로 이루어져 있다는 뜻입니다.






프로그램상에서 이를 조정할 때 따로 조정할까요? 아닙니다. PPI와 DPI는 resolution(해상도)에서 함께 조정됩니다.




픽셀이냐 점이냐의 차이지 1Inch안에서 해상도를 위해 구성되는 수는 같으므로 함께 조정되는 것입니다.


자 그럼 이제 쉬운 이해를 위해 직접 확인해볼까요? 해상도만 72ppi와 200pp로 달리해서 직접 모니터 화면에서 본 것과 인쇄물로 출력한 것을 보여드리겠습니다.


 

( 모니터 상에서의 차이 . 좌 72PPI / 우 200PPI )



( 출력물 상에서의 차이 . 좌 72DPI / 우 200DPI )






해상도의 차이가 크죠? 하지만 해상도가 차이 나면 선명도가 좋아지지만 그만큼 용량도 차이 나게 됩니다.



해상도가 낮으면 인치 안에 구성되는 Pixel이 줄기 때문에 용량이 적습니다. ex) 72ppi - 1인치당 72개의 픽셀



반대로 해상도가 높은 것은 1인치당 200개의 픽셀로 구성이 되기 때문에 선명해지나 용량이 커지죠. 

용량의 변화 72ppi  1.43M -> 200ppi 11.1 M픽셀 수의 변화 72ppi 595x842=500,990개 / 200ppi 1654x2339=3,868,706개


잠깐, 혹시나 지금 한번 따라 해보셨다면 출력 크기는 둘 다 A4사이즈 변함이 없는데, 왜 포토샵에서 사진 크기는 줄어든 것일까요?



이 이유는 PPI가 낮아졌기 때문에 그만큼 Inch 당 존재하던 Pixel의 개수가 줄어들었기 때문입니다. 3,868,706개 -> 500,990개


혹시 여기서 하나 궁금하실 수도 있는 게, 앞에서 Pixel의 크기는 PPI 단위마다 크기가 유동적이라고 했었는데, 왜 화면에서 사진 크기가 줄어드는 거지라고 하실 수도 있습니다. 이건 이미지의 1픽셀 = 화면에서 1픽셀이기 때문에 그렇습니다.


즉 토대가 되는 A4사이즈는 PPI가 DPI로써 선명도로만 영향을 주는거고, 디스플레이에서는 모니터 화면 자체에 픽셀이 고정되어 있기 때문에 웹이나 포토샵에서는 inch 당 픽셀 개수에 맞게 사진이 줄어드는 것입니다. 이제 확실히 이해되시죠?






자 이제 여태까지 설명을 짧게 요약해드리겠습니다.


  • PPI는 디스플레이상에서의 해상도를 나타낸다.
  • DPI는 출력물, 인쇄상에서의 해상도를 나타낸다.
  • PPI나 DPI나 해상도를 나타내는 단위로써는 같은 맥락이다.
  • Pixel Pitch는 이미지 센서를 구성하는 하나의 픽셀이 차지하는 면적
  • PPI나 DPI가 높아질수록 1inch당 안에 구성하는 Pixel과 dot이 많이지므로 선명도가 좋아지지만, 용량이 커진다.
  • 포토샵에서 해상도(resolution) PPI가 조정되면 모니터 화면 속에서 Pixel의Inch대비 개수변화 때문에 사진 크기에 변화가 있지만, 출력 시에는 출력 크기에 변함없이 출력된 사진의 선명도에만 변함이 있다.



마무리


포토샵은 비트맵 기반이기 때문에, 사진이 큰 상태에서 줄이는 것은 상관없지만, 사진이 작은 상태에서 PPI를 올리는 건 pixel이 늘어나도 깨짐 현상이 생기기 때문에 의미 없습니다. 그렇기에 처음부터 작업하기 전에 작업하고자 하는 PPI와 사이즈를 지정하고 작업 시작하는 것이 좋습니다.


웹용 이미지 : 72PPI / 인쇄 및 출력 이미지 : 300PPI


마지막으로 남기는 이야기.

사실 모니터 해상도는 72ppi를 넘은 지 이미 오래되었습니다. (모노크롬 타입의 애플컴퓨터 13인치가 72ppi)

그러나 현재도 보편적이게 72ppi를 쓰는 이유는 웹이라는 환경은 네트워크를 통해 이미지가 전송되다 보니, 로딩속도만 느려져서 암묵적인 값으로 정해진 것입니다.


출력물의 경우는 우리가 선명하고 좋다고 판단하는 정도면 300 dpi가 가장 좋습니다. 사람의 눈으로 구분할 수 있는 선명함의 한계가 300 dpi이기 때문입니다. 오늘의 준비는 여기까지입니다. :-) 혹시나 이해가 안 가시거나, 잘못된 내용이 있다면 언제든지 피드백해주세요!  감사합니다!





'디자인 공부' 카테고리의 다른 글

이미지 파일 형식(포맷)과 확장자  (0) 2017.02.16
시각디자인의 종류  (0) 2017.02.08
벡터와 비트맵의 차이  (3) 2017.01.23
PPI와 DPI의 차이  (9) 2017.01.09
디자인의 어원  (1) 2017.01.05
디자이너들의 꿈꾸는 공간을 시작하며  (5) 2017.01.04
  • 도현욱 2017.01.10 15:49

    제가 본것중에서 제일 이해 잘되게 쓰셨네여 감사여`.`

  • webhaus 2017.02.27 11:44

    10dpi일 때 10 x10= 100 dot이 맞지만
    20dpi일 때 20 x20= 400dot가 되어야 합니다.
    ppi도 마찬가지....

    • Favicon of https://blank2.tistory.com 오지식 2017.02.27 12:03 신고

      글 준비하면서, 실수한 것 같습니다. ㅠㅠ 문제점 지적해주셔서 감사합니다. 하단 아래에 메일로 연락처 보내주시면, 커피 한 잔 보내드리겠습니다. 감사합니다! :-)

  • Favicon of https://blank2.tistory.com 오지식 2017.02.27 12:08 신고

    정정내용 안내해드립니다. 예제 이미지에서 20DPI와 20PPI dot과 pixel의 총 값이 200이 아니라 400입니다.
    오류 발견해주시고 댓글로 피드백 주신 webhaus님께 진심으로 감사드립니다. :-)

  • 궁금한점! 2017.05.18 12:04

    사진스캔시 dpi 와 ppi 를 같은 개념으로 보면 되는것인가요~?
    예를들어 600ppi 가 600dpi와 같은것인가요~~?

  • soso 2017.05.19 17:10

    안녕하세요
    저는 앱 개발 관리를 맞아 진행하고 있는 초보 개발자입니다.
    앱 개발시에 안드로이드, iOS에서 ppi, dip 관련해서 정의되지 않은 점들이
    위 글을 보면서 이해하였습니다.
    좋은 글 올려주셔서 감사합니다.
    앞으로도 유익한 정보 공유 기대하겠습니다.

  • 유학생 2017.06.12 12:06

    안녕하세요.
    유익한 정보 감사합니다.
    이해되지 않는 부분이 있어 질문드리려고 합니다.
    예를 들어 A2사이즈의 FHD 모니터에서 FHD로 찍힌 사진을 보면 ppi에 맞게 화면에 꽉찰텐데 그걸 A4에 프린트 하면 dpi가 네 배로 증가하는거 아닌가요? (프린터의 성능을 고려하지 않을때)
    dpi가 ppi와 같은 개념이라면 해상도가 낮은 사진을 가져왔을 때 모니터는 ppi가 고정되어 있으니 작은 사이즈로 보이고 인쇄물은 사이즈가 정해져 있으니 선명도 즉, dpi가 떨어진다고 생각하면 되는걸까요?

    만약 저 가정들이 틀린 것이고 저장한 resolution이 변하지 않는거라면 결국 dots per inch라는 원 의미는 퇴색되고 선명하다 흐릿하다는 느낌만 표현하는 것이 아닌지요? (저화질의 사진을 뽑았을때 픽셀이 눈에 보일 정도로 커지니까, 즉 inch당 dots수가 줄어드니까)

    • 지나가는 사람 2017.07.07 06:45

      FHD 모니터에서 FHD로 찍힌 사진을 보면 화면에 꽉 차는 것은 맞을텐데 그 이유는 화면에서 이미지가 보이는 방식은 사실상 dpi 가 어떻게 설정이 되어있던 액츄얼 사이즈, 즉 이미지의 가로 세로 픽셀에 맞추어서 뜨기 때문입니다. 예를 들면 웹에서 이미지를 저장해서 포토샵으로 열어보면 대부분이 72dpi 로 저장되어있지만 간혹 300dpi로 저장되어 있는 사진도 있습니다. 하지만 몇 dpi 로 되어있던 400x600pixel 이미지면 웹에서 보기에 동일한 사이즈로 보입니다. 그러므로 웹이던, GUI디자인이던, 게임디자인이던 화면용으로 제작하는 이미지는 몇 dpi로 저장하던 큰 의미는 없고 액츄얼 사이즈가 중요하다는 겁니다. 다만 전통적으로 혹은 습관적으로 72dpi 로 맞추는 것이죠.

      두번째 질문인 A2사이즈의 FHD로 찍힌 사진을 A4에 프린트하면 dpi가 네 배로 증가하냐는 질문은 어떤 소프트웨어로 출력하냐에 따라 다르겠지만 포토샵을 기준으로 한다면 '아니다'입니다. 프린트 옵션에 따라 다르겠지만, 일반적인 옵션이라면 A4 사이즈 종이에 A2사이즈 이미지가 여러장으로 나뉘어 프린트됩니다. A2사이즈는 포토샵에서 캔버스 사이즈라 하는데 이 사이즈는 기계가 임의로 수정하지 않기 때문에 A2사이즈는 A2 사이즈로 출력되는 것이죠. 이것을 A4 사이즈로 수정하면서 이미지 퀄리를 손해보고싶지 않다 하면 포토샵에서 임의로 캔버스 사이즈 줄인만큼 dpi를 높여주면 됩니다. 그러면 물리적인 사이즈는 줄어들지만 해상도가 높아지는 것이죠. 하지만 본문에서 보시는 것처럼 300dpi가 넘어가면 큰 의미가 없습니다. 잡지인쇄같은 고품질 인쇄도 300dpi 로 맞춥니다.

      마지막 질문인 resolution 이 변하지 않는다면 결국 dpi라는 원 의미는 퇴색되고 선명하다 흐릿하다는 느낌만 표현하는 것이 아니냐는 질문은 저도 동의합니다. 72dpi 이미지를 출력하거나 인쇄한다 하여도 인치당 72개의 점으로 인쇄되는 것이 아니라 뿌옇더라도 꽉 채워서 인쇄하는 것 같습니다.

  • Favicon of https://dysky.tistory.com 쟝냥 2020.11.19 17:52 신고

    좋은 정보 감사합니다.
    관련 글을 작성중인데 출처도 밝히고 해당글을 퍼갈께요~