[PM교육] UX/UI 디자인 기초 이론 (1)

[ UX/UI 디자인 기초 이론 (1) ]

 

1. 디자인이란?

  디자인은 과거에는 심미적이고 형태적인 아름다움을 설계하는 일이었다면, 오늘날에는 제품과 서비스를 통해 사용자가 기쁨을 느끼고 그 이상의 의미까지 가질 수 있도록 설계하는 일을 통칭한다. 

 

 

2. UX/UI

  UX/UI는 요즘 너무나 많이 언급되는 용어이기 때문에 한번쯤은 모두 들어봤을 것이다. UX와 UI를 합쳐 UX/UI라고 부르지만, UX와 UI에는 차이가 존재한다. 간단하게 정리해서 보자면 아래와 같다. 

• UI(User Interface) = 사용자 인터페이스 
• UX(User eXperience) = 사용자 경험

1. Surface (= 비주얼 디자인 )	- GUI, 그래픽 등 시각적 경험을 전달하는 영역, 시각적인 형태, 색체, 표현방법 등 반영
2. Skeleton (= 구성, 배치, 형태, 상호작용)	- 사용자에게 내용을 전달하는 정적인 경험과 사용자의 행동을 유도하는 동적 경험 - 와이어프레임, 인터랙션 디자인, 프로토타이핑 등
3. Structure (= 구조, 흐름)	- 사용자에게 전달하는 정보 구조,  프로세스, 탐색방법 등 설계 - IA, 유저 플로우 등
4. Scope (=내용)	- 사용자에게 전달된 내용 그 자체 - 서비스 콘텐츠
5. Strategy (=콘텐츠 및 전략)	- 특정한 사용자 경험 시스템의 근거, 시장 조사와 같은 다양한 리서치 기반 - 데스크 리서치, 시장 전략 등

 

 UI,  '사용자 인터페이스'는 사람이 접촉하는 디지털 시스템의 입출력 장치와 그 장치에 표현되는 모든 내용을 의미한다. 그리고 UX, '사용자 경험'은 사용자가 어떤 대상(시스템, 상품, 서비스)를 직간접적으로 이용하면서 느끼고 생각하게 되는 지각 반응(감정, 태도, 행동)의 총제적 경험을 의미한다. 

 

 단순히 개념만을 읽었을때는 두 개념의 차이가 명확하지 않다. UX와 UI의 차이에 대해 가장 명확하게 보여주는 이미지로 '빙산의 일각'이 가장 많이 언급되어진다. UI는 빙산의 일각(Surface, Skeleton)이고, UX는 보이지 않는 빙산의 영역(Structure, Scope, Strategies)으로 비유가 되어진다.

 

 

3. 인터렉션(Interaction)

  UX/UI을 이해하기 위해 추가적으로 등장하는 개념인 인터렉션이 있다.  인터렉션은 입출력 장치를 매개로 디지털 시스템과 사람이 주고 받는 일련의 의사소통 과정이며 UX/UI 디자인에서 인터렉션은 사용자에게 최적의 경험을 제공하는 기본 단위이다. 가장 기본은 인터페이스(UI)이며 그 위에 인터렉션이 제공이 되고, 그 위에 경험(UX)를 축적시킬 수가 있다. 사용자와 컴퓨터로 바라본 인터렉션은 아래와 같다. 

 

 

  그림에서 인터렉션을 포함하고 있는 인터페이스는 서로 다른 두 시스템이나 장치 또는 소프트웨어 등을 이어주는 접속 장치이다. 쉽게 말해 두 대상을 이어주는 매개체라 할 수 있다. 여기서 매개체는 크게 입력(Input)과 출력(Output)으로 구성이 되어진다. 입력은 한쪽 장치가 다른 쪽에 정보를 전달하는 것이고, 출력은 전달된 정보를 다른 장치가 받아들이는 과정이라고 할 수 있다.

  인터페이스는 연결하는 대상에 따라 크게 하드웨어 인터페이스 , 소프트웨어 인터페이스, 사용자 인터페이스로 구분할 수 있다. 여기서 언급되어지는 사용자 인터페이스가 UI(User Interface)이다.

 

 

4. UI의 이해

(1) UI의 종류

   UI는 UI 명령어를 텍스트로 조작하는 CLI, 그래픽 환경을 기반으로 마우스를 이용해 조작하는 GUL, 사람의 말과 행동으로 기기를 조작하는 NUI, 사물 인터넷의 발전과 함께 대두되고 있는 OUI로 분류할 수 있다. 

• CLI(Command Line Inteface) : 텍스트 기반 인터페이스로 단일 명령어를 입력하면 컴퓨터가 수신하고 같은 방식으로 프롬프트에 응답하는 구조
• GUI(Graphical User Interface) : 이미지, 그림, 색상 조합을 통해 수행 작업과 비슷한 결과를 컴퓨터 화면에 표시함으로써 사용자가 직관적으로 인식하도록 운영       
• NUI(Natural User Interface) : 사람과 컴퓨터의 상호작용을 위한 시스템으로, 사용자의 일상적 행동과 관련된 직관적인 동작을 통해 작동 
•  OUI(Organic User Interface) : 모든 자연 상태에서 발견할 수 있는 형태, 변형, 유연, 진화 등의 특성을 반영한 UI로, 모든 사물을 입출력 장치로 변환할 수 있고, 상태도 자유롭게 변형이 가능 

 

 

5. UX의 이해

(1) UX의 특성 

1. 주관성(Subjectivity)
   :인간의 경험은 개인적, 신체적, 문화적 특성에 따라 주관적이므로 동일한 제품이나 서비스도 사람마다 전혀 다르게 느낄 수 있음
2. 총체성(Holistic)
   :사용자 경험은 제품이나 서비스를 경험하는 시점에서 개인이 느끼는 모든 심리적, 감정적 결과를 의미하며 제품이나 서비스의 성공과 실패를 결정
3. 문맥성(Contextuality)
   : 사용자 경험은 그 사용자와 제품, 서비스 또는 그 밖에 있는 환경이나 맥락의 영향을 받을 수 있음 

 

 

(2) 어떤 디자인이 더 좋은 UX디자인인가?

 

"  두 리모콘 중 어떤 디자인이 더 좋은 UX 디자인일까?? "

 

정답은 사용자(User)를 누구로 두냐에 따라 다르다. 자칫 복잡한 왼쪽 리모콘의 UX가 나쁘다고 생각할수도 있지만, 복잡한 것이 나쁘다고 생각해서는 안된다. 만약 사용자가 단순한 기능보다 다양한 기능을 원한다면 오히려 단순한 리모콘보다 복잡한 리모콘이 더욱 좋은 사용자 경험을 제공할 수 있다.

 

인지 심리학의 대가, 도널드 노먼은  "복잡함"과 "혼란스러움"의 차이에 대해 명확히 인지해야한다고 했다 . 복잡함(Complexity)은 실재의 상태이고, 혼란스러움(Complicated)은 마음의 상태이다.  다른 예시로 비행기 조종실을 생각해보자. 일반 사람들에게 비행기의 조종실이란 심하게 혼란스럽고 어려운 공간이다. 하지만 조종사들은 그렇게 생각하지 않는다. 그들에겐 모든 기기들이 알맞은 자리에 정리되어있어 이해하기 쉽고 논리적이고 작동하기 편리하다. 즉, 비행을 하기위해 적절한 복잡함인 셈이다. 적절한 복잡함은 오히려 풍부하고 만족스러운 삶을 제공한다. 

 

 

(3) 좋은 디자인이란?

 도널드 노먼의 Emotinal Design에서는 사람의 마음을 움직이는 좋은 디자인을 이해하기 위해서 크게 세 가지 디자인을 이야기 한다. 

1. 본능적 디자인
   : 인간의 감각과 감성적인 측면에서 초첨을 맞춘 디자인
2. 행동적 디자인
   : 제품이 얼마나 기능을 잘 수행하는지, 제품의 유용성과 관련된 디자인
3. 반성적 디자인 
   : 제품과 사용자 간 개인적 관계를 형성하여 가치를 부여하는 디자인 

 

 

6. 좋은 UX 디자인을 위한 사용자 경험의 7가지 원칙 

 그럼 과연 어떤 UX가 좋은 디자인인지 어떻게 판단해야할까? 디자이너 피터 모빌(Peter Morvile)이 발견한 UX 7가지 핵심 원칙을 통해 좋은 디자인인지에 대해 생각해볼 수 있다.  

• 유용성 : 목적 달성에 부합한가
• 사용성 : 직관적이고 효율적인가 ( 초보자도 사용이 가능한가, 높은 연령대도 반복적으로 쉽게 사용이 가능한가)
• 검색성 : 목적을 찾기 쉬운가 
• 신뢰성 : 이미지, 문구(UX Writing), 예측가능성(멘탈 모델)
• 매력성 : 브랜딩/심미성
• 접근성 : 모두가 사용 가능한가 (웹 접근성과 관련)
• 가치성 : 경쟁력이 있는가