SlideShare a Scribd company logo
1 of 6
Download to read offline
01-1 UX Actually
UX 진단 및 UX Key-concept 도출
Step 1
User Scenario
사용자 입장에서 use case 작성하고 사용자 이해하기!
사용자가 무엇을 원하고 필요로 하는지에 대해 UX시나리오를 구체화하여, 궁극적으로
제품/서비스 사업아이템이 근본적으로 해결해야 할 사용자 니즈의 본질을 찾는다.
Step 2
UX flow&elements ; UX흐름과 구성요소
경험의 흐름을 파악하고 사용자에게 형성될 UX의 구조와 요소를 이해한다. 제품/서비스의 어떤 요소들이 사용자에게 어떤 유형의 동기로 작용하여 사용자에게서 특정 행동을 이끌어내는지를 파악한다.
Item 당신의 사업모델과 서비스아이템은 무엇인지 간단히 작성해 보시오.
User definition2
어떤 사용자(고객)인지?
사용자의 성격, 선호도, 라이프스타일, 직업, 태도, 가치관 등 목표 사용자 정의
ex) 도시에 거주하며 4세 자녀를 둔 맞벌이, 가사일에 항상 시간이 없는 워킹맘
Needs/Problem3
무엇이 문제인지?
제품/서비스가 해결, 또는 제공하고자 하는 핵심적인 사용자니즈
ex) 해야 할 일을 시간에 구애 받지 않고 실수 없이 처리하고 싶은 니즈
ex) 쇼핑목록 작성과 동시에 구매,결제 서비스
User Task Flow6
기능/서비스 사용방법은?
사용자 니즈를 충족시킬 해당기능을 사용하는 방법, 또는 인터랙션 방식
ex) 쇼핑리스트 작성, 실시간 마트에 전송, 위치기반으로 해당 매대 경로선택
Benefit/Meaning7
사용하는 가장 큰 이유는?
사용자 가치효용 - 만족, 기억, 피드백
ex) 쇼핑리스트 전송과 동시에 결제가능, 줄서서 계산하지 않고 10분만에 쇼핑완료
Human needs set(ERA Model)
* 타킷 사용자에 해당되는 human needs에 체크. 중복가능
제품/서비스를 사용하는 사용자 층의 행동, 라이프스타일, 성향 등의 조사를 통해 해당
제품/서비스에 투영되는 소비자들의 니즈를 발견하고, 목표 사용자 층에 대한 특징을 파악할
수 있다. 이는 향후 제품/서비스 전략 및 디자인개발 전략에 중요한 정보를 제공한다.
Step 3
Human Needs ; 인간근본 욕구분석
당신의 앱서비스 이면에 숨겨진 사용자 니즈의 근본 원인 찾기!
Q. 사용자는 이 앱을 통해 어떤 욕구를 해결할 수 있는가?
Q. 사용자가 이 앱을 사용하는 단 한가지 이유는?
Q. 사용자는 이 앱을 통해 얻을 수 있는 경험적 가치는 무엇인가?
UX design Trigger for STARTUP Team
1
User Identity : 사용자는 어떤 욕구의 소유자인가?(인간 본질적 욕구) WIW : 궁극적으로 사용자가 원하는 기능은 무엇인가?(앱의 Key-function)
Copyright ⓒ2018 POTENTIALEYES Inc. All rights reserved.
ex) 개인 프라이버시에 민감하며, 사회적 소속감을 중시 ex) 자신의 개인정보를 친한 지인과 안전하게 공유할 수 있는 자신만의 접속 방법
기억/태도
Memory & Attitude
결과에 대한 만족 수준의 기억,
다음 행동 영향을 주는 요인
사용자 행동에 대한 어떤 인터렉션/인터페이스가
필요한지 판단하는데 도움이 됨.
사용자 행동이 일어나게 되는 직접적인 이유(목표) 의도/원했던 목표와 결과의 비교평가와
인식한 것에 대한 경험적 해석
사용자 행동
User behavior
기대 결과의 평가/피드백
Evaluation & Feedback
동기/계기(의도)
Motivation & Goal
안전, 보안, 프라이버시
타인들로부터 자신의 안전과 정보의
보안을 유지하려는 욕구 뿐만 아니라,
자신의 감정, 신체 또는 경제적 사안의
노출을 꺼리는 욕구.
개인에게 축적되는 수많은
정보자산(Information property)가치가
확장, 오용되면서 보안과 프라이버시
요구는 높아짐.
Privacy
자기표현, 자아투영, 개성
자신이 속한 사회, 타인과의 관계에
대해 누적된 경험에 대한 자기만의
표현욕구.
선호 브랜드 소유와 공유 등,
자기만의 세계를 적극적으로
드러내려는 욕구
Identity
소속감, 애정, 친화
다른 사람들과 좋은 관계를 유지하려고
노력하며, 특정 소셜 그룹의 소속감을
중시하는 욕구.
긍정적인 사고와 열린 사고로 타인을
자신의 영역에 함께하려는 욕구.
Friendship
심미성, 미적 가치 추구
특정한 관점에서 독특한 미적
욕구를 가지고 있으며, 기능보다는
상징적 또는 주관적인 미적 가치를
성취하려는 욕구.
Beauty
쾌락, 자극, 일탈
일상으로부터의 탈출과 함께
자극적인 것들을 감각적으로
수용하려는 욕구. 특히 인터넷
환경에서의 익명성, 가상세계(Virtual
reality) 속에서 제2의 자아를
드러내려는 욕구.
Hedonism
신뢰, 믿음, 자신감
다른 사람과의 약속을 이행하는데 있어
확신과 믿음을 주려는 욕구.
신뢰가 있는 타인과의 관계가
만들어진다면 뭐든지 잘 할 수 있다는
자신감을 가지려는 욕구.
Confidence
권력, 능력, 관심, 신분, 주목
높은 권력욕구를 가지고 리더로써 남을
통제하며, 남들로 하여금 자신이
비교우의에 있고자 하는 욕구.
Power
탐구, 호기심, 진리
모호하거나 잘 알지 못하는 외부
환경에 대해 알려고 노력하는 욕구.
스스로의 호기심, 알고자 하는
대상에 대한 명쾌한 해결 능력을
성공적으로 발휘함으로써 자긍심을
높이려는 욕구.
Explore
모험, 프론티어
도전의식이 투철하고, 미지의
세상에 대한 강한 동경으로 새로운
능력을 개발하고자 하는 욕구.
Adventure
조화, 안정, 노스텔지아
변화보다는 지속가능한 안정된
라이프스타일을 영위하고자하는 욕구.
미래지향적이기 보다는 과거의 기억과
향수를 동경하고 현실 속에서 정신적인
힐링(healing)을 추구하려는 욕구.
Stable
Existence
존재의 욕구
Relation
관계의 욕구
Accomplishment
성취의 욕구
Human
Needs
Context of Use4
어떤 상황에서 사용하는지?
시간(언제), 장소(어디서), 또는 특정 상황 등 사용 전후 맥락
ex) 움직일 틈 없는 퇴근길 만원 지하철, 10분 내로 집 근처 마트에 쇼핑리스트 작성해야하는 상황
Function5
주요기능 및 서비스는 무엇인지?
다른 제품/서비스에는 없는, 또는 개선된 기능
ex) 작성한 구매물품의 매대위치를 최단시간 경로로 추천 기능
UX Actually
UX 진단 및 killer-UX concept 도출
Step 4
Killer-UX Function
사용자경험(UX) 극대화를 위한 user touch-point 와 killer-UX Function을 도출한다.
User touch-point:사용자와 기능 또는 서비스 간의 접점
사용자 진술 : 문제상황
니즈 / 문제 / Pain Point / 요구사항 갖춰야 할 기능/서비스
사용자 진술의 해결책 : 원하는 상황 가중치*
(1~3)
평가**
(1~5) Score
Killler-UX Function 당신의 제품/서비스/앱만이 갖고 있는 (unique) UX핵심포인트를 우선순위를 고려하여 나열해보세요.
제품/서비스를 사용하는 사용자 층의 행동, 라이프스타일, 성향 등의 조사를 통해 해당
제품/서비스에 투영되는 소비자들의 니즈를 발견하고, 목표 사용자 층에 대한 특징을 파악할
수 있다. 이는 향후 제품/서비스 전략 및 디자인개발 전략에 중요한 정보를 제공한다.
Step 5
UX-service Concept Planning; USP 전략
이 앱에서 UX서비스 컨셉은 무엇인가?
거창한‘기능명세’를 만들어 내는 것이 아니라, 비즈니스 성과를 달성하기 위한 UX 핵심컨셉과 목표시장의 USP전략을 찾는 것이 목표
Q. 사용자는 이 앱을 통해 어떤 욕구를 해결할 수 있는가?
Q. 사용자가 이 앱을 사용하는 단 한가지 이유는?
Q. 사용자는 이 앱을 통해 얻을 수 있는 경험적가치는 무엇인가?
시간 (time)
사람/이벤트 (people/event)
공간 (place/location)
조건 (condition)
*우선순위, 중요도
**실현 가능성
UX design Trigger for STARTUP Team
01-2
Killler-UX Function 1
정보·컨텐츠 관점
기능(도구)적 관점
서비스 생태계 관점
Killler-UX Function 2
Killler-UX Function 3
이 제품/서비스/앱은 을/를 할 수 있다.
UX Needs&Goal 사용자 니즈와 목표(의도,계기)
Target Market : USP 전략 (목표시장)
Eco-system collaboration
관련 제품/서비스 생태계 콜라보레이션
Core Tech. 제품/서비스 구현 기술, 시스템Brand Concept 브랜드 컨셉/마케팅전략
UX Service Concept제품/서비스 핵심UX컨셉
UX touch-point
제품/서비스와
사용자 간 소통의‘접점’
User Behavioral Patterns/Data
사용자 행위 패턴과 데이터Killer-UX Function 제품/서비스의 핵심기능
서비스 전략(UX관점)
차별화된 UX 포지셔닝 전략은 무엇입니까?
UX 경쟁우위 - 비지니스적 성공을 확신하는 핵심 사용자 가치효용은 무엇입니까?
핵심기술의 활용 전략은 무엇입니까?
이 서비스의 수익모델과 마케팅 전략은 무엇입니까?
Copyright ⓒ2018 POTENTIALEYES Inc. All rights reserved.
UX Actually(Advanced)
퍼소나 기반 UX 진단 및 사용자 모델링
Step 6
Persona & User modeling
퍼소나가 달성하고자 하는 목표와 그 동기는 무엇인가?
제품/서비스를 사용하는 사용자 층의 행동, 라이프스타일, 성향 등의 조사를 통해 해당
제품/서비스에 투영되는 소비자들의 니즈를 발견하고, 목표 사용자 층에 대한 특징을 파악할
수 있다. 이는 향후 제품/서비스 전략 및 디자인개발 전략에 중요한 정보를 제공한다.
Q. 사용자가 달성하고자 하는 목표와 그 동기는 무엇인가?
Q. 사용자는 어떤 사고와 행동 패턴을 갖고 있는가?
Q. 사용자의 목표 달성을 위한 디자인 요구사항은 무엇인가?
UX design Trigger for STARTUP Team
01-3
Goal & Motivation
경험적 목표
제품/서비스를
사용하면서 어떻게
느끼고 싶어하는가?
ex) 사용하는 동안 스스로 스마트하다고 느끼고 싶다
궁극적 목표
사용자가 마음 속으로
기대하는 바는 무엇인가?
ex) 심각한 문제가 발생하기 전에 미리 알고 싶다
인생의 목표
사용자 인생의 목표에 이
제품/서비스는 어떤
의미인가?
ex) 이 분야의 전문가가 되고 싶다
ex) 촬영 후 메시지 작성하여 sns업로드(공유)하기
목표 사용자 그룹의 사고와 행동 패턴은 무엇인가?
사용내역
사용자는 어떤 행동을
하는가? 얼마나 자주,
얼마나 오래 사용하는가?
태도/관점
사용자가 제품과
서비스를 바라보는
생각과 관점은 무엇인가?
적성/지식
사용자는 어떤 교육을
받았는가?
이 제품/서비스를 이해하는
능력 수준은 얼마인가?
의도/계기
이 제품/서비스를
사용하게 된 이유, 계기는
무엇인가?
기술활용 능력
이 제품/서비스의 영역과
관련된 사용자의 능력과
기술은 무엇인가?
Behavioral patterns
디자인 요구사항 퍼소나의 목표달성을 위해 디자인 해야 하는 정보와 컨텐츠, 기능과 서비스는 무엇인가?
정보/컨텐츠 요구사항 기능적 요구사항 서비스(생태계) 연계성
사용 상황 시나리오 퍼소나가 달성하고자 하는 목표에 도달하기 까지의 의도-실행-기대결과-평가-피드백의 과정을 ‘상황과 대상, 사용자 행위’를 시간 순서로 작성하기
① 목표(Goal) ② 의도(Intention) ③ 행동계획(Action plan) ④ 실행(Action) ⑤ 지각(Perceiving) ⑥ 해석(Interpreting) ⑦ 평가(Evaluation)
* Donald Norman’s 7 stage of Action Model
퍼소나 기반 UX 시나리오 완성하기!
Design Requirment UX Scenario(in detail)
Contents Function Service
1 2
3 4
Copyright ⓒ2018 POTENTIALEYES Inc. All rights reserved.
UI Feature List 해당 user task 수행을 위해
제품/앱이 갖춰야 할 UI요소
Killler-UX Function 최종적으로 구현하고자 하는 해당 앱서비스의 핵심 UX기능은 무엇인가?
UX Storyboard란,
UX key-concept 구현에 수반되는 사용자 태스크와 UI feature 간의 상호작용을 시각화하여,
개발자/디자이너와의 의사소통을 돕는 도구이자, 완성해야 할 앱서비스와 예상되는
사용자경험 미리보기!
Q. 도출한 핵심 UX 컨셉이 UI에 충분히 반영되었는가?
Q. 기능 별 우선순위가 적절히 고려되었는가?
Q. 각 기능 간 위계 및 관계가 효율적으로 구성되었는가?
UI Storyboard
UI/인터렉션 방식을 정의하고, 사용자 테스크와 UI Feature 간 상호적용 설계하기
Step 7
User Task & UI feature list-up
UX Needs/Killer-UX concept의 구현에 필요한 기능 리스트 작성. 사용자 Task에 따른 세부적인 기능들 간의 인터렉션 방식, 정보의 흐름과 관계망을 파악한다.
User Task Domain & Goal: 수행범주와 사용자의 목표 ex)사진촬영 후 메시지 작성하여 sns 자동업로드 하기
Step 8
UI Key-screen(Wireframe)
해당기능 구현을 위한 인터페이스와 메인화면 그려보기(wireframe)
User task-flow에서 정의된 주요 components와 세부 feature의 화면 레이아웃을 구성한다.
User Task 수행 (Task domain: )
UX design Trigger for STARTUP Team Copyright ⓒ2018 POTENTIALEYES Inc. All rights reserved.
02-1
Key-screen Layout UI Element Description
① 사용자는 (목표,의도) 을/를 하고자 한다.
② 이 제품/앱은 (기능/서비스) 을/를 갖고 있다 .
1. 시간 (Time)
ex) ~할 때, ~하기 ex) ~에서, ~하기 ex) ~와(과) ~하기, ~도중에 ~하기 ex) ~라면, ~하기
2. 공간 (Place/Location) 3. 사람/이벤트(People/Event) 4. 조건(Condition)
① 특정 용도(기능) 측면
A(Goal):
B(Behavior):
C(Feedback):
A(Goal):
B(Behavior):
C(Feedback):
A(Goal):
B(Behavior):
C(Feedback):
사용자는 (A)를 하기 위해서 (B)를 하면 (C)가 된다.
사용자는 (A)를 하기 위해서 (B)를 하면 (C)가 된다.
사용자는 (A)를 하기 위해서 (B)를 하면 (C)가 된다.
② 선호/취향(좋아하는 이유) 측면
③ 문제·부정적 측면(싫어하는)
No. Naming(명칭) Description(기능설명)
개발이슈
No. Naming Description
Key-screen Layout UI Element Description
No. Naming(명칭) Description(기능설명)
(개발환경에 따른 예외사항, 또는 적용 규칙 등 개발 시 고려해야 하는 이슈)
No. Naming Description
ex) 제품/SW/서비스는
~해야 한다. ~ 갖추고 있다 등
개발이슈 (개발환경에 따른 예외사항, 또는 적용 규칙 등 개발 시 고려해야 하는 이슈)
Step 9
Workflow
화면전환 및 key-screen 간 상호작용 및 시뮬레이션 해보기
정의된 화면 별로 각 버튼이나 컴포넌트의 동작에 의해 필요한 추가 화면을 연결한다. 순서에 맞게 배열된 화면 단위로 시뮬레이션을 해보면서 앱 사용절차를 검증한다.
UI Pattern & Interaction
화면을 2공간으로 분할하여 각 영역의
스크롤이 연동
화면 내 제시되는 정보가 연관성 있고, 정보의
양이 많아서 빠르게 스크롤 할 때
Parallel Scroll
Expedia
여러가지 기능을 화면 내 배치하지 않고, 왼쪽
Side Menu로 숨겨진 공간에 배치하여 화면 내
구성요소를 단순화
앱 내 기능이 4~5개 이상이고 각 기능이
수평적으로 나열이 될 때 (각 기능 간 연관성이
떨어질 때)
Side Menu
Gmail
화면 내 공간을 3D 로 구성하여 각각의 메인
페이지를 쉽게 접근 가능
앱 내 기능이 4~5개 이하이고 각 기능 간
전환이 수시로 이루어질 때
Swiping Navigation
Evernote
버튼을 누르면 메뉴나 카테고리가 위에서
아래로 펼쳐지는 형태
메뉴나 카테고리의 수가 5~7개 이내일 때
Dropdown Navigation
Vine
앱 내 자주 쓰이는 전역 기능(Global Function)
혹은 페이지 내 국소적으로 쓰이는 기능(Local
Function) 을 상단 내비게이션 바에 덧붙여
기능성을 높인 형태
각 페이지에서 대표 기능에 대한 접근성이
좋아야 하거나, 전체 페이지 내 공통된 기능을
항상 제공해야 할 때
Action Bar in Android
Airbnb
화면 상단/하단에 각 페이지를 탭으로 구성
앱 내 제공되는 페이지가 4~5개 이내이고
페이지 간 전환이 수시로 이루어질 때
Tab Navigation
Timer
버튼을 눌렀을 때 메뉴나 기능이 화면 위에
오버레이(overlay) 형태로 표시
메뉴 개수가 4~5개 이상이고 페이지 간
전환시 context 유지가 필요할 때
Pop-over Navigation
ISO500
주요 기능을 메인 화면에서 제시하여
접근성을 높인 형태
앱 내 기능이 4가지 이하이고, 각각의 기능 간
전환이 자주 이루어지지 않을 때
Straight-forward
ANA
Portuguess
Airports
앱 실행 후 처음 접하는 기능에 대해 페이지
상에서 설명
앱 내 특정 기능이나 페이지에 처음 접근하는
사용자들에게 해당 기능/페이지를 좀 더
상세하게 설명할 때
Coach Mark
Mixer
화면 내 상시로 떠있는 형태의 메뉴 아이콘
모든 페이지에서 수시로 접근해야 하는 기능이
있을 경우
Contextual
Hovering Menu
Naver
User Interaction
화면을 손가락으로 짧게(briefly) 터치
아이템을 선택하거나 조작할 때
Tap
화면을 탭한 직후 한번 더 탭한 채로
손가락을 화면에서 떼지 않고 위쪽이나
아래쪽 방향으로 이동하여 뗌
한 손가락으로 화면을 확대하거나(아래쪽으로
이동) 축소할 때(위쪽으로 이동)
Double Touch Drag
화면을 터치한 채로 재빠르게 이동
화면을 좀 더 빠르게 스크롤 할 때
화면 내 요소를 좀 더 빠르게 이동시킬 때
Flick
화면을 누른채로 일정시간 이상 유지
- 화면 내 텍스트를 확대해서 볼 때
- 화면 내 요소에서 추가 액션을 할 때 직전에 수행했던 액션을 취소할 때
Touch and Hold
스마트폰을 손에 쥔 채로 흔들어 댐
Shake
두 손가락을 이용해 화면을 바깥쪽으로 벌리거나(Pinch Close)안쪽으로 오므림(Pinch Open)
두 손가락으로 화면을 확대하거나 축소 할 때
Pinch Open/Close
화면을 재빠르게 두번 터치
지도 비율을 확대하거나 텍스트 영역을
선택할 때
Double Tap
화면을 한 방향으로 천천히 이동하며 터치
- 화면 전체를 이동할 때(Scroll, Paging)
- 화면 바깥 부분의 위젯을 꺼낼 때(Bezel Swipe)
- 화면 내 요소에서 추가 액션을 할 때(List)
- 이전 화면으로 갈 때(iOS7)
Swipe
화면에서 특정 아이템을 선택한 채로
화면에서 손가락을 떼지 않고 손가락을
이동하여 원하는 지점에서 뗌
화면 내 요소를 특정 위치로 옮길 때
Drag
UX Storyboard란,
UX key-concept 구현에 수반되는 사용자 태스크와 UI feature 간의 상호작용을 시각화하여,
개발자/디자이너와의 의사소통을 돕는 도구이자, 완성해야 할 앱서비스와 예상되는
사용자경험 미리보기!
Q. 도출한 핵심 UX 컨셉이 UI에 충분히 반영되었는가?
Q. 기능 별 우선순위가 적절히 고려되었는가?
Q. 각 기능 간 위계 및 관계가 효율적으로 구성되었는가?
UI Storyboard
앱서비스의 기능과 사용자 간 상호작용 미리보기
UX design Trigger for STARTUP Team
02-2
User Task :
Interaction 방식 :
User Task :
Interaction 방식 :
User Task :
Interaction 방식 :
* Workflow-2
User Task :
Interaction 방식 :
User Task :
Interaction 방식 :
User Task :
Interaction 방식 :
* Workflow-1 ex) 사진촬영 후 sns에 공유하고 사진내용입력
Copyright ⓒ2018 POTENTIALEYES Inc. All rights reserved.
GUI Moodboard
완성해야 할 앱서비스의 비주얼 컨셉과 시각적 사용자경험 미리보기!
Step 10
Visual concept Planning‘look & Feel’
사용자가 쉽고 편리하게 사용할 수 있도록 입출력 따위의 기능을 알기 쉬운 아이콘 따위의 그래픽으로 표현한다. 앱의 성격이나 목적, 사용자들에게 제공하려는 핵심가치에 따라서 그에 맞는
감성을 제공하는 것이 중요하다. 시스템을 사용하기 전에 느끼는 첫인상이나 시스템을 사용하고 나서 사용자가 기억할 수 있을 만한 개성을 표현하는 것이 중요하다.
Visual Concept & Motive
앱의 직관적인 미적 인상(개성)
앱서비스의 컨셉을 반영할 비주얼 모티브를 찾는다. 타깃 사용자의 성향, 라이프스타일, 미적 선호도 등에
영향을 미치는 컨셉 키워드 를 작성한다.
타깃 사용자의 감성어휘 모티브
GUI Moodboard 란,
UX Concept이 반영된 앱서비스 화면의 직관적인
UX - Look & Feel, 앱서비스 Brand Identity를 일관되게 반영한 Tone
& Manner로 최적의 디자인컨셉을 도출하는 과정
Q. 정보의 범주를 시각적으로 어떻게 나누어 줄 것인가?
Q. 시각적 구성 요소들에 대한 화면 상의 전반적인 배열과 느낌은 어떻게 보여줄 것인가?
Q. 해당 앱서비스 화면의 시각적 인상, 또는 개성은 무엇인가?
UX design Trigger for STARTUP Team Copyright ⓒ2018 POTENTAILEYES Inc. All rights reserved.
사용자의 성향, 감정, 정서 등의 표현
시각적 인상, 매력 등 시각적 차별화 된
‘Look & Feel’
앱 화면 디자인의 모티브
ex) 남성적, 여성적, 신뢰성 등 ex) 반딧불, 폭포수, 무지개 등
ex) Fun, Sexy, Casual, Classic
03
Simple & Intuition Realistic & Decorative
Shape
GUI 요소의 크기나 형태에 대한 계획.
매우 기본적인 요소이기 때문에 그 자체보다는 서체와
같이 여러가지 복합적인 형태로 사용된다.
Mono tone Colorful
Color&Tone
일상 생활에서 매우 빈번하게사용하는 디자인 요소.
디자인 컨셉은 전반적으로 색의 사용에 의해 좌우된다.
GUI 전체 공간에 대한 디자인 컨셉을 작성하시오.(배경,레이아웃 등)
2D Flat 3D Dynamic
Space
Persona
Senior Junior
Formal Informal
Classic Modern
GUI 전체 공간에 대한 계획.
2D+Flat 또는 3D+Realistic 등의 공간을 활용한
컨셉도출이 가능하다.
퍼소나 이미지 공간 정의하기(체크)
Matt Grossy
Texture
실제 사물의 재질감 표현 요소.
스큐어모피즘 또는 리얼메타포 컨셉디자인 시 활용한다.
San-Serif Serif Script
Typography
전통적인 그래픽 디자인에서도 매우 중요한 요소.
기능적으로 의미전달이 가장 중요하나 조형미를
표현하는 그래픽 요소로도 활용 가능하다.
GUI 요소의 크기나 형태에 대한 계획을 작성하시오.(그래픽 요소의 모양,크기,형태 등)
Color 계획을 작성하시오.(컬러톤,색조,대비 등)
재질감 표현 계획을 작성하시오.(질감 등 시각요소의 디테일)
타이포디자인 컨셉을 작성하시오.

More Related Content

What's hot

UX Planning Training Course_SYS4U I&C
UX Planning Training Course_SYS4U I&CUX Planning Training Course_SYS4U I&C
UX Planning Training Course_SYS4U I&Csys4u
 
Mobile Prototype Essential
Mobile Prototype EssentialMobile Prototype Essential
Mobile Prototype EssentialJunsang Dong
 
모바일 UX/UI : 트랜드와 원칙으로써의 UX - 1부
모바일 UX/UI : 트랜드와 원칙으로써의 UX - 1부모바일 UX/UI : 트랜드와 원칙으로써의 UX - 1부
모바일 UX/UI : 트랜드와 원칙으로써의 UX - 1부RightBrain inc.
 
Mobile UX Design Essential
Mobile UX Design EssentialMobile UX Design Essential
Mobile UX Design EssentialJunsang Dong
 
'UX', 'UX Design' and 'Good UX'
'UX', 'UX Design' and 'Good UX''UX', 'UX Design' and 'Good UX'
'UX', 'UX Design' and 'Good UX'Jinyong Kim
 
Scenario-Based Interactive UI Design
Scenario-Based Interactive UI DesignScenario-Based Interactive UI Design
Scenario-Based Interactive UI DesignHyunjin Ahn
 
This is ux design summary
This is ux design summaryThis is ux design summary
This is ux design summaryRightBrain
 
UX_Academy_16th_Market_Kurly_UXUI
UX_Academy_16th_Market_Kurly_UXUIUX_Academy_16th_Market_Kurly_UXUI
UX_Academy_16th_Market_Kurly_UXUIRightBrain inc.
 
비즈니스모델링_2012_콘텐츠진흥원_SCC
비즈니스모델링_2012_콘텐츠진흥원_SCC비즈니스모델링_2012_콘텐츠진흥원_SCC
비즈니스모델링_2012_콘텐츠진흥원_SCCJunsang Dong
 
Ru5th open project wearable next mobile service
Ru5th open project wearable next mobile serviceRu5th open project wearable next mobile service
Ru5th open project wearable next mobile serviceRightBrain inc.
 
UX 아카데미 오픈프로젝트 [쿠팡 - UX/UI 개선]
UX 아카데미 오픈프로젝트 [쿠팡 - UX/UI 개선] UX 아카데미 오픈프로젝트 [쿠팡 - UX/UI 개선]
UX 아카데미 오픈프로젝트 [쿠팡 - UX/UI 개선] RightBrain inc.
 
[Rightbrain UX Academy] Netflix UX/UI개선
[Rightbrain UX Academy] Netflix UX/UI개선[Rightbrain UX Academy] Netflix UX/UI개선
[Rightbrain UX Academy] Netflix UX/UI개선RightBrain inc.
 
2015 ux관점으로 바라본 보험 서비스 디자인
2015 ux관점으로 바라본 보험 서비스 디자인2015 ux관점으로 바라본 보험 서비스 디자인
2015 ux관점으로 바라본 보험 서비스 디자인Donghoo Kim
 

What's hot (20)

Ux design process
Ux design processUx design process
Ux design process
 
UX Planning Training Course_SYS4U I&C
UX Planning Training Course_SYS4U I&CUX Planning Training Course_SYS4U I&C
UX Planning Training Course_SYS4U I&C
 
Mobile Prototype Essential
Mobile Prototype EssentialMobile Prototype Essential
Mobile Prototype Essential
 
모바일 UX/UI : 트랜드와 원칙으로써의 UX - 1부
모바일 UX/UI : 트랜드와 원칙으로써의 UX - 1부모바일 UX/UI : 트랜드와 원칙으로써의 UX - 1부
모바일 UX/UI : 트랜드와 원칙으로써의 UX - 1부
 
Mobile UX Design Essential
Mobile UX Design EssentialMobile UX Design Essential
Mobile UX Design Essential
 
'UX', 'UX Design' and 'Good UX'
'UX', 'UX Design' and 'Good UX''UX', 'UX Design' and 'Good UX'
'UX', 'UX Design' and 'Good UX'
 
원격테스트_UX1
원격테스트_UX1원격테스트_UX1
원격테스트_UX1
 
Scenario-Based Interactive UI Design
Scenario-Based Interactive UI DesignScenario-Based Interactive UI Design
Scenario-Based Interactive UI Design
 
This is ux design summary
This is ux design summaryThis is ux design summary
This is ux design summary
 
UX_Academy_16th_Market_Kurly_UXUI
UX_Academy_16th_Market_Kurly_UXUIUX_Academy_16th_Market_Kurly_UXUI
UX_Academy_16th_Market_Kurly_UXUI
 
비즈니스모델링_2012_콘텐츠진흥원_SCC
비즈니스모델링_2012_콘텐츠진흥원_SCC비즈니스모델링_2012_콘텐츠진흥원_SCC
비즈니스모델링_2012_콘텐츠진흥원_SCC
 
Ru5th open project wearable next mobile service
Ru5th open project wearable next mobile serviceRu5th open project wearable next mobile service
Ru5th open project wearable next mobile service
 
UX trend report 2014 lite version (by UX1)
UX trend report 2014 lite version (by UX1)UX trend report 2014 lite version (by UX1)
UX trend report 2014 lite version (by UX1)
 
Ux for beginners
Ux for beginnersUx for beginners
Ux for beginners
 
UX 아카데미 오픈프로젝트 [쿠팡 - UX/UI 개선]
UX 아카데미 오픈프로젝트 [쿠팡 - UX/UI 개선] UX 아카데미 오픈프로젝트 [쿠팡 - UX/UI 개선]
UX 아카데미 오픈프로젝트 [쿠팡 - UX/UI 개선]
 
Ux research guide ux1
Ux research guide ux1Ux research guide ux1
Ux research guide ux1
 
Ux for beginners
Ux for beginnersUx for beginners
Ux for beginners
 
[Rightbrain UX Academy] Netflix UX/UI개선
[Rightbrain UX Academy] Netflix UX/UI개선[Rightbrain UX Academy] Netflix UX/UI개선
[Rightbrain UX Academy] Netflix UX/UI개선
 
Ux design approach
Ux design approachUx design approach
Ux design approach
 
2015 ux관점으로 바라본 보험 서비스 디자인
2015 ux관점으로 바라본 보험 서비스 디자인2015 ux관점으로 바라본 보험 서비스 디자인
2015 ux관점으로 바라본 보험 서비스 디자인
 

Similar to Uxtrigger template v5.compressed_2019

실무를위한모바일 UI UX step up
실무를위한모바일 UI UX step up실무를위한모바일 UI UX step up
실무를위한모바일 UI UX step upAmy Young Ah Kim
 
모바일 UX디자인의 개요
모바일 UX디자인의 개요모바일 UX디자인의 개요
모바일 UX디자인의 개요Junsang Dong
 
Rightbrain 사내 ux 세미나 20220124
Rightbrain 사내 ux 세미나 20220124Rightbrain 사내 ux 세미나 20220124
Rightbrain 사내 ux 세미나 20220124sbcho
 
UX/UI 개념과 방향성
UX/UI 개념과 방향성UX/UI 개념과 방향성
UX/UI 개념과 방향성Billy Choi
 
유저해빗(UserHabit) 서비스 소개서 요약본
유저해빗(UserHabit) 서비스 소개서 요약본유저해빗(UserHabit) 서비스 소개서 요약본
유저해빗(UserHabit) 서비스 소개서 요약본Ha ji Yoon
 
퍼소나로 완성하는 인터랙션 디자인
퍼소나로 완성하는 인터랙션 디자인퍼소나로 완성하는 인터랙션 디자인
퍼소나로 완성하는 인터랙션 디자인정인 주
 
11th.Lecture.Step3.AnalysisUX.Modeling.pdf
11th.Lecture.Step3.AnalysisUX.Modeling.pdf11th.Lecture.Step3.AnalysisUX.Modeling.pdf
11th.Lecture.Step3.AnalysisUX.Modeling.pdfJeongeun Kwon
 
오래가는 Ux 디자인 파이널 1414905 이서현
오래가는 Ux 디자인 파이널  1414905 이서현오래가는 Ux 디자인 파이널  1414905 이서현
오래가는 Ux 디자인 파이널 1414905 이서현서현 이
 
사용자경험디자인 기초 강의 #1
사용자경험디자인 기초 강의 #1사용자경험디자인 기초 강의 #1
사용자경험디자인 기초 강의 #1Jd Kim
 
Ux research guide
Ux research guideUx research guide
Ux research guideKim Taesook
 
14.interaction design
14.interaction design14.interaction design
14.interaction designcheonsu park
 
사용자 스토리 기반의 스크럼
사용자 스토리 기반의 스크럼사용자 스토리 기반의 스크럼
사용자 스토리 기반의 스크럼Junyi Song
 
사용자 스토리 기반의 스크럼(Scrum)
사용자 스토리 기반의 스크럼(Scrum)사용자 스토리 기반의 스크럼(Scrum)
사용자 스토리 기반의 스크럼(Scrum)재능마켓 크몽
 
What Can I say? Addressing User Experience Challenges of a Mobile Voice User ...
What Can I say? Addressing User Experience Challenges of a Mobile Voice User ...What Can I say? Addressing User Experience Challenges of a Mobile Voice User ...
What Can I say? Addressing User Experience Challenges of a Mobile Voice User ...skkang0617
 
[교육리뷰] 스토리텔링을 통한 모바일 서비스 시나리오 작성 110321
[교육리뷰] 스토리텔링을 통한 모바일 서비스 시나리오 작성 110321[교육리뷰] 스토리텔링을 통한 모바일 서비스 시나리오 작성 110321
[교육리뷰] 스토리텔링을 통한 모바일 서비스 시나리오 작성 110321Kyungeun Kim
 

Similar to Uxtrigger template v5.compressed_2019 (20)

실무를위한모바일 UI UX step up
실무를위한모바일 UI UX step up실무를위한모바일 UI UX step up
실무를위한모바일 UI UX step up
 
U&I Insgiht
U&I InsgihtU&I Insgiht
U&I Insgiht
 
Uxtrigger brochure v4(2019)-rev
Uxtrigger brochure v4(2019)-revUxtrigger brochure v4(2019)-rev
Uxtrigger brochure v4(2019)-rev
 
모바일 UX디자인의 개요
모바일 UX디자인의 개요모바일 UX디자인의 개요
모바일 UX디자인의 개요
 
Rightbrain 사내 ux 세미나 20220124
Rightbrain 사내 ux 세미나 20220124Rightbrain 사내 ux 세미나 20220124
Rightbrain 사내 ux 세미나 20220124
 
UX/UI 개념과 방향성
UX/UI 개념과 방향성UX/UI 개념과 방향성
UX/UI 개념과 방향성
 
유저해빗(UserHabit) 서비스 소개서 요약본
유저해빗(UserHabit) 서비스 소개서 요약본유저해빗(UserHabit) 서비스 소개서 요약본
유저해빗(UserHabit) 서비스 소개서 요약본
 
퍼소나로 완성하는 인터랙션 디자인
퍼소나로 완성하는 인터랙션 디자인퍼소나로 완성하는 인터랙션 디자인
퍼소나로 완성하는 인터랙션 디자인
 
11th.Lecture.Step3.AnalysisUX.Modeling.pdf
11th.Lecture.Step3.AnalysisUX.Modeling.pdf11th.Lecture.Step3.AnalysisUX.Modeling.pdf
11th.Lecture.Step3.AnalysisUX.Modeling.pdf
 
오래가는 Ux 디자인 파이널 1414905 이서현
오래가는 Ux 디자인 파이널  1414905 이서현오래가는 Ux 디자인 파이널  1414905 이서현
오래가는 Ux 디자인 파이널 1414905 이서현
 
Bsw ui ux정의
Bsw ui ux정의Bsw ui ux정의
Bsw ui ux정의
 
사용자 경험품질향상 가이드 - 한국디자인진흥원
사용자 경험품질향상 가이드 - 한국디자인진흥원사용자 경험품질향상 가이드 - 한국디자인진흥원
사용자 경험품질향상 가이드 - 한국디자인진흥원
 
사용자경험디자인 기초 강의 #1
사용자경험디자인 기초 강의 #1사용자경험디자인 기초 강의 #1
사용자경험디자인 기초 강의 #1
 
Ux research guide
Ux research guideUx research guide
Ux research guide
 
14.interaction design
14.interaction design14.interaction design
14.interaction design
 
Ui vs ux
Ui vs uxUi vs ux
Ui vs ux
 
사용자 스토리 기반의 스크럼
사용자 스토리 기반의 스크럼사용자 스토리 기반의 스크럼
사용자 스토리 기반의 스크럼
 
사용자 스토리 기반의 스크럼(Scrum)
사용자 스토리 기반의 스크럼(Scrum)사용자 스토리 기반의 스크럼(Scrum)
사용자 스토리 기반의 스크럼(Scrum)
 
What Can I say? Addressing User Experience Challenges of a Mobile Voice User ...
What Can I say? Addressing User Experience Challenges of a Mobile Voice User ...What Can I say? Addressing User Experience Challenges of a Mobile Voice User ...
What Can I say? Addressing User Experience Challenges of a Mobile Voice User ...
 
[교육리뷰] 스토리텔링을 통한 모바일 서비스 시나리오 작성 110321
[교육리뷰] 스토리텔링을 통한 모바일 서비스 시나리오 작성 110321[교육리뷰] 스토리텔링을 통한 모바일 서비스 시나리오 작성 110321
[교육리뷰] 스토리텔링을 통한 모바일 서비스 시나리오 작성 110321
 

Uxtrigger template v5.compressed_2019

  • 1. 01-1 UX Actually UX 진단 및 UX Key-concept 도출 Step 1 User Scenario 사용자 입장에서 use case 작성하고 사용자 이해하기! 사용자가 무엇을 원하고 필요로 하는지에 대해 UX시나리오를 구체화하여, 궁극적으로 제품/서비스 사업아이템이 근본적으로 해결해야 할 사용자 니즈의 본질을 찾는다. Step 2 UX flow&elements ; UX흐름과 구성요소 경험의 흐름을 파악하고 사용자에게 형성될 UX의 구조와 요소를 이해한다. 제품/서비스의 어떤 요소들이 사용자에게 어떤 유형의 동기로 작용하여 사용자에게서 특정 행동을 이끌어내는지를 파악한다. Item 당신의 사업모델과 서비스아이템은 무엇인지 간단히 작성해 보시오. User definition2 어떤 사용자(고객)인지? 사용자의 성격, 선호도, 라이프스타일, 직업, 태도, 가치관 등 목표 사용자 정의 ex) 도시에 거주하며 4세 자녀를 둔 맞벌이, 가사일에 항상 시간이 없는 워킹맘 Needs/Problem3 무엇이 문제인지? 제품/서비스가 해결, 또는 제공하고자 하는 핵심적인 사용자니즈 ex) 해야 할 일을 시간에 구애 받지 않고 실수 없이 처리하고 싶은 니즈 ex) 쇼핑목록 작성과 동시에 구매,결제 서비스 User Task Flow6 기능/서비스 사용방법은? 사용자 니즈를 충족시킬 해당기능을 사용하는 방법, 또는 인터랙션 방식 ex) 쇼핑리스트 작성, 실시간 마트에 전송, 위치기반으로 해당 매대 경로선택 Benefit/Meaning7 사용하는 가장 큰 이유는? 사용자 가치효용 - 만족, 기억, 피드백 ex) 쇼핑리스트 전송과 동시에 결제가능, 줄서서 계산하지 않고 10분만에 쇼핑완료 Human needs set(ERA Model) * 타킷 사용자에 해당되는 human needs에 체크. 중복가능 제품/서비스를 사용하는 사용자 층의 행동, 라이프스타일, 성향 등의 조사를 통해 해당 제품/서비스에 투영되는 소비자들의 니즈를 발견하고, 목표 사용자 층에 대한 특징을 파악할 수 있다. 이는 향후 제품/서비스 전략 및 디자인개발 전략에 중요한 정보를 제공한다. Step 3 Human Needs ; 인간근본 욕구분석 당신의 앱서비스 이면에 숨겨진 사용자 니즈의 근본 원인 찾기! Q. 사용자는 이 앱을 통해 어떤 욕구를 해결할 수 있는가? Q. 사용자가 이 앱을 사용하는 단 한가지 이유는? Q. 사용자는 이 앱을 통해 얻을 수 있는 경험적 가치는 무엇인가? UX design Trigger for STARTUP Team 1 User Identity : 사용자는 어떤 욕구의 소유자인가?(인간 본질적 욕구) WIW : 궁극적으로 사용자가 원하는 기능은 무엇인가?(앱의 Key-function) Copyright ⓒ2018 POTENTIALEYES Inc. All rights reserved. ex) 개인 프라이버시에 민감하며, 사회적 소속감을 중시 ex) 자신의 개인정보를 친한 지인과 안전하게 공유할 수 있는 자신만의 접속 방법 기억/태도 Memory & Attitude 결과에 대한 만족 수준의 기억, 다음 행동 영향을 주는 요인 사용자 행동에 대한 어떤 인터렉션/인터페이스가 필요한지 판단하는데 도움이 됨. 사용자 행동이 일어나게 되는 직접적인 이유(목표) 의도/원했던 목표와 결과의 비교평가와 인식한 것에 대한 경험적 해석 사용자 행동 User behavior 기대 결과의 평가/피드백 Evaluation & Feedback 동기/계기(의도) Motivation & Goal 안전, 보안, 프라이버시 타인들로부터 자신의 안전과 정보의 보안을 유지하려는 욕구 뿐만 아니라, 자신의 감정, 신체 또는 경제적 사안의 노출을 꺼리는 욕구. 개인에게 축적되는 수많은 정보자산(Information property)가치가 확장, 오용되면서 보안과 프라이버시 요구는 높아짐. Privacy 자기표현, 자아투영, 개성 자신이 속한 사회, 타인과의 관계에 대해 누적된 경험에 대한 자기만의 표현욕구. 선호 브랜드 소유와 공유 등, 자기만의 세계를 적극적으로 드러내려는 욕구 Identity 소속감, 애정, 친화 다른 사람들과 좋은 관계를 유지하려고 노력하며, 특정 소셜 그룹의 소속감을 중시하는 욕구. 긍정적인 사고와 열린 사고로 타인을 자신의 영역에 함께하려는 욕구. Friendship 심미성, 미적 가치 추구 특정한 관점에서 독특한 미적 욕구를 가지고 있으며, 기능보다는 상징적 또는 주관적인 미적 가치를 성취하려는 욕구. Beauty 쾌락, 자극, 일탈 일상으로부터의 탈출과 함께 자극적인 것들을 감각적으로 수용하려는 욕구. 특히 인터넷 환경에서의 익명성, 가상세계(Virtual reality) 속에서 제2의 자아를 드러내려는 욕구. Hedonism 신뢰, 믿음, 자신감 다른 사람과의 약속을 이행하는데 있어 확신과 믿음을 주려는 욕구. 신뢰가 있는 타인과의 관계가 만들어진다면 뭐든지 잘 할 수 있다는 자신감을 가지려는 욕구. Confidence 권력, 능력, 관심, 신분, 주목 높은 권력욕구를 가지고 리더로써 남을 통제하며, 남들로 하여금 자신이 비교우의에 있고자 하는 욕구. Power 탐구, 호기심, 진리 모호하거나 잘 알지 못하는 외부 환경에 대해 알려고 노력하는 욕구. 스스로의 호기심, 알고자 하는 대상에 대한 명쾌한 해결 능력을 성공적으로 발휘함으로써 자긍심을 높이려는 욕구. Explore 모험, 프론티어 도전의식이 투철하고, 미지의 세상에 대한 강한 동경으로 새로운 능력을 개발하고자 하는 욕구. Adventure 조화, 안정, 노스텔지아 변화보다는 지속가능한 안정된 라이프스타일을 영위하고자하는 욕구. 미래지향적이기 보다는 과거의 기억과 향수를 동경하고 현실 속에서 정신적인 힐링(healing)을 추구하려는 욕구. Stable Existence 존재의 욕구 Relation 관계의 욕구 Accomplishment 성취의 욕구 Human Needs Context of Use4 어떤 상황에서 사용하는지? 시간(언제), 장소(어디서), 또는 특정 상황 등 사용 전후 맥락 ex) 움직일 틈 없는 퇴근길 만원 지하철, 10분 내로 집 근처 마트에 쇼핑리스트 작성해야하는 상황 Function5 주요기능 및 서비스는 무엇인지? 다른 제품/서비스에는 없는, 또는 개선된 기능 ex) 작성한 구매물품의 매대위치를 최단시간 경로로 추천 기능
  • 2. UX Actually UX 진단 및 killer-UX concept 도출 Step 4 Killer-UX Function 사용자경험(UX) 극대화를 위한 user touch-point 와 killer-UX Function을 도출한다. User touch-point:사용자와 기능 또는 서비스 간의 접점 사용자 진술 : 문제상황 니즈 / 문제 / Pain Point / 요구사항 갖춰야 할 기능/서비스 사용자 진술의 해결책 : 원하는 상황 가중치* (1~3) 평가** (1~5) Score Killler-UX Function 당신의 제품/서비스/앱만이 갖고 있는 (unique) UX핵심포인트를 우선순위를 고려하여 나열해보세요. 제품/서비스를 사용하는 사용자 층의 행동, 라이프스타일, 성향 등의 조사를 통해 해당 제품/서비스에 투영되는 소비자들의 니즈를 발견하고, 목표 사용자 층에 대한 특징을 파악할 수 있다. 이는 향후 제품/서비스 전략 및 디자인개발 전략에 중요한 정보를 제공한다. Step 5 UX-service Concept Planning; USP 전략 이 앱에서 UX서비스 컨셉은 무엇인가? 거창한‘기능명세’를 만들어 내는 것이 아니라, 비즈니스 성과를 달성하기 위한 UX 핵심컨셉과 목표시장의 USP전략을 찾는 것이 목표 Q. 사용자는 이 앱을 통해 어떤 욕구를 해결할 수 있는가? Q. 사용자가 이 앱을 사용하는 단 한가지 이유는? Q. 사용자는 이 앱을 통해 얻을 수 있는 경험적가치는 무엇인가? 시간 (time) 사람/이벤트 (people/event) 공간 (place/location) 조건 (condition) *우선순위, 중요도 **실현 가능성 UX design Trigger for STARTUP Team 01-2 Killler-UX Function 1 정보·컨텐츠 관점 기능(도구)적 관점 서비스 생태계 관점 Killler-UX Function 2 Killler-UX Function 3 이 제품/서비스/앱은 을/를 할 수 있다. UX Needs&Goal 사용자 니즈와 목표(의도,계기) Target Market : USP 전략 (목표시장) Eco-system collaboration 관련 제품/서비스 생태계 콜라보레이션 Core Tech. 제품/서비스 구현 기술, 시스템Brand Concept 브랜드 컨셉/마케팅전략 UX Service Concept제품/서비스 핵심UX컨셉 UX touch-point 제품/서비스와 사용자 간 소통의‘접점’ User Behavioral Patterns/Data 사용자 행위 패턴과 데이터Killer-UX Function 제품/서비스의 핵심기능 서비스 전략(UX관점) 차별화된 UX 포지셔닝 전략은 무엇입니까? UX 경쟁우위 - 비지니스적 성공을 확신하는 핵심 사용자 가치효용은 무엇입니까? 핵심기술의 활용 전략은 무엇입니까? 이 서비스의 수익모델과 마케팅 전략은 무엇입니까? Copyright ⓒ2018 POTENTIALEYES Inc. All rights reserved.
  • 3. UX Actually(Advanced) 퍼소나 기반 UX 진단 및 사용자 모델링 Step 6 Persona & User modeling 퍼소나가 달성하고자 하는 목표와 그 동기는 무엇인가? 제품/서비스를 사용하는 사용자 층의 행동, 라이프스타일, 성향 등의 조사를 통해 해당 제품/서비스에 투영되는 소비자들의 니즈를 발견하고, 목표 사용자 층에 대한 특징을 파악할 수 있다. 이는 향후 제품/서비스 전략 및 디자인개발 전략에 중요한 정보를 제공한다. Q. 사용자가 달성하고자 하는 목표와 그 동기는 무엇인가? Q. 사용자는 어떤 사고와 행동 패턴을 갖고 있는가? Q. 사용자의 목표 달성을 위한 디자인 요구사항은 무엇인가? UX design Trigger for STARTUP Team 01-3 Goal & Motivation 경험적 목표 제품/서비스를 사용하면서 어떻게 느끼고 싶어하는가? ex) 사용하는 동안 스스로 스마트하다고 느끼고 싶다 궁극적 목표 사용자가 마음 속으로 기대하는 바는 무엇인가? ex) 심각한 문제가 발생하기 전에 미리 알고 싶다 인생의 목표 사용자 인생의 목표에 이 제품/서비스는 어떤 의미인가? ex) 이 분야의 전문가가 되고 싶다 ex) 촬영 후 메시지 작성하여 sns업로드(공유)하기 목표 사용자 그룹의 사고와 행동 패턴은 무엇인가? 사용내역 사용자는 어떤 행동을 하는가? 얼마나 자주, 얼마나 오래 사용하는가? 태도/관점 사용자가 제품과 서비스를 바라보는 생각과 관점은 무엇인가? 적성/지식 사용자는 어떤 교육을 받았는가? 이 제품/서비스를 이해하는 능력 수준은 얼마인가? 의도/계기 이 제품/서비스를 사용하게 된 이유, 계기는 무엇인가? 기술활용 능력 이 제품/서비스의 영역과 관련된 사용자의 능력과 기술은 무엇인가? Behavioral patterns 디자인 요구사항 퍼소나의 목표달성을 위해 디자인 해야 하는 정보와 컨텐츠, 기능과 서비스는 무엇인가? 정보/컨텐츠 요구사항 기능적 요구사항 서비스(생태계) 연계성 사용 상황 시나리오 퍼소나가 달성하고자 하는 목표에 도달하기 까지의 의도-실행-기대결과-평가-피드백의 과정을 ‘상황과 대상, 사용자 행위’를 시간 순서로 작성하기 ① 목표(Goal) ② 의도(Intention) ③ 행동계획(Action plan) ④ 실행(Action) ⑤ 지각(Perceiving) ⑥ 해석(Interpreting) ⑦ 평가(Evaluation) * Donald Norman’s 7 stage of Action Model 퍼소나 기반 UX 시나리오 완성하기! Design Requirment UX Scenario(in detail) Contents Function Service 1 2 3 4 Copyright ⓒ2018 POTENTIALEYES Inc. All rights reserved.
  • 4. UI Feature List 해당 user task 수행을 위해 제품/앱이 갖춰야 할 UI요소 Killler-UX Function 최종적으로 구현하고자 하는 해당 앱서비스의 핵심 UX기능은 무엇인가? UX Storyboard란, UX key-concept 구현에 수반되는 사용자 태스크와 UI feature 간의 상호작용을 시각화하여, 개발자/디자이너와의 의사소통을 돕는 도구이자, 완성해야 할 앱서비스와 예상되는 사용자경험 미리보기! Q. 도출한 핵심 UX 컨셉이 UI에 충분히 반영되었는가? Q. 기능 별 우선순위가 적절히 고려되었는가? Q. 각 기능 간 위계 및 관계가 효율적으로 구성되었는가? UI Storyboard UI/인터렉션 방식을 정의하고, 사용자 테스크와 UI Feature 간 상호적용 설계하기 Step 7 User Task & UI feature list-up UX Needs/Killer-UX concept의 구현에 필요한 기능 리스트 작성. 사용자 Task에 따른 세부적인 기능들 간의 인터렉션 방식, 정보의 흐름과 관계망을 파악한다. User Task Domain & Goal: 수행범주와 사용자의 목표 ex)사진촬영 후 메시지 작성하여 sns 자동업로드 하기 Step 8 UI Key-screen(Wireframe) 해당기능 구현을 위한 인터페이스와 메인화면 그려보기(wireframe) User task-flow에서 정의된 주요 components와 세부 feature의 화면 레이아웃을 구성한다. User Task 수행 (Task domain: ) UX design Trigger for STARTUP Team Copyright ⓒ2018 POTENTIALEYES Inc. All rights reserved. 02-1 Key-screen Layout UI Element Description ① 사용자는 (목표,의도) 을/를 하고자 한다. ② 이 제품/앱은 (기능/서비스) 을/를 갖고 있다 . 1. 시간 (Time) ex) ~할 때, ~하기 ex) ~에서, ~하기 ex) ~와(과) ~하기, ~도중에 ~하기 ex) ~라면, ~하기 2. 공간 (Place/Location) 3. 사람/이벤트(People/Event) 4. 조건(Condition) ① 특정 용도(기능) 측면 A(Goal): B(Behavior): C(Feedback): A(Goal): B(Behavior): C(Feedback): A(Goal): B(Behavior): C(Feedback): 사용자는 (A)를 하기 위해서 (B)를 하면 (C)가 된다. 사용자는 (A)를 하기 위해서 (B)를 하면 (C)가 된다. 사용자는 (A)를 하기 위해서 (B)를 하면 (C)가 된다. ② 선호/취향(좋아하는 이유) 측면 ③ 문제·부정적 측면(싫어하는) No. Naming(명칭) Description(기능설명) 개발이슈 No. Naming Description Key-screen Layout UI Element Description No. Naming(명칭) Description(기능설명) (개발환경에 따른 예외사항, 또는 적용 규칙 등 개발 시 고려해야 하는 이슈) No. Naming Description ex) 제품/SW/서비스는 ~해야 한다. ~ 갖추고 있다 등 개발이슈 (개발환경에 따른 예외사항, 또는 적용 규칙 등 개발 시 고려해야 하는 이슈)
  • 5. Step 9 Workflow 화면전환 및 key-screen 간 상호작용 및 시뮬레이션 해보기 정의된 화면 별로 각 버튼이나 컴포넌트의 동작에 의해 필요한 추가 화면을 연결한다. 순서에 맞게 배열된 화면 단위로 시뮬레이션을 해보면서 앱 사용절차를 검증한다. UI Pattern & Interaction 화면을 2공간으로 분할하여 각 영역의 스크롤이 연동 화면 내 제시되는 정보가 연관성 있고, 정보의 양이 많아서 빠르게 스크롤 할 때 Parallel Scroll Expedia 여러가지 기능을 화면 내 배치하지 않고, 왼쪽 Side Menu로 숨겨진 공간에 배치하여 화면 내 구성요소를 단순화 앱 내 기능이 4~5개 이상이고 각 기능이 수평적으로 나열이 될 때 (각 기능 간 연관성이 떨어질 때) Side Menu Gmail 화면 내 공간을 3D 로 구성하여 각각의 메인 페이지를 쉽게 접근 가능 앱 내 기능이 4~5개 이하이고 각 기능 간 전환이 수시로 이루어질 때 Swiping Navigation Evernote 버튼을 누르면 메뉴나 카테고리가 위에서 아래로 펼쳐지는 형태 메뉴나 카테고리의 수가 5~7개 이내일 때 Dropdown Navigation Vine 앱 내 자주 쓰이는 전역 기능(Global Function) 혹은 페이지 내 국소적으로 쓰이는 기능(Local Function) 을 상단 내비게이션 바에 덧붙여 기능성을 높인 형태 각 페이지에서 대표 기능에 대한 접근성이 좋아야 하거나, 전체 페이지 내 공통된 기능을 항상 제공해야 할 때 Action Bar in Android Airbnb 화면 상단/하단에 각 페이지를 탭으로 구성 앱 내 제공되는 페이지가 4~5개 이내이고 페이지 간 전환이 수시로 이루어질 때 Tab Navigation Timer 버튼을 눌렀을 때 메뉴나 기능이 화면 위에 오버레이(overlay) 형태로 표시 메뉴 개수가 4~5개 이상이고 페이지 간 전환시 context 유지가 필요할 때 Pop-over Navigation ISO500 주요 기능을 메인 화면에서 제시하여 접근성을 높인 형태 앱 내 기능이 4가지 이하이고, 각각의 기능 간 전환이 자주 이루어지지 않을 때 Straight-forward ANA Portuguess Airports 앱 실행 후 처음 접하는 기능에 대해 페이지 상에서 설명 앱 내 특정 기능이나 페이지에 처음 접근하는 사용자들에게 해당 기능/페이지를 좀 더 상세하게 설명할 때 Coach Mark Mixer 화면 내 상시로 떠있는 형태의 메뉴 아이콘 모든 페이지에서 수시로 접근해야 하는 기능이 있을 경우 Contextual Hovering Menu Naver User Interaction 화면을 손가락으로 짧게(briefly) 터치 아이템을 선택하거나 조작할 때 Tap 화면을 탭한 직후 한번 더 탭한 채로 손가락을 화면에서 떼지 않고 위쪽이나 아래쪽 방향으로 이동하여 뗌 한 손가락으로 화면을 확대하거나(아래쪽으로 이동) 축소할 때(위쪽으로 이동) Double Touch Drag 화면을 터치한 채로 재빠르게 이동 화면을 좀 더 빠르게 스크롤 할 때 화면 내 요소를 좀 더 빠르게 이동시킬 때 Flick 화면을 누른채로 일정시간 이상 유지 - 화면 내 텍스트를 확대해서 볼 때 - 화면 내 요소에서 추가 액션을 할 때 직전에 수행했던 액션을 취소할 때 Touch and Hold 스마트폰을 손에 쥔 채로 흔들어 댐 Shake 두 손가락을 이용해 화면을 바깥쪽으로 벌리거나(Pinch Close)안쪽으로 오므림(Pinch Open) 두 손가락으로 화면을 확대하거나 축소 할 때 Pinch Open/Close 화면을 재빠르게 두번 터치 지도 비율을 확대하거나 텍스트 영역을 선택할 때 Double Tap 화면을 한 방향으로 천천히 이동하며 터치 - 화면 전체를 이동할 때(Scroll, Paging) - 화면 바깥 부분의 위젯을 꺼낼 때(Bezel Swipe) - 화면 내 요소에서 추가 액션을 할 때(List) - 이전 화면으로 갈 때(iOS7) Swipe 화면에서 특정 아이템을 선택한 채로 화면에서 손가락을 떼지 않고 손가락을 이동하여 원하는 지점에서 뗌 화면 내 요소를 특정 위치로 옮길 때 Drag UX Storyboard란, UX key-concept 구현에 수반되는 사용자 태스크와 UI feature 간의 상호작용을 시각화하여, 개발자/디자이너와의 의사소통을 돕는 도구이자, 완성해야 할 앱서비스와 예상되는 사용자경험 미리보기! Q. 도출한 핵심 UX 컨셉이 UI에 충분히 반영되었는가? Q. 기능 별 우선순위가 적절히 고려되었는가? Q. 각 기능 간 위계 및 관계가 효율적으로 구성되었는가? UI Storyboard 앱서비스의 기능과 사용자 간 상호작용 미리보기 UX design Trigger for STARTUP Team 02-2 User Task : Interaction 방식 : User Task : Interaction 방식 : User Task : Interaction 방식 : * Workflow-2 User Task : Interaction 방식 : User Task : Interaction 방식 : User Task : Interaction 방식 : * Workflow-1 ex) 사진촬영 후 sns에 공유하고 사진내용입력 Copyright ⓒ2018 POTENTIALEYES Inc. All rights reserved.
  • 6. GUI Moodboard 완성해야 할 앱서비스의 비주얼 컨셉과 시각적 사용자경험 미리보기! Step 10 Visual concept Planning‘look & Feel’ 사용자가 쉽고 편리하게 사용할 수 있도록 입출력 따위의 기능을 알기 쉬운 아이콘 따위의 그래픽으로 표현한다. 앱의 성격이나 목적, 사용자들에게 제공하려는 핵심가치에 따라서 그에 맞는 감성을 제공하는 것이 중요하다. 시스템을 사용하기 전에 느끼는 첫인상이나 시스템을 사용하고 나서 사용자가 기억할 수 있을 만한 개성을 표현하는 것이 중요하다. Visual Concept & Motive 앱의 직관적인 미적 인상(개성) 앱서비스의 컨셉을 반영할 비주얼 모티브를 찾는다. 타깃 사용자의 성향, 라이프스타일, 미적 선호도 등에 영향을 미치는 컨셉 키워드 를 작성한다. 타깃 사용자의 감성어휘 모티브 GUI Moodboard 란, UX Concept이 반영된 앱서비스 화면의 직관적인 UX - Look & Feel, 앱서비스 Brand Identity를 일관되게 반영한 Tone & Manner로 최적의 디자인컨셉을 도출하는 과정 Q. 정보의 범주를 시각적으로 어떻게 나누어 줄 것인가? Q. 시각적 구성 요소들에 대한 화면 상의 전반적인 배열과 느낌은 어떻게 보여줄 것인가? Q. 해당 앱서비스 화면의 시각적 인상, 또는 개성은 무엇인가? UX design Trigger for STARTUP Team Copyright ⓒ2018 POTENTAILEYES Inc. All rights reserved. 사용자의 성향, 감정, 정서 등의 표현 시각적 인상, 매력 등 시각적 차별화 된 ‘Look & Feel’ 앱 화면 디자인의 모티브 ex) 남성적, 여성적, 신뢰성 등 ex) 반딧불, 폭포수, 무지개 등 ex) Fun, Sexy, Casual, Classic 03 Simple & Intuition Realistic & Decorative Shape GUI 요소의 크기나 형태에 대한 계획. 매우 기본적인 요소이기 때문에 그 자체보다는 서체와 같이 여러가지 복합적인 형태로 사용된다. Mono tone Colorful Color&Tone 일상 생활에서 매우 빈번하게사용하는 디자인 요소. 디자인 컨셉은 전반적으로 색의 사용에 의해 좌우된다. GUI 전체 공간에 대한 디자인 컨셉을 작성하시오.(배경,레이아웃 등) 2D Flat 3D Dynamic Space Persona Senior Junior Formal Informal Classic Modern GUI 전체 공간에 대한 계획. 2D+Flat 또는 3D+Realistic 등의 공간을 활용한 컨셉도출이 가능하다. 퍼소나 이미지 공간 정의하기(체크) Matt Grossy Texture 실제 사물의 재질감 표현 요소. 스큐어모피즘 또는 리얼메타포 컨셉디자인 시 활용한다. San-Serif Serif Script Typography 전통적인 그래픽 디자인에서도 매우 중요한 요소. 기능적으로 의미전달이 가장 중요하나 조형미를 표현하는 그래픽 요소로도 활용 가능하다. GUI 요소의 크기나 형태에 대한 계획을 작성하시오.(그래픽 요소의 모양,크기,형태 등) Color 계획을 작성하시오.(컬러톤,색조,대비 등) 재질감 표현 계획을 작성하시오.(질감 등 시각요소의 디테일) 타이포디자인 컨셉을 작성하시오.