UI 디자인 가이드 - 컬러
UI 디자인 가이드 - 레이아웃
토스의 8가지 라이팅 원칙들
독이 되는 레퍼런스 활용법
프론트개발자가 알아야할 UI 요소
토스
- 제이콥의 법칙
- 자신이 이미 알고 있는 다른 서비스들과 비슷한 방식으로 동작하기 원함
- ex) 아이콘 모양, 화면 배치 등
- 포스텔의 법칙
- 채워 넣어야 할 정보의 양이 많아질수록 인지부하가 증가함
- 정보를 한꺼번에 물어본다면? 사용자가 인지부하가 올 것.
- one thing one page 철학
- 밀러의 법칙
- 테슬러의 법칙
- 모든 시스템에는 더 이상 줄일 수 없는 복잡성이 존재함. 이를 해결해야 함.
- 심미적 사용성 효과
- 사용자는 보기 좋은 디자인을 사용성이 더 뛰어난 디자인으로 인식함
- 도허티 임계
- 사용자의 관심을 유지하고 생산성을 높이기 위해서는 0.4초 이내에 시스템 피드백을 제공해야 함
- 애니메이션 넣기!
TIP
- 로티
- 에어비앤비에서 제작한 애니메이션 오픈소스 라이브러리
- 무료 애니메이션 리소스를 다운로드하여 쉽게 커스텀 가능
- json 파일로 변환 → 애니메이션 용량 줄어듦
- 에셋 사이트
- 포킷: 텍스트로 AI 이미지 생성
- Freepik
- Flaticon
- 피그마 플러그인, 피그마 커뮤니티 적극 활용하기