Problem driven
Goal directed Design
Hitchhiker’s guide to the UI design


               한상택
Information Design + Problem Solving
+ Prototyping

Pxd, Inc.
User Centered Design

User
                  ?
                                     Design
Research                       ...
Goal directed Design
• If achieving the user’s goal, the user will be
  satisfied and happy. Success.
• A goal is end cond...
Problem driven Goal directed Design
• A goal is the problems solved condition.
Design
• Understanding the user’s wants, needs, motivations, and contexts
• Understanding business, technical, and domain ...
Design
• Understanding the user’s wants, needs, motivations, and contexts
• Understanding business, technical, and domain ...
좋은 디자인

사람을 행복하게 하는것
“
행복한 가정은 모두 모습이 비슷하고,
불행한 가정은 모두 제 각각의 불행을 안고 있다.



                          ”
행복은

불행의 부재
좋은 디자인은

    문제가 없는 것

Problem driven design
Innovation
   Vs.

 Kaizen
Local Optimum
Better but not best
Innovation
Incremental, radical, and revolutionary changes in
   thinking, products, processes, or organizations


       ...
디자인의 적
혁신에 대한 강박
 혁신은 결과
Problem Diagnosis

근본 문제는 무엇인가?

•   Redefine Problems

•   Expand Solution domain
Universial Design
누구의 문제?


• Primary Persona 일반인 넓은 좌석
• Secondary Persona 장애인 넓은 통로
Diagnosis
문제는 무엇인가?


Symptom - 휠체어로 이동할 수 없는 좁은 통로
Problem Redefine – 통로 이용이 불편하다
Solution – 출입구쪽 자리를 배정해준다. 특실의 출입구 쪽 좌석...
우리는 사용자의 문제를 정말 알고있나?
1.문제정의

문제 정의와 해결 과정 분리


     문제해결            문제정의


Instinct
위험이 닥치면 바로 피한다
바로 디자인 스케치 한다         해결
문제정의
누구의 문제인가?
• Positioning (target market)
• Personas (target customer)

무엇이 (가장) 문제인가?
• TOC (constraint)
• Contextual ...
needs

Needs : actual, negative → problem

Wants : assumptive, positive → solution


   “통로가 넓으면 좋겠어요”           문제가 아님

 ...
2. 해결
Steal it!


Design Patterns
Other Domain’s Solution (interdiscipline)


답이 안 나오면 문제를 다시 정의해본다
3.반복

기존 시스템/
 디자인




 문제정의     평가/선택




  해결
Recursion

•       TOC

•       Divide and conquer
    –     framework, workflow, wireframe,
          information design
...
Problem driven design
                   기존 시스템/
     Find needs     디자인




Redefine problem     문제정의                평가/선...
Case study

아이폰 네이버 블로그 리디자인

http://j.mp/uxredesign
진단
응급실의 ABC


Airway 기도유지
Breathing 호흡유지   Flow
Circulation 순환
Flow


작업 흐름 - Information Architecture
시선 흐름 - Information Priority
동작 흐름 - Interaction
iPod’s Hierarchical Structure         이전



        목록                      컨텐트




                                      ...
목록을 랜덤하게 찾아보나?   모든 글을 순차적으로 읽나?

    목록                컨텐트
progressive disclosure
Random Access - Link rich
Information Priority
 나는 네이버 블로그를 보고 있다는게 제일 중요한가?
 누구의 블로그인지 보다 내블로그로 가는게 중요한가?
사실 누가 덧글을 썼는지 관심없다. 주인말고는.
숫자의 나열은 언제인지 잘 알려주지 못한다.
모바일 사용 환경
책상 앞에 앉아서가 아니라 지하철을 타고가면서,
걸으면서 읽어봤어?
Smart Scrollbar
고맙습니다.



twitter.com/taekie
Problem Driven Goal Directed Design 아이폰 웹어플 리디자인
Problem Driven Goal Directed Design 아이폰 웹어플 리디자인
Problem Driven Goal Directed Design 아이폰 웹어플 리디자인
Upcoming SlideShare
Loading in …5
×

Problem Driven Goal Directed Design 아이폰 웹어플 리디자인

5,593 views

Published on

@uxcampseoul 날로먹는UI디자인방법론 발표자료입니다. 케이스스터디로 아이폰의 네이버블로그 리디자인 작업을 소개하였습니다.

퍼소나나 컨텍스츄얼 디자인같은 UCD 방법론이 낯선 분은 이재용님의 퍼소나 튜터리얼 발표자료를 먼저 보시면 좋을것 같습니다.다.http://www.slideshare.net/arangyi/persona-3323174

Published in: Design, Technology, Education

Problem Driven Goal Directed Design 아이폰 웹어플 리디자인

  1. 1. Problem driven Goal directed Design Hitchhiker’s guide to the UI design 한상택
  2. 2. Information Design + Problem Solving + Prototyping Pxd, Inc.
  3. 3. User Centered Design User ? Design Research Result User Data Method Context Goal directed design User Values Personas Goals Contextual design Scenarios
  4. 4. 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
  5. 5. Problem driven Goal directed Design • A goal is the problems solved condition.
  6. 6. 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
  7. 7. 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 • 문제를 찾고 • 그것을 해결한다
  8. 8. 좋은 디자인 사람을 행복하게 하는것
  9. 9. “ 행복한 가정은 모두 모습이 비슷하고, 불행한 가정은 모두 제 각각의 불행을 안고 있다. ”
  10. 10. 행복은 불행의 부재
  11. 11. 좋은 디자인은 문제가 없는 것 Problem driven design
  12. 12. Innovation Vs. Kaizen
  13. 13. Local Optimum Better but not best
  14. 14. Innovation Incremental, radical, and revolutionary changes in thinking, products, processes, or organizations 0 → + innovation - → 0 improvement △ > α innovation △ < α improvement
  15. 15. 디자인의 적 혁신에 대한 강박 혁신은 결과
  16. 16. Problem Diagnosis 근본 문제는 무엇인가? • Redefine Problems • Expand Solution domain
  17. 17. Universial Design 누구의 문제? • Primary Persona 일반인 넓은 좌석 • Secondary Persona 장애인 넓은 통로
  18. 18. Diagnosis 문제는 무엇인가? Symptom - 휠체어로 이동할 수 없는 좁은 통로 Problem Redefine – 통로 이용이 불편하다 Solution – 출입구쪽 자리를 배정해준다. 특실의 출입구 쪽 좌석을 장 애인용으로 배정하여 일반요금으로 제공한다.
  19. 19. 우리는 사용자의 문제를 정말 알고있나?
  20. 20. 1.문제정의 문제 정의와 해결 과정 분리 문제해결 문제정의 Instinct 위험이 닥치면 바로 피한다 바로 디자인 스케치 한다 해결
  21. 21. 문제정의 누구의 문제인가? • Positioning (target market) • Personas (target customer) 무엇이 (가장) 문제인가? • TOC (constraint) • Contextual Design (task analysis)
  22. 22. needs Needs : actual, negative → problem Wants : assumptive, positive → solution “통로가 넓으면 좋겠어요” 문제가 아님 “통로를 다니기 불편해요”
  23. 23. 2. 해결 Steal it! Design Patterns Other Domain’s Solution (interdiscipline) 답이 안 나오면 문제를 다시 정의해본다
  24. 24. 3.반복 기존 시스템/ 디자인 문제정의 평가/선택 해결
  25. 25. Recursion • TOC • Divide and conquer – framework, workflow, wireframe, information design • Agile process – Design, test
  26. 26. Problem driven design 기존 시스템/ Find needs 디자인 Redefine problem 문제정의 평가/선택 prototyping 해결 Steal Design Pattern Borrow from other domain
  27. 27. Case study 아이폰 네이버 블로그 리디자인 http://j.mp/uxredesign
  28. 28. 진단 응급실의 ABC Airway 기도유지 Breathing 호흡유지 Flow Circulation 순환
  29. 29. Flow 작업 흐름 - Information Architecture 시선 흐름 - Information Priority 동작 흐름 - Interaction
  30. 30. iPod’s Hierarchical Structure 이전 목록 컨텐트 다음
  31. 31. 목록을 랜덤하게 찾아보나? 모든 글을 순차적으로 읽나? 목록 컨텐트
  32. 32. progressive disclosure
  33. 33. Random Access - Link rich
  34. 34. Information Priority 나는 네이버 블로그를 보고 있다는게 제일 중요한가? 누구의 블로그인지 보다 내블로그로 가는게 중요한가?
  35. 35. 사실 누가 덧글을 썼는지 관심없다. 주인말고는. 숫자의 나열은 언제인지 잘 알려주지 못한다.
  36. 36. 모바일 사용 환경 책상 앞에 앉아서가 아니라 지하철을 타고가면서, 걸으면서 읽어봤어?
  37. 37. Smart Scrollbar
  38. 38. 고맙습니다. twitter.com/taekie

×