brunch

매거진 독후감

You can make anything
by writing

C.S.Lewis

by 유정혁 delivan Oct 19. 2019

인터랙션 디자인 핵심 원칙 7가지

도널드 노먼의 디자인과 인간 심리

인터랙션 디자인이란?

우리는 살면서 수많은 제품과 함께 생활한다. 제시간에 일어나기 위해 사용하는 알람 앱, 아침 조깅을 위해 신는 운동화, 운동 후 흘린 땀을 씻겨 주는 샤워기 등 정말 다양한 제품들이 일상에 스며들어 우리와 상호작용을 한다. 이러한 상호작용을 어떻게 하면 즐겁게 만들 수 있는지에 대해 설계하는 작업이 바로 인터랙션 디자인(Interaction Design)이다.


인터랙션 디자인에는 몇 가지 원칙이 존재한다. 책 <디자인과 인간 심리>의 저자 도널드 노먼은 시간이 지나도 변치 않을 인터랙션 디자인 원칙 7가지를 제시한다. 이 원칙들을 알아보기 전에 몇 가지의 용어에 대한 개념 정리를 할 필요가 있다. 우선 인터랙션이란 정확히 어떤 개념인지 알아보자.

도널드 노먼


인터랙션, UI, UX

인터랙션은 서로 다른 두 요소 사이의 인터페이스(Interface)에서 발생하는 일련의 상호작용 행위를 뜻한다. 여기서 또 인터페이스라는 새로운 단어가 등장했다. 인터페이스는 서로 다른 두 요소 사이에 생기는 경계면을 뜻한다. 우리가 흔히 알고 있는 UI라는 단어는 인터페이스 앞에 사용자(User)라는 단어가 붙었으므로 서로 다른 두 요소 중에 한 요소가 사용자인 것이다.


UI라는 단어가 나왔으니 항상 따라다니는 용어인 UX에 대해 안 짚고 넘어갈 수 없다. UX(User eXperience)란 사용자가 제품과 인터랙션(상호작용)을 하면서 얻는 모든 경험을 의미한다. 인터랙션, UI, UX 이 세 단어의 정의를 잘 보면 의미가 긴밀히 연결되어 있단 걸 알 수 있다. 즉 UI는 사용자와 제품 사이의 접점이고, 그 접점에서 인터랙션이 일어나며, 인터랙션으로 인해 생기는 경험이 바로 UX인 것이다.

* 소중한 피드백 by 킹홍: 도널드 노먼이 말하는 UX는 end user와 service/ product와의 인터랙션뿐만 아니라 회사와의 인터랙션도 포함하는 총체적인 경험이다.

출처: http://bahns.net/5673484

결론적으로 좋은 인터랙션 디자인은 좋은 사용자 경험을 만들어 낸다. 도널드 노먼은 경험이라는 단어를 매우 강조한다. 제품과의 인터랙션(상호작용)에 대한 좋은 경험은 사용자에게 좋은 감정과 기억을 남긴다. 이는 곧 제품의 성공과 실패를 가르는 중요한 요소다.


도널드 노먼은 좋은 인터랙션을 만들기 위한 방법은 여러 가지일 수 있어도 기본적인 원칙들은 변하지 않는다고 말한다. 그 원칙들은 무엇일까? 책 <디자인과 인간 심리>에서 제시하는 기초 원칙들을 나의 전문 분야인 웹 서비스로 예를 들어 설명해보겠다.


1. 발견 가능성(discoverability)

웹 서비스에서 이 원칙은 보통 얼마나 쉽게 콘텐츠를 찾을 수 있느냐에 직결된다. 예를 들어 아마존은 그동안 사용자가 웹을 이용하면서 관심 있어했던 항목들을 기억하여 메인 페이지에 그와 관련된 상품들을 보여준다. 이는 사용자가 구매를 위해 검색을 하거나 찾아봐야 하는 작업들을 없애준다. 이 정도까지는 아니어도 카테고리를 찾기 쉽게 분류해놓는 것, 메뉴를 적절한 곳에 배치하는 것 등도 이 원칙을 지키려는 노력의 일환이다.


2. 행동 유도성(affordance)

행동 유도성은 사용자가 제품을 보고 어떠한 행동을 자연스레 할 수 있는지와 관련이 있다. 예를 들어 웹 사이트에서 높이는 짧고 너비는 기다란 빈 네모칸은 그 안에 무언가를 쓰게 하는 행동 유도성을 가진다. 이는 네모칸의 고유한 속성은 아니다. 주로 사용자의 경험 혹은 제약사항에 좌우된다. 당연한 얘기지만 눈이 보이지 않는 사람에겐 이 네모칸은 무언가를 쓰게 하는 행동 유도성을 가지게 하지 못한다.


3. 기표(signifier)

기표는 위에서 언급한 행동 유도성이 사용자에게 지각될 수 있도록 하는 것이다. 행동 유도성에서 언급했던 네모칸에 커서가 깜빡거린다던지 placeholder(흐린 글씨로 '검색어를 입력해주세요'라고 쓰여있는 것)등을 기표라고 할 수 있다. 도널드 노먼은 이러한 기표를 잘 만들어 사용자에게 원하는 행동 유도성을 인지하도록 하는 것이 디자이너의 중요한 과제라고 말한다.


4. 제약(constraint)

제약은 사용자에게 적절한 행동 방침을 제공하여 불필요한 행위들을 최소화시킨다. 예를 들어 많은 웹 서비스들이 회원가입을 할 때 입력한 비밀번호가 8자리 이상, 숫자와 영어, 특수문자를 혼합해서 사용하도록 제한한다. 이는 사용자들이 너무 쉬운 비밀번호를 입력해서 계정을 해킹당하기 쉽게 만드는 것을 어느 정도 방지하게 만들어 좀 더 안심하고 서비스를 이용할 수 있도록 돕는다.


5. 대응(mapping)

대응은 서로 다른 두 요소에 그럴만한 관계를 짓는 것을 말한다. 예를 들어 옷가게에 가면 인기상품이나 최신 상품들이 매장 구석이 아닌 초입이나 중심에 있는 것처럼, 쇼핑몰 웹 사이트에서도 그런 것들을 첫 페이지에 띄운다. 사용자들은 보통 인기가 많고 최신의 상품을 원하기 때문에 그런 성향에 맞춰 서비스를 그에 맞게 대응시키는 것이다.


6. 피드백(feedback)

피드백은 사용자들이 제품과 어떻게 상호작용 해야 하는지, 그것이 어떠한 효과를 낫는지에 대한 가이드를 제공하는 것이다. 사용자가 우리의 웹 서비스에 회원가입을 하면서 8자리가 아닌 7자리의 비밀번호를 입력했을 때, 당신이 1자리를 덜 입력했다고 피드백을 주어 사용자가 인지할 수 있어야 다음 단계로 넘어갈 수 있을 것이다. 피드백은 즉각적이어야 한다. 지체되면 사람들은 종종 포기하고 다른 일을 한다. 또한 너무 많은 피드백은 너무 적은 것보다 한층 더 성가실 수 있다. 이는 사용자들이 그것을 무시하게 만들고 짜증 나게 하며, 중요한 소식을 간과할 수 있게 한다.


7. 개념 모형(conceptual model)

개념 모형은 제품 자체가 원하는 대로 작동하는가에 대한 하나의 모형이 되는 걸 의미한다. 예를 들어 좋아요 버튼은 누르는 것은 그 컨텐츠를 선호한다는 개념의 모형이 된다. 카트 모양의 장바구니는 버튼은 그 자체로 내가 구매하기로 한 것들을 모아놓은 페이지로 갈 수 있다는 개념의 모형이 된다. 개념 모형은 그 제품을 쓰는 사람들의 마음속에 있다. 사람마다 다른 심적 모형을 가질 수 있어서 이 개념 모형은 어떤 사용자에겐 종종 오류를 일으킨다. 그래서 복잡하지 않게 최대한 일반화시키는 것이 중요하다.


정답은 사람에게 있다

수십 년간 디자인은 지속적으로 발전해왔다. 하지만 현대 기술의 발전 속도를 따라가기엔 역부족인 듯하다. 새로운 기술이 나오면서 새로운 제품이 등장하고 그에 따른 새로운 인터랙션 방법이 등장한다. 그 사이에 또 새로운 기술이 나오면서 이 단계는 반복된다. 그 결과 기술의 속도를 따라가고자 디자인 원칙들을 제품에 적용하고 테스트해보기 전에 제품을 출시하게 되고, 결국 나쁜 디자인의 선례를 만들게 된다.


도널드 노먼은 이에 대한 해결책으로 인간 중심 디자인(Human-Centered Design, HCD)을 제시한다. 즉 인간의 필요, 능력 및 행동을 첫째로 두고 이 필요와 능력 및 행동 방식에 맞추기 위해 디자인하는 접근이다. 좋은 디자인은 기술의 이해와 더불어 인간에 대한 이해로 시작된다. 인간의 행동을 있는 그대로 받아들이고 그들이 우리의 제품과 어떻게 상호작용을 하는지 관찰하는 것이 중요하다. 관찰한 것을 토대로 얻은 아이디어를 신속하게 검증해보며 더 나은 인터랙션을 디자인하는 것이 핵심이다.


책에는 이런 구절이 나온다. "디자인의 상당 부분이 기술에는 전문가이지만 사람을 이해하는 데에는 한계가 있는 엔지니어들에 의해 이뤄지기 때문에, 종종 나쁜 디자인(사용자 입장에서)의 제품이 출시되곤 한다"

엔지니어로서 일을 하고 있는 나에게 경각심을 일깨워준 구절이다. 기술뿐만 아니라 사람에 대한 이해를 의식적으로 하려 노력하고, 제품을 단지 구현만 하는 것이 아니라 사용자들이 어떻게 상호작용 할지 충분히 고민해보는 것이 장기적으로 더 좋은 방법이라는 것을 잊지 말아야겠다.


매거진의 이전글 돈으로는 살 수 없는 것 (feat. 오픈소스)
브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari