대덕대학교 출결시스템교수자안내 - ddu.ac.kr · 2-1. 안드로이드용설치및설정 2-2. ios(아이폰)용설치및설정 2-3. ios(아이폰) 경고창시설정 03.
Problem Driven Goal Directed Design 아이폰 웹어플 리디자인
-
Upload
sangtaek-hahn -
Category
Design
-
view
5.470 -
download
3
description
Transcript of Problem Driven Goal Directed Design 아이폰 웹어플 리디자인
![Page 1: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/1.jpg)
Problem driven Goal directed Design
Hitchhiker’s guide to the UI design
한상택
![Page 2: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/2.jpg)
Information Design + Problem Solving + Prototyping
Pxd, Inc.
![Page 3: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/3.jpg)
User Centered Design
?User DataContextUser ValuesGoalsScenarios
User Research
Design Result
MethodGoal directed designPersonasContextual design
![Page 4: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/4.jpg)
Goal directed Design
• If achieving the user’s goal, the user will be satisfied and happy. Success.
• A goal is end condition.
• Goals motivate people to perform tasks.
About face 2.0: the essentials of interaction design
Alan Cooper, Robert Reimann
![Page 5: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/5.jpg)
Problem driven Goal directed Design
• A goal is the problems solved condition.
![Page 6: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/6.jpg)
Design• Understanding the user’s wants, needs, motivations, and contexts
• Understanding business, technical, and domain requirements and constraints
• Translating this knowledge into plans for artifacts whose form,content and behavior is useful, usable,and desirable, as well as economically viable and technically feasible
About face 2.0: the essentials of interaction design
Alan Cooper, Robert Reimann
![Page 7: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/7.jpg)
Design• Understanding the user’s wants, needs, motivations, and contexts
• Understanding business, technical, and domain requirements and constraints
• Translating this knowledge into plans for artifacts whose form,content and behavior is useful, usable,and desirable, as well as economically viable and technically feasible
• 문제를 찾고
• 그것을 해결한다
![Page 8: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/8.jpg)
좋은 디자인
사람을 행복하게 하는것
![Page 9: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/9.jpg)
행복한 가정은 모두 모습이 비슷하고,
불행한 가정은 모두 제 각각의 불행을 안고 있다.
“”
![Page 10: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/10.jpg)
행복은
불행의 부재
![Page 11: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/11.jpg)
좋은 디자인은
문제가 없는 것
Problem driven design
![Page 12: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/12.jpg)
InnovationVs.
Kaizen
![Page 13: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/13.jpg)
Local OptimumBetter but not best
![Page 14: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/14.jpg)
Innovation
Incremental, radical, and revolutionary changes in thinking, products, processes, or organizations
0 → + innovation
- → 0 improvement
△ > α innovation
△ < α improvement
![Page 15: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/15.jpg)
디자인의 적
혁신에 대한 강박
혁신은 결과
![Page 16: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/16.jpg)
![Page 17: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/17.jpg)
Problem Diagnosis
근본 문제는 무엇인가?
• Redefine Problems
• Expand Solution domain
![Page 18: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/18.jpg)
![Page 19: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/19.jpg)
Universial Design
누구의 문제?
• Primary Persona 일반인 넓은 좌석
• Secondary Persona 장애인 넓은 통로
![Page 20: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/20.jpg)
Diagnosis
문제는 무엇인가?
Symptom - 휠체어로 이동할 수 없는 좁은 통로
Problem Redefine – 통로 이용이 불편하다
Solution – 출입구쪽 자리를 배정해준다. 특실의 출입구 쪽 좌석을 장애인용으로 배정하여 일반요금으로 제공한다.
![Page 21: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/21.jpg)
우리는 사용자의 문제를 정말 알고있나?
![Page 22: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/22.jpg)
![Page 23: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/23.jpg)
1.문제정의
문제정의
해결
문제해결
Instinct위험이 닥치면 바로 피한다바로 디자인 스케치 한다
문제정의와해결과정분리
![Page 24: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/24.jpg)
문제정의
누구의 문제인가?
• Positioning (target market)
• Personas (target customer)
무엇이 (가장) 문제인가?
• TOC (constraint)
• Contextual Design (task analysis)
![Page 25: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/25.jpg)
needs
Needs : actual, negative → problem
Wants : assumptive, positive → solution
“통로가 넓으면 좋겠어요”
“통로를 다니기 불편해요”
문제가 아님
![Page 26: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/26.jpg)
2. 해결
Steal it!
Design Patterns
Other Domain’s Solution (interdiscipline)
답이 안 나오면 문제를 다시 정의해본다
![Page 27: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/27.jpg)
3.반복
문제정의
해결
기존 시스템/디자인
평가/선택
![Page 28: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/28.jpg)
Recursion
• TOC
• Divide and conquer
– framework, workflow, wireframe,
information design
• Agile process
– Design, test
![Page 29: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/29.jpg)
Problem driven design
문제정의
해결
기존 시스템/디자인
평가/선택
Find needs
Redefine problem prototyping
StealDesign PatternBorrow from other domain
![Page 30: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/30.jpg)
Case study
아이폰 네이버 블로그 리디자인
http://j.mp/uxredesign
![Page 31: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/31.jpg)
진단
응급실의 ABC
Airway 기도유지
Breathing 호흡유지
Circulation 순환
Flow
![Page 32: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/32.jpg)
Flow
작업 흐름 - Information Architecture
시선 흐름 - Information Priority
동작 흐름 - Interaction
![Page 33: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/33.jpg)
목록 컨텐트
이전
다음
iPod’s Hierarchical Structure
![Page 34: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/34.jpg)
모든 글을 순차적으로 읽나?목록을 랜덤하게 찾아보나?
목록 컨텐트
![Page 35: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/35.jpg)
progressive disclosure
![Page 36: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/36.jpg)
Random Access - Link rich
![Page 37: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/37.jpg)
Information Priority
나는 네이버 블로그를 보고 있다는게 제일 중요한가?누구의 블로그인지 보다 내블로그로 가는게 중요한가?
![Page 38: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/38.jpg)
사실 누가 덧글을 썼는지 관심없다. 주인말고는.숫자의 나열은 언제인지 잘 알려주지 못한다.
![Page 39: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/39.jpg)
모바일 사용 환경
책상 앞에 앉아서가 아니라 지하철을 타고가면서,걸으면서 읽어봤어?
![Page 40: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/40.jpg)
Smart Scrollbar
![Page 41: Problem Driven Goal Directed Design 아이폰 웹어플 리디자인](https://reader033.fdocuments.net/reader033/viewer/2022051208/5479322eb37959652b8b46cb/html5/thumbnails/41.jpg)
twitter.com/taekie
고맙습니다.