it-swarm-korea.com

혼란스러운 체크 박스와 라디오 버튼

웹 사이트의 특정 UI를 작성하는 데 문제가 있습니다. 식당 체인을위한 간단한 웹 사이트에서 문제를 보여 드리겠습니다.

문맥

웹 사이트에는 많은 사용자와 식당이 있습니다. 각 식당에는 관리자, 요리사 또는 웨이터가 될 수있는 특정 사용자가 있습니다.

웨이터는 주문의 주소를 볼 수 있고, 요리사는 and 주문의 내용 (음식이 무엇인지)을 볼 수 있으며, 관리자는이 두 가지를 볼 수 있습니다 and 모든 사용자의 역할을 변경할 수 있습니다.

모든 식당마다 one 관리자 만있을 수 있지만 원하는만큼의 요리사와 웨이터가있을 수 있습니다. UI는 현재 다음과 같이 보입니다.

mockup

bmml 소스 다운로드Balsamiq Mockups

문제

모든 역할에는 이전 역할의 모든 권한과 새로운 권한이 있으므로 사용자는 각각 one 역할 만 가질 수 있습니다. 따라서 웨이터와 쿡, 쿡과 관리자 등이 될 수있는 사람은 없습니다. 위의 UI를 사용하면 명확하지 않습니다. 동일한 사용자에 대해 두 개의 확인란을 선택하거나 세 가지 역할을 모두 수행 할 수 있기 때문입니다.

질문

UI를 통해이 아이디어를 어떻게 명확하게합니까? '아이디어'는 식당에 one 관리자 만있을 수 있으며 모든 사용자는 one 역할 만 가질 수 있습니다.

이것은 내가 처음 여기에 게시 한 글이므로 올바른 위치에 있기를 바랍니다. 미리 답변 해 주셔서 감사합니다!

편집 : 언급 된 세 가지 역할을 모두 자유롭게 변경할 수있는 높은 역할이 있습니다.

마지막 경우는 피하려고하는 것입니다 (Mary).

Image .

70
H. Saleh

이와 같은 시나리오에서 UI가 응용 프로그램의 가능한 상태를 반영하도록 만들 것입니다. 관리자를 한 명만 가질 수 있으므로 관리자를 선택할 수있는 장소가 한 곳만 있어야합니다. 다른 모든 사람은 요리사 또는 서버 일 수 있으므로 해당 상태에 대해 상호 배타적 인 UI 위젯을 제공하십시오. 예를 들면 다음과 같습니다.

Mockup

실제로 당신은 사람들의 역할을 바꾸는 것을 조금 더 고의로 만들고 싶겠지 만 적어도 아이디어를 전달하기를 바랍니다.

편집 : 일부 의견에서는이 모형에 디자인 문제가 있다고 언급 했으므로 직접 구현하지 않는 것이 좋습니다. 이 모형은 OP의 질문에 대답하기위한 것이며 다른 설계 원칙이 여전히 여기에 적용된다는 점에 유의하십시오.

독자를위한 몇 가지 연습은 다음과 같습니다.

  1. 현재 역할이 선택된 모호함 제거
  2. 관리자 정보 표시 (전화, 이메일 등)
  3. 단순히 드롭 다운 또는 토글을 변경하는 것보다 데이터 변경 작업을보다 신중하게 수행
122
Tristan Shelton

현재 관리자의 변경은 다른 옵션을 무효화하는 조치이므로, 발생하는 상황을 명확하게 전달하는 방식으로 제시합니다.

웨이터/요리사는 라디오 버튼이므로 한 번에 하나만 활성화 할 수 있으며 한 사람 만 관리자가 될 수 있습니다.

Example For Manager with Button

106
Falco

이것은 사용자 그룹화 작업처럼 보입니다.

이 두 예제에는 Nice 속성이있어서 비슷한보기를 인쇄하여 부엌에 표시 할 수 있습니다. 또한 전체 UI에 대해 중복/중복 텍스트 Cook/Waiter가 없으므로 누가 누구와 일하고 있는지 쉽게 읽고 이해할 수 있다고 생각합니다.

태그 스타일

스택 교환 질문에 태그를 추가하는 방법과 유사합니다.

enter image description here

메뉴 스타일

계층 구조를 시뮬레이션하기 위해 기본 개념으로 WordPress 메뉴 편집)을 사용했습니다.

enter image description here

21
icc97

이것을 사용하십시오-이것은 더 높은 역할보기입니다.

관리자의 관점에서 볼 때 관리자는 자신의 역할에 대한 콤보 상자가 없습니다.
다른 두 개보기는 콤보 상자가없는 일반 텍스트입니다.

mockup

bmml 소스 다운로드Balsamiq Mockups

13
DPS

내가 본 것에서 모두 라디오 버튼이어야합니다 (각 사용자와 관련 라디오 버튼을 나누려면 더 나은 간격을 사용하십시오).
머리 속 질문은 다음과 같아야합니다.
앨리스는 누구입니까? 그녀는 (•) 매니저, () 쿡 또는 () 와이어입니까?
밥은 누구입니까? 그는 () 매니저, (•) 쿡 또는 () 와이어입니까?
기타.

왼쪽에서 오른쪽으로 읽으므로 먼저 사용자와 역할 만 알 수 있습니다. 사용자 당 하나의 역할 만있을 수 있으므로 모두 라디오 버튼이어야합니다.

4
Armands

비활성화 상태와 함께 iOS 세분화 개념을 사용하여 솔루션을 생각해 냈습니다. 시각적으로 이해할 수 있지만 목적에 부합한다고 생각합니다.

enter image description here

0
Vadivel