UX 디자인의 기본, PUI 디자인

domaelist.com / 2023-08-25

(섬네일=손찬호 디자이너 bbt0808@ditoday.com)

📌 이 글을 읽으면 알 수 있어요.

1. AI 등 기술의 발전과 사용자의 니즈에 따라 인터페이스 기술은 계속해서 발전하고 있죠. 그러나 우리는 아직 키보드, 마우스와 같은 전통적인 물리 입력 장치인 PUI(Physical User Interface)를 사용하고 있습니다. 이는 우리가 익숙함과 편리함을 쉽게 버리지 못하기 때문인데요. 5년, 10년 뒤에도 우리 곁에 있을지 모르는 편리한 PUI란 무엇일까요?

2. PUI의 유형에는 작동과 멈춤과 같은 단순 조작이 포함된 이산형 정보와 조정, 위치 제어 등이 포함된 정량적 정보가 있습니다. 전자레인지의 온도처럼 연속적인 값의 조절에는 노브가 편리한 것처럼, 과업의 종류에 따라 올바른 PUI 유형을 선택해야 사용자가 편리함을 느낄 수 있다고 합니다. 사용자를 편리하게 해주는 적합한 PUI 유형 선택에 대해 알아봅니다.

3. 효율성과 편리성은 PUI에서 중요한 요소입니다. 빠르고 정확한 조작을 위한 버튼의 배치, 사용자가 편안한 자세로 오랫동안 사용할 수 있도록 유도하는 디자인 등 사용자의 편리를 위한 PUI 디자인이란 무엇일지, PUI 디자인 가이드를 살펴봅니다.

글. 오의택(LG전자 디자인경영센터)
편집. 이민호 기자


“Hi Alexa”

최근 AI기술의 급격한 발전으로, 사용자의 음성인식을 통해 다양한 IT 제품을 조작하는 것을 손쉽게 볼 수 있게 됐습니다. 그렇지만 여러 트렌드 레포트에서 말하는 AI 기술의 발 빠른 확산에 대한 장밋빛 전망과는 달리, 우리는 아직도 물리 버튼이나 키보드와 마우스, 리모컨과 같은 전통적인 PUI(Physical User Interface)를 통해 대부분의 IT 제품을 조작해 사용하고 있습니다.

다양한 IT 제품의 PUI(자료=Celmetro)

생물이 환경의 변화에 적응하고 진화하듯이, 인터페이스도 기술의 발전과 사용자의 니즈에 따라 진화하는데요. 입력 방식은 물리 버튼에서 터치나 제스처 방식으로, 그리고 음성인식 방식으로 진화했습니다. 그렇지만 전통적인 입력 장치인 물리 버튼이나 키보드나 마우스, 그리고 리모컨과 같은 PUI가 5년 후, 10년 후, 아니면 20년 후에 우리 곁에서 사라질까요? 그렇지는 않을 것 같습니다. 왜냐하면 사용자는 새롭고 흥미로운 것을 좋아하지만, 동시에 익숙하고 편리한 것을 쉽게 버리지 못하기 때문입니다.

우리는 아직도 일상에서 셀 수 없는 PUI를 접하면서 생활하고 있습니다. 아침에 일어나면 욕실 스위치로 불을 켜고, 손잡이를 돌려 문을 열고 들어가 세수를 합니다. 아침 뉴스를 듣기 위해 리모컨으로 TV를 켜고, 냉장고 문을 잡아 당겨 우유를 꺼내 마신 뒤 현관문을 밀고 나가 엘리베이터 버튼을 누릅니다. 차 문을 당겨 차에 타 시동 버튼을 누르고, 기어를 바꾸고 가속 페달을 밟으며 핸들을 돌려 회사로 이동합니다. 회사로 향하면서 차와 연동된 스마트폰 전원 버튼을 누르고 앱을 실행해 차 안에서 음악을 듣습니다. 회사 자리에 도착해 노트북 전원 버튼을 누르고, 마우스와 키보드로 업무를 시작합니다.

특히 입력 장치는 사용 맥락에 따라 편리의 방식이 다릅니다. 예를 들어 전자레인지의 온도와 같은 연속적인 값을 조절할 때는 여러 번 눌러야 하는 누름 버튼보다는 한 번에 돌려서 값을 이동할 수 있는 노브(knob)가 휠씬 편합니다. 겨울에 장갑을 끼고 있을 때에는 터치 스크린 조작이 어렵고, 대중교통을 이용할 때는 음성인식으로 스마트폰을 사용하기 곤란합니다. 이처럼 사용 맥락에 따라 절대적인 우위의 입력 방식은 존재하지 않을 수 있는데요. 이는 전통적인 PUI가 20년 후에도 여전히 우리 곁에서 공존할 수 있는다는 것을 의미할 수 있습니다.

그렇다면 이러한 PUI를 사용자가 조작하기 편리하도록 하려면 어떻게 디자인해야 할까요? 사용자가 수행해야 할 과업에 가장 효과적으로 지원할 수 있는 입력 방식을 선정하고, 자연스러운 자세에서도 접근이 편리해야 합니다. 또한 빠르고 정확하게 조작할 수 있도록 디자인해야 합니다. 이번 글에서는 사용자에게 편리한 조작 경험을 제공하기 위한 PUI 디자인 원칙에 대해 알아보도록 하겠습니다.

원칙 1. 과업에 따라 효과적인 조작을 할 수 있는 PUI 타입을 제공해야 합니다.

제네시스 인테리어와 다양한 유형의 PUI(자료=제네시스)

PUI는 다양한 제품에 적용돼 있습니다. 특히 자동차에는 ▲핸들 ▲레버 ▲페달 ▲누름 버튼 ▲노브 ▲썸휠 ▲스위치 등과 같이 정말 다양한 유형의 PUI가 적용돼 있습니다.

다양한 가전제품과 PUI(자료=Lg전자)

다른 IT 제품을 살펴볼까요. 노트북에는 마우스와 키보드, 스마트폰에는 누름 버튼, 스마트 워치에는 노브와 누름 버튼, TV에는 누름 버튼과 리모컨으로 구성돼 있습니다. 집안의 가전 제품을 살펴보면, 세탁기와 전자레인지에는 노브와 누름 버튼이 있습니다. 아직 대부분의 가전 제품은 터치 스크린보다는 물리 버튼으로 구성돼 있습니다.

PUI 조작 장치 유형(자료=오의택)

그렇다면 지금 기획하고 있는 제품에는 어떤 PUI를 적용해야 할까요? 기능을 실행해야 하는 과업의 성격에 따라 사용자가 효과적으로 조작할 수 있도록 적절한 PUI 타입을 선정해야 합니다. 특히 사용자가 조작하고자 하는 정보의 유형에 따라, 이산형과 연속형 정보로 구분할 수 있고 이러한 정보를 조작하는 PUI 유형으로 구분할 수 있는데요. 여기서 이산형 정보(discrete information)의 조작은 작동과 멈춤과 같은 ▲단순 조작(action) ▲여러 조건 중 선택(selection) ▲자료 입력과 같은 형태로 분류됩니다. 반면에 연속형 정보(Continuous information)는 ▲정량적인 정보의 설정(setting) ▲조정(adjusting) ▲위치 제어(positioning) ▲추적(tracking)의 형태로 분류할 수 있습니다.

앞서 예를 든 것과 같이 전자레인지의 온도와 같은 연속적인 값을 조절할 때는 여러 번 눌러야 하는 버튼보다는 한 번에 돌려서 값을 이동할 수 있는 노브가 휠씬 편합니다. 단순히 이산형 정보냐, 연속형 정보냐에 따른 적절한 PUI 유형의 선정뿐만 아니라 동일한 유형의 정보를 조작하는 PUI에서도 사용자의 좋은 경험을 위해 좀 더 정교하게 검토해 볼 수 있습니다.

위치 제어 장치의 사용성 비교 결과(자료=Baber)

위치 제어(positioning) 장치에 대한 사용성 평가 결과를 살펴보면, 마우스가 제일 빠르지는 않지만 정확성 측면에서는 가장 우세한 것을 볼 수 있습니다. 반면 직접적으로 포인팅할 수 있는 터치 스크린이나 라이트펜은 속도는 상당히 빠르지만 정확성에서는 떨어지는 경향을 볼 수 있습니다. 즉, 속도와 정확성 간의 교환 관계(trade-off)를 볼 수 있는데요. 이러한 경우에는 사용자가 수행해야 할 과업의 속성에 따라 속도와 정확성 중 우선 순위를 결정해 적합한 위치 제어 장치를 결정하는 것이 필요합니다.

원칙 2. 의도한대로 빠르고 정확하게 조작할 수 있도록 해야 합니다.

다수의 버튼이 함께 배치된 키보드와 피쳐폰 키패드(자료=애플, LG)

입력 장치로서의 PUI는 사용자가 의도하는 대로 가장 빠르고 정확하게 조작할 수 있도록 하는 효율성(Efficiency)을 제공하는 것이 중요합니다. IT 제품에서 가장 많이 사용하는 PUI 형태는 누름 버튼인데요. 대표적으로 다수의 버튼이 함께 배열된 키보드나 피쳐폰의 키패드를 들 수 있습니다.

이러한 누름 버튼에서 빠르고 정확한 조작을 지원하기 위해서는 적절한 크기와 간격으로 버튼이 디자인 돼야 합니다. 버튼이 적당히 커야 사용하기 편리하다는 것은 누구나 알고 있는 내용일 것 같은데요.


이와 관련하여 피츠의 법칙(Fitts’ law)에 따르면 버튼의 크기가 클 수록 동작 시간이 적게 걸리기도 하며, 또한 버튼이 너무 작으면 손가락이 큰 남성의 경우 누르기 어려울 수 있습니다. 반면에 제한된 영역 하에 버튼이 너무 커서 근접한 버튼과의 간격이 좁다면, 다른 버튼이 눌리는 오류가 발생할 확률이 높아질 수 있습니다. 그러므로 사용자가 누름 버튼을 빠르고 정확하게 조작하려면 적절한 버튼의 크기와 간격으로 디자인 돼야 합니다.

리모컨의 엄지 동작 범위 실험(자료=안성희)

특히 제품을 잡고 사용하는 핸드폰이나 리모컨의 경우에는 주로 사용하는 엄지의 동작 범위를 파악해서 접근이 쉬운 영역에 누름 버튼을 배치하는 것이 중요한데요. 그래야 자연스러운 자세에서 이동 거리를 최소화해 빠르게 접근할 수 있습니다. 리모컨을 조작할 때 자세를 바꾸지 않고 오른손 엄지로 움직일 수 있는 범위를 인간공학적 실험을 통해 도출한 결과를 보면, 리모컨의 누름 버튼 배치 시 사용자가 많이 사용하거나 중요한 버튼을 붉은 색 영역이 배치한다면 사용자는 더욱 효율적으로 리모컨을 조작할 수 있습니다.

원칙 3. 자연스러운 자세로 사용할 수 있도록 해 신체적인 편안함을 제공해야 합니다.

좋은 경험을 제공하기 위한 PUI 디자인의 조건에는 효율성뿐만 아니라, 사용자가 자연스러운 자세로 사용하도록 해 신체적 편안함을 제공해 주는 것도 포함됩니다. 입력 장치는 주로 정보를 보고 인지적으로 처리하면서 발생되는 인지적 부담을 최소화해야 것과 달리, PUI와 같은 조작 장치는 사용자가 수행하기로 한 동작을 위해 발생되는 신체적인 부담을 최소화 해주는 것이 중요합니다.

여기서 사용자의 신체적인 부담은 크게 ▲과도한 힘의 요구 ▲부자연스러운 자세 유발 ▲장시간의 반복적인 사용에 의해 유발될 수 있습니다. IT 제품의 사용에서 과도한 힘을 요구하는 경우는 드물며 사무적인 목적성을 띤 PC나 노트북 사용을 제외하고는 신체적 부담은 주로 부자연스러운 자세에서 유발될 수 있습니다. 그러므로 좋은 PUI 디자인은 사용자가 자연스러운 자세에서 조작할 수 있도록 해 사용자에게 신체적인 편안함을 제공해 줄 수 있어야 합니다.

인체공학적 키보드 디자인(자료=Strasser)

이와 관련된 몇 가지 PUI 디자인 가이드라인을 살펴보도록 하겠습니다. 일반 키보드와 인체공학적 키보드를 비교해 보면 일반 키보드에서는 팔목의 꺽임이 발생하는 반면 인체공학적 키보드 사용 시에는 자연스러운 자세에서 사용할 수 있어 팔목의 피로를 최소화해 줍니다.

마우스 PUI 디자인 가이드라인(자료=Tillman et al)

다음은 마우스 PUI 디자인 가이드라인입니다. 마우스를 잡는 손의 크기를 고려해 마우스의 너비, 길이 및 높이를 디자인한다면 사용자는 자연스러운 자세로 마우스를 잡고 사용할 수 있습니다. 이에 따라 긴 시간 동안 마우스를 사용해도 손과 손목의 피로감을 덜 느낄 수 있어 쾌적하게 업무를 수행할 수 있습니다.

UX 디자인의 기본, PUI 디자인

이번 글에서는 전통적인 입력 방식인 PUI를 어떻게 하면 사용자가 편리하게 조작할 수 있도록 디자인할 수 있는지에 대해 살펴 봤습니다. PUI 디자인을 잘 하기 위해서는 좀 더 다각적인 관점에서 살펴보는 것이 필요한데요.

예를 들면, 누름 버튼 크기나 간격, 배치만이 PUI 디자인의 영역은 아닙니다. 누름 버튼을 편리하게 조작하기 위해서는 의도치 않은 접촉에 의해 버튼이 눌리지 않으면서 무리하게 누르지 않아도 작동할 수 있는 적절한 최적 누름 힘에 대한 정의도 필요합니다. 또한 냉장고나 세탁기 문이 열리는 힘을 정의한다거나, 스틱형 무선 청소기의 무게나 무게 중심, 핸들 형태와 같이 육체적 작업이 있는 PUI를 디자인할 경우에는 사용자의 물리적 부하에 대해 근전도법(EMG)과 같은 정교한 측정 방법을 이용하여 최적의 디자인 값을 도출하기도 합니다.연속형 정보를 다루는 PUI의 디자인에서는 좀 더 복잡한 원리의 이해가 필요합니다. 예를 들어 누름 버튼 다음으로 IT제품에 많이 적용된 노브의 디자인 원리를 살펴보면, 사용자의 입력 장치 움직임과 표시 장치의 반응 정도에 대한 조종·반응 비(C/R Ratio)와 같은 경우가 있습니다. 특히 단순히 입력 장치뿐만 아니라, 표시 장치와의 상호작용을 고려해 디자인할 경우에는 신체적 특성과 인지적 특성을 함께 고려해야 합니다. 대표적인 개념으로 양립성(Compatibility)을 들 수 있습니다. 예를 들면 운동 양립성은 조작 장치의 방향과 표시 장치가 움직이는 방향이 사용자의 기대와 일치하는 것으로, 노브를 오른쪽으로 돌리면 표시 장치의 커서가 아래로 이동하는 것은 양립성에 일치하는 것입니다.

인터페이스는 발전된 기술과 사용자의 니즈에 따라 진화하고 있습니다. 입력 방식은 PUI에서 터치와 제스처 방식으로, 그리고 음성인식 방식으로 점차 진화하고 있는데요. 이런 진화된 입력 방식은 다양한 IT 제품에 적극적으로 적용되고 있습니다. 그렇지만 사용자에게 익숙하고, 특정 맥락에서 더욱 편리하고 효율적인 PUI는 5년 후, 10년 후, 나아가 20년 후에도 사라지지는 않을 것입니다. PUI 디자인은 UX 디자인 도메인의 하나로, 기본적인(Fundamental) 요소입니다.

변화하는 트렌드를 빠르게 센싱하고 적용하여 차별화된 UX를 제공하는 것은 아주 중요합니다. 이와 함께 PUI 디자인과 같이 기본적인 영역을 단단히 유지하고 계승하는 것도 좋은 사용자 경험을 제공하는 데 꼭 필요한 영역 중 하나입니다.


*참고 문헌

Baber, C. (1997). Beyond the desktop: Designing and using interaction devices. Academic Press.
안성희, 박성환, 김민지, 이중희, 이지환, & 윤명환. (2017). 인터페이스 측면에서 본 리모컨 설계 가이드라인. 한국 HCI 학회 학술대회, 1000-1003.
Strasser, H. (2022). Compatibility as guiding principle for ergonomics work design and preventive occupational health and safety. Zeitschrift für Arbeitswissenschaft, 76(3), 243-277.
Tillman, B., Fitts, D. J., Woodson, W. E., Rose-Sundholm, R., & Tillman, P. (2016). Human factors and ergonomics design handbook. McGraw-Hill Education.

자료출처 : UX 디자인의 기본, PUI 디자인 - DIGITAL iNSIGHT 디지털 인사이트 (ditoday.com)


Document

필독 정보 모음

마케터를 위한 도구