6/13 UX전략과 UI설계방법론 (feat. 스토리보드)
어피니티 다이어그램
방대한 데이터 사이에서 의미있는 데이터를 발견하는 그룹핑 기법
- 리서치를 통해 수집된 데이터를 분류하고 정리하는 데에 사용됨
→ 공통의 이슈, 주제, 고객의 문제와 니즈를 한 눈에 파악할 수 있다.
페르소나
인터뷰, 설문 등 사용자 연구를 통해 얻어진 데이터를 기반으로 대상 사용자 층을 대표하는 가상의 인물 → 사용자 니즈에 맞는 최적화된 사용자 경험 구축
- 실무에서는 안 쓰는 경우가 많다.
사용자 페르소나 5단계
UX를 위한 페르소나 만들기
사용자 조사 → 조사결과 분석 → 페르소나 개수 결정 → 페르소나 묘사 → 페르소나 시각화
√ 1~4개 페르소나
√ 주요/보조 페르소나
- 사진, 라이프스타일(시나리오), 이름, 나이, 지역, 직업, 성격, 학력, 특징, etc.
* 딱 보자마자 뭘 하고자 하는 사람인지 알 수 있도록 사진 등이 직관적이고 깔끔한 느낌이 있어야함.
저니 맵
사용자가 목적을 달성하기 위해 행하는 과정을 시각화한 것
기능별 행동에 대한 만족도로 문제점 도출
UX전략 도출
비즈니스 전략(경쟁분석/영업기회/사례분석)과 UX디자인(사용자조사/디자인트랜드/새로운경험과니즈)을 모두 고려하여 UX 전략을 짜야함
UX전략 수립 단계
문제 파악 → 인사이트 → 가치 도출 → 포지셔닝 → 컨셉 도출 → 아이디어 도출
UI 설계 방법론
메뉴설계 → 이용자 흐름 설계 → 정보구조설계(IA) → 화면 설계 → 디자인 컨셉 도출 및 디자인
메뉴설계
서비스의 전체 구성을 한눈에 볼 수 있도록 메뉴트리 구성
√ 핵심 서비스가 잘 드러나도록 구성
√ 메뉴를 통한 서비스 정체성 부여
* 처음에는 손으로 그려놓고 나중에 툴로 그리는 것이 중요.
이용자 흐름 설계(Flow Chart)
사이트 전체의 흐름에 따라 데이터를 어떻게 처리하는지 기호나 도형을 통해 보여준다
와이어프레임
UX설계 작업을 기반으로 각 페이지와 기능 간의 관계와 구조를 정의하고 콘텐츠 및 레이아웃을 시각화 하는 작업
* IA를 보면서 이미지와 색상을 넣지 않고 회색 베이스로 디자인.
ex) 제목을 두 줄까지 노출할건지, 어쩔건지를 기획자가 결정
스토리보드
와이어프레임, 콘텐츠, 기능 정의, 프로세스, DB연동, 정책 등 서비스 구축을 위한 모든 정보를 작성하는 문서