티스토리 뷰

  

오래가는 UX 디자인》 반준철 저 (2013.2)

Chapter 6 NOTE

6장은 인터렉션 표현 설계에 관한 내용으로 다음 4가지 원칙을 이야기한다.

  • 행동을 유도하는 단서를 제공하라
  • 적절한 피드백을 제공하라
  • 올바른 대응 관계를 만들어라
  • 제약과 제한의 힘을 활용하라 

 

 

01행동을 유도하는 단서를 제공 하라

여기서는 어포던스와 행동유도성, 시그니파이어에 대해 설명한다.

 

이 책에서는 어포던스를 2가지 의미로 구분해서 설명한다. 심리학자 제임스 J. 깁슨이 소개한 개념인 내재적 어포던스와 도널드 노먼이 소개한 인지된 어포던스이다. 제품 디자인의 관점에서는 인지된 어포던스가 더 중요하다고 한다.

깁슨의 어포던스는 사물 또는 환경이 지니는 본연의 특성을 의미하며 사람이 알아채지 못하더라도 항상 내부에 존재하는 특성이다.

하지만 실제로 제품을 디자인할 때는 깁슨이 이야기한 사물 본연의 특성이 아니라 사람들에게 인지된사물의 특성이 더 중요하다. () 예를 들어 일반 유리는 충격에 약하고 쉽게 깨지지만, 고강도 유리처럼 특수하게 제작된 유리는 총탄도 뚫지 못할 정도로 강도가 높다. 창에 고강도 유리를 설치한 건물에서 불이 났다고 하자. 사람들이 건물의 유리가 쉽게 깨질 것으로 생각하고 창을 부수고 탈출하려 한다면 문제가 생길 것이다. 이 경우 고강도 유리를 사용한 창은 쉽게 깨지지 않을 것처럼 보이게 디자인 되어야 한다.

이렇게 행위자의 행동을 유도하는 사물 또는 환경의 인지된 특성을 행동유도성, 또는 인지된 어포던스라고 이야기한다. _362, 363

 

공공도서관 휴게실 낙서관련 사례를 읽어보면 내재적 어포던스와 인지된 어포던스의 차이가 명확해진다. (363)

 

행동유도성은 사물이 가진 행동을 유도하는 특성을 말하지만 시그니파이어는 행동유도성이 있는 단서를 의미한다. 인터페이스 디자인에서 시그니파이어는 색깔, 기호, 특별한 모양, 버튼, 아이콘 등의 시각적 단서와 소리 같은 청각적 단서, 진동, 질감 등의 촉각적 단서를 모두 포함하는 개념이다. _367

디자인할 때 적절한 행동유도성이 있는 시그니파이어를 잘 배치하면, 디자이너는 설명을 추가하지 않고도 사용자가 제품을 의도한 대로 사용하게 할 수 있다. _369

내용 일부를 미리 보여주는 인터페이스 형태로 시각적 시그니파이어가 제공되면 사람들은 추가 내용이 더 있을 것으로 생각하고, 화면을 이동시켜 나머지를 보려고 할 것이다. (, 윈도우폰7의 파노라마 애플리케이션) _371, 372

 

 

 

02적절한 피드백을 제공하라

빠르다고 느껴지는 피드백에 관한 부분이 흥미롭다.

작업 완료에 대한 기대 시간이 작업의 종류나 사람들의 경험에 따라 차이가 나므로 빠른 응답을 정의하기 어렵다. _383

작업을 수행하면서 사람들에게 최종 결과를 전달하는 데 걸리는 시간이 같더라도 이를 어떤 식으로 알리는지에 따라 사람들이 경험하는 체감적인 피드백에는 큰 차이가 생긴다. _385

 

스마트폰에서 모바일앱 실행 시 로딩되는 동안 개발사나 브랜드 로고를 보여주는 대신 앱의 첫 화면 레이아웃 이미지를 보여주어 로딩 체감속도를 빠르게 느껴지도록 한다는 것을 다른 책에서 읽은 적이 있다. 특히 SNS 앱은 스플래시 이미지를 사용하지 않고 이런 식으로 만드는 경우가 많다고 했었는데 이 책에서도 유튜브 앱의 로딩 사례를 통해 빠르게 느껴지는 피드백의 예를 보여준다. (389)

 

 

위 이미지는 페이스북 앱을 실행하고 바로 캡쳐한 화면이다. 레이아웃 이미지가 순차적으로 보여진 후 실제 데이터를 표시한다.

 

 

03ㆍ올바른 대응관계를 만들어

대응에 관한 내용으로는 배치에 대한 대응, 움직임에 대한 대응, 의미에 대한 대응에 관해 설명한다. 그 중에서 움직임에 대한 대응의 사례로 제시된 닌텐도 위와 플레이스테이션, 키넥트를 사용자 경험의 관점에서 비교한 부분이 흥미롭다.

기술적인 차이로 각 시스템에서 사람들에게 제공할 수 있는 경험에는 큰 차이가 생긴다. 각 게임기의 대표 게임을 보면 이를 알 수 있다.

닌텐도 위에 번들되어 팔리는 게임은 자동차 운전 게임인데, 게임을 진행하려면 리모컨을 회전하고 기울여서 자동차를 운전해야 한다. 반면 플레이스테이션에는 양궁 게임이 번들되어 판매된다. 양궁 게임은 각도에 대한 정밀한 제어가 필요한데, 사용자는 두 개의 플레이스테이션 무브 리모컨을 이용해서 활과 화살을 정밀하게 제어할 수 있다. 마이크로소프트 키넥트는 주로 몸을 이용해서 조작하는 게임과 함께 판매된다. 아래의 키넥트 게임은 동물 사육 게임으로 사용자는 동물이 자신의 행동을 따라 하게 해서 동물을 훈련시킨다.

이처럼 동작을 인식하는 방식에 따라 구현 가능한 경험에도 큰 차이가 생긴다. _414

 

 

04ㆍ제약과 제한의 힘을 활용하

일반적으로 개발자는 기계를 세세하게 조작하고 원하는 대로 통제하는 데서 즐거움을 느낀다. 그래서 개발자가 설계하고 만든 제품은 설정할 수 있는 요소가 많은 경향이 있는데, 이런 제품은 보통 전문 지식이 없는 사용자는 사용하기 어렵다. 복잡한 설정 옵션이 가득한 프로그램을 제대로 이용하기 위해서는 각 옵션의 의미를 알고 프로그램 작동 구조를 정확히 이해해야 한다.

이런 프로그램을 누구나 쉽게 사용하게 하려면 제공하는 설정 옵션을 대폭 줄이고도 문제없이 동작하도록 프로그램의 구조를 바꿔야 한다.

제품을 단순하게 만들 때 전체 구조를 최적화하지 않고 겉으로 보이는 인터페이스 요소만 간단하게 만들면 사용자는 기본 기능도 제대로 동작하지 않는 제품을 쓰게 될 수도 있다. 예를 들어 십여 개의 버튼이 달린 휴대폰의 버튼을 하나만 남기고 다 제거하기는 쉽지만, 하나만 남은 버튼으로 기존에 사용하던 기능을 쉽게 이용하게 하기는 어렵다. 겉으로 보이는 것에만 신경 쓰지 않고 전체 시스템을 제약과 제한을 기반으로 간단하게 만들어야 진정 사용하기 쉬운 시스템을 만들 수 있다. _419

 

물리적, 논리적, 문화적 제약을 적용해서 제품을 단순하게 만들 수도 있지만, 사용자가 선택할 수 있는 범위를 일부 제한하는 것만으로도 제품은 놀랍도록 단순해질 수 있다. _431

    • 범위 제한 : iOS 의 폴더 내 아이콘 개수, 플리커의 갤러리에 추가할 수 있는 사진 개수 _432
    • 기본값 제공 : iOS의 폴더 이름, MS워드의 새문서 저장 시 파일명, 파일 복사 시 동일 파일명인 경우 복사본으로 자동 저장 _434
    • 사전 설정값 제공 : 음악 재생기의 이퀄라이저, 포토샵 플러그인, MS 파워포인트 2010의 테마 _435

 

다양한 기능을 제공하고, 세세한 부분까지 사용자가 직접 설정할 수 있게 만들어 놓고, 이런 것까지 직접 설정 가능한 좋은(?) 제품 이라고 자부심을 가질 일이 아닌 것 같다. 핵심기능에 집중하고 적절한 제약과 제한을 두는 것이 사용자에게 더 이로운 일인 것 같다.

이쯤에서 다시 떠오르는 건 사용자가 심성 모형을 형성하기 쉬운 디자인, 사용자에게 이미 형성된 심성 모형에 가까운 디자인을 해야 하는 것이지, 디자이너가 옳다고 생각하는 개념 모형을 만들어 놓고 그 사용법을 익히도록 강요하면 안 된다는 내용이 머릿속을 맴돈다.

 

관련 포스팅

《오래가는 UX 디자인》 반준철 저 - Chapter 1 NOTE

《오래가는 UX 디자인》 Chapter 2~3 NOTE

《오래가는 UX 디자인》 Chapter 4~5 NOTE

《오래가는 UX 디자인》 Chapter 6 NOTE - END