오늘 한일
-디자인 카타
-개인과제 진행
-피그마 AI 특강 참여
내일 할일
-개인 과제 진행피그마 AI 특강 내용 정리
프로토타입 배워야 하는 이유
- 채용공고 우대사항 명시
피그마, 어도비, 프로토타입(하이파이)을 원하는 기업 많음 - 프로토타입을 할줄 안다→행동을 설게할줄 아는 것(과정 설계)
- 실무-비용 절감을 위해→사용성과 니즈를 디자이너 한명으로 빠르게 검증 가능함
프로토타입
→한번의 프로토타입은 천번의 회의보다 낫다
- 단순한 시각적 도구X, 발견 도구
성공적인 제품을 발견하도록 돕는 것(해결할 가치가 있는 문제를 찾고
만들 가치가 있는 솔루션을 찾는)
프로토타입 역할
- 가치 검증-이 문제가 정말 해결할 가치가 있는지 이 솔류션이 사용자에게 의미 있는지 확인
- 사용성 테스트-실제 사용자 행동 패턴 관찰 및 개선점 도출
- 커뮤니케이션-말이 아닌 경험으로 아이디어 전달
3가지 충성도 축
충성도(FIDELITY)
:얼마나 진짜 같은지(경험의 퀄리티)
- 비주얼 충성도:실제처럼 보이고 느껴지는 정도(컬러, 이미지, 타이포그래피 등 포함 정도)
- 행동 충성도:인터렉션과 동작이 실제와 얼마나 비슷한지(애니메이션, 반응성 등)
- 데이터 충성도:실제 데이터와 샘플, 더미 데이터 사용 정도(앱 연걸, 라이브 데이터 연동 등)
※프로토타입은 누구에게, 무엇을 검증하려고 만드는가가 핵심
3가지 축을 독립적으로 조정 가능
복잡도(COMPLEXITY)
:얼마나 많은 기능과 상호작용을 포함하는지
GENERAL 프로토타입
- 클릭과 연결만으로 단순하게 구성된 형태
- 기본적인 화면 전환과 선형적인 플로우
- 기획 초기 단계, 전체적인 흐름 파악, 아이디어 검증
- 빠른 제작, 쉬운 수정, 핵심 흐름 검증 가능
ADVANCED 프로토타입
- 조건, 변수, 분기 같은 요소를 활용해 구성된 형태
- 복잡한 상호작용, 다양한 예외 상황, 실제 데이터 연동
- 사용성 태스트, 개발 직전 검증, 투자자 프레젠테이션
- 실제 서비스와 유사한 경험, 세밀한 사용성 테스트가능
사용성 테스트→ADVANCED 프로토타입 사용(실제 사용자는 해피패스로만 가지 X)
기획, 회의, 미팅→GENERAL 프로토타입 사용(방향이 많이 변하기에)
※어디서 어디가지 어떤 기능을 얼만큼 넣을건지 기준을 잡기 위해서 프로토타입 설정 필요
어떻게 설계할 것인가
보통은 시각적인 화면(점)에 집중
- 사고방식 전환→점이 아닌 선으로 생각하기
TASK FLOW
:가장 작고, 가장 구체적인 흐름, 사용자가 하나의 명확한 과업을 완수하기 위한
- 단순하고 직선적인 경로
- 단일 기능, 단일 목표
- 분기점 없음(직선 경로)
- 핵심은 시작과 끝이 명확한 하나의 행동 유도
예시-로그인하기, 장바구니에 상품 넣기
USER FLOW
:특정 과업의 전체적인 여정을 보여주는 경로, 사용자가 서비스의 들어와 특정 목표를 달성하기까지의
전체적인 여정을 보여줌, 여러 형태의 경로 존재
- 서비스 내 특정 과업의 전체 여정
- 분기점 있음(사옹자 선택에 따라 경로가 나뉨)
- 핵심은 여러가지의 테스크 플로우가 연결된 형태
예시-광고 클릭→앱 접속→상품 탐색→구매 완료
WIRE FLOW
: 추상적인 흐름 위의 구체적인 화면 구조를 결합한 형태
- 유저 플로우+화면 구조&테스크 플로우+화면구조
- 분기점 있을 수도 없을 수도 있음
- 핵심은 흐름이 보이는 와이어프레임 또는 화면이 있는 플로우 지도
결과물-개발자가 이 버튼을 누루면 화면이 나오는구나 바로 이해 가능
위의 플로우들은 →제품 안에서의 행동에 집중
USER JOURNEY MAP
:가장 넓은 범위를 다루는 경험 지도
서비스 안에서의 행동뿐만 아니라 서비스를 사용하기 전후의 모든 상황, 감정, 생각까지 총망라
- 제품 안+제품 밖(사용 전후 맥락)
- 핵심은 터치 포인트, 행동, 생각, 감정 등을 시간순으로 기록
결과물-사용자의 페인 포인트 제품 개선 기회 발견
→제품 밖의 맥락, 감정까지 포함
기획 초기→유저 플로우로 전체 구조 잡기
사용자 분석→테스크 플로우로 사용자의 행동 파악
개발 핸드오프→와이어 플로우로 스펙 전달
서비스 개선→유저저니맵으로 페인 포인트 발굴
UXUI 도전!!!