한글 최초의 힌팅 폰트, 맑은고딕을 말한다-3

아웃라인 폰트의 사용과 문제점 및 그 보완

 

지난 포스트에서는 아웃라인 폰트의 문제점을 보완하기 위해 사용되는 기술 중에서, 폰트 자체에 적용될 수 있는 기술에 대해서 알아 보았습니다. 이번 포스트에서는, 아웃라인 폰트의 문제점을 보완하는 기술 중에서 폰트 자체가 아닌, 폰트를 화면에 렌더링 처리하는 기술의 발전에 대해 알아보고자 합니다.

 

아웃라인 폰트의 문제점 보완 - 2 

일반적으로 '렌더링'이라는 표현은, 3D 그래픽 쪽에서, 3D로 제작된 결과물들을 화면상의 이미지로 만들어 내는 것을 의미합니다. 폰트에서는, 그와 비슷하게, 글자를 화면에 그리는 기술이라고 할 수 있습니다. 래스터라이징과 비슷하게 이해될 수 있겠지만, 폰트 래스터라이징은 아웃라인 폰트를 화면의 픽셀 단위로 변환하는 작업을 말하며, 하나의 픽셀 단위를 어떤 렌더링 방식으로 결정하느냐에 따라 그 품질에 차이가 생기는 것이라 할 수 있습니다.

 

 

기초적인 렌더링 기술 : 블랙 앤 화이트(Black & White)

블랙 앤 화이트 기술은, 폰트 렌더링 기술 중 가장 기초적인 렌더링 기술로, 글자를 단색으로 표현하는 기술을 말합니다. 이 렌더링 기술은 픽셀의 중앙에 해당하는 부분이 아웃라인의 안쪽에 포함되는 여부에 따라, On, Off 가 결정되는 방식으로, 글자의 왜곡을 많이 일으키는 단점이 있습니다. 폰트에 직접적으로 적용되는 기술인 비트맵 폰트를 임베딩하는 이유가 바로, 이 렌더링 기술의 문제로 인한 것이라 할 수 있습니다. 이 렌더링 기술은 비트맵 폰트와 같이 앨리어싱(aliasing : 계단현상) 처리가 되어져 보인다는 단점이 있습니다.

 

<Black and White 렌더링 결과>

 

 

보다 향상된 렌더링 기술 : 그레이 스케일(Gray Scale)

블랙 앤 화이트 렌더링의 단점인 계단현상을 해결하기 위해 개발된 기술이 바로, 그레이 스케일입니다. 이 그레이 스케일은 앤티 앨리어싱(Anti-Aliasing) 렌더링 기술로도 불리며, 이미지의 경계를 부드럽게 처리하는 기술입니다. 그레이 스케일 기술의 원리를 쉽게 표현하면, 화면의 1개의 픽셀에 들어간 아웃라인의 면적에 따라 색의 농도가 달라지는 것이라 할 수 있습니다.

 

   

   

<아웃라인 상태 / Black & White / Gray Scale 렌더링 결과>

 

블랙 앤 화이트 렌더링 기술은 픽셀의 중앙이 아웃라인 안쪽에 포함되는 여부에 따라 On, Off가 결정되었다면, 그레이 스케일 기술은 아웃라인이 픽셀에 어느 정도의 비율로 포함되어 있느냐에 따라 그 농도가 결정된다고 할 수 있습니다. 예로, 픽셀이 아웃라인의 안쪽에 완전히 들어 있는 경우에는 농도가 100%이고, 픽셀의 1/2 정도가 포함되었다면 1/2 정도의 농도를 갖는 식으로(실제 값은, 처리 방식에 따라 다양함), 그 농도가 달라지는 특징을 갖게 되는 것입니다.

 

그러나, 이런 앤티앨리어싱도, 큰 글자에서는 좋은 효과를 볼 수 있지만, 작은 크기의 글자에서는 전반적으로 농도가 옅어져, 오히려 역효과를 주는 경우가 있기도 합니다.

 

<그레일 스케일과 블랙 앤 화이트 렌더링 결과 비교>

 

위의 예를 보면, 그레이 스케일 렌더링 결과물이 비트맵 폰트에 비해 그 판독성이 낮음을 볼 수 있습니다. 그러므로, 무조건 그레이 스케일이 비트맵 폰트 또는 블랙 앤 화이트 렌더링 기술보다 좋다고 할 수는 없습니다.

 

LCD 모니터에 최적화된 폰트 렌더링 기술 : 클리어 타입(Clear Type)

CRT 디스플레이가 보편적일 때는, 나름대로 위의 그레이 스케일 기술을 사용하는 것이 화면에서 고품질의 출력을 낼 수 있는 최상의 방법들이었습니다. 하지만, 기존의 CRT 디스플레이와 구조가 전혀 다른 LCD가 개발되면서, 상황이 달라지기 시작했습니다. 바로, 모니터의 픽셀구조가 완전히 달라졌기 때문에 새로운 구조에 맞는 렌더링 기술이 필요해지게 된 것입니다.

 

LCD 하나의 픽셀은 R(Red),G(Green),B(Blue) 3개의 하위픽셀(sub pixel)들로 구성되어 있는데, 이런 특징을 고려해 개발된 기술이 바로 서브픽셀(sub pixel) 렌더링 기술입니다.

<LCD 모니터의 픽셀을 확대한 모습>

 

실제, LCD 모니터에서 흰색 선은, 눈으로 보면 단지 하나의 흰색 선에 불과하겠지만, 실제 확대했을 때는 다음과 같이 RGB 픽셀들의 연속으로 보이는데, 이는, 빛에 있어서의 흰색은 RGB 3 종류의 빛이 합친 값이기 때문입니다.

 

<LCD 모니터에서 흰색 선을 확대한 모습>

 

서브픽셀 렌더링 기술의 기본 원리는 그레이 스케일 기술과 거의 흡사합니다. 다만, 그레이 스케일 기술의 경우 1개의 픽셀에 대한 획의 면적을 통해 단색의 농도로 결정되는 반면, 서브픽셀 렌더링의 경우는 3개의 서브픽셀에 대한 각각의 면적으로 각 서브픽셀의 농도가 달라진다는 점이 다릅니다. 그리고, 서브픽셀의 각 밝기가 다르기 때문에 해당 픽셀들의 컬러가 다양하게 결정됩니다. 따라서, 어찌보면 서브픽셀 렌더링 기술은 앤티앨리어싱의 컬러버전이라고도 할 수 있지 않을까 합니다.

현재 서브픽셀 렌더링 기술은 몇몇 폰트엔진에 탑재가 되어 있는 상태이며, 마이크로소프트에서도 자체적인 서브픽셀 렌더링 기술을 개발, 클리어타입(ClearType)이라는 이름으로 부르고 있습니다.

 

        

        

<실제 아웃라인 모습 / 그레이 스케일 / 서브픽셀 렌더링>

 

 

서브 픽셀 렌더링 결과물을 다시 한번 확대하면, 다음과 같이 볼 수 있습니다.

 

<서브픽셀 렌더링 결과 확대 모습>

 

픽셀 값의 의미는, 255은 픽셀의 불이 완전히 다 켜진 상태, 128은 픽셀의 밝기가 1/2인 상태, 0은 픽셀의 불이 완전히 꺼진 상태를 의미합니다. 즉, RGB(255, 255, 255)는 3개 픽셀이 완전히 켜진 하얀색을, RGB(255, 0, 0)은 붉은 픽셀만 켜진 상태, RGB(0, 0, 0)은 모든 픽셀이 꺼진 상태로 검은 색을 의미하는 것입니다.

그러나, 위 서브픽셀 렌더링의 픽셀 값은 최종 결과물이 아닌, 보정을 거치기 전의 결과물입니다. 위와 같이 서브픽셀에서의 값을 단순 계산해 처리하면, 전반적으로 경계선이 원색계열이 나와 좋지 않은 결과를 가져오게 됩니다. 이를 해결하기 위해, 실제 서브픽셀 렌더링 기술은, 인접한 서브 픽셀의 밝기를 참조하여 또 한 번의 보정처리를 하여 최종적인 결과물을 내놓게 됩니다. 이러한 보정처리에 대한 내용은 수학적으로 매우 복잡한 과정을 거치게 되므로 생략하기로 합니다.

 

Windows의 개선된 서브픽셀 렌더링 기법 : DirectWrite / Direct2D

Windows에서는 서브픽셀 렌더링 기술인 클리어타입을 Windows XP때부터 지원하기 시작합니다. 어찌 보면, Windows XP가 출시되면서 드디어 클리어타입을 쓸수 있는 환경이 되었다고 판단되었기 때문은 아닐까 생각해 봅니다.

일반적으로 그레이 스케일의 결과를 보면, 앤티앨리어싱의 효과가 가로, 세로 두 방향으로 적용됩니다. 하지만, 클리어타입의 경우는 세로 방향으로의 앤티앨리어싱이 적용되지 않은 가로방향으로만의 앤티앨리어싱이 적용되어 있는 상태라 할 수 있습니다. 그로 인해, 가로 방향은 괜찮아 보이지만, 세로 방향으로는 앤티어싱이 적용되지 않는 특성으로 인해, 많은 부분에서 그레이스케일보다 그 결과가 매끄럽지 못한 경우가 많습니다. 그래서, 많은 분들이 ‘클리어타입보다 그레이 스케일 결과물이 훨씬 좋다’고 인식하고, 심지어는 그런 이유로 그레이 스케일을 지정하기 위한 다양한 방법들을 찾습니다.

하지만, 마이크로소프트가 이에 대한 해결책을 준비하지 않았을리는 없으니, 바로, 클리어타입에 세로방향의 앤티앨리아싱까지 적용시키는 방법인 DirectWrite / Direct 2D 기술을 개발합니다. Windows Vista 부터 해당 폰트엔진이 탑재되었고, 프로그래밍을 통한 설정이 가능하였습니다. 

실제로, 맑은고딕은 2004년에 제작되었지만, 클리어타입 수준의 힌팅이 아닌, DirectWrite를 지원하는 폰트로 미래상황까지 예측하여 장기간의 계획을 갖고 개발한 폰트라 말할 수 있는 것입니다.

 

 

 

 

<ClearType 렌더링 결과 / DirectWrite 렌더링 결과 / 두 렌더링 결과의 비교>

클리어타입 렌더링 결과와 DirectWrite 렌더링 결과를 비교하면, 클리어타입은 곡선 부분의 계단현상이 두드러져 있는 반면, DirectWrite의 경우는 계단현상이 거의 없이 매우 부드러운 결과물을 갖고 있음을 알 수 있습니다.

 

---

다음 포스트에서는, 힌팅에 대한 내용으로 정리하도록 하겠습니다.