UI/UX 이론서 10권 읽기 #1
UI/UX 이론서를 읽고 팀원들에게 소개하려 쓰는 글입니다.
첫 번째로 도널드 노먼의 <디자인과 인간심리>를 읽었습니다.
이전 글에서 인간 행위의 7단계에 대해 정리해보았다면 이번에는 7가지 디자인 근본 원칙이자 디자이너가 활용할 수 있는 도구적 개념들에 대해 정리해보도록 하겠습니다.
디자이너의 도구들(인터렉션의 7가지 기초 원칙)
1. 어포던스(Affordance, 행동유도성)
어포던스란 물리적인 대상의 속성과 사람(행위자)의 능력 사이 관계를 가리키는 말입니다. 흔히 어포던스를 그 물체의 고유 속성으로 생각하기 쉬운데, 사용자의 능력이 달라짐에 따라 그 물체가 어떻게 사용될 수 있을 것인지를 바뀌게 됩니다. 예를 들어 의자는 앉을 수 있는 가능성의 어포던스가 있지만 키가 5미터가 넘는 생명체라면 인간 기준의 의자에 앉을 수 없겠죠. 너무 무거워서 들 수 없는 무기가 있다면 근력이 약한 사람에게는 무용지물이 될 뿐입니다.
다이얼은 돌릴 수 있는 가능성을, 레버는 손으로 쥐고 꺾을 수 있는 가능성, 집게는 쥐어서 벌릴 수 있는 가능성을 가지고 있습니다.
어포던스는 어떤 행동이 가능한가를 결정하는 요소로 디자이너가 작업할 수 있는 속성은 아닙니다. 이런 어포던스를 지각될 수 있게 해주는 건 기표라 하며 디자이너의 영역은 바로 이 기표입니다.
(국내 출간본의 번역은 "행위지원성" 으로 되어있는데, 어포던스 또는 행동유도성으로 많이 사용됩니다.)
2. 기표(Signifier)
기표는 원래 소쉬르의 구조주의 언어철학에서 나오는 개념으로 언어를 기표와 기의로 나누어 생각해보는 것에서 출발했습니다. "나무"를 생각해보면 실제 나무라는 개념을 기의, [namu] 라는 소리, "ㄴㅏㅁㅜ"가 조합된 글자가 기표를 나타냅니다. 이 기표는 "TREE", "木", "き" 등 셀 수도 없는 것들이 가능합니다. 사실 기표와 기의는 그렇게 연결하기로 한 사회적인 약속일뿐 둘 사이에 본질적으로는 아무런 연관성이 없습니다.
디자인에서 말하는 기표는 어포던스가 내포하는 그 행동이 어디에서 일어나야 하는지를 전달하는 역할을 합니다. 위의 문 사진을 보면 손잡이는 잡고 밀거나 당길 수 있는 어포던스를 내포하고 있고, "PUSH" "PULL"이라는 팻말로 정확한 방법을 안내하고 있습니다. 여기서 저 팻말이 기표라고 할 수 있죠. 기표는 의도된 것이든 우연적인 것이든 중요하지 않고 인간에게 지각될 수 있는지 여부가 더 중요합니다. 물론 저 문손잡이 자체도 이 부분을 잡으라는 의미로 디자인 되어있으며 기표이자 지각된 어포던스로 볼 수 있습니다.
어포던스 : 사람과 환경 간의 가능한 상호작용. 지각될 수도 있고 아닐 수도 있음.
지각된 어포던스 : 종종 기표 역할을 하지만 아닌 경우도 있음
기표 : 어떤 행동이 가능하며 그리고 그것들이 어떻게 수행되어야 하는지를 신호. 기표는 지각 가능해야 하며 그렇지 않으면 기표로서 기능하지 못함
디자이너는 기표를 효과적으로 사용하여 발견 가능성을 높이고 피드백이 잘 전달될 수 있도록 노력해야 합니다. 위의 기표-기의 관계를 떠올려 보면서 어포던스를 기표의 기의로 생각하면 아주 딱 맞는 대응은 아니지만 대충 그 차이를 이해할 수 있지 않을까 싶습니다.
3. 제약(Constraint)
제약은 아주 기본적이면서 효과적인 디자인 수단입니다. 때로는 무엇이 가능하냐는 가이드보다 무엇이 불가능한지를 알려주어 잘못된 사용방법을 차단하는 것이 효과적일 수 있습니다. 적절한 제약만 주어진다면 처음 보는 물건을 사용할 때에도 자연스럽게 기획된 의도대로 조작할 수 있게 됩니다. 제약에는 물리적, 논리적, 의미적, 문화적인 다양한 계층의 제약이 존재할 수 있습니다.
위 USB는 제약이 잘못 적용된 사례라고 할 수 있습니다. 꽂을 수 있는 방향이 한 방향이라면 꽂는 부분의 디자인이 위아래가 더 확실히 구분되어 절대로 시도조차 할 수 없게 하거나, 아니면 어느 방향으로 꼽아도 작동이 되게 제약을 없애거나 하는 게 좋습니다. 진짜 전 지구인이 USB 잘못 꼽아서 허비한 시간을 모두 합친다면 얼마나 될지ㅠㅠ 왜 하필 2번 실패하고 나서야 제대로 꼽아지는가...
4. 맵핑(Mapping, 대응)
맵핑은 컨트롤러 또는 디스플레이가 조장되는 실제 장치와 갖는 상응 관계를 말합니다. 위 가스레인지 사진에서도 알 수 있듯이 A, B는 별도의 기표(BACK, FRONT 등의 텍스트)가 없다면 몇 번의 시행착오를 겪어야지 정확한 사용이 가능합니다. 그에 반해 C, D는 공간적인 유사성 등을 이용하여 아주 자연스러운 매핑이 이루어져 있어 손쉽게 사용이 가능합니다.
아래 보이는 자동차 시트 조절 버튼은 지금은 당연하지만 처음 접했을 때 굉장히 만족스러웠던 경험이 생각납니다. 사무실 의자는 저런 버튼이 없어서 각도 높이 등을 조절할 때 파트 별로 제각각 레버를 조절해야 합니다. 이게 무슨 레버인지 항상 혼동이 왔던 경험을 생각해 보면 다양한 시트 포지션을 조작하는데 최고의 디자인이었다고 할 수 있죠.
5. 피드백(Feedback)
피드백은 어떤 행동의 결과를 알려주는 것으로 많이 사용되는 용어이니 간단하게 넘어가도록 하겠습니다. 노먼 선배님의 조언을 더 하자면 피드백은 즉각적이어야 한다고 합니다. 잠깐만 피드백이 늦어져도 사용자 입장에서는 잘 작동되고 있는지 당황스러울 수 있으며 너무 지체될 시 이탈하게 된다고 합니다. 또 너무 많거나 나쁜 피드백은 피드백이 아예 없는 것보다 더 안 좋을 수 있습니다. 산만하고 제대로 된 정보를 제공하지 못하기 때문에 사용자에게 짜증과 불안을 유발할 수 있습니다. 피드백도 우선순위에 맞게 계획적으로 사용해야 합니다.
6. 개념 모델(Conceptual Model), 멘탈 모델(Mental Model)
'개념 모델'(개념모형)은 어떤 장치가 어떻게 작동하는가에 대한 하나의 설명을 의미하며 보통 매우 단순한 형태로 되어있습니다. 개념 모델이 사람들의 마음속에 있는 것을 '멘탈 모델'(심적 모델, 심적 모형)이라 합니다. 개념 모델 보다는 멘탈 모델이라는 말을 더 많이 사용하는 것 같습니다.
어떻게 일이 벌어지는지에 대한 이해는 사람마다 다를 수 있습니다. 보통 과거 경험에 의해 구성되는 경우가 가장 많고, 제품 자체로부터 추론되기도 하고 매뉴얼을 통해 습득하기도 합니다. 기표, 어포던스, 제약, 대응 등을 통해 습득할 수도 있습니다.
디자인은 시스템에 대한 좋은 개념 모델을 형성하는데 필요한 모든 정보를 보여주어야 합니다. 만일 다른 모든 것이 안된다면 표준화하여 1번만 배워서 다른 곳에도 동일한 개념 모델을 사용할 수 있게 해주어야 합니다.
도널드 노먼도 사례로 소개하고 있지만 윈도우OS와 맥OS의 스크롤이 반대라 처음에 많이 혼동이 왔던 게 생각납니다. 마우스가 기본 베이스인 윈도우에서는 윈도우 창 자체를 내리는 개념 모델을 가지고 있습니다. 맥은 스마트 디바이스들이 출시되면서 스크롤 방향을 반대로 바꿨다고 합니다. 스크롤을 할 때 창이 아닌 실제 컨텐츠를 터치해서 올리고 내리고 한다는 개념 모델로 되어있는 것이죠. 저도 노먼의 의견과 마찬가지로 결국에는 터치 스크린의 개념 모델을 사용하는 스크롤 방식이 결국 이기지 않을까 싶습니다.
7. 발견가능성(Discoverability)
발견가능성이란 어떤 행위가 가능하며 기기의 현재 상태가 무엇인지를 판정할 수 있도록 해주는 정도를 의미합니다. 아무리 좋은 UI를 디자인했더라도 눈에 안 띄면 무슨 의미가 있겠습니까.
보통 게임에서 미로를 통과할 때 어떤 퍼즐 적인 요소를 넣어서 버튼이나 장치를 풀어야지만 문을 열 수 있게 합니다. 위의 문을 보면 실제 문과 열림 버튼이 멀리 떨어져 있으며 수줍게 열쇠 모양으로 힌트를 주고 있습니다. 문을 설계한 사람이 퍼즐을 푸는 성취감, 문을 통과할 때마다 버튼을 누르고 제한 시간 이내에 통과하는 스릴을 주고 싶었던 게 아니라면 망한 디자인이라고 할 수 있습니다.
이 사진을 보면 뭐가 문제였고 어떤 디자인 원칙을 사용해 문제를 해결했을까요? 새로 이사한 사무실의 에어콘 조절기가 천장에 설치된 여러 에어콘들과 제대로 맵핑이 되지 않았습니다. 날씨는 쌀쌀해지는데 사람들이 자꾸 다른 에어콘 기기를 트는 게 불편했던 팀원이 포스트잇으로 작은 기표를 추가하였습니다. 두 포스트잇 사이에 색을 다르게 하고, 조작 버튼 바로 옆에 부착하여 발견가능성을 높였습니다. 짝짝짝
이쯤에서 이 도식을 다시 봅시다. 디자이너는 7가지 디자인 도구들을 사용하여 사용자의 행위에 적절하게 개입하고 단서를 줄 수 있습니다.
다음 글에서는 도널드 노먼의 인간 중심 디자인에 관한 여러 아이디어들을 살펴보고, 그의 저서들이 국내에 어떤 게 나와있고 더 보고 싶은 내용이 있을 때 어떤 책을 찾아보면 좋을지 정리해보도록 하겠습니다.
