2010-02-02 8 views
3

사용자 데이터를 수집하기 위해 모달 패널/대화 상자 팝업이있는 웹 응용 프로그램에서 작업하고 있습니다. 패널 내의 양식이 커지면서 양식을 여러 탭으로 분할 할 것을 제안했지만 고객이 모달 패널에 스크롤 막대를 추가 할 것을 제안했습니다.모달 패널의 스크롤 막대

모달 패널 내의 스크롤 막대에 사용성 문제가 있습니까? 나는 나쁜 습관이라고 생각하지만 다른 의견을 원합니다.

감사합니다,

글렌

업데이트 : 좀 더 구체적으로 시나리오를 설명 할 것이다. 검색 결과 항목을 저장 (시스템의 다른 영역으로 복사) 할 수있는 검색 페이지가 있습니다. 이 항목에 추가 정보를 저장할 수 있습니다 (예 : 추가 설명, 다른 버킷에 할당 - 그 이상의 세부 정보는 얻을 수 없음). 사용자가 검색 결과 항목을 저장하려면 하나 이상의 항목을 선택하고 저장 버튼을 클릭하면됩니다. 그러면 모달 패널 팝업이 나타납니다.

원래 사용자는 별도의 페이지로 이동하여 일련의 페이지를 따랐습니다. 우리의 고객은 이것이 시간이 많이 걸린다는 것을 느꼈으므로, 우리는 모달 패널을 사용하도록 페이지를 변경했습니다.

저는 모달 패널을 사용하면 100 % 확신 할 수 없지만 최고의 디자인이라고 생각합니다.하지만 지금 우리가 가지고있는 것입니다. 다른 아이디어도 환영합니다.

답변

2

너무 오래 걸리는 모달 형식이 있다면 자체 페이지로 만들어서는 안될까요?

모달 대화의 전체적인 점은 사용자에게 알 필요가있는 내용 (대개 무시되고 성가신 내용)을 사용자에게 알려주거나 진행하기 전에 필요한 정보를 사용자에게 제공하는 것입니다.

양식이 사용자 입력 수집 용이라고합니다. 사용자가 진행하기 전에 입력해야하는 항목 인 경우 (예 : 결제 흐름의 일부 또는 그와 유사한 항목), 전체 페이지를 흐름에 바치는 것이 가장 좋습니다.

"진행중인 작업을 진행하기 전에 여기에 로그인하십시오"라는 것이 있다면 다시 한 번 자신의 페이지로 돌아가는 것이 더 의미가 있다고 생각합니다. 양식 작성을 마친 후에 입력 한 페이지입니다. 이것이 스택 오버 플로우 인적 검증 페이지의 작동 방식입니다.

"사이트에 대한 의견을 보내주십시오"와 같이 짜증이 난다면 모달이 아니 어서 쉽게 해고 될 수 있습니다 (말하겠습니까?) 팝업 창.

모달 대화 상자는 실제로 가능한 한 짧게 유지해야합니다. 간결함이 불가능하고 대화가 실제로 모달이어야한다면 다음 페이지에 액세스하기 전에 채워야하는 페이지의 흐름을 만드는 것이 더 합리적이라고 생각합니다. 결제와 마찬가지로 : 배송 정보를 추가하기 전에 장바구니에 제품을 추가해야하며 배송 비용을 결정하려면 배송 정보가 필요합니다. 그런 종류의 것.

모달 대화의 정확한 성격을 모른 채 정확하게 어떤 방법이 최선인지를 말할 수는 없습니다.


편집 : 아하! 귀하의 고객 느낀 이것은 시간이 오래 걸리는거야?이것은 어떤 방식으로 실제로 더 나은지보기 위해 매우 빠르고 더러운 실시간 사용성 테스트를 수행해야하는 상황의 유형입니다. 복도에서 사람들을 붙잡고, 일부 사람들에게 그것을하는 모달 방법 (스크롤과 함께)을 보여주고, 다른 사람들에게 그것을하는 오래된 (모달이 아닌) 방법을 보여주고 그들이 말하는 것을 보아라.

(이상적으로는 세션과 화면을 녹화하는 것이고 개인적인 취향을 표시하지 않는 것이 좋습니다. 시청하는 동안 시스템을 사용하여 작업 수행 능력을 확인하도록 요청하십시오. 한 방법이 다른 방법보다 실제로 더 빠른지 시간과 시간을 기록하여 녹음합니다.

표준에 위배되는 유용성 결정을해서는 안됩니다 (이 경우 표준은 "큰 형태는 자신의 페이지를 유용합니다" ") 실제로 비정상적인 방법을 사용할 수 있는지 확인하지 않고. 유용성에 관해서는 표준이 일반적으로 사용 가능하기 때문에 (항상 그런 것은 아니기 때문에 테스트해야합니다). 고객이 싸우면 적어도 원하는 바가 어리석은 경험적 증거에 반하는 증거를 얻게됩니다.

궁극적으로 고객은 청구서를 지불하는 고객입니다. 당신이 이유를 볼 수 없다면 당신이 말하는 것을 최대한 활용해야 할 것입니다. 폼이 모달 대화 상자에 있어야한다면 대부분의 사용자가 스크롤 할 필요가 없도록 적어도 필수적이지 않은 필드가있는 경우 폴드 아래에 필수가 아닌 필드를 숨길 수 있습니다.

양식을 제출할 단추 (또는 양식과 관련하여 필요한 모든 항목)가 사용자가 스크롤 한 위치에 관계없이 표시되는지 확인하십시오. 정말 나쁜 생각은 모든 필수 필드를 맨 위에 놓은 다음 사용자가 제출 버튼을 누르기 위해 아래로 스크롤하도록 강요하는 것입니다. 그것은 단지 무례한 일입니다.

0

여기에 모달 창을 넣는 것이 합리적입니다. 페이지의 레이어로 사용한다고 가정합니다. 그러나 그것이 혼잡 해지면 계속 증가하는 UI 요소 배열을 관리하는 방법을 찾고 있습니다.

스크롤바에 대한 초기 질문에 대답하려면 아니오, 그들은 말쑥하지 않습니다. 그러나 다른 응답자가 주장한 것처럼 스크롤 영역 내에서 작업 UI 요소를 디자인해서는 안됩니다.

좋은 사용자 연구가 여기 유용 할 것처럼 들립니다. 사용자에게 중요한 항목입니다. 필수 항목과 선택 항목은 무엇입니까? 분류 될 수 있습니까?

일부 사람들은 UI 항목 수가 대화 상자에서 오버플로되면 탭이 분류에 유용하다는 의견을 제시합니다. 이 경우에는, 이것이 나쁜 생각이라고 생각합니다. 이것은 대화 상자의 설정 범주가 아니라 사용자가 입력하고 선택한 내용을 저장하는 확인/선택/입력 대화 상자입니다. 탭으로 인해 사용자가 탭을 놓치고 정보를 입력하지 못할 가능성이 있습니다. '뒤로'탭의 항목이 필요하고 사용자가 거기에 가지 않으면 오류 경험이 매우 떨어집니다.

스크롤에 관한 한 가지는 마우스가있는 사용자가 쉽게 사용할 수 있다는 것입니다. 스크롤바를 클릭하거나 (많은 경우) 스크롤 휠을 굴릴 수 있습니다.

특히 사용자가 입력하거나 선택할 수있는 항목이 선택 사항 인 경우 고려하지 않은 한 가지 사항은 대화 상자에서 축소 및 확장 할 수있는 섹션을 만드는 것입니다. 필수 요소가있는 섹션은 기본적으로 확장되며 선택적 요소가있는 섹션은 기본적으로 축소됩니다. 섹션을 확장 할 때 스크롤바가 추가되면 UI에 추가 된 내용이 사용자에게 분명합니다.

물론 키보드 만 사용하는 사람, 장애가있는 사람, 휴대 기기에서 누가 액세스 할 수 있는지에 대해 알아야 할 수도 있습니다.

0

탭 패널이 스크롤 패널보다 근본적으로 좋거나 나쁘지 않다고 생각합니다. 각각 다른 상황에서 장점이 있습니다. 그러나 당신의 경우에 더 중요합니다 : 당신이 탭 또는 스크롤 해야하는 경우 패널이 아마도 너무 모달로 복잡합니다. 모달 패널에서 더 많은 정보가 입력 될수록 사용자가 대답을 얻기 위해 다른 곳으로 가야 할 가능성이 높아지며, 사용자가 어떤 이유로 든 다른 곳으로 가야한다고 결정하면 버리는 작업이 늘어납니다.

해결 방법은 패널에서 부모 페이지/창으로 가능한 많은 정보를 이동하는 것입니다. 사용자가 검색 결과 페이지에 "추가 정보"를 입력 할 수있게하여 검색 결과를 탐색하여 정보를 결정하는 데 도움을줍니다. 추가 정보는 분명히 많은 공간을 소비하기 때문에 컨트롤을 표시하고 숨길 수있게 만들지 만 숨기기와 표시간에 사용자 입력을 항상 유지합니다. 나는 발자국을 작게 유지하기 위해 탭이나 스크롤하는 것이 좋다고 생각합니다. 단일 검색 결과에 대한 추가 정보는 별도의 패널이 아닌 해당 검색 결과 옆에있는 컨트롤로 이동해야합니다.

모달 저장 패널에는 저장하는 데 도움이되는 파일 이름과 위치, 파일 유형 등의 몇 가지 컨트롤 만 포함해야합니다. 모든 정보가 저장에 도움이된다면, 저장 패널을 모덜리스로 만드십시오. 누가 네가 할 수 없다고 말했어?

다른 페이지에 모든 저장 정보를 두는 것은 사용자가 입력을 잃지 않고 다른 곳으로 이동할 수 없다는 점에서 모달 패널보다 훨씬 우수합니다. 사용자가 다른 페이지로 이동할 경우 사용자의 입력 내용을 보존하기 위해 조치를 취하더라도 대부분의 웹 사용자는 이라고 생각하면은 입력을 잃을 수 있으므로 시도하지 않습니다.