Multi-Fidelity Prototyping of User Interfaces
Download as PPT, PDF1 like731 views
1. The document discusses multi-fidelity prototyping of user interfaces, which allows designers to create low, medium, and high fidelity prototypes at different stages of the design process. 2. A survey was conducted with 12 participants to evaluate the usability of sketching user interfaces at different fidelity levels. The results showed that fidelity had no influence on sketching time and users were faster than designers. 3. Overall, participants rated the sketching tool positively and preferred medium and high fidelity levels for sketching interfaces. The study provides insights into multi-fidelity prototyping to support the user interface design process.
![2 Interact 2007 – Rio de Janeiro, Brazil, 14 September, 2007
Motivations
User interface determines how easily a user may control
underlying functions of a computer program
A program equipped with powerful functionalities
and low quality user interfaces may be under-
exploited or misused
In an interactive application, the UI is probably the portion
which affects the most the general acceptability of the
system by end users [Niel93]
[Nielsen 93]](https://image.slidesharecdn.com/coyette-interact2007-150408132539-conversion-gate01/85/Multi-Fidelity-Prototyping-of-User-Interfaces-2-320.jpg)
![3 Interact 2007 – Rio de Janeiro, Brazil, 14 September, 2007
Motivations
As it was the case in software engineering, HCI
communities wanted to develop a well-structured
method for developing user interfaces
However, the systematization, and the reproducibility
found in software engineering methods cannot be
transposed equally in HCI: the development life cycle
remains inherently:
Open
Ill-defined
Highly iterative
[LimbourgLimbourg, 2004]](https://image.slidesharecdn.com/coyette-interact2007-150408132539-conversion-gate01/85/Multi-Fidelity-Prototyping-of-User-Interfaces-3-320.jpg)
![4 Interact 2007 – Rio de Janeiro, Brazil, 14 September, 2007
Motivations
Designers often consider that informal
techniques based on low fidelity mock up is the
best alternative for the early design phase
It allows to cope with the fact the such process
is eminently open, iterative and incomplete
[SumnerSumner, 1997]](https://image.slidesharecdn.com/coyette-interact2007-150408132539-conversion-gate01/85/Multi-Fidelity-Prototyping-of-User-Interfaces-4-320.jpg)
![5 Interact 2007 – Rio de Janeiro, Brazil, 14 September, 2007
Motivations
Empirical observations: (3 points)
Such approach allows to reduce the time needed
between the cycle
Permit to involve the end user in the process since
few technical background is required
And rises as many usability problems than using
high fidelity mock-ups
[Virzi and AlVirzi and Al, 1996]](https://image.slidesharecdn.com/coyette-interact2007-150408132539-conversion-gate01/85/Multi-Fidelity-Prototyping-of-User-Interfaces-5-320.jpg)
Multi-Fidelity Prototyping of User Interfaces
- 1. 1 Interact 2007 – Rio de Janeiro, Brazil, 14 September, 2007 Multi-Fidelity Prototyping of User Interfaces Adrien Coyette, Suzanne Kieffer & Jean Vanderdonckt Université catholique de Louvain (UCL) School of Management (IAG) Information Systems Unit (ISYS) Belgian Lab. of Computer-Human Interaction (BCHI) http://www.isys.ucl.ac.be/bchi
- 2. 2 Interact 2007 – Rio de Janeiro, Brazil, 14 September, 2007 Motivations User interface determines how easily a user may control underlying functions of a computer program A program equipped with powerful functionalities and low quality user interfaces may be under- exploited or misused In an interactive application, the UI is probably the portion which affects the most the general acceptability of the system by end users [Niel93] [Nielsen 93]
- 3. 3 Interact 2007 – Rio de Janeiro, Brazil, 14 September, 2007 Motivations As it was the case in software engineering, HCI communities wanted to develop a well-structured method for developing user interfaces However, the systematization, and the reproducibility found in software engineering methods cannot be transposed equally in HCI: the development life cycle remains inherently: Open Ill-defined Highly iterative [LimbourgLimbourg, 2004]
- 4. 4 Interact 2007 – Rio de Janeiro, Brazil, 14 September, 2007 Motivations Designers often consider that informal techniques based on low fidelity mock up is the best alternative for the early design phase It allows to cope with the fact the such process is eminently open, iterative and incomplete [SumnerSumner, 1997]
- 5. 5 Interact 2007 – Rio de Janeiro, Brazil, 14 September, 2007 Motivations Empirical observations: (3 points) Such approach allows to reduce the time needed between the cycle Permit to involve the end user in the process since few technical background is required And rises as many usability problems than using high fidelity mock-ups [Virzi and AlVirzi and Al, 1996]
- 6. 6 Interact 2007 – Rio de Janeiro, Brazil, 14 September, 2007 Prototyping Early design Late design Low fidelity paper prototypes Content: Mainly Presentation Use: Exploration, Communication Medium fidelity prototypes Content: Presentation, content, basic navigation Use: Simulation, refinement, user testing… High fidelity prototypes Content: Presentation, navigation, functionalities, content Use: Final specifications, marketing, documentation A paper based prototype A PowerPoint prototype The final user interface with few functionalities
- 7. 7 Interact 2007 – Rio de Janeiro, Brazil, 14 September, 2007 Sketches • Paper prototypes – familiar and unconstrained approach – fast to learn and quick to produce – focus on basic structural issues instead of unimportant details – can be performed collaboratively between designers and end-users – … • Purpose – Early design phase – Get a sense of the user's needs and goals – brainstorm competing representations – …
- 8. 8 Interact 2007 – Rio de Janeiro, Brazil, 14 September, 2007 Computer Assisted Prototyping DENIM(James A. Landay, James Lin, Mark W. Newman, Jason I. Hong) http://dub.washington.edu/denim/ Several levels of granularity Support for scenario- based design Good documentation No shape recognition and interpretation No code generationNo preview mode
- 9. 9 Interact 2007 – Rio de Janeiro, Brazil, 14 September, 2007 Computer Assisted Prototyping JavaSketchIt (Joaquim A. Jorge, Manuel João Fonseca, Anabela Caetano, Néri Goulart ) http://immi.inesc-id.pt/project_page.php?project_id=21 Performance (speed and accuracy)Multi-stroke gesturesRecognizes rotated shapes Interpretation in Java Only generates Java No scenario editor Limited widget setMono-window
- 10. 10 Interact 2007 – Rio de Janeiro, Brazil, 14 September, 2007 Eliciting requirementsEliciting requirements 17 different tools and approaches Commercial products and literature Systematic analysis Applied to the same case study
- 11. 11 Interact 2007 – Rio de Janeiro, Brazil, 14 September, 2007 Avoidance of Effort loss Large conceptual coverage Language neutrality Ease of use (naturalness) Flexible processing Robust scenario editor … How to choose the rendering of recognized widget? Motivations / Related works
- 12. 12 Interact 2007 – Rio de Janeiro, Brazil, 14 September, 2007 Multi-Fidelity Support
- 13. 13 Interact 2007 – Rio de Janeiro, Brazil, 14 September, 2007 Survey – Methodology Participants (12) 6 males and 6 females 6 users and 6 designers Average age is 30 Environment Cintiq 21 UX No keyboard / mouse
- 14. 14 Interact 2007 – Rio de Janeiro, Brazil, 14 September, 2007 Survey – Methodology Procedure 1. Training 2. Test 4 realistics UIs (ticket booking, travel planner, small ad, online cv) 10 possible widgets (button, check box, combo box, radio button, text area, etc.) 4 fidelity levels (none, low, medium and high) 3. Questionnaire Computer System Usability Questionnaire (CSUQ, IBM) Semi-structured interview
- 15. 15 Interact 2007 – Rio de Janeiro, Brazil, 14 September, 2007 Surveys - Results Usability criteria Efficiency (time needed to sketch UI) Satisfaction (CSUQ) Results from quantitative analysis Fidelity has no influence on the development time (ANOVA procedure) User profile had a significant influence on sketching time (ANOVA procedure) Users performed better than designers!! Results from qualitative analysis (CSUQ, IBM) SYSUSE (system usefulness) : 4.30 INFOQUAL (information quality) : 4.90 INTERQUAL (interaction quality) : 5.36 OVERALL : 5.00
- 16. 16 Interact 2007 – Rio de Janeiro, Brazil, 14 September, 2007 Surveys – Interpretation Fidelity level No influence on users’ strategy No matter what the fidelity level is to sketch UIs High fidelity level judged faster by users Medium and high fidelity levels prefered by users Quality and aesthetics more important for designers than end users Designers preserved alignment, symmetry, and semantic grouping of UI Designers are slower than end users
- 17. 17 Interact 2007 – Rio de Janeiro, Brazil, 14 September, 2007 Future Works Further usability studies including Number of recognized/unrecognized shapes/texts/gestures Number of effective “widgets” that are added to the interface Extending the coverage of sketching artifacts Other UI types Other model involved outside HCI Other UI genres …
- 18. 18 Interact 2007 – Rio de Janeiro, Brazil, 14 September, 2007 Thank you very much for your attention For more information and downloading, http://www.isys.ucl.ac.be/bchi http://www.usixml.org User Interface eXtensible Markup Language http://www.similar.cc European network on Multimodal UIs http://www.usixml.org/index.php?view=page&idpage=29 SketchiXML home page