DOI QR코드

DOI QR Code

Mobile Text Readability Improvement Study of Korean Font - Focusing on Google Noto Sans Typeface -

  • Jae-Hong Park (Dept. of Visual Arts, Mokpo National University)
  • Received : 2023.05.23
  • Accepted : 2023.07.28
  • Published : 2023.08.31

Abstract

The background of this study lies in the increasing economic value of Korean fonts and the necessity for font development focused on small character design suitable for the mobile environment. The objective of this study is to analyze and propose strategies to improve readability on mobile screens. The research was conducted by applying eight attributes that could enhance readability according to Tim Ahrens to the design process of a Korean mobile font, adjusting Google's Noto Sans Korean for print/publishing and for small sizes. The results of the study indicate that 1. type width should be increased, 2. open counter (interior space) should be increased, 3. closed counter should be decreased, 4. font weight should be increased, 5. stroke contrast should be decreased, 6. spacing between characters should be increased. Therefore, distinct font families should be provided, differentiating between print/publishing and mobile use, as well as varying font weights and sizes, applying readability and legibility enhancement techniques for Korean fonts.

본 연구의 배경은 한글 폰트의 경제적 가치가 증대되고 있으며, 모바일 환경에 적합한 작은 글자디자인 중심의 폰트 개발의 필요성에 있다. 본 연구의 목표는 모바일 화면에서의 가독성 향상을 위한 방안을 분석하고 제시하는 것이다. 연구는 인쇄·출판용 구글 본고딕체와 작은 크기에 맞게 보정한 구글 본고딕체를 대상으로 팀 아렌스의 가독성 향상에 영향을 줄 수 있는 여덟 가지 속성을 모바일 텍스트 한글 폰트디자인에 적용하는 과정으로 진행하였다. 연구의 결과는 1. 낱글자의 너비는 넓게, 2. 열린 속공간(모인 공간)은 좁게, 3. 닫힌 속공간은 좁게, 4. 무게(굵기)는 두껍게, 5.획의 대비는 줄여서, 6. 글자 사이의 간격은 늘려 디자인할 필요가 있다로 나타났다. 따라서 인쇄·출판용과 모바일용, 굵기와 크기에 따라, 가독성과 판독성 향상 기술이 적용된 한글 폰트가족으로 구별되어 공급되어야 한다.

Keywords

I. Introduction

컴퓨터 기술 발전과 정보화의 급속한 진행으로 인해 콘텐츠를 구성하는 한글 관련 사업 모델의 경제적 가치가 증대되고 있다. 인쇄와 출판용으로만 사용되었던 폰트 산업은 모바일 보급과 함께 한글 폰트 비즈니스도 다양해지면서 새로운 모바일 온라인 폰트 시장으로 발전하고 있다[1]. 이러한 폰트 시장은 폰트디자인의 개발이 인쇄 매체에서 디지털 폰트로 확대되면서 모바일 시장의 니즈에 맞게 모바일 폰트디자인으로 발전해 왔다. 하지만, 아직 소수의 모바일용 폰트를 제외하고 디지털 폰트 개발 초기에 디자인된 인쇄와 출판용 폰트가 모바일 시스템에서 여전히 사용되고 있다는 것이 사실이다.

오정수는 모바일 한글 폰트 사용의 문제점으로 모바일 디스플레이 환경 변화와 디스플레이의 다양한 종류와 관계없이 같은 종류와 크기의 서체를 사용하고 있다는 점을 언급한 바 있다[2]. 모바일 환경은 인쇄 환경과 달리 화면 크기가 제한적이므로 작은 글자디자인을 중심으로 폰트가 사용되고 있다. 따라서 모바일 환경에 적합한 작은 글자디자인 중심의 한글 디지털 폰트 개발에 대한 심도 있는 연구가 필요하다.

본 연구는 구글 본고딕 폰트와 같은 인쇄 및 출판용 폰트를 모바일 환경에 맞게 조정하여 작은 글자디자인에 적합하고 가독성 향상에 영향을 줄 수 있는 속성 즉, 낱글자의 너비, 열린 속공간(모인 공간 – 라틴 알파벳은 ‘C’자의 속공간, 한글은 ‘밈’자의 초·중·종성이 모인 가운데 공간), 닫힌 속공간, 무게(굵기)와 획 대비, 낱글자의 주변 공간(글자 사이)를 분석하고 이러한 특성을 적용한 모바일 폰트디자인 방향을 제시하는 데 있다.

이를 위해 낱글자의 너비, 열린 속공간(모인 공간), 닫힌 속공간, 무게(굵기)와 획 대비, 낱글자의 주변 공간(글자 사이)을 분석하고 모바일 화면에서 한글 텍스트의 가독성을 향상시키기 위한 방안을 도출하고자 한다.

II. Preliminaries

1. Mobile Environment

1.1 Mobile Font Technology

디지털 화면과 인쇄·출판 환경의 텍스트는 근본적으로 다른 성격을 보인다. 인쇄 환경의 텍스트는 잉크로 지면에 인쇄되는 반면, 모바일 환경의 텍스트는 화면에 노출된다.

즉, 인쇄 환경의 텍스트는 선분을 이용한 벡터(Vector) 방식으로 표현하는 반면, 모바일 환경의 텍스트는 픽셀을 이용한 래스터(Raster) 방식으로 표현된다. 폰트 개발 회사에서는 인쇄·출판용 폰트를 디지털 폰트로 전환할 때 크기별로 픽셀화하기 위하여 백터 폰트가 작은 글자에서 출력 품질에 문제가 생기는 현상을 해결하기 위한 방법으로 ‘힌팅(hinting-)기술’을 사용해 오고 있다.

구글 본고딕(2014)체는 구글과 어도비의 합작 프로젝트로 폰트 회사 ‘산돌’이 3년 동안 인쇄·출판 환경의 텍스트를 중심으로 제작한 총 7종의 폰트 가족이다. 구글 본고딕체는 모바일 환경을 위한 픽셀의 방식으로 제작된 것이 아닌 벡터의 방식으로 제작되었다.

힌팅이 적용되지 않은 폰트(위)와 힌팅이 적용된 폰트(아래)를 비교해 보면 다음 fig 1과 같다. 힌팅이 적용된 폰트의 낱글자들은 세로획에서 좀 더 뚜렷한 폰트 형태를 보여주며, 대각선과 곡선에서도 좀 더 간결한 블러 효과를 볼 수 있다. 아래는 폰트의 힌팅 유무가 가독성에 미치는 영향을 보여주는 예시이다(Fig. 1).

CPTSCQ_2023_v28n8_77_f0001.png 이미지

Fig. 1. A font test without hinting (upper rows) and with hinting (lower rows)

일반적으로 인쇄 기반에서 가독성이 높은 서체는 세리프체이지만 디지털 기반에서는 오히려 가독성이 떨어진다. 디지털 기반에서 가독성이 높은 서체는 굴림체, 돋움체 등과 같은 산세리프체이다. 또한 전자책 본문의 글꼴이 세리프체일 경우에 폰트의 크기가 6.5pt에서 7.5pt일 때 가독성이 높게 나타났으며 산 세리프체보다 0.5pt에서 1pt 더 크게 사용했을 때 가독성이 높았다는 결과를 찾아 볼 수 있다[3][4]. 이렇듯 모바일 화면 텍스트의 가독성은 화면의 크기, 해상도 및 시각적 균형을 고려한 폰트와 관련성이 있음을 알 수 있다.

1.2 Type Design Cases of Latin Alphabets

서양의 라틴 알파벳 폰트디자인 역사를 살펴보면, 금속 활자 시대부터 이미 폰트의 크기별 디자인이 적용되어 왔음을 알 수 있다[5]. 금속활자를 제작하기 위한 첫 단계로 강철에 글자 면을 조각하는 사람인 활자 조각가들은 펀치를 조각할 때 이미 금속활자의 크기별로 조각하였고 초기 단계부터 크기별로 적절한 시각 보정을 적용한 디자인으로 조각하였다. 특히, 작은 크기의 금속활자의 경우, 글자의 너비와 x-높이를 높이고 획의 대비를 줄이고 글자의 여백을 넓게 디자인되었다. 크기별 활자 조각을 통해 우리는 같은 폰트라도 크기에 따라 다르게 디자인되어 있음을 확인할 수 있다. 예를 들어, ATF Garamond체의 6 포인트 ‘a’와 72 포인트의 폰트에서 소문자 ‘a’의 폰트디자인을 비교해 보면, 6 포인트 ‘a’의 폰트디자인은 글자 너비가 넓고 획의 대비가 적은 반면, 72 포인트 ‘a’의 폰트디자인은 글자 너비가 좁고 획의 대비가 크게 디자인되어 있음을 확인할 수 있다(Fig. 2).

CPTSCQ_2023_v28n8_77_f0014.png 이미지

Fig. 2. ATF Garamond Scale from 6pt to 72pt

작은 폰트디자인은 폰트의 디테일이 생략되어 있기도 하다. 우리는 Fig. 3를 통해 폰트가 작아지면 오히려 전체적인 폰트디자인의 일관성을 유지하기 위하여 디테일이 생략되기도 한다는 사실을 확인할 수 있으므로 작은 크기의 폰트를 디자인할 때 형태를 단순화하여 디자인하여야 한다는 사실을 도출할 수 있다. 큰 크기의 폰트디자인과 같은 시각적 결과를 만들기 위해서 작은 크기의 폰트를 디자인할 때 기술적으로 폰트의 크기만을 축소하기 보다는 폰트의 형태를 강조하여야 한다는 사실을 알 수 있다(Fig. 3).

CPTSCQ_2023_v28n8_77_f0002.png 이미지

Fig. 3. Klingspor 1949

라틴 알파벳 폰트디자인의 역사를 살펴보면, 크기별 폰트디자인을 적용한 금속활자 시대와 달리 사진식자 시대와 디지털 폰트 시대에 오히려 작은 크기에 적합한 폰트디자인은 현격히 줄어들게 된다. 사진식자 시대에는 하나의 폰트디자인 원도를 확대·축소하여 사용하는 것이 효율적이었으므로 크기별 폰트디자인을 해야 할 필요가 없었다. 하지만, 오늘날 발전된 디지털 폰트디자인 개발 환경은 Table 1과 같이 105가지 종류의 다양한 크기별 활자 가족(Type Family 또는 Font Family; 디자인이 일정한 계통을 이루는 폰트의 집합, 라이트(light), 미디움(medium), 볼드(bold), 장체(condensed), 정체(normal), 평체(expand -ed) 등이 있다, Size-specific Type Family;활자 가족의 개념이 크기별로 확장된 활자 가족, Fig 2)의 사례를 가능하게 하였다(Table 1)[5].

Table 1. Size-specific Type-Family List by T. Ahrens

CPTSCQ_2023_v28n8_77_t0001.png 이미지

이상의 라틴 알파벳의 크기별 폰트디자인을 살펴보면, 두 종류(2010년 Kris Sowersby가 디자인한 Tiempo체의 Text와 Headline)의 크기별 폰트디자인에서 아홉 종류(Fig. 1. ATF Garamond 참조)의 크기별 폰트디자인까지 다양한 크기별 활자 가족을 찾아볼 수 있었다.

팀 아렌스[5]의 라틴 알파벳에서 폰트의 크기가 작을 때 가독성 향상을 위한 폰트디자인의 중요한 여덟 가지 속성에 관한 연구 결과는 Table 3과 같다. 1. 글자의 너비가 넓어짐, 2. 속공간이 증가함, 3. 닫힌 속공간이 확장될 수도 있고 축소될 수도 있음, 4. 때때로 글자 전체의 굵기가 증가함, 5. 획의 대비가 낮아짐, 6. 글자의 특징이 강화되거나 약화됨, 7. 열린 속공간이 커짐, 8. 글자의 주변 공간이 많아짐.

Table 2. Design Changes in smaller sizes

CPTSCQ_2023_v28n8_77_t0002.png 이미지

하지만, 디지털 폰트디자인 제작 시간 측면에서 라틴 알파벳 폰트보다 한글 폰트가 상당한 시간을 요구되기에 현재까지도 크기별 한글 디지털 폰트 개발이 요원한 실정이다.

1.3 Hangeul Mobile Font

일반적으로 폰트(font)란 “인쇄를 위한 알파벳, 숫자, 기호 등의 같은 활자꼴, 같은 크기의 활자 한 벌”과 같이 정의된다. 폰트는 아날로그 폰트와 디지털 폰트, 또는 비트맵 폰트와 백터 폰트로 구분되고 있다. 오늘날 주로 디지털 폰트를 의미하는 용어로 사용되고 있다[6].

오늘날 디지털 한글 폰트의 활자 가족은 여러 굵기의 모임을 의미한다. “같은 활자꼴, 같은 크기의 활자 한 벌의 폰트디자인”은 여러 굵기(Weight; 산돌Neo고딕의 경우, Thin, UltraLight, Light, Regular, Medium, Semibold, Bold, Extrabold, Heavy의 9종)의 활자 가족을 가지고 있다(Fig. 4).

CPTSCQ_2023_v28n8_77_f0003.png 이미지

Fig. 4. The Map of Saldoll Neo Gothic Font Family

디지털 한글 폰트에서 ‘굵기’에 따라 파생되는 활자 가족을 수평적인 개념으로 본다면, ‘크기’에 따라 파생되는 활자 가족은 수직적인 개념으로 볼 수 있다. 활자 가족을 수직적 개념으로 확장해 보면, 이전의 활자 가족 정의와 범위를 폰트디자인의 가독성 향상을 위해 여러 크기로 파생되는 모임으로 확장해야 한다. 현재까지도 국내 폰트 회사들은 폰트의 크기별 디지털 한글 폰트 가족을 제공하지 못하고 있다. 아울러, 모바일 환경에 적합한 디지털 한글 폰트디자인이 적용된 한글 폰트 가족 또한 공급되지 못하고 있다. 디지털 한글 폰트를 크기별로 공급하기 위해서 상당한 제작 시간이 요구되기 때문이다. 가령 산돌Neo 고딕의 9종 폰트를 크기별로 확장하기 위해서 6가지 크기의 범위로 폰트를 제작하려면, 6배의 폰트 제작 기간이 예상된다.

모바일 환경에서 폰트를 사용하기 위해서는 인쇄·출판용 디지털 한글 폰트 파일을 힌팅 기술을 적용한 디지털 한글 폰트 파일로 제작해야 한다[7]. 또한 이미 제작된 백터 폰트 파일을 크기별 힌팅 기술을 다시 적용하는 과정에서 상당한 제작 시간을 요구한다. 디자이너가 원도 디자인의 일관성을 유지하면서 힌팅에 적합한 모바일용 폰트 파일로 다시 디자인해야 한다(Fig 5). 힌팅 기술은 다음 Table 3과 같이 네 가지 방식으로 설명할 수 있다[7].

CPTSCQ_2023_v28n8_77_f0004.png 이미지

Fig. 5. Four Kinds of Hinting Technology

Table 3. Four Kinds of Hinting Technology

CPTSCQ_2023_v28n8_77_t0003.png 이미지

1.4 Type Design in small size

앞서 연구자는 모바일 환경에서 현재의 폰트 기술, 라틴 알파벳에서 크기별 폰트디자인의 역사, 디지털 한글 폰트의 현황을 살펴보았다. 다음 단계로 작은 화면에서 폰트 가독성에 대한 선행 연구를 살펴보고자 한다.

팀 아렌스(Tim Ahrens)의 연구는 라틴 알파벳에서 작은 폰트 크기에서 가독성 향상을 위한 폰트디자인의 주요 속성을 ‘1. 글자 너비가 넓어짐, 2. x-높이가 증가함, 3. 닫힌 속공간이 확장됨, 4. 때때로 글자 전체의 굵기가 증가함, 5. 획 대비가 낮아짐, 6. 글자의 특징이 강화 또는 약화됨, 7. 열린 속공간이 커짐, 8. 글자의 주변 공간이 많아짐’으로 요약하고 있다[5].

위에서 언급한 라틴 알파벳의 작은 크기를 위한 폰트디자인의 여덟 가지 속성은 라틴 알파벳의 ‘낱자’는 ‘낱글자’이므로 낱자와 낱글자의 속성이 동시에 적용되고 있음을 의미한다. 이와 달리, 한글의 작은 크기를 위한 폰트디자인의 속성은 ‘1. 글자 너비가 넓어짐, 2. 열린 속공간이 증가함, 3. 닫힌 속공간이 감소함, 4. 글자의 굵기는 증가함, 5. 획 대비가 감소함, 6. 글자의 주변 공간이 많아짐.’ 여섯 가지로 요약할 수 있다. 한글의 낱자는 낱글자가 아니기 때문이다. 한글은 모아쓰기의 특징을 가지고 있어 두개 이상의 낱자가 모여 하나의 낱글자를 형성한다. 따라서, 연구자는 모바일 환경과 같이 작은 공간에서 라틴 알파벳 낱자의 여덟 가지 속성을 한글 낱글자에 여섯 가지 속성으로 요약하여 모인 공간에 적용해야 한다는 중요한 결과를 도출하였다(Fig. 6).

CPTSCQ_2023_v28n8_77_f0005.png 이미지

Fig. 6. Latin Alphabets vs Hanguel

2. Readability Improvement Studies

가독성(Readability)이란 문장을 읽고 이해하기 쉬운 정도를 의미한다. 즉, 문장 또는 문단에서 얼마나 이해하기 쉬운 정도를 나타낸다. 판독성(Legibility)은 문자의 형태를 알아보기 쉬운 정도를 의미하는데, 가독성과 혼동되어 사용되곤 한다. 즉, 판독성은 낱글자의 형태가 얼마나 이해하기 쉬운지를 나타낸다. 그러므로 문자의 판독성은 가독성에 영향을 미칠 수 있지만, 가독성은 문자의 판독성에 영향을 미치지 않는다[8].

가독성에 영향을 주는 속성은 문자뿐만 아니라 독자의 익숙성, 인지 능력, 조도 등의 인지 및 지각 심리적 요인들도 영향을 미친다[9]. 존 라이더(John Ryder)는 가독성에 영향을 미치는 요소를 다음 Table 4와 같이 구분하였다.

Table 4. The case for legibility by John Ryder

CPTSCQ_2023_v28n8_77_t0004.png 이미지

가독성에 영향을 주는 속성은 모바일 화면의 크기, 해상도 등의 시각적 환경을 고려한 폰트와 폰트의 크기, 폰트의 색채 등이 가독성과도 관련이 있다[10]. 이 외에도 디지털 환경에서 가독성에 영향을 미치는 요소로는 화면의 빛의 발광 정도, 모바일 화면의 크기, 속도, 조도, 화면의 반사도, 폰트의 종류, 자간, 어간, 지면과 글자의 대비 정도 등이 있다[11]. 김묘하 등은 평균적인 읽기 시간과 정확도의 연구 결과로 글자의 크기가 클수록 자간이 간격이 넓을 수록 가독성이 좋다고 하였으나, 글자의 크기가 작은 경우는 자간이 100%로 커지며 읽는 시간도 증가하는 경향을 보이게 되므로 작은 글자디자인의 경우, 글자 사이를 고려하여 디자인하는 것이 바람직하다고 하였다[12]. 이 외에도 디지털 환경에서 가독성에 영향을 미치는 요소로는 화면의 빛의 발광 정도, 모바일 화면의 크기, 속도, 조도, 화면의 반사도 등이 있다.

이상 폰트디자인과 관련된 여러 연구의 내용을 살펴보면, 글자 너비, 글자 크기, 획의 밀도, 판독성 등을 일부 언급하고 있으나 본 연구의 대상인 작은 폰트디자인 연구는 여전히 미흡한 실정이다.

III. Study Contents

1. Research Subject

본 연구에서는 모바일 환경에서 인쇄·출판용으로 사용되는 구글 본고딕체를 기존의 힌팅(Hinting) 방식이 아닌, 팀 아렌스가 정리한 ‘낱글자의 너비, 열린 속공간(모인 공간), 닫힌 속공간, 무게(굵기), 획의 대비, 낱글자 사이의 간격’ 등 가독성 향상에 영향을 줄 수 있는 속성을 적용하여 디자인할 필요가 있다.

2. Analysis Process

본 연구는 인쇄·출판 환경을 위해 디자인된 구글 본고딕체가 모바일 환경에서 사용될 때의 문제점이 무엇인지를 파악하고, 이를 바탕으로 라틴 알파벳의 가독성 향상 속성을 한글 폰트디자인에 응용·적용한 모바일 폰트디자인 방향을 제시하는 데 있다. 이를 위하여 구체적으로 모바일 디지털 한글 폰트디자인의 가독성 향상 속성을 ‘1. 낱글자의 너비, 2. 열린 속공간(모인 공간), 3. 닫힌 속공간, 4. 무게(굵기), 5. 획의 대비, 6. 낱글자 사이의 간격’의 순서로 반영하여 연구하였다.

2.1 Problems and Solutions in Small Size

모바일 환경같이 작은 화면에서 인쇄·출판용 구글 본고딕체의 크기 변화를 살펴보면 Fig. 7과 같다. Fig. 7의 폰트를 구체적으로 살펴보면, 왼쪽부터 오른쪽으로 본고딕체 10pt, 11pt, 12pt, 14pt, 16pt, 18pt, 21pt, 24pt, 36pt, 48pt인 낱글자 ‘미’의 크기 변화를 볼 수 있다.

CPTSCQ_2023_v28n8_77_f0006.png 이미지

Fig. 7. Type Size Scale of Original Noto Sans Hangeul and Modified Version (from 10pt to 48pt)

가장 왼쪽의 10pt ‘미’와 가장 오른쪽의 48pt ‘미’를 살펴보면, 10pt의 ‘미’는 오른쪽의 48pt ‘미’보다 낱글자의 ‘너비, 열린 속 공간(모인 공간), 닫힌 속 공간’은 좁아 보이며, ‘굵기(무게)’는 가늘어 보이고, ‘획의 대비’는 약해 보이는 것을 알 수 있다. 일반적으로 형태는 크기 변화에 따라 달라지는 데 글자의 크기 또한 가장 작은 크기의 글자 형태와 가장 큰 크기의 글자 형태’의 크기 변화에 따라 가독성에 영향을 주는 속성의 변화를 확인할 수 있다.

2.2 Analysis and application of hangeul fonts

본 연구에서는 팀 아렌스의 라틴 알파벳 폰트디자인의 가독성 향상의 여덟 가지 속성 중, 한글의 작은 폰트디자인에는 다섯 가지로 정리하여 디자인 설계에 반영하였다.

Table 4. Different Design Changes between Latin and Hanguel

CPTSCQ_2023_v28n8_77_t0005.png 이미지

IV. Study Results

1. Results

지금까지 작은 크기에서 라틴 알파벳 폰트디자인의 속성들을 모바일 환경에 적합한 한글 폰트디자인에 적용하여 가독성 향상에 영향을 줄 수 있는 속성, 즉 낱글자의 너비, 열린 속공간(모인 공간), 닫힌 속공간, 무게(굵기), 획의 대비, 낱글자의 주변 공간(글자 사이)을 비교·분석한 결과를 정리하면 다음과 같다(Table. 5).

Table 5. Design Changes of Hangeul in smaller sizes

CPTSCQ_2023_v28n8_77_t0006.png 이미지

1.1 Type Body

선행 연구를 통해 작은 크기에서 라틴 알파벳 폰트디자인을 할 때 큰 크기의 라틴 알파벳의 너비와 높이를 증가시켜 디자인하여야 한다는 사실을 알고 있다. 같은 원리로 모바일 환경에서 작은 크기의 한글을 디자인할 때 글자의 너비와 높이를 증가시킬 필요가 있다(Fig. 8).

CPTSCQ_2023_v28n8_77_f0007.png 이미지

Fig. 8. Type Width of Hangeul in Small Size

왼쪽의 ‘밈’자는 큰 크기의 폰트디자인이고 오른쪽의 ‘밈’자은 작은 크기 폰트디자인이다(fig 8). 글자의 크기가 다르더라도 동일한 폰트디자인으로 보이기 위해서는 작은 크기의 ‘밈(오른쪽)’자는 큰 크기의 ‘밈(왼쪽)’자에 비해 글자의 너비가 넓고 높이가 증가시켜야 할 필요가 있다. 따라서 모바일 환경에서 작은 크기의 한글 폰트디자인을 할 때 글자의 너비와 높이를 증가시켜야 큰 크기의 한글 폰트 디자인과 동일하게 보인다는 사실을 알 수 있다.

1.2 Open Counter(Collective Counter)

라틴 알파벳의 작은 크기의 글자에서 큰 크기의 글자와 같아 보이기 위해서는 열린 속공간을 증가시켜야 한다는 사실을 알고 있다. 같은 원리로 모바일 환경에서 작은 크기의 한글 폰트의 열린 속공간을 증가시킬 필요가 있다. 모아쓰기 한글 폰트디자인의 특수성을 감안하여 초성의 닫힌 속공간만 증가시키는 방법이 아닌 초·중·종성이 모인가운데 공간을 증가시켜 큰 크기의 폰트디자인과 동일하게 보이게 할 필요가 있다(Fig. 9).

CPTSCQ_2023_v28n8_77_f0008.png 이미지

Fig. 9. Open Counters of Hangeul in Small Size

왼쪽의 ‘밈’자는 기존 구글 본고딕체의 낱글자 디자인이고 오른쪽의 ‘밈’자는 작은 크기를 위해 시각적으로 보정한 글자이다. 현재 폰트 업계에서는 라틴 알파벳의 소문자 x-높이를 증가시켜서 낱글자의 판독성을 향상시키는 방법으로 단순히 한글 초성의 속공간을 증가시키는 방법을 적용해 온 것이 사실이다. 그러나, 본 연구를 통해 한글 낱글자 폰트디자인에서는 초성이 아닌 초·중·종성이 모인 가운데 공간을 증가시켜 낱글자의 판독성을 향상시킬 수 있다는 사실을 알 수 있었다.

2.2.3 Closed Counter

라틴 알파벳과 달리, 작은 크기의 한글 폰트디자인에서 글자의 닫힌 속공간을 감소시켜야 큰 크기의 한글 폰트디자인과 같아 보일 수 있다(Fig 10). 모바일 환경에서 작은 크기의 한글 폰트디자인을 할 때 가독성을 향상시키기 위해 닫힌 속공간을 감소시킬 필요가 있다.

CPTSCQ_2023_v28n8_77_f0009.png 이미지

Fig. 10. Closed Counter of Hangeul in Small Size

왼쪽의 ‘미’자는 기존 구글 본고딕체의 폰트디자인이고 오른쪽의 ‘밈’자는 작은 크기를 위해 시각 보정한 폰트디자인이다. 한글 폰트디자인에서 모아쓰기의 특성을 고려하여 작은 크기의 낱글자 ‘ㅁ’의 닫힌 속공간은 감소시켜야 비슷해 보인다는 사실을 알 수 있었다. 낱글자 ‘미’는 초성 ‘ㅁ’과 중성 ‘ㅣ’가 결합하여 하나의 낱글자 ‘미’를 형성한다. 초성 ‘ㅁ’의 닫힌 속공간을 증가시키는 것보다 초성 ‘ㅁ’과 중성 ‘ㅣ’ 사이의 가운데 공간을 증가시킬 필요가 있다. 초성 ‘ㅁ’의 닫힌 속공간을 줄이면 낱글자 ‘미’의 판독성을 향상시킬 수 있다는 사실을 알 수 있었다.

2.2.4 Weight

라틴 알파벳의 획의 굵기는 작은 크기의 폰트디자인에서도 큰 크기의 폰트디자인과 같아 보이도록 증가해야 한다. 같은 원리로 모바일 환경에서 작은 크기의 한글 폰트디자인도 획의 굵기가 증가하여야 할 필요가 있다(Fig. 11).

CPTSCQ_2023_v28n8_77_f0010.png 이미지

Fig. 11. Weight of Hangeul in Small Size

작은 크기의 폰트디자인이 적용된 ‘미(오른쪽 아래)’ 글자를 큰 크기의 ‘미(왼쪽 아래)’ 글자와 비교하면, 획의 굵기를 증가시켜 디자인하여야 큰 크기의 ‘미’자와 비슷하게 보인다.

2.2.5 Contrast

라틴 알파벳의 획의 대비는 작은 크기의 폰트디자인에서도 큰 크기의 폰트디자인과 같이 보이도록 증가해야 한다. 한글의 회의 대비는 작은 크기의 폰트디자인에서 오히려 큰 크기의 폰트디자인보다 감소해야 할 필요가 있다(Fig. 12).

CPTSCQ_2023_v28n8_77_f0011.png 이미지

Fig. 12. Contrast of Hangeul in Small Size

작은 크기의 폰트디자인이 적용된 ‘믐(오른쪽 아래)’자는 큰 크기의 ‘믐(왼쪽 아래)’자와 비교해 보면, 획의 대비는 감소시켜야 하는 것으로 나타났다. 큰 글자에서는 획의 대비가 크지만, 작은 글자에서는 가로획이 얇아져 보이기 때문에 같은 굵기로 보이려면 작은 글자의 획 대비는 오히려 감소시켜야 할 필요가 있다.

2.2.6 Letter Spacing

라틴 알파벳의 경우, 작은 크기의 폰트디자인은 큰 크기의 폰트디자인과 같아 보이도록 글자 사이의 간격이 더 넓어져야 한다. 같은 원리로 모바일 환경에서 작은 크기의 한글 폰트디자인에서도 글자 사이의 간격을 넓게 디자인하여 글자 사이의 간격이 비슷해 보이도록 조정해야 할 필요가 있다(Fig. 13).

CPTSCQ_2023_v28n8_77_f0012.png 이미지

Fig. 12. Letter Spacing of Hangeul in Small Size

왼쪽 아래의 ‘믜믬’ 글자 사이 간격은 구글 본고딕체의 글자 사이 간격이다. 반면, 오른쪽 ‘믜믬’ 글자는 작은 크기를 위해 시각 보정한 글자 사이 간격이다. 작은 크기의 폰트디자인과 큰 크기의 폰트디자인을 같아 보이게 하기 위해서는 ‘믜’자와 ‘믬’자의 주변 공간을 넓혀야 하며, 결과적으로 ‘믜믬’의 글자 사이 간격을 증가시켜야 한다는 것을 알 수 있었다.

구글 본고딕 폰트와 같은 인쇄·출판용 폰트를 모바일 환경에 맞게 보정하여 작은 한글 글자디자인에 적합하고 가독성 향상에 영향을 줄 수 있는 속성 즉, 낱글자의 너비, 열린 속공간(모인 공간), 닫힌 속공간, 무게(굵기), 획의 대비, 낱글자의 주변 공간(글자 사이)을 분석하고 모바일 화면에서 한글 텍스트의 가독성 향상을 위한 한글 폰트디자인에 적용한 이미지는 다음과 Fig. 13과 같다. 위쪽의 ‘미밈므믐믜믬’ 글자들은 구글 본고딕체이고 아래쪽의 ‘미밈므믐믜믬’ 글자들은 보정한 구글 본고딕체이다.

CPTSCQ_2023_v28n8_77_f0006.png 이미지

Fig. 13. Type Size Scale of Original Noto Sans Hangeul and Modified Version (from 10pt to 48pt)

연구의 결과는 다음과 같다. 1. 10pt 크기의 글자의 너비는 48pt 크기의 글자의 너비 보다 넓게 디자인할 필요가 있다. 2. 10pt 크기의 보정 후 구글 본고딕 글자의 모인 공간은 같은 크기의 보정 전 구글 본고딕 글자의 모인 공간보다 좁게 디자인할 필요가 있다. 3. 10pt 크기의 보정 후 구글 본고딕 글자의 닫힌 속공간은 같은 크기의 보정 전 구글 본고딕 글자의 닫힌 속공간 보다 좁게 디자인할 필요가 있다. 4. 10pt 크기의 보정 후 구글 본고딕 글자의 획의 굵기는 같은 크기의 보정 전 구글 본고딕 글자의 획의 굵기 보다 두껍게 디자인할 필요가 있다. 5. 10pt 크기의 보정 후 구글 본고딕 글자의 획의 대비는 같은 크기의 보정전 구글 본고딕 글자의 획의 대비 보다 줄여서 디자인할 필요가 있다. 6. 글자 사이의 간격을 늘려야 할 필요가 있다. 10pt 크기의 보정 후 구글 본고딕 글자의 글자 사이 간격은 같은 크기의 보정 전 구글 본고딕 글자의 글자 사이 간격 보다 늘려 디자인할 필요가 있다.

V. Conclusions

본 연구는 구글 본고딕 폰트와 같은 인쇄·출판용 폰트를 모바일 환경에 맞게 보정하여 가독성 향상에 영향을 주는 속성의 도출을 목적으로 연구하였다. 모바일 환경에서 작은 텍스트에 사용되는 디지털 한글 폰트의 가독성 향상을 위해 다음과 같은 폰트디자인 방안이 필요하다.

첫째, 인쇄·출판용 한글 폰트디자인과 모바일용 한글 폰트디자인은 구별되어 공급되어야 한다. 현재 모바일에서 사용되고 있는 한글 폰트는 대부분 인쇄·출판용 한글 폰트 디자인을 위해 제작된 폰트가 사용되고 있다. 둘째, 굵기별 한글 폰트 가족과 크기별 한글 폰트 가족으로 한글 폰트디자인이 구별되어 공급되어야 한다. 현재 굵기별 한글 폰트 가족으로 제공되고 있는 폰트 가족은 크기별 한글 폰트 가족으로 크기에 맞게 제작·공급되어야 할 필요가 있다. 셋째, 가독성 향상 기술이 적용된 한글 폰트와 판독성 향상 기술이 적용된 한글 폰트가 융합되어 공급되어야 할 필요가 있다. 판독성 향상 속성을 적용한 한글 폰트와 힌팅 기술을 적용한 가독성 향상 한글 폰트가 서로 융합되어 제작·공급되어야할 필요가 있다.

본 연구는 작은 크기에 모바일 한글 폰트디자인의 선행 연구가 미흡한 시점에서 기초연구로 가치가 있다고 볼 수 있다. 하지만, 한정된 글자로 가독성 향상 연구는 대상과 범위에 있어 한계를 가지고 있다. 연구자는 향후 가독성 향상 속성을 적용한 폰트 개발연구를 진행할 예정이다. 가독성에 대한 요인들을 포함한 모바일 한글 텍스트의 후속 연구를 기대한다.

ACKNOWLEDGEMENT

This Research was supported by Research Funds of Mokpo National University in 2021.

References

  1. Seungwan Hong, "A Study on Market Analysis and Design Trend of Mobile Font" Korea Digital Design Society, 9(4), pp. 145-154, 2009. DOI: 10.1109/TPDS.2005.38
  2. Seongsu Oh, "Study of readability of Hangeul fonts along environmental change of mobile display", Hongik University, 2012. DDC: 621.3815422
  3. Hyunyoung Lee, web & motion typography, Information Publishing Group, 2011
  4. Minjee Kim, Sung Hee Ahn, Youlbeen Kang, Soo-chan Jee, Sondo Kim, Ji Hwan Park, Hunsik Shin, Myung-Hwan Yun, "The effect of font and display sizes on the readability for mobile devices", Proceedings of HCI Korea 2023, pp 468-475, HCI, 2016, DOI : 10.17210/hcik.2016.01.468
  5. Tim Ahrens and Shoko Mugikura, "Size-specific adjustments to type designs", Just Another Foundry, 2014.
  6. https://terms.naver.com/entry.naver?docId=785289&cid=41828&categoryId=41828
  7. https://linegap.tistory.com/18
  8. Mi Hwa Moon, Hyun Suk Kim, Dong Ryun Chang, "Influence on the Inside and Outside Space Organization of Letter Affects the Readability and Aesthetic", Journal of Basic Design & Art., 17(3), pp. 139-150, 2016. UCI : G704-001069.2016.17.3.037 G704-001069.2016.17.3.037
  9. Legge, G. E, Pelli, D. G., Rubin, G.S., and Schleske, M. M.: "Psychophysics of reading-I. Normal vision", Vision Research, 25(2), 239-252, 1985. DOI: 10.1016 / 0042-6989 (85)90117-8 https://doi.org/10.1016/0042-6989(85)90117-8
  10. Junghyun Kim, Hyewon Lee, "An empirical study on the readability of e-book in the mobile platform - Focused on typography elements", Journal of Digital Design, 14(3), pp. 227-234, 2014, DOI : 10.17280/jdd.2014.14.3.023
  11. Seunghee Seo, YounJin Lee, "A Study on the Reading, Fatigue Degree and Short-term Memory Differences by the Black Concentration of Characters in Mobile Environment", Journal of Korea Society of Color Studies, 33(3), pp 66-76, 2019, DOI : 10.17289/jkscs.33.3.201908.66
  12. Myoha Kim, Yonggu Ji, "The influence of font size and separation between letters on readability", Proceedings of The HCI Society of Korea Conference, pp. 2008-2012, 2006.