생각이 필요한 3-5분
최근에 윌 그랜트의 'UX원칙:UXer를 위한 101가지 원칙'을 읽고 디지털 프로덕트를 만들 때 실수하기 좋은 것들이 나 꼭 알아야 할 것들 위주로 내용을 발췌하여 정리하였습니다.
시작하며
사용자의 컴퓨터에 설치된 폰트를 사용하라
사용자가 이미 보유한 시스템 기본 폰트를 사용하라
시스템 폰트는 일반적으로 외부 폰트보다 렌더링이 더 잘된다
기본 폰트 사용은 페이지 로드 시간을 단축시킨다
항목들을 ‘햄버거’ 메뉴 속에 숨기지 마라
햄버거 메뉴는 사용자의 검색을 늦춘다
이런 식으로 메뉴 컨트롤을 숨기면 사용자는 자신의 위치에 대한 감을 가질 수 없다
햄버거 메뉴의 대안을 고민하되, 꼭 써야 한다면 레이블을 붙여라
컴포넌트
새로운 컨트롤을 제멋대로 만들지 마라
자신만의 UI를 만들어 내지 마라
당신이 하고자 하는 것을 실현해 주는 UI 컴포넌트가 이미 거의 다 존재한다
당신이 만든 새로운 것을 사용자가 학습하게 하지 마라
옵션이 많지 않다면 드롭다운 메뉴를 사용하지 마라
드롭다운 메뉴는 짜증을 유발할 수 있으므로 꼭 필요한 경우에만 사용하라
아주 긴 드롭다운에서는 검색 기능을 제공하라
드롭다운은 모바일 앱에서 특화된 UI를 활용할 수 있으므로 유용할 수 있다
아이콘
제품 전반에서 일관된 아이콘을 사용하라
제품 전반에서 일관된 아이콘을 사용하라
이질적인 아이콘을 포함시키는 지름길을 택하지 마라
일관성 있는 아이콘 스타일 개발에 추가 시간을 투자하라
기존 아이콘으로 신규 아이디어를 표현하려고 하지 마라
신큐 콘셉트에 기존 아이콘을 사용하지 마라
오픈소스나 공개 도메인 아이콘이 있는지 먼저 확인하라
콘텐츠
줄임표를 사용해서 다음 단계가 있다는 것을 알려라
사용자가 추가적인 액션을 수행해야 할 경우, 줄임표를 표시하라
줄임표는 액션을 확장하려면 추가 단계를 거쳐야 한다는 것을 알려줌으로써 사용자에게 자신감을 줄 수 있다. (“Email Link…”)
사용자는 줄임표가 사용자 인터페이스에서 어떤 의미가 있는지 무의식적으로 학습하게 된다.
피드 스타일의 콘텐츠에만 ‘무한 스크롤’을 사용하라
긴 목록에서는 페이지 네이션을 사용하라
무한 스크롤은 뉴스 피드 스타일의 콘텐츠에서만 사용하라
사용자가 피드에서 벗어날 때에는 사용자의 위치를 기억하라
콘텐츠에 시작, 중간, 끝이 있다면 페이지 번호 매김을 사용하라
콘텐츠가 한정된 경우에는 페이지 번호 매김을 사용하라
사용자에게 현재 페이지, 주변 페이지 및 범위 내의 양 끝 페이지를 보여줘라
사용자에게 검색, 정렬 및 필터 컨트롤을 제공하라
User Flow
사용자 여정에는 시작, 중간, 끝이 있어야 한다
사용자 태스크와 여정에서는 이정표가 꼭 필요하다고 생각하는 것이 도움이 될 수 있다.
사용자에게 그들이 하고자 했던 태스크가 언제 완료됐는지 알려줘라
여정 종료를 알리는 이정표의 예로는 ‘메시지가 발송되었습니다’, ‘변경 사항이 저장되었습니다’, ‘링크가 게시되었습니다’가 있다.
사용자는 모든 여정에서 자신이 어느 단계에 있는지 항상 알아야 한다
제품의 랜드마크로 기능할 시각적 단서를 제공하라
모든 여정에서 사용자의 현재 단계를 명확하게 알려라
사용자에게 단계 간 이동이 가능한 컨트롤을 제공하라
UX Writing
용어를 일관되게 사용하라
제품 전반에서 일관된 용어를 사용하라
맘대로 레이블을 붙이지 마라 당신의 제품을 위해 일관된 언어를 개발하라
일관된 카피를 사용해서 사용자가 보다 신속하게 멘탈 모델을 형성하도록 도와라 (명확한 텍스트를 작성하되, 짧고 간단한 문장을 사용하는게 좋습니다)
사람이 쓴 것처럼 작성하라
조직이 아닌 사용자 중심의 관점에서 작성하라
‘회사에서 쓰는 표현들’이 제품에 영향을 미치지 않게 하라
당신이 사용하는 단어들이 제품에 대한 사람들의 인식에 어떤 영향을 미칠 수 있을지 고려하라
한번 쭉 훑으며 정리하면서 알면서 지켜지지 않았던것들 미리 알았으면 좋았겠다 싶었던것들이 잘 설명되어 있어 책을 보시는것을 추천드립니다. 요즘 앞광고 뒷광고가 이슈인데 전혀 지원받은것 없는 광고글이 아님을 알립니다 ;)
이번주도 고맙습니다.