확인 취소 버튼 배치

대화상자에서 '확인'·'OK'·'다음'·'완료' 같은 긍정 액션 버튼을 어디에 둘 것인가는 사소해 보이지만 실무에서 자주 이견이 갈리는 문제다. 2010년 pxd의 한 프로젝트 회의에서, 디자이너가 평소 익숙함에 따라 우측 하단에 배치한 완료 버튼이 다른 참가자들에게 어색하게 느껴진 사례가 이 논의의 출발점이다. 결론은 "적용될 디바이스의 다른 UI, 그리고 일반적인 관례를 따르자"는 절충이었지만, 그 관례 자체가 하나로 수렴되지 않는다는 점이 문제의 핵심이다.

버튼 위치를 결정하는 근거는 크게 다섯 가지로 정리된다. 첫째는 OS 차원의 일관된 위치로, Windows는 '확인'과 '취소'를 함께 두되 왼쪽을 '확인'으로 일관되게 배치하는 반면, Mac OS X는 설정 변경 시 창을 닫으면 곧바로 값이 적용되는 방식을 취하면서도 '확인'·'OK' 버튼이 등장할 때는 항상 우측 하단에 둔다. 둘째는 핸드헬드 디바이스의 조작성으로, 오른손잡이 사용자가 다수라는 점에서 우측 하단이 손에 편한 위치로 꼽힌다. 셋째는 시선 이동 순서로, '취소'나 '이전' 버튼이 함께 있지 않다면 글을 읽는 시선의 흐름상 맨 마지막에 해당하는 우측 하단에 'OK'·'다음'·'확인'을 두는 것이 자연스럽다. 넷째는 긍정·부정의 의미가 하드키와 맺는 관계로, 휴대폰에서 오래 쓰인 통화/끊기 버튼처럼 긍정·부정의 의미를 가진 물리 버튼과 심리적 공통성을 유지하려고 OK 버튼을 왼쪽에 두는 경우도 있다. 다섯째는 디바이스 하드키의 물리적 배치로, 피처폰 시절에는 하드키 디자인이 결정적 영향을 주어 'OK' 버튼이 화면 가운데 위치하는 경우가 많았다.

이처럼 근거가 다층적이고 서로 충돌하기 때문에, 버튼 위치는 하나의 규칙으로 통일해 해결할 수 있는 문제가 아니다. 다양한 디바이스와 거대해진 앱 생태계 안에서 이 기본적인 규칙조차 중구난방으로 쓰이고 있으며, 목표는 사용자가 오류 없이 사용하게 하는 것이지만 그것을 보장하는 만능 규칙을 찾기는 어렵다는 것이 이 논의의 결론이다. 이는 UI 가이드라인에서 다루는 Windows 3.1 가이드(1987년 초판)가 이미 'OK'·'Cancel' 버튼의 배치 순서를 한 페이지 분량으로 상세히 규정했지만, Mac OS X 2000년판부터는 이런 세부 규정이 오히려 줄어들었다는 역사와도 맞닿아 있다 — 플랫폼별 관례가 시대에 따라서도 계속 달라져 왔다는 뜻이다.

핵심 내용

버튼 위치를 정하는 5가지 근거: OS 컨벤션(Windows 왼쪽 확인 vs Mac 우측 하단 확인), 손 조작성(오른손잡이 다수 고려), 시선 이동 순서(마지막 시선이 닿는 우측 하단), 하드키와의 심리적 공통성(통화/끊기 버튼 등), 디바이스 하드키 물리적 배치(피처폰 시절 중앙 배치)
여러 근거가 상황에 따라 서로 다른 결론을 내리기 때문에, 단일 규칙으로 통일하기 어려운 문제
실무 결론: 최종적으로는 해당 디바이스·OS의 다른 UI와 일반적 관례를 따르는 절충이 현실적
Windows 3.1 가이드는 OK·Cancel 배치를 한 페이지 분량으로 상세 규정했으나, 이후 판본에서는 관련 규정이 줄어드는 추세

출처

확인! OK! 계속! 완료! 버튼은 어디로? — 2010-05-03, 알 수 없는 사용자

확인 취소 버튼 배치

핵심 내용

관련 개념

출처