2026.03.10 DAY.2
[Today I Learned]
디자인개론 3~5강 , 디자인 근력 기르기 폰트 레퍼런스 리서치
[ 디자인 개론 ] 제 3강. 타이포그래피
타이포그래피란 무엇인가?
- 글자의 형태, 배열, 크기, 간격 등을 조절하여 텍스트를 효과적으로 표현하고 전달하는 예술적, 기술적 작업
- 폰트 선택, 문자 간격, 행 간격 등을 이용하여 디자인함
- 타이포그래피는 정보 전달, 브랜드 정체성 강화, 사용자 경험 향상에 중요하게 작용
- 단순한 글자 배열을 넘어, 글자가 어떻게 시각적으로 전달될지를 고민하는 과정
- 정보를 전달하는 기능 외에도, 느낌을 전달하고 특정 감정을 유발하는 시각적 언어로 기능
타이포그래피의 기본
- 타이포 그래피의 구성요소
- 폰트 알아보기 Serif / Sanserif의 차이
- 폰트 알아보기 명조체 / 고딕체의 차이
- 자간(Letter spacing) : 글자와 글자사이의 간격
- 어간(Word spacing) : 띄어쓰기. 낱말과 낱말 사이의 간격
- 커닝(Kerning) : 한글자 한글자 사이를 미세조정
- 행간(Leading) : 글 줄 사이
Positive Space
- 시각적인 주제가 되는 글자 자체
[실습] 예시가 되는 이미지 리서치
Negative Space
- 글자 주변이나 주변의 빈 공간(여백/white space)을 활용하여 숨겨진 형태를 만들어냄
[실습] 예시가 되는 이미지 리서치
[ 디자인 개론 ] 제 4강. 레이아웃
레이아웃이란?
- 특정 공간 안에 문자, 이미지 등의 구성요소를 보기 쉽게 효과적으로 배치하는 작업
- 시각적인 균형과 조화를 이루고, 사용자의 효과적인 정보 인식을 돕는 구성방식
- 텍스트, 이미지, 그래픽 요소들을 효과적으로 배치해서 메시지를 명확하게 전달하고, 시선의 흐름을 유도하는 것
레이아웃의 중요성
- 정보 전달력 향상 : 레이아웃은 혼란스럽지 않게 정보를 정리하여 사용자가 빠르게 핵심을 파악할수 있도록 도울 수 있다.
- 시각적 위계 형성 : 레이아웃은 시각적 위계를 형성해서 결국 정보 전달력이 향상되도록 만든다.
- 일관성으로 브랜드 이미지 제고 : 정렬, 간격, 그리드의 규칙성을 일관되게 적용하면 그 자체로 전문선과 신뢰감이 형성 되기도 한다. 어떤 브랜드가 동일한 레이아웃을 일괸되게 사용한다면, 그 브랜드를 자연스럽게 인식하는데에 좀 더 효과적이다.
- 사용자 경험(UX) : 레이아웃이 사용자 경험에 미치는 영향. 미적인 문제 뿐만이 아닌 사용자의 행동과 효율적인 정보탐색과도 직결이 된다. 예를들어, 쿠팡과 같은 온라인쇼핑몰은 미적으로 예쁘진않지만 사용자가 많은 상품들을 보고 탐색할 수 있다.
레이아웃의 핵심 원칙
- 여백 만들기 : 어떤 디자인은 필요와 목적에 따라 여백 없이 꽉 채우는 경우도 있지만, 기본적으로 디자인을 할 때 여백을 적절하게 두어 가독성을 높히거나 집중을 시키는데 도움이 된다.
- 콘텐츠 그룹화 : 타이틀, 시간, 날짜 정보 등 전달하려는 정보를 그룹화하여 배치하는 것이 정보 전달력에 큰 차이를 만들어낸다.
- 핵심 요소 반복 사용 : 디자인의 전체적인 컨셉을 전달하는 데에 효과적이다.
- 대비와 강조 : 대비는 서로 다른 요소를 비교되게 배치하여 눈에 잘띄게 하고, 강조는 여러 요소 중에서 가장 중요한 요소를 눈에 띄게 만든다. 시선을 특정 요소에 집중시키는데에 효과적이다.
- 정렬, 그리드 : 디자인을 질서 있게 정리하고 보기 쉽기 만드는 원리. 텍스트의 정렬 등으로 정보 전달력에 효과적이다. 그리드는 화면을 보이지않는 선으로 나누어 일정한틀에 맞게 요소를 배치하는 방법이다. (신문)
- 초점 만들기 : 레이아웃의 시작점. 분산되는 시선을 집중시키도록 구성하는 원리.
- 계층 구조 구성 : 시각적 위계, 계층구조. 시선의 흐름을 미리 가정해서 설계를 하는 것
[ 디자인 개론 ] 제 5강. 디자인에서의 색상
기본 색채학
- 색상(Hue) : 우리가 보통 말하는 색의 종류
- 명도(Value) : 색의 밝고 어두운 정도
- 채도(Saturation) : 색의 선명하고 탁한 정도
색의 분류
- 따뜻한 색(웜톤) : 빨강,주황,노랑 등 활력이 있고 에너지가 있는 색
- 차가운 색(쿨톤) : 파랑, 록, 남색 등 차분하고 시원한 색
- 중간온도 중 따뜻한 색 : 연두색, 초록색
- 중간온도 중 차가운 색 : 자주색, 보라색
보색대비
- 생동감과 에너지, 시선을 집중시키는 색의 조합
- 시각물을 보는 사람한테 시각적 경험을 풍부하게 만듬
- 다이나믹, 임팩트있는 느낌을 주고 싶을 가장 많이 사용하는 색 조합
유사색 조화
- 같은 계열 색상의 조화로 안정적이다.
- 익숙함과 편안함. 부드럽고 통일감 있는 느낌을 준다.
명도 대비
- 밝기가 다른 두 색의 영향
- 명도 대비를 잘 못하면 디지털 미디어에 대한 접근성 자체가 낮아짐
- 콘텐츠와 배경 사이의 명도 대비가 일정 비율 이상으로 해야한다.
색상모드
- RGB : Red, Green, Blue 빛의 삼원색을 이용해 색을 만드는 방식
- CMYK : Cyan, Magenta, Yellow, Key 잉크를 겹쳐서 색을 만드는 방식
- RGB는 디지털 화면에서 주로 사용, CMYK는 인쇄물 제작에서 주로 사용
- 작업물에 용도에 따라 색상모드를 선택하는 것이 중요하다.
[ 디자인 감각훈련 ] DAY2. 폰트 레퍼런스 리써치
폰트 분류
| 분류 | 특징 | 폰트 예시 | 어울리는 용도 |
| 고딕 (Gothic) 산세리프 (Sans-serif) |
획의 굵기와 글자의 두께 및 크기가 거의 일정하고 장식이 없음. 깔끔하고 모던함 | 나눔고딕, 나눔스퀘어, leferipoint, wanted-sans, Google Sans Flex, 서울남산체, Kopub 돋움 , Noah | UI, 웹디자인, 잡지, 브랜드 로고, 프레젠테이션, 패션 매거진 디자인 |
| 명조 (Myeongjo) 세리프 (Serif) |
획의 굵기가 일정하지 않고 글자 끝부분에 세리프 장식이 있음. 클래식, 고급스러움. | 나눔명조, 조선일보명조, 함초롱바탕, 카페24 고운밤, hamlet, zen-serif, Argesta, Butler, Woodland | UI, 웹, 인포그래픽, 브랜드 로고, 출판물, 에디토리얼, 긴 본문 텍스트 |
| 손글씨체 (Handwriting / Script) | 손으로 쓴 듯한 자연스러운 곡선. 따뜻하고 감성적인 느낌. | 나눔손글씨, 교보손글씨, 잉크립퀴드체, Trashhand, Cardenio Mordern | 캘리그래피, 타이포그래피, 포스터, 청첩장, 에세이 |
| 디스플레이체 (Display / Decorative) | 장식적이고 개성이 강함. 큰 사이즈에서 시각적 임팩트 강조. | 배달의민족한나체, 여기어때잘난체, 땅스부대찌개, 산돌국대떡볶이체, Misto Font, Cafe24 Angbanana | 어플, 브랜드 로고, 제목, 포스터, 배너, 광고 |
폰트 레퍼런스
1. Gothic , Sans-serif (깔끔하고 현대적인 느낌)
▶ 런드리고체
획의 굵기가 일정하다. 부드러운 곡선 형태로 친근함을 주며 글자의 획이 생동감을 주고 있다. 일반 각진 고딕을 썼다면 개성이 없고 밋밋했을 것 같은데, 빨래를 개어 놓은 듯한 느낌의 폰트가 이 브랜드의 아이덴티티를 잘 살렸고 개성도 뚜렷하다.
▶ Helvetica
산세리프체의 대표적 영문 폰트. 가로 세로 비율이 거의 일정하여 안정감과 신뢰감을 준다. 가독성이 좋아서 본문이나 타이틀 등 어디에 사용해도 손색없을 정도로 깔끔하지만, 개성이 약하고 다소 차가운 느낌이 든다.
2. Myeongjo , Serif (고급스럽고 클래식한 느낌)
▶ Noto Serif KR
비교적 깔끔한 느낌의 클래식한 명조체이다. 책의 표지, 문학 행사 배너 등 책, 출판/편집 디자인에서 많이 보여지고, 획의 대비가 강하지 않은 것이 특징이다. 너무 장식적이지 않아서 단정하고 깔끔한 느낌을 주며 고급스럽다.
▶ Didot
획 대비가 대폭 큰 폰트로 포스터의 레트로, 빈티지 감성의 분위기가 극대화 된 느낌이 든다. 패션잡지 또는 빈티지 포스터와 조화롭게 잘 어우러진다. 본문 내용으로 쓰기엔 가독성의 문제가 있을 것 같다.
3. 손글씨 Handwriting / Script (따듯하고 감성적인 느낌)
▶ Tlab 사월의봄
손글씨 폰트는 글자의 크기나 획이 조금씩 차이가 있어서 자연스럽고 인간적인 분위기가 특징이다. 위 이미지와 폰트의 조합은 힐링, 감성적인 여행의 따듯하고 잔잔한 분위기와 잘 맞는다.
▶ Brittany Signature
실제 손글씨의 리듬감을 잘 살리면서도 자연스럽게 흐르는 손글씨 스크립트 폰트로 우아함, 고급스러움이 특징이다. 향수/패션 광고, 청첩장, 전시 팜플렛 등의 디자인 등에서 많이 쓰인다.
4. 디스플레이 Display, Decorative (개성이 강하고 장식적인 느낌)
▶ 배달의민족 한나체
음식 브랜드, 이벤트 홍보 등 배너와 포스터에 잘 어울리는 느낌의 폰트. 레트로 감성이 느껴지고, 네온사인과 같은 화려한 분위기가 잘 어울린다. 글자가 굵고 투박한 느낌이라 본문 내용의 폰트로는 어울리지 않는다.
▶ Playfair Display
곡선이 매우 부드럽고 장식적이다. 굵은 세로 획과 얇은 가로 획의 대비가 커서 세련된 느낌이 강하다. 소문자는 기울기가 적용되어있어 본문 내용의 폰트보다는 헤드라인이 어울린다. 즉, serif 디자인의 display 폰트인 것이다.
[ DAY.2 학습 일기 ]
오늘은 디자인 개론 3~5강 타이포그래피, 레이아웃 그리고 디자인에서 색상 챕터까지 온라인강의를 수강했다. 타이포그래피 챕터 강의를 들으며 여러가지 폰트를 탐구할 수 있었다. 각기 다른 매력과 개성을 가진 폰트가 무수히 많지만, 그중에서도 비슷비슷하게 보이지만 자세히 보면 차이점을 찾아볼 수 있다는 점이 재밌게 느껴졌다. 또한, 타이포그래피 디자인 레퍼런스를 찾아보며 글자만으로도 디자인을 만들어내는 것이 신기하고 흥미로웠다. 레이아웃 챕터는 감을 상실했던 UI디자인을 다시 상기시키게 하는 발판이 되었다. 다시금 레이아웃의 중요성을 되새기고 지난 포폴을 보며 문제점을 찾아보고 자체 피드백을 해보는 시간을 가졌다. 색상 챕터에서는 명도대비 내용이 제일 인상깊었는데, 콘텐츠와 배경의 명도대비를 일정비율이상으로 해야한다는 점이 새로웠다.
오후에는 디자인감각훈련 2일차, 폰트 레퍼런스 리써치 학습을 했다. 오전에 수강했던 타이포그래피 챕터와 연관되는게 많아서 레퍼런스를 찾아보며 꽤 재밌었다. 그래픽요소와 폰트가 조화로운지, 어떤 용도의 디자인에서 어떤 폰트가 어울리는지에 대해 많이 생각해 볼 수 있었다. 그리고 내가 추구하는 폰트의 느낌은.. 너무 화려하지않고, 클래식하면서 또박또박한 폰트인 San-Serif 와 장식요소가 과하지않은 단정한 Serif 느낌의 폰트였다.
이로써 나의 폰트디자인 취향을 확실하게 알게 되었고, 강사님이 말씀 주신 것처럼 어떠한 디자인을 볼 때, 배웠던 것들을 기반으로 분석해보는 습관을 조금씩 길러가고 있는 중인 것 같다. 오늘도 수고했따 척추얌..
'[학습기록] AI 디자이너 내일배움캠프 > Today I Learned' 카테고리의 다른 글
| [TIL] DAY6_포토샵 기초 5~6강, 디자인 근력 기르기 종합 회고 & 나의 디자인 스타일 정의 (0) | 2026.03.16 |
|---|---|
| [TIL] DAY5_포토샵 기초 2강, 디자인 근력 기르기 구도와 시선흐름 분석 (1) | 2026.03.13 |
| [TIL] DAY4_포토샵기초 1강, 디자인 근력 기르기 로고 스타일 리서치 (1) | 2026.03.12 |
| [TIL] DAY3_디자인개론 6강, 디자인 근력 기르기 훈련 포스터 벤치마킹 (0) | 2026.03.11 |
| [TIL] DAY1 _ 개강OT, 디자인개론1~2강, 디자인 근력 기르기 컬러팔레트 리서치 (0) | 2026.03.09 |