Your SlideShare is downloading. ×
User Interface Design by Sketching: A Complexity Analysis of Widget Representations
User Interface Design by Sketching: A Complexity Analysis of Widget Representations
User Interface Design by Sketching: A Complexity Analysis of Widget Representations
User Interface Design by Sketching: A Complexity Analysis of Widget Representations
User Interface Design by Sketching: A Complexity Analysis of Widget Representations
User Interface Design by Sketching: A Complexity Analysis of Widget Representations
User Interface Design by Sketching: A Complexity Analysis of Widget Representations
User Interface Design by Sketching: A Complexity Analysis of Widget Representations
User Interface Design by Sketching: A Complexity Analysis of Widget Representations
User Interface Design by Sketching: A Complexity Analysis of Widget Representations
User Interface Design by Sketching: A Complexity Analysis of Widget Representations
User Interface Design by Sketching: A Complexity Analysis of Widget Representations
User Interface Design by Sketching: A Complexity Analysis of Widget Representations
User Interface Design by Sketching: A Complexity Analysis of Widget Representations
User Interface Design by Sketching: A Complexity Analysis of Widget Representations
User Interface Design by Sketching: A Complexity Analysis of Widget Representations
User Interface Design by Sketching: A Complexity Analysis of Widget Representations
User Interface Design by Sketching: A Complexity Analysis of Widget Representations
User Interface Design by Sketching: A Complexity Analysis of Widget Representations
User Interface Design by Sketching: A Complexity Analysis of Widget Representations
User Interface Design by Sketching: A Complexity Analysis of Widget Representations
User Interface Design by Sketching: A Complexity Analysis of Widget Representations
User Interface Design by Sketching: A Complexity Analysis of Widget Representations
User Interface Design by Sketching: A Complexity Analysis of Widget Representations
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

User Interface Design by Sketching: A Complexity Analysis of Widget Representations

2,100

Published on

User interface design by sketching, as well as other sketching activities, typically involves sketching objects through representations that should combine meaningfulness for the end users and …

User interface design by sketching, as well as other sketching activities, typically involves sketching objects through representations that should combine meaningfulness for the end users and easiness for the recognition engines. To investigate this relationship, a multi-platform user interface design tool has been developed that enables designers to sketch design ideas in multiple levels of fidelity with multistroke
gestures supporting widget representations and
commands. A usability analysis of these activities, as they are submitted to a recognition engine, suggests that the level of fidelity, the amount of constraints imposed on the representations, and the visual difference of representations positively impact the sketching activity as a whole. Implications for further sketch representations in user interface design and beyond are provided based on usability guidelines.

Published in: Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
2,100
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
20
Comments
0
Likes
1
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Suzanne Kieffer, Adrien Coyette, Jean Vanderdonckt Université catholique de Louvain, Belgium {suzanne.kieffer, adrien.coyette, jean.vanderdonckt}@uclouvain.be Berlin, Germany – June 19-23, 2010
  • 2.
    • A design tool for the user interface prototyping
      • Multi-stroke bi-directional sketching of representations
      • Object recognition based on a graphical grammar
      • Multiple gesture representations of the same object
      • Multiple levels of fidelity
      • http://www.usixml.org/, funded by
      • - ITEA2 Call 3 – Ref. 2008026
      • - Eureka Project 3674
    EICS2010, 19–23 June 2010, Berlin, Germany ∑ ! 3674
  • 3. EICS2010, 19–23 June 2010, Berlin, Germany DENIM: Lin et al., CHI’2000 JavaSketchIt: Caetano et al., 2002 Gabbeh: Naghsh et al., DSVIS’2005 SILK: Landay & Myers, 1995 InkKit: Plimmer et al., CHI’2004 SketchRead: Alvarado, 2004
  • 4. EICS2010, 19–23 June 2010, Berlin, Germany
  • 5. EICS2010, 19–23 June 2010, Berlin, Germany 1: none 2: low 3: medium 4: high
  • 6. EICS2010, 19–23 June 2010, Berlin, Germany
  • 7.
    • Experiment 1 (XP1)
      • Determine the most preferred and drawn gestural representations for each object depending on the user type (designer vs standard user)
    • Experiment 2 (XP2)
      • Study the potential influence of the level of fidelity on the sketching task
    EICS2010, 19–23 June 2010, Berlin, Germany
  • 8.
    • 2 groups of 30 subjects
      • Designers: people with relevant experience in computer science and user interface design
      • End-users: people without any prior knowledge in computer science or user interface design
        •  Involve the end-user early in the software development life-cycle
    EICS2010, 19–23 June 2010, Berlin, Germany
  • 9.
    • 1 st phase
      • Catalogue of 32 widgets
      • How do participants sketch the widgets?
      •  Widget representations
    • 2 nd phase
      • Categories of representations
      • How do participants rank the representations?
      •  Most common object representation
    EICS2010, 19–23 June 2010, Berlin, Germany
  • 10. EICS2010, 19–23 June 2010, Berlin, Germany
  • 11.  
  • 12.
    • Experiment 1 (XP1)
      • Determine the most preferred and drawn gestural representations for each object depending on the user type (designer vs standard user)
    • Experiment 2 (XP2)
      • Study the potential influence of the level of fidelity on the sketching task
    EICS2010, 19–23 June 2010, Berlin, Germany
  • 13.
    • Usability study of the potential influence of widget representation complexity on user performances
    • Measures and usability criteria
      • Speed (efficiency)
      • Accuracy (effectiveness)
    EICS2010, 19–23 June 2010, Berlin, Germany
  • 14. EICS2010, 19–23 June 2010, Berlin, Germany
  • 15.
    • Participants: 11 volunteers (22<age<28) with significant pen-based interaction experience
    • Task: series of widget sketches with a constant rotation between the widget and the fidelity level
    • Setup: 4 fidelity levels x 12 widgets x 2 iterations
    EICS2010, 19–23 June 2010, Berlin, Germany
  • 16. EICS2010, 19–23 June 2010, Berlin, Germany 21-inch Wacom Cintiq 21UX touch screen flat panel
  • 17.
    • Fidelity level has no influence on user speed and accuracy  Interpretation : users do not change their sketching strategy whatever the fidelity level is
    • Widget representation has a highly significant effect on user speed and accuracy  Further investigation : which specific widget characteristics lead to such a statistical difference
    • Widget classification according to relevant characteristics based on recursive partitioning and recognition rate
    EICS2010, 19–23 June 2010, Berlin, Germany
  • 18. EICS2010, 19–23 June 2010, Berlin, Germany
  • 19. EICS2010, 19–23 June 2010, Berlin, Germany One-Way ANOVA Procedure Variables: sketching times & delete operations
  • 20.
    • Basic widgets
      • Label, text field, picture (2 shapes)
      • Check-box, radio button (juxtaposition)
    • Complex widgets
      • Button, text area (inclusion)
      • Slider (intersection)
      • Combo box, list box, progress bar, and toggle button (complex inclusion)
    EICS2010, 19–23 June 2010, Berlin, Germany
  • 21.
    • 2 experiments
      • Identification of the preferred representations
      • Complexity analysis of widget representations
    EICS2010, 19–23 June 2010, Berlin, Germany
  • 22.
    • The level of fidelity has no impact on the sketching of any individual widget
    • The quality of the recognition depends on the type of widget representation
    • Any representation of an object to be sketched should minimize the amount of constraints (e.g. inclusion, intersection, sequence)
    EICS2010, 19–23 June 2010, Berlin, Germany
  • 23.
    • Naturalness supports creative design process
    • Non-obtrusion avoids disturbing the designer during the prototyping phase
    • Continuity during drawing improves and facilitates the prototyping task
    • Recovery enables the re-use of previous material
    EICS2010, 19–23 June 2010, Berlin, Germany
  • 24.
    • FP7 Human project
    • ITEA2 Call 3 UsiXML project
    • Contact information
      • suzanne.kieffer
      • adrien.coyette @uclouvain.be
      • jean.vanderdonckt
    EICS2010, 19–23 June 2010, Berlin, Germany

×