본문 바로가기

101 UX 원칙3

[101가지 UX 원칙] #12~#14 UI 컨트롤 제대로 알기 (2) #12 슬라이더는 수량화 할 수 없는 값에만 사용해야 한다. 슬라이더의 경우 쓰이는 곳을 명확히 구분해야 하는데, 그게 수치화 하려는 것이 정량적인가 정성적인가로 구분된다. 정량적 : 물건의 갯수, 점수, 온도 등 수치화 할 수 있는 것 정성적 : 소리, 밝기, 색상값 등 명확히 수치화 하지 않아도 되는 것 우리는 슬라이더 UI를 반드시 정성적인 값을 표현할 때만! 써야한다. 정량적인 수치를 입력받기 위해 슬라이더 UI를 사용한다면 답답한 스크린에서 꼼지락대며 수치를 맞추려는 사용자의 분노를 사게 될 것이다. 또한 사용자가 슬라이더를 편하게 조절하게 하기 위해서 적절한 크기로 만들어야 한다. #13 정확한 숫자 입력을 위해서는 숫자 입력 필드를 사용하라 정확한 숫자를 입력받고자 한다면, 반드시 숫자 입력.. 2020. 5. 18.
[101가지 UX 원칙] #10~#11 UI 컨트롤 제대로 알기 (1) #10 새로운 UI 컨트롤을 제멋대로 만들지 마라 새로운 UI 컨트롤러를 '제멋대로' 만들지 말라는 것은 무슨 뜻일까? 이 책에 나오는 예시는 차량의 색상을 바꾸는 가상의 3D 휠 '회전'시키려면 클릭하고 드래그로 업-다운을 시켜야 하는 볼륨 다이얼 특정 액션을 실행시키려면 클릭하고 몇 초간 버튼을 누르는 것을 유지해야하는 버튼 이라고 쓰여있다. 위의 예시 중에 볼륨 다이얼을 알아보자. 실제로 볼륨 컨트롤러는 좌우로 회전시키는 타입과 좌우 혹은 상하로 움직이는 타입이 있는데 만약 여기서 좌우로 회전시키는 다이얼을 UI로 만들었다고 해보자. 과연 이 UI는 어떻게 작동해야하는가? 마우스로 클릭을 하고 회전시켜야하는가? 클릭한 채로 위아래 혹은 좌우로 움직이면 다이얼이 회전하는가? 둘다 매우 불편한 경험이 .. 2020. 5. 11.
[101가지 UX 원칙] #6~#9 버튼 UX의 기본 원칙 #6 줄임표를 사용해서 다음 단계가 있다는 것을 알려라 메뉴 창을 열어보면 ' ... ' 이 붙은 버튼과 그렇지 않은 버튼이 있다. 나도 이 책을 읽으면서 처음 안 사실이지만 ' ... '이 있는 버튼은 눌렀을 때 다음 단계(ex : 확인 절차, 경로 설정 등)가 있다는 것이다. 책의 저자는 ' ... '을 보면서 사용자들이 다음 단계가 있다고 추론할 수 있다고 하지만 나는 대다수의 사람들은 그저 자주 쓰는 버튼들에 한해서 다음에 어떤 단계가 있는지 무의식 적으로 학습하는 것이라고 생각한다. 물론 ' ... '의 의미를 알고 있는 사람들에게 이는 방향을 제시해주는 매우 좋은 디자인이라고 생각한다. 나도 ' ... '의 의미를 알고 난 지금은 다음 단계가 있다는 것을 유추할 수 있게 되었기 때문이다. #7.. 2020. 5. 10.
반응형