좋은 UI/UX

Jinwoo Choi·2022년 10월 24일
1

부트캠프

목록 보기
24/29

1. UI 레이아웃

웹 디자인 분야에서는 화면을 세로로 나누는 것에 초점을 맞춘 컬럼 그리드 시스템을 사용하며 아래 세 요소로 구성된다.

  • Margin : 화면 양쪽의 여백
  • Column : 콘텐츠가 위치할 세로로 나누어진 영역
  • Gutter : Column 사이의 공간, 콘텐츠 구분하는데 도움

🔶 표준적으로 휴대폰 4개, 태블릿 8개, PC 12개의 컬럼으로 화면을 나눈다.


2. 좋은 UX를 만드는 요소 7가지

  1. 유용성 Useful : 목적에 맞는가
  2. 사용성 Usable : 사용하기 쉬운가
  3. 매력성 Desirable : 이쁜가
  4. 신뢰성 Credible : 믿고 사용할 수 있는가
  5. 접근성 Accessible : 누구나 쓸 수 있는가
  6. 검색 가능성 Findable : 쉽게 찾을 수 있는가
  7. 가치성 Valuable : 고객에게 가치를 제공하는가\

3. 제품을 완벽하게 만드는 10가지 평가 기준

설계하는 과정에서 제이콥 닐슨의 사용성 평가 기준 10가지를 활용한다.

  1. 시스템 상태의 가시성 Visibility of system status
  2. 시스템과 현실 세계의 일치 Match between system and the real world
  3. 사용자 제어 및 자유 User control and freedom
  4. 일관성 및 표준 Consistency and standards
  5. 오류 방지 Error prevention
  6. 기억보다는 직관 Recognition rather than recall
  7. 사용의 유연성과 효율성 Flexibility and efficiency of use
  8. 미학적이고 미니멀한 디자인 Aesthetic and minimalist design
  9. 오류의 인식, 진단, 복구를 지원 Help users recognize, diagnose, and recover from errors
  10. 도움말 및 설명 문서 Help and documentation

⛔️ 잠깐만!! UI와 UX는 어떻게 다를까?
UI는 시각적으로 디자인된 부분만을 이야기하지만, UX는 사용자의 경험과 만족도까지 고려한다. UX가 더 포괄적 의미로 UI의 상위 개념이라 볼 수 있다.

profile
Let your code speak for you.

0개의 댓글