UX/UI 개념 이해
UX (User experience, 사용자 경험)
제품을 사용할 때 서비스를 사용할 때 인터렉션을 하게 되는데 그 과정에서 얻게되는 모든 경험을 UX라고 한다. 디지털 경험 뿐만 아니라 오프라인에서도 경험하는 모든것을 UX라고 한다.
UI (User Interface, 사용자 인터페이스)
유저가 있고 시스템이 있으면 경계면이 있는데 그 경계면에 있는 모든 시각적요소를 뜻한다.
UX디자인은 유저의 관점에서 유저의 문제를 해결하는 것에 집중하고 UI디자인은 시각 언어의 규칙을 만드는 것에 집중한다.
UX/UI 디자인 프로세스
더블 다이아몬드 모형 이해하기
문제를 찾고 문제를 해결하는 두 가지에 초점을 둠
다이아몬드 1 - 해결해야 할 문제 찾기
다이아몬드 2 - 해결책 찾기
다이아몬드1
문제들을 발견하고 어떤 문제를 해결할 것인지 정의하는 단계
발견 - 어떤것이 문제이고 왜 문제인지 이해하는 단계
유저 리서치를 진행하고 이 과정에서 문제가 여러개 발견 될 수 있다.
유저리서치(데스크리서치, 필드 리서치)
정의 - 어떤 문제에 집중할지 정의하는 단계
유저리서치 결과물을 분석하고 정리하며 어떤 문제에 집중할지 논리를 정립함
어피니티 다이어그램, 유저 페르소나작성 등
다이아몬드2
문제를 해결할 여러 아이디어를 발전시키고 구현하여 최종적으로 유저에게 제공하는 단계
발전 - 문제해결을 위해 여러 아이데이션을 진행
제한을 두기보단 다양한 방향성을 열어두고 고민하는 것이 중요
정보구조도, 와이어프레임
전달 - 디자인을 최종적으로 구현해서 유저에게 전달하는 단계
프로토타입을 제작 후 사용성을 테스트 해보면서 개선을 거듭
최종 프로토타입, 사용성 테스트
디자인씽킹과 더블 다이아몬드 모형 모두 UXUI 디자인 프로세스에 속한다.
더블 다이아몬드 모형의 4가지 핵심 원칙
- 유저와 유저 니즈를 이해하는 것에서 시작하기
- 문제와 아이디어에 대해 구성원들과 얼라인하기
- 구성원들과 협업하고 공동 작업하기
- 이터레이션을 통해 에러와 리스크 일찍 발견하기
문제 해결자들이 유저를 우선으로 고려하면서 시각적이고 포용적인 소통을 기반으로 협력과 공동작업을 진행하고 이터레이션을 통해 반복적으로 개선할 것을 강조하고 있다.
더블다이아몬드 모형에 오해와 한계
오해
선형적인 프로세스라는 오해 - 4단계까지 마치면 끝나는 것이 아니다. (왔다갔다)
한계
모든 디자인 프로세스를 설명하지 못 한다.
복잡한 프로젝트나 대규모 서비스에서는 한계가 있다.
Lean UX와 MVP
Lean = 기름기 없이 쫙 빠진
군더더기 없이 효율적인 프로세스
가설을 설정하고 그 가설을 검증하기 위해서 유저 피드백을 데이터로 측정을 해서 반복적으로 디자인을 개선하는 것이 주요 프로세스
Lean UX 프로세스가 널리 활용되는 이유
클라우드의 발전으로 실시간으로 협업이 활발해짐
분석 툴의 발전으로 데이터를 통해 임펙트를 보기 용이해짐
치열한 시장 경쟁에서 생존에 적합함
MVP
최소한의 기능을 갖춘 제품 또는 서비스
초기 아이디어나 가설을 검증함
케이스 스터디
에어비엔비 -
아마존 -
심화학습
+오즈의 마법사 기법, 페이크 도어 테스트
데이터 드리븐 UX 트렌드
데이터 드리븐 UX 등장 배경과 중요성
등장배경
직관과 추측에 의존해서 제품을 만들어냄 - 데이터 기반 가설 설정, 검증
제품을 만들기까지 많은 시간과 돈이 듬 - MVP통해 빠르게 시장에 내놓고 유저 데이터를 살펴서 꾸준히 개선하는 것이 효율적
정성적 리서치 같은 경우 소수를 대상으로 딥다이브 하는 기법이기에 다수의 유저를 커버하기에 한계가 있음 - 실제 행동 데이터 기반으로 유저들이 어떻게 행동하는지 정량적 리서치를 선호하게 됨
빠르게 변화하는 시장속에서 효율적으로 제품을 개선하는 방법이 뭐가 있을까? 하다가 데이터 기반으로 의사결정을 해서 사용자 경험을 개선하는 것이 효율적을 수 있겠다 하는 아이디어에서 등장했다.
중요성
단순히 디자이너가 작업할 때 뿐만 아니라 다른사람과 협업을 할 때, 산출물의 임펙트를 측정할 때도 중요한 역할을 한다.
디자이너 관점 - 데이터 기반을 해석하고 이를 바탕으로 디자인 산출물에 논리적인 근거를 제공할 수 있음
커뮤니케이션 관점 - 데이터가 타 조직과 의사소통을 할 때 공용으로 사용
비즈니스 관점 - 내가 열심히 만든 디자인 산출물에 기여도를 측정할 수 있음
데이터 드리븐 UX에서 활용되는 지표 예시
유저 관여도 관점 (Engagement) - DAU(일간 활성화 유저수), WAU(주간 활성화 유저수), MAU(월간 활성화 유저수)
유저 재방문 관점 (Retention) - 코호트 리텐션(특정한 특성이 있는 유저들을 묶어서 기간별로 재방문하는지를 트레킹 하는 지표), Day N 리텐션(N일째 된 유저들이 재방문 하는가)
유저 획득 관점 - 페이지 뷰 수, 클릭 뷰 수, 전환율, 이탈율
케이스 스터디
여기어때 -
코드아카데미 -
실무 UX/UI 용어
디자인 관련 용어
시각적 계층 구조 (Visual Hierarchy) - 중요한 순서에 따라 시선의 흐름이 이동하도록 디자인하는 것
와이어프레임 (Wireframe) - 화면의 인터페이스를 단순한 선과 도형으로 표현한 것
프로토타입 (Prototype) - 제품이나 서비스의 초기 버전으로, 아이디어를 시각적으로 보여주고 테스트하는 모델
정보 구조도 (Information Architecture; IA) - 제품이나 서비스를 구성하는 요소들의 구조를 도식화하는 것으로, 유저가 길을 잃지 않고 원하는 정보를 쉽게 찾고 작업을 완료할 수 있도록 돕는 과정
피델리티 (Fidelity) - 디자인 또는 프로토타입의 디테일 및 정확성 수준으로 Lo-fi는 낮은 피델리티, Hi-fi는 높은 피델리티를 가짐
CTA (Call To Action) - 사용자에게 원하는 동작을 취하도록 유도하기 위해 설계된 디자인 요소나 텍스트
모크업 (Mockup) - 정적인 형태로 디자인된 인터페이스나 레이아웃을 보여주는 이미지나 모형
인지 심리 관련 용어
인지 부하 (Cognitive Load) - 정보를 이해하고 처리하는 데 필요한 정신적 노력의 양
멘탈 모델 (Mental Model) - 유저가 시스템이나 서비스를 어떻게 이해하고 예측하는지를 나타내는 개념
어포던스 (Affordance) - 디자인 요소가 유저에게 어떤 동작을 할 수 있는 단서나 힌트를 제공하는 원리
게슈탈트 원리 (Gestalt Principles) - 사람이 이미지를 인식할 때 주변에 있는 요소 간의 관계와 맥락에 영향을 받는다는 이론
힉의 법칙 (Hick’s Law) - 선택할 수 있는 옵션 수가 늘어날수록 결정 시간이 증가하는 원리
피츠의 법칙 (Fitts’ Law) - 대상까지의 거리와 크기에 따라 상호작용 시간이 달라지는 원리
제이콥의 법칙 (Jacob’s Law) - 유저가 과거 경험을 토대로 익숙한 디자인 패턴을 기대하는 원리
개발 관련 용어
서버 (Server) - 정보와 서비스를 제공하는 소프트웨어로, 웹사이트나 앱의 데이터를 저장하고 제공함
클라이언트 (Client) - 서버로부터 정보를 요청하고 받아오는 디바이스나 소프트웨어로, 웹 브라우저나 모바일 앱과 같은 유저가 상호작용하는 부분을 가리킴
접근성 (Accessibility) - 모든 유저, 포괄적으로 장애가 있는 유저를 포함하여, 웹사이트나 앱을 이용할 수 있도록 디자인하고 개발하는 것을 의미함
API (Application Programming Interface) - 서로 다른 소프트웨어 간의 상호작용을 도와주는 인터페이스로, 데이터를 교환하거나 서비스를 활용할 수 있도록 하는 프로그래밍 규칙과 도구의 집합
CMS (Content Management System) - 웹사이트 또는 앱의 콘텐츠를 쉽게 관리하고 업데이트하는 도구 또는 플랫폼
오픈 소스 (Open Source) - 소프트웨어 또는 프로젝트가 무료로 공개되며, 누구나 소스 코드를 확인하고 수정할 수 있는 개발 방식
디버깅 (Debugging) - 소프트웨어 오류를 찾고 수정하는 프로세스로, 프로그램이 예상대로 동작하지 않을 때 문제를 식별하고 해결하기 위해 사용하는 과정
