Software Environment for Research on Evolving User Interfaces

Juan Quiroz, Anil Shankar, Sergiu M. Dascalu, Sushil J. Louis

Department of Computer Science and Engineering

University of Nevada, Reno

USA

2

Outline

• Motivation

• Background

• Evolution environment

• Improving research productivity

• Transitioning from research to end-user tool

3

Motivation

• User interface design is a complex, expensive, time consuming process

• Iterative process

• Users and contexts of use are numerous

• Streamline and improve UI design

4

IGA for UI Evolution

• IGA to explore the space of UIs– Creativity and insight

• Evolution is guided by both the user preferences and coded guideline metrics

5

Genetic Algorithms

• Population based search technique– Natural selection– Survival of the fittest

6

Interactive Genetic Algorithms (IGAs)

7

Implementation Details

• Python

• GUI – wxPython

• Target language – XUL

8

XUL User Interfaces

• XML User Interface Language

• Mark-up language for UIs– Buttons, textboxes, sliders

menubars, toolbars

• <button label=“Hello World” />

Poor XUL rendering support in python

9

10

Investing Time on Development

vs.

Research Experimentation

11

Research Environment Improvements

• wxPython integration

• Experiment runs manager

• Data manager

12

wxPython Integration

13

Experiment Runs Manager

14

Data Manager

15

Future Productivity Improvements

• GUI definition in wxGlade or NetBeans

• Integration of user interface definition in the environment

• Higher level user interface specification

• Code generation

• User interface editing

16

Transitioning from Research to End-User Tool

• Users– Researchers– UI designers

• Environment Modes– End-user mode– Researcher mode

17

User Modes

• End-user mode– Minimalist interface– Reduce technical jargon

• “Variety”• “Creativity”

– Subset of functionality of researcher mode

• Researcher mode– Advanced configuration

18

Use CaseEnd-User Mode

Researcher Mode

1 Define user interface √ √

2 Load user interface definition √

3 Customize high level IGA details √ √

4 Customize low level IGA details √

5 Start IGA √ √

6 Stop IGA √ √

7 Open IGA state √ √

8 Save IGA state √ √

9 Select best and worst UI √ √

10 Undo evolution step √ √

11 Redo evolution step √ √

12 Edit evolved UI √ √

13 Run batch mode √

14 Extended help √

19

Summary

• UI evolution

• Investing time on environment development– Improves productivity– Less error prone– Reduces tedious tasks

• Transition from end-user to research tool

20

Questions?

• www.cse.unr.edu/~quiroz

• quiroz@cse.unr.edu