SLIDE 1 Cross-Device Consistency in Automatically Generated User Interfaces
Krzysztof Gajos, Anthony Wu and Daniel S. Weld University of Washington Seattle, USA
SLIDE 2 Problem Statement
How to automatically generate user interfaces for the same application
- r appliance for different devices
SLIDE 3 Problem Statement
How to automatically generate user interfaces for the same application
- r appliance for different devices
Motivation: to make new interfaces for
- ld applications easier to learn when
switching devices
SLIDE 4 SUPPLE Architecture
Display Device Model Target Device SUPPLE Interface Model Application
Appliance User Model User's Info Space
SLIDE 5 SUPPLE Architecture
Display Device Model Target Device SUPPLE Interface Model Application
Appliance User Model User's Info Space
SLIDE 6
Automatically Rendered Interfaces for a Classroom Controller
SLIDE 7
Automatically Rendered Interfaces for a Classroom Controller
SLIDE 8
Automatically Rendered Interfaces for a Classroom Controller
SLIDE 9
Email Client
SLIDE 10
Email Client
Click!
SLIDE 11
SLIDE 12
UI Rendering As Optimization
cost = cost of manipulating individual widgets + cost of navigating through the interface
SLIDE 13 UI Rendering As Optimization
cost = cost of manipulating individual widgets + cost of navigating through the interface
For a multimodal approach, see “UI on the fly” by Reitter, Panttaja & Cummins
SLIDE 14
Manipulation-Navigation Tradeoff Example
SLIDE 15
Manipulation-Navigation Tradeoff Example
SLIDE 16 Manipulation-Navigation Tradeoff Example
easier navigation easier manipulation
SLIDE 17 Manipulation-Navigation Tradeoff Example
cost = αm× cost of manipulating individual widgets + αn× cost of navigating through the interface
easier navigation easier manipulation
SLIDE 18
UI Rendering As Optimization
cost = αm× cost of manipulating individual widgets + αn× cost of navigating through the interface + αs× dissimilarity to the previously used interfaces
SLIDE 19 The reference UI for a classroom controller rendered on a touch panel
SLIDE 20 The reference UI for a classroom controller rendered on a touch panel
The “optimal” UI for the classroom controller for a keyboard and pointer device rendered in the absence of similarity information
SLIDE 21 The reference UI for a classroom controller rendered on a touch panel
The “optimal” UI for the classroom controller for a keyboard and pointer device rendered in the absence of similarity information The “optimal” UI for the classroom controller for a keyboard and pointer device rendered taking into account the similarity information
SLIDE 22 Open Questions
- What aspects of surface presentation make
user interfaces appear “similar”
- Does surface presentation similarity
matter?
SLIDE 23
Features
SLIDE 24 Features
- Language (toggle, text, position, icon, color)
SLIDE 25 Features
- Language (toggle, text, position, icon, color)
- Domain visibility (full, partial, current value)
SLIDE 26 Features
- Language (toggle, text, position, icon, color)
- Domain visibility (full, partial, current value)
- Orientation of data presentation
SLIDE 27 Features
- Language (toggle, text, position, icon, color)
- Domain visibility (full, partial, current value)
- Orientation of data presentation
- Continuous
- Vs. discrete
SLIDE 28 Features
- Language (toggle, text, position, icon, color)
- Domain visibility (full, partial, current value)
- Orientation of data presentation
- Continuous
- Vs. discrete
- Variable domain
SLIDE 29 Features
- Language (toggle, text, position, icon, color)
- Domain visibility (full, partial, current value)
- Orientation of data presentation
- Continuous
- Vs. discrete
- Variable domain
- Primary manipulation method (point, type, drag)
SLIDE 30 Features
- Language (toggle, text, position, icon, color)
- Domain visibility (full, partial, current value)
- Orientation of data presentation
- Continuous
- Vs. discrete
- Variable domain
- Primary manipulation method (point, type, drag)
- Widget geometry
SLIDE 31
[Lin & Landay, 2002]
SLIDE 32
Summary
SLIDE 33 Summary
- Using optimization for user interface generation enables
use of different quality metrics
SLIDE 34 Summary
- Using optimization for user interface generation enables
use of different quality metrics
- If we know the right features, we can find the right
numbers
SLIDE 35 Summary
- Using optimization for user interface generation enables
use of different quality metrics
- If we know the right features, we can find the right
numbers
- But:
- What features are most salient for determining if two
interfaces are similar?
- Does surface similarity matter?
SLIDE 36 Summary
- Using optimization for user interface generation enables
use of different quality metrics
- If we know the right features, we can find the right
numbers
- But:
- What features are most salient for determining if two
interfaces are similar?
- Does surface similarity matter?
- We are designing a user study to answer these questions
(with Roxane Neal)
SLIDE 37 More Info
http://www.cs.washington.edu/ai/supple/
kgajos@cs.washington.edu
http://www.cs.washington.edu/homes/kgajos/
