앱 UI 디자인 기본 - 아이콘, 타이포그래피

1. 아이콘

• 직관적 : 지나치게 단순화하거나 본인만 아는 아이콘 X
• 통일성 

의도에 맞는 통일된 아이콘 스타일 사용.  UI 아이콘은 outline, solid 를 주로 사용

• 단순성 : 작은 크기에서도 파악할 수 있는 형태
• 규격 및 시각보정 : 안전한 영역 안에서 작업, 시각적으로 부피의 면적이 동일한지 확인 ( 시각보정 )  

안전한 영역 안에 들어가도록 작업해서 잘리는 현상 방지

사람의 눈은 크기를 가로, 세로에 대한 사이즈보다는 여백과 물체의 면적에 대한 부피감으로 판단

keyline = 시각보정을 위한 가이드라인

 

2.  타이포그래피 - 어떤 앱이 읽기 편한가요?  'UI 내 정보 전달, 우선순위에 따른 강약조절'이 있는 것

글을 주로 다루는 컨텐츠와 맞는 명조체, 이미지와 결합해 정보성 글을 빠르게 전달하기 위한 고딕체

 

Typegraphy란? 

 

    Type(활자) + Graphy(-술) : 활자의 서체나 글자배치 등의 구성 및 표현

 

타이포그래피 요소 

• 서체 종류 ( 제목용 & 본문용, 고딕, 명조, 손글씨 )
• 서체 크기와 두께
• 텍스트 컬러 ( 가독성과 연관! )

 

※ 앱 UI 디자인 작업 시 타이포그래피가 중요한 이유 ※

1. 위계 구조 표현
2. 정보전달을 위한 가독성
3. 유효성 검사 충족된 크기, 대비 활용 ( 접근성 )

120% ~ 150% 사이 ( 짧은 글줄, 제목에는 작은 행간 )

180% 이상 ( 긴 글줄, 본문에서는 넓은 행간 )

최소 #767676 보다는 어두워야한다

 

서체 크기 : 국문 최소 폰트 사이즈 12, 본문은 최소 14 ~ 16