카테고리 없음

11월 24일

rhrjsdn1208 2025. 11. 24. 20:57

TYPOGRAPHY

타입(Type,글자)을 조형적으로 배열하고, 의미를 시각화하는 행위

읽히는 글자(Readable Text)이자, 보이는 이미지(Visual Form)
디자이너는 '언어적 의미'와 '시각적 형상'을 동시에 다룸

 

디자인에서 타이포그래피의 역할

 

1. 정보 전달 (Funtional Race)

● 정보를 명확하고 빠르게 파악하도록 도움

● 잘 선택된 서처, 적절한 크기와 줄 간격은 높은 가독성을 부여

● 정보에 대한 접근성 확장

 

2. 감정 전달 (Emotional Role)

● 타이포그래피는 '글자의 표정'을 통해 감정을 전달

● 서체의 형태, 웨이트, 자간, 대/소문자등이 모두 감정의 언어로 작용

● 타이포그래피는 디자인의 분위기를 형성하고, 독자의 감정을 조절

 

3. 브랜딩과 정체성 (Identity Role)

● 서체는 브랜드의 인격을 시각화

● 로고타입, 헤드라인, 포스트 타이틀은 강력한 브랜드 경험을 창출

● 서체는 곧, 브랜드가 말하는 '목소리 톤'

 

디자이너가 알아야 할 타이포그래피 원칙

 

1. 텍스트에 계층을 설정하라

● 크기,굵기,색상 등으로 계층 설정

페이지 구조를 알려주고, 사용자에게 콘텐츠의 흐름 안내

● 명확한 계층 구조는 정보 전달력을 향상시킵니다.

 

2. 적정한 텍스트 크기 설정

● 다수의 사람들이 편안하게 읽을 수 있는 본문 텍스트 크기 확인

● 사용자에 따른 텍스트 크기 고려 (ex. 고령자를 위한 큰 텍스트)

● 인쇄물에서 7pt 이하의 텍스트 크기 금지

 

3. 서체 조합의 원칙

● 한 페이지에 사용하는 서체의 종류 제한 (2~3개 정도)

● 조합에 적절한 대비 생성하기 (ex. San Serif + Serif)

● 목적에 맞는 역할 부여하기

 

4. 가독성을 위한 여백 제공

● 적절한 행간은 가독성을 높일 수 있습니다.

● 행간이 너무 넓으면, 텍스트 박스의 시각적 통일성이 깨집니다.

● 텍스트 한 줄의 글자 수는 60~70자가 적절

 

5. 텍스트와 배경 사이의 충분한 대비

● 텍스트와 배경 사이의 대비는 가독성에 큰 영향을 주는 요소

● 어두운 배경에는 선명한 서체 사용 권장

● 어두운 배경은 글자의 간격이 좁아 보이는 착시 현상 --> 자간 넓게 조정

 

텍스트 크기 조절 가이드

구분        권장 텍스트 크기                          설명
디지털 (웹, 앱 등) 16px 이상 (모바일: 17px 이상 권장) 가독성 확보가 중요하며,
디지털 취약 계층 고려 필요
인쇄물 (리플렛 등)             9pt ~ 11pt 가까이서 읽는 용도이므로
너무 크게 하지 않도록 하기
원고 양에 따라서 가독성을 고려하여
크기 조절 필요
출판물 (소설 등)             2pt ~ 14pt 출판사 따라 다르지만,
이 범위 크기가 일반적
제목 및 소제목       본문보다 크게 사용 제목과 본문을 시각적으로
구분해야 하므로, 본문보다 크게

 

 

포스터 디자인을 위한 비주얼 원칙

 

1. Visual Structure

● 좋은 타이포그래피는 보이지 않는 그리드 위에 서 있다.

● Grid System: 텍스트를 논리적이고 조형적으로 정렬하기 위한 기본 틀

● 글자와 여백은 서로 대화하는 공간을 생성

 

2. Visual Hierarchy

● 독자가 정보를 '한눈에' 파악하도록 하는 시각적 질서

● 위계 표현의 4가지 도구: Size, Weight, Color, Position 

Focal Point: 가장 주목해야 할 '핵심 지점' 설정

 

3. Visual Contrast

● 대비는 디자인에 리듬과 생명을 불어넣는다.

● 포스터에서의 대비는 시선을 멈추게 하는 장치

● 대비는 크기 뿐 아니라 형태, 방향, 색, 질감 모두 포함

 

4. Rhythm & Repetiton 

● 리듬은 시각적 음악, 글자 배열에도 박자가 있다.

● 일정한 간격의 반복 요소가 만드는 시각적 흐름

● 자간, 행간, 단락 간격의 일관성이 시각적 통일감 생성

 

5. Whitespace

● 여백은 시선을 머물게 하고, 메세지의 집중도를 높인다.

● 여백은 디자인의 호흡이자 강조의 수단이다.

● 여백은 '비어 있음'이 아니라, '의도된 공간'