본문 바로가기

UI개발

UX/UI 기획을 위한 제반 이론

사용자 경험의  개념과 이해

 

1. 사용자 경험의 정의와 중요성


사용자 경험이란?
그 경험의 작용 대상과 인간의 반응으로 이해한다.

사전적 정의 : 
사용자 경험 (User Experience, UX)은 사용자가 어떤 시스템, 제품, 서비스를 직간접적으로 이용하면서 느끼고 생각하게 되는 지가고가 반응, 행동 등의 총체적 경험을 말한다.

UX 대상과 사용자의 지각과 반응
사용자는 경험의 대상(제품, 시스템, 서비스, 회사, 브랜드 등)과 지각 반응(감정, 태도, 행동의 총합)을 통합적으로 인지하고, 구매와 지속적 사용행위를 하게 된다.

 

UX 이해의 복잡성

주관성 (subjectivity) :
인간의 경험은 그 사람의 개인적, 신체적, 인지적 특성에 따라 주관적이다.

맥락성 (contextuality) :
사용자 경험이 일어나는 상황적 외적 환경에 영향을 받는다.

총체성 (holistic) :
경험 시점에서 개인이 느끼는 총체적인 심리적, 감성적 결과이다.

 

2. UX에 대한 이해와 관점

인지적 관점 (Cognitive) :
인간의 기억과 생각하는 구조의 이해
인간이 어떻게 하나의 정보를 받아들여 인지하고 처리하는가

사용자 맥락과 상황 (Context) :
경험 발생 상황과 외적 영향 
사용자는 컨텍스트의 영향으로 외부환경에 어떤 관계적 경험을 형성하게 되는가

감각과 감성 (Emotion) :
역동적이고 다면적인 감각능려고가 경험 발생 시점에서의 심리적 상태와 변화의 이해
어떻게 느끼는가

사용자 행위 (Behavior) :
제품, 서비스 경험의 물리적, 인지적, 사회문화적 현상의 해석과 상호작용
어떻게 행동하는가

사용자 경험(UX)의 영역
사용자 경험은 특정 영역을 갖기보다 기존의 다양한 분야와 결합되는 새로운 틀을 제공하는 접근으로 확장되고 있다.
단순하게 인터페이스만이 아니라, 제품, 시스템, 서비스, 회사 등 사용자가 특정 포인트를 중심으로 경험할 수 있는 대상이 확장된다.

사용자 경험(UX)의 중요성
사용자를 이해하고 공감하기 위한 사고방식. UX는 서비스에 내재되어 있는 개념이 아니라 사용자에 귀속된 개념으로 이해한다.
특정한 경험을 할 수 있도록 기회를 제공할 수 있어야 한다.

 

3. 사용자 경험 요소


사용자 (User)
어떤 목표와 의도를 가지고 컴퓨터나 기기 등을 사용하여 능동적이고 가변적인 욕구를 가지는 주체이다.

사용자 경험의 기본 요소
니즈 (Needs) :
UX 대상으로부터 특정한 만족감을 얻으려는 사용자들의 기대

동기 (Motives) :
사용자들의 행동을 불러일으키는 직접적인 발화제

태도 (Attitudes) :
UX 대상에 대해 갖는 개인의 취향과 선호, 선험적인 믿음과 정보

행위 (Behavior) :
UX 대상을 사용하는 과정에서 드러나는 반복적인 행동 패턴

 

모바일앱 환경 특성의 이해

모바일앱의 종류와 특성

네이티브앱

모바일 OS 제조사에서 제공하는 개발언어를 이용하여 각각의 고유 모바일 OS에서만 동작되는 앱

(자바 안드로이드앱, C언어 아이폰앱)

 

장점 :

빠른 구동속도

다양한 기능 구현 가능

인터렉티브한 사용자 환경 제공 가능

 

단점 :

업데이트 및 수정이 어려움

동일한 앱을 다양한 플랫폼에서 출시시 많은 시간이 소요됨

 

모바일 웹

모바일에 최적화된 웹사이트

디바이스 별 별도의 개발 방식이 필요하지 않으며, 인터넷에 접속이 가능하면 어떤 디바이스로도 접속 가능.

 

장점 :

플랫폼 및 기기에 상관없이 대부분 모바일기기 브라우저에서 볼 수 있음.

업데이트 및 수정이 용이함

 

단점 :

앱스토어 등록x

인터넷 연결이 되지 않으면 사용할 수 없음.

하이브리드앱

모바일웹의 웹기능과 앱의 어플 기능을 접목시킨 형태. 네이티브앱과 모바일웹의 장점을 혼합한 앱.

네이티브앱의 형태를 띄고 있어 앱스토어에서 다운받아 모바일에 설치할 수 있다.

 

장점 :

네이티브 앱의 빠른 속도와 모바일 웹이 가지는 개발의 용이성을 둘 다 취할 수 있음

빠른 업데이트 적용.

 

단점 :

인터넷 환경에 따라 일부 기능 작동 되지 않음

네트워크 상태에 따라 속도의 영향을 받음.

 

모바일 사용자 행태적 속성

편재성 : 

어디서든 정보검색과 통신이 가능한 이동성을 구현해 공간의 제약을 해소.

 

즉시연결성 :

언제 어디서나 사용자가 원하는 즉시, 해당 정보검색과 통신이 가능.

 

개인화 : 

사용자 개인의 선호와 취향 등 개인 특성에 맞춘 콘텐츠 및 보안 인증 제공.

 

위치기반 : 

사용자의 현재 위치를 파악하여 주변 정보 제공이 가능.

 

모바일 사용자 경험의 주요 특징

단순 간결한 경험 선호 :

직관적인 UX요소들의 중요성이 PC의 비해 상대적으로 강함.

정보에 대한 복잡한 선택 상황을 꺼려함.

 

소통에 개방적, 현재 주변 환경과 교감 :

정보의 선택, 공유, 평가, 저장, 편집 등에 적합한 경험이 형성.

이동성과 위치 기반 특성으로 내 주변 상황에 민감함.

 

새로운 형태의 UX에 비교적 쉽게 적응 :

이미 학습된 모바일 환경에 새로운 기능과 서비스를 배우는데 쉽게 적응.

새로운 기능, 서비스 경험을 하고자하는 기대 형성

 

새로운 정보제공이나 추천 서비스에 개방적 :

모바일 기기와의 상호작용 시간이 길고, 양방향 인터렉션 경험에 익숙함.

OS별 앱 업데이트에 익숙함.

사용자가 원하는 정보가 사용자 상황에 맞게 제공되는 방식에 익숙함.

 

모바일 UX 특성을 반영한 UI 설계 시 주안점

사용하기 쉬운 사용자 인터페이스 - 사용자의 목표를 달성하기 위해 제공된 인터페이스가 얼마나 쉬운가?

유용한 기능과 컨텐츠 - 필요한 기능과 컨텐츠인가?

접근성 - 언어적 다양성, 나이, 성별의 국하지 않고 누구나 쉽게 접근할 수 있는가?

정보 탐색 경로(네비게이션)의 일반화 - 정보와 기능을 쉽게 찾을 수 있게 UI 설계되었는가?

 

사용자 인터페이스(UI)의 개념과 이해

사용자 인터페이스란?

사용자와 컴퓨터, 시스템, 기기, 도구 등 그 사이에서 의사소통을 할 수 있도록 만들어진 매개체를 뜻한다.

디스플레이 화면, 키보드, 마우스, 문자, 아이콘, 도움말 등 사용자들과 상호 작용을 하도록 설계된 모든 정보 관련 고안품을 포함, 상호 작용을 초래하거나 그것에 반응하는 방법 등을 의미.

 

사용자 인터페이스의 목적

사용성 (주된 목적)

심리학과 생리학에 기반하여, 사용자가 필요로 하는 요소를 쉽게 찾고 사용하며 그 요소로부터 명확하게 의도한 결과를 쉽게 얻어 낼 수 있어야 한다.

 

상호작용 수단과 방식을 제공

입력 : 시스템을 조작할 수 있게 한다.

출력 : 시스템이 이용한 것에 대한 결과를 표시한다.

 

사용자 인터페이스의 구분

CUI (Character based UI) :

문자방식의 명령어 입력 사용 인터페이스

 

GUI (Graphic UI) :

그래픽 환경 기반의 마우스 입력 사용자 인터페이스

 

NUI (Natural UI) :

사용자의 말과 행동 기반 제스쳐 입력 인터페이스

 

사용자 인터페이스 기본 원칙

직관성 :

앱의 구조를 큰 노력 없이 쉽게 이해하고, 쉽게 사용하게 해주는지

 

유효성 :

얼마나 정확하고 완벽하게 사용자의 목표가 달성될 수 있는지

 

학습성 :

초보자와 숙련자 모두가 쉽게 배우고 사용할 수 있게 해주는지

 

유연성 : 

사용자의 인터렉션을 얼마나 포용하고, 실수로부터 방지해주는지

 

사용자인터페이스 설계 지침 10원칙 (한국HCI연구회)

1) 가시성의 원칙 - 주요기능을 노출시켜 최대한 조작이 쉽게 되도록 한다.

2) 조작결과 예측의 원칙 - 사용자가 앱을 조작하여 작동시킨 결과를 조작 부위만 보고도 미리 예측 가능하게 설계해야 한다. 

3) 일관성의 원칙 - 조작방식에 일관성을 제공함으로써 사용자가 쉽게 기억하고 빠르게 적응할 수 있게 한다.

4) 단순성의 원칙 - 앱의 기능구조를 단순화 시켜 조작에 요구되는 노력을 최소화하여 인지적 부담을 줄이게 한다.

5) 지식배분의 원칙 - 기능 조작에 요구되는 지식은 사용자의 지식과 기억 구조에 적합하도록하여 학습하기 쉽고 기억하기 쉽게 상호 보완적으로 분배한다.

6) 조작오류의 원칙 - 발견된 오류는 쉽게 발견될 수 있도록하고, 오류의 수정 또한 최대한 쉽게 이루어져야 한다.

7) 제한사항 선택사용의 원칙 - 앱의 조작 상의 제한사항을 이용하여 가능한 선택의 여지를 줄여 조작방법이 명확하도록 한다.

8) 표준화의 원칙 - 기능구조와 디자인을 표준화하여 한번 학습한 이후 효과적으로 사용할 수 있도록 한다.

9) 행동유도성의 원칙 - 앱의 기능을 어떻게 조작하면 될 것인가에 관한 단서를 제공함으로써 조작의 가능성을 높인다.

10) 접근성의 원칙 - 사용자의 성별, 연령, 인종 등에 따른 다양한 계층의 사용자를 수용할 수 있도록 고려해야 한다.

 

좋은 UI의 특징 및 관련 원칙들

조직성 + 일관성

조직성은 사용자에게 일관성 있는 개념적 구조를 제공

일관성은 사용자가 예측할 수 있는 UI를 반영하여 용이성을 향상

 

간결성 + 명료성

간결성이란 커뮤니케이션을 위해 꼭 필요한 요소만을 디자인.

사용자에게 한 번에 너무 많은 기능을 제공하지 않음.

디자인 된 모든 요소들의 의미가 모호하지 않고 명료해야 함.

 

가독성 + 시인성

너무 많은 버튼이 디스플레이 되거나 너무 복잡한 아이콘은 사용자에게 부담

UI를 바로 보고, 그 의미를 혼동 없이 쉽게 읽고 정확하게 이해할 수 있어야 함.

 

접근성 + 관용성

다양한 사용자 고려. 불특정 다수의 사용자도 시스템 UI에 접근할 수 있도록 하고, 동시에 다양한 사용자의 문화적, 언어적 차별이 없이 사용자 요구를 반영해야 함.

 

메타포 + 피드백

현실세계의 대상물을 메타포로서 인터페이스에 옮겨 놓은 아이콘들은 직관적 사용성에 효과적으로 작용.

메타포 활용은 문화적, 언어적 장벽을 자연스럽게 극복

피드백은 사용 결과와 반응의 대화를 이끌어낸다.

반응은 가능한 즉각적으로 제공하여 시각적, 청각적 신호로 제공

사용자에게 무슨일이 일어나고 있는지를 피드백을 통해 알려주어야 한다.

'UI개발' 카테고리의 다른 글

자바스크립트 객체지향프로그래밍  (0) 2020.08.23
[ES6] 화살표 함수에 없는 것  (0) 2019.09.02
자바스크립트 참조타입  (0) 2017.08.21
자바스크립트 배열  (0) 2017.07.09
자바스크립트 연산자  (0) 2017.06.25