p-tab a multidisciplinary participatory design environment

42
P-Tab A Multidisciplinary Participatory Design Environment Human-Centered Software Engineering Group Concordia University http:// hci.cs.concordia.ca/www/ hcse/ Jonathan Benn B.Eng. Software Engineering M.Sc. Computer Science (in progress) [email protected]

Upload: nira

Post on 02-Feb-2016

23 views

Category:

Documents


0 download

DESCRIPTION

P-Tab A Multidisciplinary Participatory Design Environment. Jonathan Benn B.Eng. Software Engineering M.Sc. Computer Science (in progress) [email protected]. Human-Centered Software Engineering Group Concordia University http://hci.cs.concordia.ca/www/hcse/. Outline. - PowerPoint PPT Presentation

TRANSCRIPT

Page 1: P-Tab A Multidisciplinary Participatory Design Environment

P-TabA Multidisciplinary Participatory

Design Environment

Human-Centered Software Engineering Group

Concordia University

http://hci.cs.concordia.ca/www/hcse/

Jonathan BennB.Eng. Software Engineering

M.Sc. Computer Science (in progress)

[email protected]

Page 2: P-Tab A Multidisciplinary Participatory Design Environment

2

Outline

• Introduction to Design• Introduction to HCD• Introduction to P-Tab• P-Tab and the Design Process

– Brainstorming– Design Patterns– Interactivity– Metaphors

• Conclusion

Page 3: P-Tab A Multidisciplinary Participatory Design Environment

3

Introduction to Design

• What is software design?– Tradeoffs, constraints and stakeholders– Describes how “software is decomposed and

organized into components.”– Describes the “interfaces between those

components… at a level of detail that [enables] their construction.”

Source: Software Engineering Body of Knowledge (SWEBOK). http://www.swebok.org/

Page 4: P-Tab A Multidisciplinary Participatory Design Environment

4

Importance of S/W Design

• Work distribution

• Maintenance

• All domains and disciplines

Page 5: P-Tab A Multidisciplinary Participatory Design Environment

5

The Design Process

2Analyze needsand build blackbox model of

problem

1Clarify

nature ofrequirements

3Postulate awhite box

designsolution

4Validate solution

(including useof prototypes)

5Implementation

of the design planusing a suitable

form ofsoftware

External requirements

Source: D. Budgen. Software Design. 2nd Ed. Addison-Wesley, 2003.

Page 6: P-Tab A Multidisciplinary Participatory Design Environment

6

Why is Design Difficult?

“The fundamental problem is that designers are obliged to use current information to predict a future state that will not come about unless their predictions are correct.”

--J. Christopher Jones

Source: J.C. Jones. Design Methods: Seeds of Human Futures. 1970.

Page 7: P-Tab A Multidisciplinary Participatory Design Environment

7

Outline

• Introduction to Design• Introduction to HCD• Introduction to P-Tab• P-Tab and the Design Process

– Brainstorming– Design Patterns– Interactivity– Metaphors

• Conclusion

Page 8: P-Tab A Multidisciplinary Participatory Design Environment

8

Introduction to HCD

• Human Centered Design– User focus– Multi-disciplinary– Iterative development

Page 9: P-Tab A Multidisciplinary Participatory Design Environment

9

Peanut Butter Theory

• Peanut Butter Theory Approach– UI is a thin spread– User is an afterthought

– Focus is on system functionalities

• Human-Centered Approach– UI has a major focus– User is a primary

stakeholder– Focus is on user tasks

Page 10: P-Tab A Multidisciplinary Participatory Design Environment

10

The Problem

• HCD is a good thing, but…

• Challenges– User communication– Team communication– Supportive environment

• A solution

Page 11: P-Tab A Multidisciplinary Participatory Design Environment

11

Outline

• Introduction to Design• Introduction to HCD• Introduction to P-Tab• P-Tab and the Design Process

– Brainstorming– Design Patterns– Interactivity– Metaphors

• Conclusion

Page 12: P-Tab A Multidisciplinary Participatory Design Environment

12

Introduction to P-Tab

• Participatory Tangible Board– Concordia University– HCSE group & OBX

lab

• What is it?

• The P-Tab Group– Dr. Ahmed Seffah– Antoine Morris– James Maciukenas– Prof. Jason Lewis– Jonathan Benn– Rozita Naghshin

Page 13: P-Tab A Multidisciplinary Participatory Design Environment

13

Artist’s Conception

Page 14: P-Tab A Multidisciplinary Participatory Design Environment

14

P-Tab Characteristics

• Two distinct user groups– Software engineers– Digital media artists and designers

• Additional features/constraints– Network access– Interoperability

Page 15: P-Tab A Multidisciplinary Participatory Design Environment

15

Challenges

• P-Tab– Research, not engineering

• How to enable participatory design– Brainstorming– Design Patterns– Interactivity– Metaphors

• Studies

Page 16: P-Tab A Multidisciplinary Participatory Design Environment

16

Outline

• Introduction to Design• Introduction to HCD• Introduction to P-Tab• P-Tab and the Design Process

– Brainstorming– Design Patterns– Interactivity– Metaphors

• Conclusion

Page 17: P-Tab A Multidisciplinary Participatory Design Environment

17

Back to the Design Process

2Analyze needsand build blackbox model of

problem

1Clarify

nature ofrequirements

3Postulate awhite box

designsolution

4Validate solution

(including useof prototypes)

5Implementation

of the design planusing a suitable

form ofsoftware

External requirements

Page 18: P-Tab A Multidisciplinary Participatory Design Environment

18

Back to the Design Process

1Clarify

nature ofrequirements

5Implementation

of the design planusing a suitable

form ofsoftware

External requirements

Interactivity

Brainstorming Design Patterns

4Validate solution

(including useof prototypes)

2Analyze needsand build blackbox model of

problem

3Postulate awhite box

designsolution

Interactivity + Metaphors

Page 19: P-Tab A Multidisciplinary Participatory Design Environment

19

Brainstorming

• Supporting brainstorming– Freeform tools– Flexible visualization tools

• Annotation– Audio/visual

Page 20: P-Tab A Multidisciplinary Participatory Design Environment

20

Freeform Tools

Source: Smart Technologies. Smart Ideas Concept-Mapping Software. http://www2.smarttech.com/st/en-US/Products/SMART+Ideas/Features.htm

Page 21: P-Tab A Multidisciplinary Participatory Design Environment

21

Design Patterns

• Reuse solutions

• Common terminology

• High-level perspective

Source: A. Shalloway and J. R. Trott. Design Patterns Explained: A New Perspective on Object-Oriented Design. Addison-Wesley, 2001.

Page 22: P-Tab A Multidisciplinary Participatory Design Environment

22

Carpentry Example

• Carpenter 1: “How do you think we should build these drawers?”

• Carpenter 2: “Well, I think we should make the joint by cutting straight down into the wood, and then cut back up 45 degrees, and then going straight back down, and then back up the other way 45 degrees, and then going straight back down, and then…”

Source: A. Shalloway and J. R. Trott. Design Patterns Explained: A New Perspective on Object-Oriented Design. Addison-Wesley, 2001.

Page 23: P-Tab A Multidisciplinary Participatory Design Environment

23Source: A. Shalloway and J. R. Trott. Design Patterns Explained: A New

Perspective on Object-Oriented Design. Addison-Wesley, 2001.

Page 24: P-Tab A Multidisciplinary Participatory Design Environment

24

Patterns Are High-Level

• Question: Should we use a dovetail joint or a miter joint?

• Translation: Should we use an expensive and durable joint, or should we make a cheaper but less durable joint?

Source: A. Shalloway and J. R. Trott. Design Patterns Explained: A New Perspective on Object-Oriented Design. Addison-Wesley, 2001.

Page 25: P-Tab A Multidisciplinary Participatory Design Environment

25

Interactivity

• Audio/visual annotation

• Software agents

• Digital libraries

• Prototypes

• Design Visualization– Zoom levels– Fisheye views– Customizable views

Page 26: P-Tab A Multidisciplinary Participatory Design Environment

26Source: A. Repenning and A. Ioannidou. Agent-Based End-User Development.

Communications of the ACM, September 2004.

The Bridge Builder

Page 27: P-Tab A Multidisciplinary Participatory Design Environment

27Source: O. Turetken, D. Schuff, R. Sharda, and T. T. Ow. Supporting systems

analysis and design through fisheye views. Com. of the ACM, September 2004.

Page 28: P-Tab A Multidisciplinary Participatory Design Environment

28Source: O. Turetken, D. Schuff, R. Sharda, and T. T. Ow. Supporting systems

analysis and design through fisheye views. Com. of the ACM, September 2004.

Page 29: P-Tab A Multidisciplinary Participatory Design Environment

29Source: O. Turetken, D. Schuff, R. Sharda, and T. T. Ow. Supporting systems

analysis and design through fisheye views. Com. of the ACM, September 2004.

Page 30: P-Tab A Multidisciplinary Participatory Design Environment

30

UI Design Metaphor

• Design metaphor

• Tangible objects

• Impacts– Learnability– Comprehension– Satisfaction

• Metaphors and P-Tab

Page 31: P-Tab A Multidisciplinary Participatory Design Environment

31

Page 32: P-Tab A Multidisciplinary Participatory Design Environment

32Source: Black & White game. Courtesy of Strategy Informer.

http://www.strategyinformer.com/screenshots/blackwhite.shtml

Page 33: P-Tab A Multidisciplinary Participatory Design Environment

33Source: Black & White game. Courtesy of Strategy Informer.

http://www.strategyinformer.com/screenshots/blackwhite.shtml

Page 34: P-Tab A Multidisciplinary Participatory Design Environment

34

Outline

• Introduction to Design• Introduction to HCD• Introduction to P-Tab• P-Tab and the Design Process

– Brainstorming– Design Patterns– Interactivity– Metaphors

• Conclusion

Page 35: P-Tab A Multidisciplinary Participatory Design Environment

35

P-Tab Applications

• Software design

• User-interface design

• User-interface testing

• PMix

Page 36: P-Tab A Multidisciplinary Participatory Design Environment

36

Some Existing Research

• P-Tab vs. other research• IBM’s Rational Rose• AIRE group and DRG at MIT

– http://www.ai.mit.edu/projects/aire/projects.shtml– http://www.rationale.csail.mit.edu/projects.shtml

• HCII at Carnegie Mellon– http://www-2.cs.cmu.edu/~NatProg/

• GUIR at Berkeley– http://guir.berkeley.edu/projects/denim/

Page 37: P-Tab A Multidisciplinary Participatory Design Environment

37

floating.numbers

Source: Jewish Museum, Berlin, Germany. http://www.artcom.de/

Page 38: P-Tab A Multidisciplinary Participatory Design Environment

38Source: Walker Art Center, Minneapolis, USA. http://dialogtable.com/

Dialog Table

Page 39: P-Tab A Multidisciplinary Participatory Design Environment

39

Hmm… Looks Like Fun

Source: Walker Art Center, Minneapolis, USA. http://dialogtable.com/

Page 40: P-Tab A Multidisciplinary Participatory Design Environment

40

How It Works

Source: Walker Art Center, Minneapolis, USA. http://dialogtable.com/

Page 41: P-Tab A Multidisciplinary Participatory Design Environment

41

Acknowledgements

• Many images:– Rozita Naghshin

• Constructive criticism and ideas:– Dr. Ahmed Seffah– James Maciukenas– Prof. Jason Lewis– Rozita Naghshin

Page 42: P-Tab A Multidisciplinary Participatory Design Environment

42

Any Questions?

Human-Centered Software Engineering Group

Concordia University

http://hci.cs.concordia.ca/www/hcse/

Jonathan BennB.Eng. Software Engineering

M.Sc. Computer Science (in progress)

[email protected]

http://www.cs.concordia.ca/~benn/publications/