사용자 경험의 5계층
이번에는 사용자 경험을 5계층으로 나눈 제시 제임스 가렛(Jesse James Garrett)의 다이어그램을 소개합니다. 우리가 사용하는 소프트웨어는 다음 그림과 같은 5가지 계층 구조에 기반을 두고 만들어집니다. 사용자는 소프트웨어를 이용할 때 눈에 보이는 표면, 윤곽과 함께 바로 보이지 않는 구조와 범위, 전략을 함께 경험하며, 이런 5가지 계층이 소프트웨어의 사용자 경험을 만들어냅니다.
가렛은 이 모델을 웹사이트의 사용자 경험을 설명하기 위해 만들었지만, 이 구조는 디지털 기기에서 동작하는 모든 소프트웨어 디자인에 적용할 수 있습니다.
구조적인 측면에서 소프트웨어는 크게 정보 중심의 제품과 작업 중심의 제품으로 나눌 수 있습니다.
정보 중심 제품은 목적이 정보 자체를 전달하는 것입니다. 이때 제품에 중요한 점은 다양한 정보를 빠르고 정확하게 전달하는 것입니다. 그래서 사용자들이 어떤 정보를 원하는지에 대한 요구사항을 수집하고, 정보를 어떻게 구성할지 결정하는 정보 구조(Information Architecture) 설계가 중요합니다. 정보 구조를 만든 다음에는 그 정보에 접근하는 길을 설계하는 내비게이션 디자인이 중요해집니다.
작업 중심 제품은 정보의 전달보다는 특정한 작업을 처리하는 것이 중요한 제품입니다. 정보 중심의 제품은 각 정보를 이해하기 쉽게 나열하고 이를 서로 잘 연결하는 것이 중요하지만, 작업 중심의 제품은 다양한 인터랙션을 어떻게 효율적이고 사용하기 쉽게 설계할 것인지가 중요합니다. 또한, 정보 중심 제품에서는 제품의 콘텐츠 요구사항이 중요하지만, 작업 중심 제품은 사용자가 필요로 하는 기능 요구사항을 찾고 설계된 기능을 자연스럽게 사용할 수 있는지 파악하는 것이 중요합니다.
그림의 아래에 있는 전략과 범위 계층은 추상적이고 개념적인 정의를 내리는 계층이고, 그 위에 있는 구조, 윤곽, 표면 계층으로 갈수록 점점 더 구체적인 실체를 만드는 계층입니다. 표면 계층에서 이루어지는 비주얼 디자인은 이전 설계 단계에서 정의된 내용을 시각 디자이너가 시각적으로 디자인하는 단계입니다.
5계층별 설계 요소
각각의 계층에서 정의되고 설계되는 요소는 다음과 같습니다.
- 표면 (Surface): 이미지와 텍스트 등 전체 요소 배치, 시각적 마무리
- 윤곽 (Skeleton): 버튼과 탭, 이미지, 텍스트 블록 등에 대한 배치
- 구조 (Structure): 인터페이스의 추상적인 구조와 형태를 정의
- 범위 (Scope): 제품에 제공할 기능, 작업, 콘텐츠의 범위를 정의
- 전략 (Strategy): 제품을 만들 때 사업자와 사용자가 추구하는 목표 정의
계층별로 정의되고 설계되는 내용을 좀 더 자세히 살펴보겠습니다. 소프트웨어의 사용자 경험은 작업 중심 제품과 정보 중심 제품에서 차이가 납니다. 전략 계층에서 고려되는 사용자 요구와 사이트 목표는 제품 형태와 상관없이 공통으로 중요한 요소입니다. 이후의 범위, 구조, 윤곽 계층에서는 제품의 형태에 따라 중요한 요소에 차이가 생깁니다. 작업 중심 제품은 기능 요구사항, 인터랙션 디자인, 인터페이스 디자인이 더 중요하고, 정보 중심 제품은 그보다 콘텐츠 요구사항, 정보 구조, 내비게이션 디자인을 중요하게 고려해야 합니다.
하나의 제품을 만들기 위해서는 5계층의 다양한 요소를 잘 조화시켜야 합니다. 일반적인 디지털 기기는 정보 전달 목적과 작업 수행 목적을 동시에 가지므로, 설계를 할 때도 한쪽에만 치우치지 않고 전체적으로 조화롭게 제품을 설계해야 합니다.
사용자 경험 5계층별 설계 요소 상세
표면 (Surface Plane)
- 비주얼 디자인 (공통)
- 인터페이스 요소의 시각적인 배치를 담당합니다.
- 주요 요소에 대한 시각적인 강조로 시선을 유도하고, 통일성과 일관성을 유지합니다.
윤곽 (Skeleton Plane)
- 인터페이스 디자인 (작업 중심 제품)
- 인터페이스 요소와 GUI 구성 요소를 배치합니다.
- 버튼, 선택, 입력 필드 등 인터페이스 요소의 일관된 사용을 보장합니다.
- 내비게이션 디자인 (정보 중심 제품)
- 정보를 편리하게 찾을 수 있도록 인터페이스 요소를 배치합니다.
- 전역, 지역, 보조 내비게이션을 설계하여 사이트 길 찾기의 기본 구조를 제공합니다.
- 인포메이션 디자인 (공통)
- 사용자의 이해를 돕기 위해 콘텐츠 요소를 배치합니다.
- 의미에 맞게 콘텐츠를 그룹화하고, 사용자 사고방식을 배치에 반영합니다.
구조 (Structure Plane)
- 인터랙션 디자인 (작업 중심 제품)
- 기능 요구사항의 세부 작업에 대한 동작을 설계합니다.
- 작업을 수행하고 완료하는 과정에 대한 패턴과 순서를 정의합니다.
- 인포메이션 아키텍처 (정보 중심 제품)
- 원하는 콘텐츠를 편리하게 이용할 수 있게 콘텐츠 공간을 설계합니다.
- 정보를 전달하는 과정과 관련된 패턴과 순서를 정의합니다.
범위 (Scope Plane)
- 기능 요구사항 (작업 중심 제품)
- 사용자 요구사항을 충족시키기 위해 필요한 기능 범위를 정의합니다.
- 각 기능에 대한 세부 작업과 스펙을 정리합니다.
- 콘텐츠 요구사항 (정보 중심 제품)
- 사용자 요구사항을 충족시키기 위해 필요한 콘텐츠 범위를 정의합니다.
- 제공할 콘텐츠의 범위, 형태, 작성 프로세스 및 관리 주체 등을 정의합니다.
전략 (Strategy Plane)
- 사용자 요구 (공통)
- 제품이 사용자에게 제공할 가치를 정의합니다.
- 사용자 리서치와 자료 분석을 통해 사용자의 요구사항을 파악합니다.
- 제품 목표 (공통)
- 제품이 추구하는 사업적 가치와 전략적 목표를 정의합니다.
- 제품의 성격, 제공할 경험의 형태, 수익 구조 등을 정의합니다.
표 1-3. 소프트웨어 사용자 경험의 5계층에서 설계되는 요소 – 표면, 윤곽 계층은 눈에 보이며 구조, 범위, 전략 계층은 눈에 보이지 않습니다.