작은 화면용 5x5 픽셀 폰트

3 hours ago 1
  • 모든 문자를 5픽셀 정사각형 안에 넣고 6x6 그리드에 안전하게 그릴 수 있게 맞춘 초소형 고정폭 폰트로, 작은 화면과 제한된 메모리 환경에 맞게 설계됨
  • 5x5 크기는 4x4에서 부족했던 E, M, W 표현 문제를 해결하고, 대부분의 소문자를 대문자보다 1픽셀 작게 그려 시각적 구분성도 확보함
  • 전체 폰트가 350바이트에 불과해 AVR128DA28 같은 8비트 마이크로컨트롤러에 잘 맞고, 160x128이나 128x64 OLED 같은 작은 화면에서 픽셀 효율이 커짐
  • 비슷한 크기로 렌더링한 벡터 폰트와 비교해도, 안티앨리어싱과 훨씬 큰 코드·폰트 데이터를 써도 350바이트 수제 폰트보다 결과가 떨어짐
  • 더 작은 3x5, 3x4, 3x3, 2x3, 3x2, 2x2까지 실험했으며, 3x5는 꽤 읽을 만하고 3x2는 2x3보다 낫지만 2x2는 사실상 비밀 코드에 가까운 수준까지 무너짐

5x5 픽셀 폰트

  • 모든 문자가 5픽셀 정사각형 안에 들어가고 6x6 그리드에 안전하게 그릴 수 있게 설계됨
    • 기반은 lcamtuf의 5x6 font-inline.h이며, 이 폰트는 ZX Spectrum의 8x8 폰트에서 영향을 받음
    • 5x5는 가독성을 해치지 않는 최소 크기로 잡힘
  • 2x2는 불가능하고 3x3은 기술적으로 가능하지만 읽기 어려우며, 4x4는 E, M, W를 제대로 그리기에 부족함
    • 5x5에서는 이 문제가 해결됨
  • 5x5는 대부분의 소문자를 대문자보다 1픽셀 작게 그릴 수 있어 시각적으로 구분 가능함
  • 더 좁은 4x53x5도 가능하지만, M, 점이 있는 0, 그리고 U/V/Y의 구분성을 희생해야 함
  • 모든 문자를 일정한 폭으로 맞추면 프로그래밍이 쉬워짐
    • 화면에서 문자열 길이는 항상 문자 수의 6배로 계산됨
    • "8978"이 "1111"보다 길어져 레이아웃이 넘치는 문제를 걱정하지 않아도 됨
  • 폰트 전체 크기는 350바이트에 불과해 AVR128DA28 같은 8비트 마이크로컨트롤러에 잘 맞음
    • 본문에는 AVR128DA28이 RAM 16kB를 가진다고 적혀 있음
    • 이런 칩은 저렴하고 저전력이며 견고하지만 그래픽 처리 여유는 적음
  • 384x288 디스플레이도 픽셀이 약 11만 개라 AVR 메모리에 담기에는 너무 큼
    • 대신 160x128이나 128x64 OLED처럼 더 작은 화면이 더 실용적이고 저렴함
    • 이런 화면에서는 손으로 그린 픽셀 효율적 폰트가 유리함
  • 비슷한 크기로 렌더링한 벡터 폰트도 함께 비교됨
    • 해당 벡터 폰트는 실제로 높이 6픽셀이지만 글자는 더 좁음
    • 안티앨리어싱, 수 메가바이트 코드, 1MB 폰트 데이터를 써도 350바이트 수제 폰트보다 결과가 떨어짐

실제 화면과 더 작은 크기 실험

  • 실제 픽셀은 완전한 정사각형이 아니라서 화면에서의 모습은 상단 렌더링과 정확히 같지 않음
    • 서브픽셀이 만드는 의사 드롭섀도우 효과는 긍정적으로 평가됨
    • 흑백 디스플레이에서는 이 효과가 없지만 그래도 예상보다 더 부드럽게 보임
  • 픽셀 사이의 간격은 e와 g를 더 그럴듯하게 보이게 만듦
    • 같은 효과를 바탕으로 더 작은 폰트 가능성도 이어서 탐색함
  • 3x5는 타협 없는 최소 해상도는 아니지만 꽤 괜찮은 수준으로 읽힘
    • 이 크기에서는 글리프가 32,768개 있고 그중 27,904개가 서로 구분됨
    • M, W, Q는 손해를 보지만 O와 0은 여전히 구분됨
    • 화면에 50% 더 많은 열을 넣어야 할 때 선택지가 될 수 있음
  • 3x4에서는 여전히 읽을 수 있지만 제약이 커짐
    • 글리프는 4,096개, 그중 3,392개가 서로 구분됨
    • 이 크기에서는 대문자와 소문자를 구분할 수 없어 제한된 공간에서 가장 잘 맞는 스타일 하나를 고름
    • 숫자 표현력도 나빠지지만 아직은 작동 가능함
  • 3x3에서는 숫자 손실이 가장 큼
    • 글리프는 512개, 그중 400개가 서로 구분됨
    • 글자는 중복 없이 어느 정도 알아볼 수 있음
    • 실제 하드웨어에 표시하면 이 폰트가 크게 개선됨
  • 2x3은 무리한 수준에 가까워짐
    • 글리프는 64개, 그중 44개가 서로 구분됨
    • 대부분의 글자를 알아보기 어렵고 중복도 많음
    • 맨 아래 줄은 "Hello World"임
  • 가로세로 비율을 뒤집은 3x2는 2x3보다 훨씬 나아짐
    • 이 크기도 글리프는 64개, 그중 44개가 서로 구분됨
    • M, W, N, Q, G, P처럼 가로 디테일이 필요한 글자가 E, F 같은 세로 디테일보다 많아 더 유리함
    • 맨 아래 줄은 "you can probably read this"이며, 찡그려 보거나 축소해서 보면 읽을 수 있음
  • 2x2는 완성도를 위한 비교 대상으로만 남음
    • 가능한 2x2 이미지는 이론상 16개지만, 하나는 빈 칸이고 다섯 개는 다른 글리프를 이동해 복사한 형태라 실제로는 10개만 남음
    • 숫자 전체를 표현할 만큼은 되지만 원래 형태와 닮지 않아 폰트라기보다 비밀 코드에 가까움
Read Entire Article