memmel vanderdonckt reiterer dsvis2008
TRANSCRIPT
-
8/13/2019 Memmel Vanderdonckt Reiterer DSVIS2008
1/16
Multi-Fidelity User InterfaceSpecifications
Thomas Memmel1, Jean Vanderdo nck t2, Harald Reiter er1
1Human-Computer Interaction Group, University of Konstanz,
Universittsstrasse 10, 78457 Konstanz, Germany
http://hci.uni-konstanz.de
2
Universit catholique de Louvain (UCL)Louvain School of Management (LSM) - Information Systems Unit (ISYS)
Belgian Laboratory of Computer-Human Interaction (BCHI)
http://www.isys.ucl.ac.be/bchi
-
8/13/2019 Memmel Vanderdonckt Reiterer DSVIS2008
2/16
DSV-IS2008, Kingston, Canada, July 16-18, 2008 Thomas Memmel, Jean Vanderdonckt, Harald Reiterer.
Challanges of UI Specification
2
Zetie 2005
Different disciplines, speaking different languagesSeparation of concerns (client & supplier)
Media disruptions, loss of precision, ambiguity
Lots of systems lack UI quality (usability, user experience)failure
-
8/13/2019 Memmel Vanderdonckt Reiterer DSVIS2008
3/16
DSV-IS2008, Kingston, Canada, July 16-18, 2008 Thomas Memmel, Jean Vanderdonckt, Harald Reiterer.
UI Specification Is Not A Linear Proces
3
Creating innovative interactive products requires
Leaping between abstract and detailDesigning design alternatives
Keeping the design space open as long as possible
From: Lwgren & Stolterman 2004, Thoughtful Interaction Design
-
8/13/2019 Memmel Vanderdonckt Reiterer DSVIS2008
4/16
DSV-IS2008, Kingston, Canada, July 16-18, 2008 Thomas Memmel, Jean Vanderdonckt, Harald Reiterer.
Responsibility Assignment in Corporate Projects
4
Client
Business People,Usability Experts
Avoids CASE-Tools Office dominates
Informal notationspreferred
Gulf betweenacademic methodsand industrial practice
IT Supplier
Software Engineers
Structured
approaches Formal Notations(e.g. UML)
Professional tools(GUI-Builder)
Programminglanguages
-
8/13/2019 Memmel Vanderdonckt Reiterer DSVIS2008
5/16
DSV-IS2008, Kingston, Canada, July 16-18, 2008 Thomas Memmel, Jean Vanderdonckt, Harald Reiterer.
Current Situation
Media disruptionsText-based artifacts
Document-based
requirements management
Lack of traceability
Difficult to translate into UI
IntransparentAmbiguous
Corporate UI Development Process
IT Supplier
Client
5
User Needs
GeneralRequirements
Specific UIRequirements
UI SpecificationUI Prototyping
Implementation
Feedback
Required ChangeUsability strategic factor
UE must not be outsourced
Early prototypingRapid feedback
Corporate Design
Specification incl. Design
Save rationale & artifacts electr.
IT Supplier
Client
User Needs
GeneralRequirements
Specific UIRequirements
UI PrototypingUI Specification
Implementation
Feedback
Prototyping-Driven UI Specification
-
8/13/2019 Memmel Vanderdonckt Reiterer DSVIS2008
6/16
DSV-IS2008, Kingston, Canada, July 16-18, 2008 Thomas Memmel, Jean Vanderdonckt, Harald Reiterer.
Prototyping for everybody: Comm. Tools
6
iRise
Axure
-
8/13/2019 Memmel Vanderdonckt Reiterer DSVIS2008
7/16
DSV-IS2008, Kingston, Canada, July 16-18, 2008 Thomas Memmel, Jean Vanderdonckt, Harald Reiterer.
Related Work
7
Denim/Damsk
Canon & TaskSketch
-
8/13/2019 Memmel Vanderdonckt Reiterer DSVIS2008
8/16
DSV-IS2008, Kingston, Canada, July 16-18, 2008 Thomas Memmel, Jean Vanderdonckt, Harald Reiterer.
Bringing it all together
Provide shared means of communication tosupport collaboration of different disciplines
Identify a common denominator
Overcome limitations of text-based work-style
Provide something tangibleand interactive
Determine ingredients of UI specification
Support switching between abstract and detail
(multi-fidelity) Provide traceability and transparency
Save design rationale
8
-
8/13/2019 Memmel Vanderdonckt Reiterer DSVIS2008
9/16
DSV-IS2008, Kingston, Canada, July 16-18, 2008 Thomas Memmel, Jean Vanderdonckt, Harald Reiterer.
Interactive UI Specification Explained
9
Interactive UI Prototypes Interactive UI Specifications
Vehicle for requirementsanalysis
Vehicle for requirementsspecification
Exclusively models the UI layer;
may be inconsistent with
specification and graphicalnotations
Allows drill down from UI to
models; relates UI to
requirements and vice versa
Either low-fidelity or high-fidelity Multi-Fidelity: Several levels of
detail
Supplements text-based
specification
Alternative to text-based UI
specification
Design rationale saved in other
documents
Incorporates design knowledge
and rationale
-
8/13/2019 Memmel Vanderdonckt Reiterer DSVIS2008
10/16
DSV-IS2008, Kingston, Canada, July 16-18, 2008 Thomas Memmel, Jean Vanderdonckt, Harald Reiterer.
Model-driven vs. Model-based
Model-driven UI specification Uses formal, predefined models
Allows code generation directly from models
Very suitable for straight forward design solutions or
when design space is constrained
Model-based UI specification
Is based on models, but no need to code generation
Models visualize requirements More appropriate when innovation is required and
disciplines must be bridged
10
-
8/13/2019 Memmel Vanderdonckt Reiterer DSVIS2008
11/16
Mayhew, Rosson &
Caroll, Constantine
Constantine,
Ambler, Beck
Holt, Ambler
1. Usability Engineering
High-Fi Prototype
Low-Fi Prototype,Conceptual Model
UI Storyboard,Navigation Map
Flow Chart,Process Model
Task Map
Task Case
Personas, User
Scenario, User Role
Activity, Information,Interaction Scenario
2. Software Engineering
Pilot System
Essential UI Prototype
Use Case Storyboard,UI Flow Diagram
Activity, Robustness &Sequence Diagram
Use Case Diagram
(Essential) Use Case
User Story, User Role,
Personas
Usage Scenario
3. Business ProcessModelling
Power Point Prototype
Mockups
UI Slide Show, UIStoryboard
Activity, Class &
SequenceDiagram
Use Case Diagram
Business Use Case
Class Diagram,
Business Roles
Business Vision
4. Common Denominator
Detailed Prototype
Abstract Prototype
UI Storyboard
Flow Chart, Activity &Data Flow Diagram
Use Case Diagram,Task Map
(Essential) Use Case
Personas, User Role,
Role Map
Scenario Map
Levelofabstraction
:Textto
UIdesign
Define a common denominator for interdisciplinary UI modelling (Bridge the gaps)
New Research
-
8/13/2019 Memmel Vanderdonckt Reiterer DSVIS2008
12/16
DSV-IS2008, Kingston, Canada, July 16-18, 2008 Thomas Memmel, Jean Vanderdonckt, Harald Reiterer.
Zooming through Levels of Abstraction
12
Drawing is based on Garrett, Jesse J. (2002). The Elements of User Experience: User-Centered Design for the Web. New Riders Press.
-
8/13/2019 Memmel Vanderdonckt Reiterer DSVIS2008
13/16
DSV-IS2008, Kingston, Canada, July 16-18, 2008 Thomas Memmel, Jean Vanderdonckt, Harald Reiterer.
Evaluation
Interviews (n=7): Very positive feedback;experts expect improvement of work style
through multi-fidelity approach
Long-term diary study (4 weeks; n=8)
Rapid enhancement of tool usability (1.75 to 4.25)
Incorporated contextual layer
Support masters/templates, creation of patterns
Versioning of specification objects (design rationale) Annotation support, defect management console
Ongoing expert interviews (e.g. SIEMENS AG)
13
-
8/13/2019 Memmel Vanderdonckt Reiterer DSVIS2008
14/16
DSV-IS2008, Kingston, Canada, July 16-18, 2008 Thomas Memmel, Jean Vanderdonckt, Harald Reiterer.
Future Work: Collaboration
14
-
8/13/2019 Memmel Vanderdonckt Reiterer DSVIS2008
15/16
DSV-IS2008, Kingston, Canada, July 16-18, 2008 Thomas Memmel, Jean Vanderdonckt, Harald Reiterer.
Summary
Towards a common denominator for UI-related modeling in non-IT organizations
Include business process modeling in
research on bridging in the gaps
Idea of interactive UI specifications
Situation-dependant alternative to model-
driven UI specification methods
Experimental tool-support to encourage
collaboration and creativity
15
-
8/13/2019 Memmel Vanderdonckt Reiterer DSVIS2008
16/16
DSV-IS2008, Kingston, Canada, July 16-18, 2008 Thomas Memmel, Jean Vanderdonckt, Harald Reiterer.
Thank you very much for your attention
http://www.usixml.org
User Interface eXtensible Markup Language
http://hci.uni-konstanz.de/INSPECTORWebsite of INSPECTOR method & tool
http://www.irise.com
The iRise prototyping and specification tool
http://www.axure.com
The Axure Pro prototyping and specification tool
http://www.usixml.org/http://hci.uni-konstanz.de/INSPECTORhttp://www.irise.com/http://www.axure.com/http://www.axure.com/http://www.irise.com/http://hci.uni-konstanz.de/INSPECTORhttp://hci.uni-konstanz.de/INSPECTORhttp://hci.uni-konstanz.de/INSPECTORhttp://www.usixml.org/