회원들이 가장 많이 본 디자인 뉴스
디자인 트렌드
페이스북 아이콘 트위터 아이콘 카카오 아이콘 인쇄 아이콘

[2016 모바일 타이포그래피] 작은 스크린에 어울리는 타이포그래피 요소 4가지



스마트폰부터 스마트워치까지 스크린의 크기가 점점 작아지고 있다. UI와 UX 전문회사인 UXPin의 디자이너 캐리 커신(Carrie Cousins)은 작은 스크린에 어울리는 타이포그래피, 즉 글자/문자 디자인 요소를 PSFK에 소개했다.

 

그녀는 “스크린이 작다고 작은 글씨만을 사용하는 것은 좋은 타이포그래픽이 아니다”라고 말하며, 작은 사이즈에 맞는 좋은 레터링(Lettering)이 뭔지 확실한 개념을 가지고 접근해야 할 필요가 있다고 강조했다.

 

그녀가 소개한 ''2016 작은 스크린에 알맞은 타이포그래피 트렌드'' 4가지를 살펴보자.




적절한 폰트, 적절한 크기 선택

 

작은 화면에 어울리는 레터링(Lettering, 글자배열)이란, 아무리 작은 화면이라도 읽는 사람이 텍스트를 읽기 쉽게 표현해놓은 것을 의미한다. 이를 실현하기 위해서는 상황에 따른 알맞은 폰트 종류와 글자의 크기를 선택하는 것이 핵심이다. 

 

스마트폰이 처음 등장했을 때는, 글자가 무조건 얇고 작고, 또 많은 내용이 한꺼번에 들어있으며, 현대적이면서 깔끔한 느낌을 주는 폰트가 모바일 타이포그래피의 트렌드였다. 하지만, 이 트렌드는 그리 오래 사랑받지 못했다. 현재는 작은 사이즈의 글자보다 살짝 커진 사이즈의 글자 크기를 선호하고, 획 자체도 예전보다 굵어진 것을 선호하는 추세다.

 

인쇄했을 시 한 줄에 30에서 40개의 알파벳만 나오도록 하는 것, 그리고 글씨 색깔을 블랙, 화이트, 그레이 중에 선택하는 것도 사용자들이 작은 스크린에 비친 텍스트를 읽기 쉽게 만드는 중요한 요소다.

 

스크린에 띄워진 텍스트를 배경색이나 배경이미지와 완전히 분리돼 텍스트만 사용자들의 눈에 딱 띌 수 있게 하는 것도 중요하다. 이렇게 눈에 딱 띄는 텍스트 효과를 주는 색상은 #0D0D0D, #0F0F0F, 141414가 있다.



 

 

위에 나타난 핏빗(Fitbit)의 이미지가 그 예이다. 핏빗 애플리케이션에 있는 한 화면을 보면, 흰 바탕에 회색으로 된 글씨, 그림, 방향표시 등이 담겨 있다. 눈에 무리가 가지 않는 회색을 사용해 사람들이 편하게 글씨를 읽을 수 있도록 한 대표적인 타이포그래픽이라고 볼 수 있다.





문장의 정렬

 

작은 스크린의 글씨가 잘 읽히도록 만들려면 왼쪽 정렬, 오른쪽 정렬, 양쪽 맞춤 중 어떤 것을 선택해야 할까?

 

이 셋 중 가장 많이 사용되는 것은 바로 왼쪽 정렬이다. 여기서 중요한 포인트는 왼쪽 정렬을 한 다음, 균등 분할을 하지 않는 것이다. 왼쪽 정렬만 설정하게 되면 오른쪽 문장이 들쑥날쑥해 깔끔해 보이지 않을 때가 있다. 그래서 대부분의 사람은 왼쪽 정렬을 한 다음 균등 분할설정도 함께 진행한다.

 

균등 분할설정을 하면, 한 줄 한 줄의 문장이 왼쪽 끝에서 오른쪽 끝까지 꽉 차 깔끔한 느낌을 주는 건 사실이지만, 몇몇 문장들의 단어 사이사이에 큰 공간이 생겨 전체적으로 볼 때 정리된 느낌을 주지는 않는다. 따라서 오른쪽 문장이 들쑥날쑥 하더라도, 균등 분할을 하지 않는 편이, 더 읽기 쉬운 타이포그래피라고 볼 수 있다.

 

그럼, 왼쪽정렬과 가운데 정렬을 사용하는 경우는 각각 어떤 때인가?

 

우선 왼쪽정렬은 긴 정보나 설명을 쭉 적을 때 유용하게 사용된다.

 

 

반면, 가운데 정렬은 헤드라인이나 아주 짧은 문장을 작성할 때 사용한다. 아무래도 텍스트가 가운데 정렬이 되어 있으면, 사람들이 가장 먼저 그 텍스트를 읽게 되기 때문이다.






지나치지 않은 대조 효과 사용

 

하얀색 바탕에 검은색 글씨, 혹은 검은색 바탕에 하얀색 글씨 등 톤 구분이 명확한 자극적인 대조 효과는 읽는 사람을 텍스트에 집중시킬 수 있다는 장점이 있지만, 한편으론 눈을 피로하게 만든다는 단점도 있다. 심지어 큰 스크린이 아닌 작은 스크린을 통해 이런 대조 효과가 명확한 글을 읽을 때는 눈의 피로함이 더 빨리 찾아올 가능성이 크다.

 

그렇기 때문에 작은 스크린에서는 색조대비를 낮춘 대조 효과를 사용하는 것이 좋다.

 

 

에어비앤비(Airbnb)는 짙은 회색 그리고 옅은 회색을 바탕화면과 글자색으로 사용해 사람들의 눈을 피로하게 만들지 않으면서도, 글자에 집중할 수 있는 타이포그래피를 실현했다.

 

 


섹션을 줄여라

 

사람들이 작은 스크린 안의 텍스트를 읽기 편하도록 제작하기 위해 텍스트의 구성, 즉 섹션을 줄일 필요가 있다.

 

모바일에서는 주로 섹션을 헤드라인, 본문 이렇게 2가지로 나누고, 헤드라인의 폰트사이즈는 크게, 본문은 작게 설정한다. 그 외에 링크라던지 작은 소제목 등은 꼭 첨가해야 되는 요소가 아니라면 삭제하는 경우가 많다.

 

 

 

플립보드(Flipboard) 애플리케이션은 섹션을 효과적으로 배치한 디스플레이 중 하나다. 플립보드는 화면의 섹션을 헤드라인, 필자명, 본문 이렇게 3개로 나누어, 적지도 과하지도 않은 구성을 택했다. 또한 글자의 크기와 색상을 섹션별로 다르게 사용해, 구분이 확실히 되도록 만들었다.

 

본문을 여러 섹션으로 나눠야 할 시에는, 블록이나 콜룸을 사용해 깔끔하게 정리하는 것도 사람들이 읽기 쉽게 만드는 요소 중 하나다.

 

 

Originally published by (www.psfk.com)

 

 

본 콘텐츠는 디자인DB 자체 또는 디자인DB와 협약을 맺은 해외 매체의 저작물로, 영리 목적의 무단 도용을 금지합니다. 이외 개인홈페이지, 블로그 등에 재게재하실 때에는 반드시 출처를 밝혀주시기 바랍니다.

 

 

Tag
#타이포그래피 #Mobile Typogr

목록 버튼 이전 버튼 다음 버튼
최초 3개의 게시물은 임시로 내용 조회가 가능하며, 이후 로그인이 필요합니다. ( 임시조회 게시글 수: )