Search

문수빈

상태
1주차
담당자

UX UI 레벨테스트 정리

UXUI 레벨 테스트를 통해 방향성을 제시해주며 개선 방법 또한 쉽게 설명해준다.

핵심 내용

왼쪽 정렬이 오래 읽기 좋다!

한 줄을 읽고 나면 자연스럽게 다음 글의 시작점을 찾게 되는데, 가운데 정렬의 글은 글줄의 시작점이 매번 달라지고, 읽는 사람이 비교적 쉽게 피로해질 수 있다. 긴 글은 왼쪽 정렬 하는 것이 좋다.

대비로 중요한 것을 강조하라!

크기, 위치, 색상, 면적 등에 대비를 주면 무엇이 중요한 정보인지 알기 쉽다. 중요 정보와 그렇지 않은 것의 차이를 만들어야 한다. 모든 것을 강조한다고 다 잘 보이지는 않는다.

줄 간격을 150% 이상으로 둬라!

줄 간격을 글자 크기의 1.5배 이상으로 지정해야 한다. 줄 간격이 지나치게 좁다면 장애가 있는 사용자가 내용을 식별하기 어렵다. 적어도 단어 사이 보다 글 줄 사이가 더 넓어야 한다.

상호작용을 나타내는 색상은 버튼과 링크에만 써라!

상호작용 가능한 요소와 아닌 요소의 색을 구분 없이 지정하면 사용자에게 혼란을 줄 수 있다.

옵션이 적으면 라디오 버튼을 사용하라!

옵션이 적으면 드롭다운 메뉴가 아닌 라디오 버튼이 낫다. 사용자가 모든 옵션을 명확하게 파악하고, 빠르게 입력할 수 있다.

플레이스 홀더를 레이블 대신 쓰지 마라!

플레이스 홀더는 사용자가 입력을 시작하면 보이지 않는다. 레이블이 없으면, 사용자는 기억에 의존해야 하는 경우가 생긴다. 되도록 레이블이 항상 보이게 만들어야 한다.

기본 옵션을 지정하라!

가장 자주 선택되는 항목, 사용자에게 가장 도움 되는 항목을 기본 옵션으로 지정해야 한다. 사용자가 더 빠르게 선택할 수 있게 도와준다.

사용자에게 수치심을 주지 마라!

특정 선택을 강제하기 위해, ‘비싸게 구매하기’, ‘혜택 포기하기’, ‘불편하지만 웹으로 보기’등 착각을 일으키거나, 수치심을 주는 말을 쓰면 안 된다.

필수 정보를 늘 보이게 하라!

꼭 알아야 하는 정보를 툴팁에 감추면 안 된다. 툴팁은 사용자에게 익숙하지 않은 정보를 요청하거나, 공간이 제한적인 상황에 쓰는 것을 권장한다.

레이블 텍스트에 유의하라!

작업 결과, 행동 등 실제 내용을 나타내는 말을 버튼에 적용해야 한다. 사용자가 버튼만 읽고도 답변할 수 있다.

인사이트

알게 된 용어 정리
플레이스홀더(Placeholder) : 사용자가 어떤 정보를 입력해야 하고 어떤 액션을 취해야 하는지 입력 필드에 표시되는 메시지
툴팁(Tooltip) : 클릭 또는 마우스를 특정 구성 요소에 가져갔을 때 상황에 맞는 도움말이나 정보를 표시한다.
드롭다운 메뉴 : 버튼을 클릭이나 터치 등의 상호작용을 통해 활성화했을 때, 버튼 아래로 하위 메뉴들이 펼쳐지는 요소
좋았던 점
위 사이트를 통해 내가 가지고 있던 습관이나 인식과 디자인에 필요한 지식은 다른 게 많다는 것을 알게 되서 좋았고 어떤 식으로 개선해야 하는 지 이해가 된 것 같다
아쉬운 점
조금 더 많은 유형의 질문이 생겼으면 좋겠다.