개체 목록을 관리 할 때 사용자 인터페이스를 디자인하는 데 항상 문제가 있습니다.목록을 관리하는 좋은 방법은 무엇입니까?
예를 들어 직원 목록을 관리해야합니다. 내 업무에서는 항상 직원 관리의 두 가지 방법을 전환했습니다.
, 나는 내 선택을 백업하거나이를 해제 어떤 UI 전문가 기준이 없습니다.
아무도 제안이나 참조를 개체의 mananing에 대한 좋은 UI를 디자인하는 데 도움이 될거야?
옵션 1을 사용하면 한 번에 더 많은 목록 항목을 볼 수 있으므로 사용자가 목록에서 많은 부분을 뛰어 넘어야하는 경우 (예 : 편집 할 다음 레코드 찾기)에 선호됩니다. 항목이 많을수록 스크롤링이 적어집니다.
옵션 2는 일반적으로 새 브라우저 창이 열리기를 기다리지 않고 사용자가인지 할 수있는 다시 방향 지정을 필요로하지 않으므로 사용자가 필드를 빨리 편집 할 수있게하므로 무거운 데이터 입력 (예 : 마다 레코드마다 하나씩 변경).
두 옵션 모두 테이블에서 편집 가능 표 형태를 사용하거나 채워진 적절한 컨트롤 (텍스트 상자, 콤보 상자, 체크 상자 등)의 배열로 표를 바꾸는 방법으로 표기법이 보다 실질적으로 열등합니다 적절한 레코드 집합에 대한 필드 값으로 사용자는 테이블에서 필드를 직접 변경하고 변경된 모든 레코드를 한 번에 업데이트하기 위해 저장 버튼 또는 메뉴 항목을 선택합니다. 또는 대역폭이 처리 할 수있는 경우 필드가 포커스를 잃을 때마다 자동으로 저장할 수 있습니다.
기록, 시간과 학습 (필요 추가 탐색 단계를 변경하려면 편집 버튼을 클릭 할 필요가 없습니다 :
는 옵션 1, 2, 제자리에서 편집이 다음과 같은 장점에 비해 예를 들어, 사용자는 "편집"아이콘을 배워야합니다.편집하기 위해 다른 위치의 필드를 시각적으로 다시 수집 할 필요가 없으므로보다 빠르고 쉽게 편집 할 수 있습니다.
배우고 이해하고 사용자가 다른 용도로 사용할 수있는 화면 공간을 소비하는 두 번째 창이나 양식 레이아웃이 없습니다.
모드 없음 - 사용자는 편집과보기 사이를 유연하게 전환 할 수 있으며 편리 할 때마다 절약 할 수 있습니다. 당신도 수평 스크롤과 표에 표시하는 종업원에 대한 너무 많은 필드가있는 경우
, 당신은 (1) 하나의 창에서 분할 화면 마스터 - 세부 레이아웃을 가진 사이에서 선택을해야하고, (2) 두 개의 창이 있고 드릴 다운이 가능합니다. 그러나 "추가"필드의 표시를 최적화하는 것은 레코드 편집 방법과는 다른 문제입니다. 유용성에 대한 일반적인 규칙은 사용자가 필드를 편집 할 수있는 경우 테이블, 화면의 세부 오버플로 영역 또는 별도의 드릴 다운에 관계없이 해당 필드가 나타나는 모든 위치에 대해 사용자를 편집 할 수 있도록하는 것입니다 세부 창.
대화 상자는 모달이며 사용자 경험 전문가는 일반적으로 싫어합니다. 분할 화면은 편집뿐만 아니라 주어진 직원 [또는 다른 종류의 객체]의 자연스러운 "모든 세부 사항에 대한 열람"을 허용합니다. (맨 손으로 작성한 목록보다 더 많은 정보가 유용하게 표시 될 수 있습니다). "이 세부 정보를 편집 가능하게 만드는"버튼은 매우 부드럽고 자연스럽고 매끄러운 방식으로 대화 상자, 팝업, 호버에 나타나는 "도구 설명"등의 불쾌 함없이 연결됩니다.
모달 운영에 대한 UX 비판에 대한 참조 요약을 보려면 wikipedia에서 시작하여 해당 링크를 따르십시오.
분할 화면에 대한 제 의견은 일반적으로 저장이나 저장이 없기 때문에 객체 저장 시점을 알기 어렵게한다는 것입니다. 취소 버튼. –
@ 피에르 -이 문제를 처리 할 수있는 방법은 여러 가지가 있습니다. 1. 항목에 수정 된 표시기를 표시하십시오. 2. 적용 버튼이 있습니다. 3. 암시 적으로 다른 항목으로 탐색 할 때 저장하지 않습니다. (또는 이들의 조합) –
"개체가 수정되었습니다"라는 표시가 좋습니다. 다른 배경, 또는 더 눈에 거슬리는 것 - 버튼을 적용하고 취소 할 수 있습니다. 나는 자동 적용 (인간 요인에 근거)에 대해 더 주저합니다. –
저는 "이메일 클라이언트"레이아웃을 약간의 성공을 거두었습니다. 화면의 왼쪽에는 탐색 요소 (전자 메일 클라이언트의 폴더와 유사)가 있습니다. 오른쪽은 분할 된 창에서 상단과 하단으로 나뉘며, 상단에는 전자 메일 목록과 유사한 목록 (예 : 직원 목록 - 전자 메일 목록과 유사 함) 및 아래쪽에 선택한 항목을 편집 할 수있는 양식이 포함됩니다 (탭으로 구성된 페이지). 목록 (작성하거나보고있는 하나의 이메일과 유사). 전자 메일 클라이언트 레이아웃은 친숙 함의 주요 이점을 가지고 있습니다. 거의 모든 사람들이 전자 메일을 사용합니다! 주요 이메일 클라이언트는 모두 동일한 레이아웃을 따르므로 친숙 이점을 강화합니다.
저는이 특정 문제에 대한 실제 연구를 찾지 못할 것입니다. 왜냐하면이 문제는 현재 진행중인 응용 프로그램에 매우 구체적이기 때문입니다. 그것이 오는 것은 개별 객체가 어떻게 사용/접근/수정/등되는지에 관한 것입니다.
그런데, 나는 이것에 수년간 앞뒤로 갔고, # 2에 정착하기 위해왔다. 내부 앱 중 하나의 걸림돌입니다.
alt text http://i27.tinypic.com/2iu22qg.png
고급 사용자가 새 창에서 열리도록 중간 클릭으로 얻을 수 있으며, 목록이 성장함에 따라 당신은,, 등 필터링, 정렬 얻을.
M. Papadimoulis와 같은 사람으로부터 의견을 얻게되어 기쁩니다. 어떤면에서는 팝업이 실제로 대화 상자 일 필요가없는 "대화 상자"입니다. 다른 창이 될 수 있습니다. 하지만 이로 인해 많은 직원 창구가 열릴 수 있습니다. –
이것은 매우 좋으며 Alan Cooper의 UI 책 _About_Face_에서 나온 "Natural Language Output"을 생각 나게합니다. –
이 모델은 기본 목표가 목록을 보는 경우에 적합합니다. 기본 목표가 목록 항목을 편집하는 경우이 모델은 제대로 작동하지 않습니다. –
올바른 대답은 목록의 기본 목표가 개체 수정이나 목록보기를 중심으로 이루어 지느냐에 따라 다릅니다.
편집 작업이 자주 발생하지 않는 경우 별도의 창에 표시되도록 정리하고 기본보기의 화면 공간을 사용하여 필요한만큼 세부 정보를 표시 할 수 있습니다.
그러나 편집 작업이 빈번하게 수행되는 경우 새 창을 열면 너무 많은 마찰이 생기므로 목록에서 원하는대로 편집 할 수 있습니다.
프로그래밍에 대한 것이 아니기 때문에이 질문을 주제와 관련이 없으므로 닫으려고합니다. –