brunch

매거진 UI UX 소식

You can make anything
by writing

C.S.Lewis

by UX 컨설턴트 전민수 Oct 03. 2024

[UX#24]드롭다운 메뉴와 세그먼티드 버튼 UX 원칙

Anthony의 글 Why Segmented Buttons AreBetter for Sorting 소개하고자 합니다.



드롭다운 메뉴와 세그먼티드 버튼 UX 적용 원칙
(요약문)


사용자가 정보를 쉽게 찾을 수 있도록 도와주는 콘텐츠 분류 옵션은 매우 중요합니다. 그러나 많은 웹사이트에서 드롭다운 메뉴를 사용함으로써 가시성이 낮아지는 문제를 겪고 있습니다. 


드롭다운 메뉴는 현재 선택된 옵션만 보여주고 나머지는 숨기기 때문에, 사용자는 다른 선택지를 확인하기 어려워 불만을 느낄 수 있습니다. 예를 들어, 특정 카테고리의 상품을 찾을 때 드롭다운 메뉴 대신 모든 옵션을 목록 형태로 보여주면, 사용자는 다양한 선택지를 비교하고 더 나은 결정을 내릴 수 있습니다.


드롭다운 메뉴는 사용자의 작업과 관련이 없는 여러 옵션이 포함될 때 공간을 절약하는 데 유용하지만, 분류 작업에서는 모든 옵션이 사용자가 원하는 정보를 찾는 데 직접적으로 연결됩니다. 이 경우, 가시성을 줄이며 공간을 절약하는 것은 사용자 경험을 저해할 수 있습니다. 드롭다운 메뉴를 클릭하고 선택하기 위해 두 번 클릭하고 한 번 스크롤해야 하므로, 이는 불편함을 초래하고 정보 검색에 소요되는 시간을 늘립니다.


따라서 분류 작업에서는 모든 옵션을 명확하게 보여주는 방식이 더 효과적이며, 사용자에게 더 나은 탐색 경험을 제공해야 합니다. 


세그먼티드 버튼은 이러한 문제를 해결할 수 있는 좋은 대안입니다. 이 버튼은 여러 옵션을 한눈에 보여주어 사용자가 원하는 선택지를 쉽게 확인하고 선택할 수 있게 해줍니다. 사용자는 옵션을 선택하기 위해 한 번만 클릭하면 되므로 매우 편리합니다. 


그러나 세그먼티드 버튼은 옵션의 수가 많아질수록 차지하는 가로 공간이 증가하여 화면이 혼잡해질 수 있는 단점이 있습니다.


세그먼티드 버튼은 높은 가시성을 제공하지만, 옵션 수가 많아지면 화면 공간이 제한될 수 있으므로 적절한 디자인과 레이아웃을 고려해야 합니다. 예를 들어, 옵션을 그룹화하거나 선택 가능한 수를 제한하여 화면을 깔끔하게 유지할 수 있습니다.


결론적으로, 사용자 인터페이스 컨트롤은 사용자 경험에 큰 영향을 미칩니다. 드롭다운 메뉴는 공간을 절약할 수 있지만 가시성을 낮추는 단점이 있고, 세그먼티드 버튼은 높은 가시성을 제공하지만 공간이 제한될 수 있습니다. 


이 상황에서 여러분은 무엇이 더 중요한지 고민해야 합니다. 공간 절약이 더 우선인지, 아니면 사용자가 정보를 쉽게 볼 수 있는 가시성이 더 중요한지를 고려하여 최적의 사용자 경험을 제공할 수 있는 방향을 찾아야 합니다.




위글은 요약문입니다.


이 글에 대한 전체 번역 원문(구체적인 사례 등)은 아래 링크를 클릭해주세요~

https://maily.so/uiux/posts/400ae999


브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari