1. UI 레이아웃
웹 디자인 분야에서는 화면을 세로로 나누는 것에 초점을 맞춘 컬럼 그리드 시스템을 사용하며 아래 세 요소로 구성된다.
- Margin : 화면 양쪽의 여백
- Column : 콘텐츠가 위치할 세로로 나누어진 영역
- Gutter : Column 사이의 공간, 콘텐츠 구분하는데 도움
🔶 표준적으로 휴대폰 4개, 태블릿 8개, PC 12개의 컬럼으로 화면을 나눈다.
2. 좋은 UX를 만드는 요소 7가지
- 유용성 Useful : 목적에 맞는가
- 사용성 Usable : 사용하기 쉬운가
- 매력성 Desirable : 이쁜가
- 신뢰성 Credible : 믿고 사용할 수 있는가
- 접근성 Accessible : 누구나 쓸 수 있는가
- 검색 가능성 Findable : 쉽게 찾을 수 있는가
- 가치성 Valuable : 고객에게 가치를 제공하는가\
3. 제품을 완벽하게 만드는 10가지 평가 기준
설계하는 과정에서 제이콥 닐슨의 사용성 평가 기준 10가지를 활용한다.
- 시스템 상태의 가시성 Visibility of system status
- 시스템과 현실 세계의 일치 Match between system and the real world
- 사용자 제어 및 자유 User control and freedom
- 일관성 및 표준 Consistency and standards
- 오류 방지 Error prevention
- 기억보다는 직관 Recognition rather than recall
- 사용의 유연성과 효율성 Flexibility and efficiency of use
- 미학적이고 미니멀한 디자인 Aesthetic and minimalist design
- 오류의 인식, 진단, 복구를 지원 Help users recognize, diagnose, and recover from errors
- 도움말 및 설명 문서 Help and documentation
⛔️ 잠깐만!! UI와 UX는 어떻게 다를까?
UI는 시각적으로 디자인된 부분만을 이야기하지만, UX는 사용자의 경험과 만족도까지 고려한다. UX가 더 포괄적 의미로 UI의 상위 개념이라 볼 수 있다.