본문 바로가기

디자이너가 알아야 할 것들/UI·UX Design

(14)
UI·UX 디자이너를 위한 가이드 - 해상도와 PPI·DPI 이 게시글은 공부하면서 정리한 내용입니다. 잘못된 정보는 제보해주시면 매우 감사드리겠습니다. *** 해상도와 밀도 기준 *해상도(Resolution): 화면(또는 이미지)을 이루는 픽셀 수의 정도를 뜻한다. 같은 크기의 화면을 기준으로 픽셀*이 많아지면 해상도가 올라가고 화면은 선명해진다. (PPI 참고) *픽셀(Pixel): 그림 원소(Picture element)란 뜻으로, 줄여서 px이다. 화면(또는 이미지)의 가로, 세로 해상도를 표현하는 단위로 쓰인다. (예: 1920*1080 px ) 빛의 삼원색인 R, G, B 값을 표현하는 서브픽셀(Subpixel)로 이루어져 있으며 비트(bit)로 정보가 표시된다. 1 bit는 2의 1승으로 2개의 컬러 값을 가지고, 8 bit는 2의 8승으로 256개의..
UI·UX 디자이너를 위한 가이드 - 래스터화(Rasterization) 이 게시글은 공부하면서 정리한 내용입니다. 잘못된 정보는 제보해주시면 매우 감사드리겠습니다. *** 디자인을 하다 보면 접하는 공식이 있다. "웹용 이미지는 72 dpi여야 한다" "4나 8배수로 아이콘을 디자인하는 것이 좋다" 머릿속에 박혀 있지만 근본적으로 이해하고 있지는 않는 공식들. 왜 그런 것일까? 맥락을 정리해보기로 했다. 래스터화(Rasterization) 컴퓨터그래픽스(Computer Graphics)의 그림 표현 방식은 벡터 그래픽*과 래스터 그래픽*으로 나뉜다. 벡터 그래픽을 래스터 그래픽으로 변환하는 것이 래스터화이며, 화면을 통해 보는 모든 것은 래스터화된 결과물이다. *벡터 그래픽(Vector Graphics): 점, 선, 면의 정보(좌표, 휘도...)로 그림을 구성한다. 기하학에..