PIXEL ART RENDERING

같은 픽셀, 다른 화면 격자

원본 작화, 확대 필터, 좌표 스냅과 색으로 만드는 움직임을 나눠 관찰하세요.

원본과 출력 격자를 함께 비교하세요. 정수 배율·필터·표시 좌표·원본 색 변화는 서로 다른 조절입니다.

원인 · 해결 · 대가

같은 픽셀, 다른 화면 격자

원본의 윤곽과 표시 격자는 다른 단계

원본 윤곽의 한 픽셀을 바꾸는 것은 작화입니다. 점 필터라도 비정수 확대에서는 한 원본 칸이 서로 다른 개수의 출력 칸을 차지할 수 있습니다. 4칸을 1.5배로 늘리는 가운데 표본 규칙에서는 폭이 1·2·1·2칸, 2배에서는 2·2·2·2칸입니다.

필터와 스냅이 바꾸는 것

점 필터는 원래 색을 고르고 보간은 경계에 중간색을 만듭니다. 이 모델은 선형 RGB에서 4개 표본을 섞은 뒤 sRGB로 표시합니다. 표시는 x_display = round(p·x) / p로 격자에 맞추지만 실제 x는 그대로 유지됩니다. 설정의 p는 출력 격자의 픽셀/월드 비율이며 원본 확대 배율과 별도로 적용합니다.

색 기반 서브픽셀과 디더링

두 고정 칸의 선형 밝기를 (1,0)에서 (0,1)로 옮기면 밝기 중심이 조금씩 이동합니다. 픽셀 좌표가 이동하거나 격자가 더 촘촘해진 것은 아닙니다. 여기서는 선형 밝기를 sRGB로 변환해 표시하므로 감마 RGB 바이트를 바로 평균하는 예가 아닙니다. 실제 작화의 미적 결과를 보증하는 수열도 아닙니다.

디더링은 밝은색과 어두운색을 공간에 번갈아 놓아 중간톤을 표현합니다. 이 모델은 4×4 순서 행렬을 8×8에 반복합니다. 두 색 이외의 중간색은 만들지 않으며, 1/16 단위의 면적 비율을 표현합니다. 색으로 만드는 프레임 변화와 공간 무늬를 같은 기법으로 설명하지 않습니다.

범위와 대가

이 화면은 자체 8×8 그림과 결정적인 CPU 샘플러입니다. 캔버스의 검사 확대와 계산 격자를 분리하며 특정 엔진의 최종 GPU 필터·카메라·아틀라스를 재현하지 않습니다. 정수 확대는 쓸 수 있는 화면 크기를 제한하고, 스냅은 표시 이동을 계단화하며, 보간은 팔레트 밖 색을 만들 수 있습니다.

Unity 6.0 · Pixel Perfect Camera
2D Will Never Die · 작가의 서브픽셀 작화 예제