본문 바로가기
카테고리 없음

리듬, 크기, 대비, 스타일을 활용한 서체 표현

by daybyday-dev 2024. 3. 28.

리듬, 크기, 대비, 스타일을 활용한 서체 표현


1. 서체 표현하기(Basic Expression)

 

서체 표현하기

 

  • 서체 표현하기(Basic Expression)
    • 글자 왜곡, 변형, 움직임, 이미지처럼 표현하는 것
    • 정보 전달, 의미 전달만을 목적으로 하는 것이 아닌 느낌, 감정, 뉘앙스 전달까지 목적으로 하는 것
    • ex) 포스터, 광고, 로고 등

 

리듬, 크기, 대비

 

  • 글자 크기, 배치 등을 통해 서체 표현하는 방법
    • 리듬
      • 글자 정렬 변화(왼끝, 가운데, 오른끝, 양끝)
      • 배치를 다양하게 하면 글을 읽는 순서나 시선에 리듬이 생김
    • 크기
      • 글자 크기 차이를 두어 강조
      • 마치 작은 글씨는 작은 목소리로 말하고, 큰 글씨는 큰 목소리로 말하는 듯하게 강약조절
    • 대비
      • 리듬, 크기를 결합해 다이내믹하게 글자 사용해 대비 극대화
      • 곡선과 직선, 작고 큼, 수직과 수평, 굵기 등 대비 주는 것

 

2. 리듬

 

리듬 적용해 표현하기

 

  • 첫 번째 이미지는 정보 전달 목적
    두 번째 이미지는 자간(글자 간격) 변화를 통해 개별 리듬 형성
    세 번째 이미지는 축 변화를 통해 그룹 리듬 형성
  • 정보 기입 → 자간을 통한 개별 리듬(글자 사이의 리듬) → 축 변화를 통한 그룹 리듬
  • 리듬을 만든다는 것은 시선의 흐름을 만든다는 의미

수평 글자 구성

 

  • 그룹 위치 이동, 글줄을 여러 줄로 바꾸는 작업만으로도 다양한 시안 가능
  • 배치, 자간, 행간, 글줄 변경 등을 통해 시선 리듬 생성
  • 단순한 쓰기의 과정이 아닌 표현의 과정

수평, 수직 글자 구성

 

  • 수평, 수직으로 글자를 구성하면 수평축, 수직축이 생겨 시선 변화가 많이 발생
  • 분산적, 리드미컬, 다이내믹
  • 상승하는 느낌 주고 싶으면 수직 사용

직간접적인 대각선

 

  • 첫 번째 이미지는 축을 통해 간접적인 대각선 표현
    두 번째 이미지는 글자 배치를 통해 간접적인 대각선 표현
    세 번째 이미지는 글자 자체를 대각선으로 회전해 직접적인 대각선 표현
  • 움직이는 느낌, 운동성, 동적인 리듬 생성
  • 어떤 대상을 표현하느냐에 따라 수직, 수평, 대각선, 라운드 등 적합한 것을 선택해 사용

 

3. 크기

 

크기 예시

 

  • 글자의 크기만 키워도 보다 더 강조, 시선 집중 가능
  • 크기 차이가 많이 나면 더 매력적이고 임팩트 있음
  • 글자 굵기 차이까지 적용하게 되면 크기 차이가 배로 느껴짐

 

4. 대비

 

리듬, 크기, 대비

 

리듬(배치), 크기 대비를 통해 주목성, 느낌 전달

 

  • 리듬, 크기 대비
  • 크기, 간격, 배치, 곡선 등 대비를 주면 강조하고자 하는 바가 더 강조되고, 읽는 시선의 순서가 보다 명쾌해짐

 

5. 글자 크기, 배치 외 서체 표현 방법: 스타일

 

서체 변경 예시

 

  • 글자 크기, 배치 외에 서체를 표현하는 방법으로는 서체 바꾸기가 있음
  • 어떤 서체를 사용하느냐에 따라 의미 표현과 함께 느낌, 뉘앙스까지 제공 가능
    → 전달하고자 하는 의미, 뉘앙스, 느낌에 맞는 서체를 골라야 함
  • 서체(글꼴)뿐만 아니라 글자의 색상, 크기, 배치, 배열, 구조 변화 등 다양한 스타일 변화가 있음
  • ex) 'GODIVA' 로고의 경우, 세리프 → 산세리프로 변경
    전통적이고 귀족적인 느낌 → 현대적이면서도 전통을 유지하는 느낌으로 변화
    획의 굵기 차이는 조금 남겨두어 기계적이면서도 인간적인 느낌 제공
  • ex) 'stress'는 뾰족한 서체가 잘 어울림
    'HEAVY'는 무게감 주는 서체가 잘 어울림

 

6. 서체의 응용 표현

 

 

결합, 분리, 변형

 

  • 결합
    • 글자와 그래픽(도형) 결합
    • ex) '한글이 걸어온 길'의 각 글자에 연결된 선들로 글자와 그래픽이 결합됨
  • 분리
    • 글자를 분리해 하나의 그래픽으로 쓰는 방법
    • ex) 'simple의 의미는 단순함이므로 가장 작은 요소인 조형적인 도형으로 분해하면 어떨까?'에서 시작
      'simple 2016'의 각 글자를 조형적 형태로 분해 후, 다시 결합하여 사용
      대각선으로 배치해 역동적이고, 다이내믹한 느낌 제공
  • 변형
    • 글자가 마치 이미지처럼, 이미지가 마치 글자처럼 변형되어 두 가지가 섞여 새로운 형태가 됨
    • ex) 보그 20주년 포스터로 숫자 '20' + 여러 색상의 옷감 이미지 = 새로운 하나의 형태(자유, 부드러운 느낌)
      보그는 옷을 다루는 브랜드이기 때문에 옷 느낌이 나도록 부드러운 느낌, 손글씨 사용
      20주년이라는 맥락 안에서 포스터를 보게 되면 '20'을 발견할 수 있도록 20을 의도적으로 숨겨놓은 디자인