Solving the Mapping Problem in UI Design by

Solving the Mapping Problem in UI Design by Seamless Integration in IDEALXML Francisco Montero Lo. UISE Research Group University of Castilla-La Mancha Belgian Laboratory of Computer-Human Interaction Université catholique de Louvain fmontero@info-ab. uclm. es Newcastle, July 13– 15, 2005

Table of contents • • The problem with mapping models A language: usi. XML A tool: IDEALXML Solution: experience documented by using patterns – Domain model – Task model – Presentation model – Mapping model • Conclusions and future works Newcastle, July 13– 15, 2005 2

Problem • MDA is a new way of writing specifications, based on a platform-independent model [OMG]. • The mapping problem is the problem of solving the transformations necessary to convert information in abstract models to concrete models close to a concrete user interface [Puerta et al. , 1999]. • Mapping to the supported MDA platforms will be implemented by tools, easing the task of supporting new or different technologies [OMG]. • OMG is in the ideal position to provide the modelbased standards that are necessary to extend integration beyond the middleware approach. . . Now is the time for the MDA [Soley, 2000]. Newcastle, July 13– 15, 2005 3

source: www. omg. org Newcastle, July 13– 15, 2005 4

Tendency In the 1980’s: Everything is an object In the 2000’s: Everything is a models: explicitly capture knowledge about UI and Interactive Applications with appropriate abstractions Newcastle, July 13– 15, 2005 5

usi. XML USer Interface e. Xtensible Markup Language • usi. XML is a XML-compliant markup language that describes the UI for multiple contexts of use such as Character User Interfaces (CUIs), Graphical User Interfaces (GUIs), Auditory User Interfaces, and Multimodal User Interfaces. • usi. XML is defined in a set of XML schemas. Each schema corresponds to one of the models (domain, task, presentation, mapping, etc) in the scope of the language. Newcastle, July 13– 15, 2005 6

Mappings in usi. XML • • • Observes: . . . (IO x domain (a/m)) Updates: . . . (IO x attribute) Triggers: . . . (IO x method) is. Executed. In: . . . (task x IO) is. Reified: . . . (AIO x CIO) Is. Abstracted. Into: . (CIO x AIO) Is. Adapted: . . (IO x IO) Captions: Manipulates: . . . . (task x domain) IO: Interaction Object Has. Context: . . . . (ANY x context of use) AIO: Abstract IO CIO: Concrete IO Newcastle, July 13– 15, 2005 7

What is IDEALXML? • It is a pattern-oriented tool. • By using this environment you can edit, manipulate, view and learn about patterns. • It is based on PLML [Fincher et al. , 2003], but additional elements are provided. • You can create a pattern repository, and then distribute your repository to other people. • You can edit textual features associated with a pattern, such as: name, alias, problem, context, solution, synopsis, rationale, etc. • You can edit diagrams (models) using meaningful notations from Software Engineering (UML) and Human-Computer Interaction (CTT). Newcastle, July 13– 15, 2005 8

Newcastle, July 13– 15, 2005 9

Newcastle, July 13– 15, 2005 10

Newcastle, July 13– 15, 2005 11

Newcastle, July 13– 15, 2005 12

Newcastle, July 13– 15, 2005 13

Newcastle, July 13– 15, 2005 14

Newcastle, July 13– 15, 2005 15

class diagram (domain model) CTT notation (task model) class attribute method dependency generalization association aggregation abstract task composition cooperation task Newcastle, July 13– 15, 2005 interaction task application task user task AIO notation (presentation model) container component input output navigation control select 16

These mappings can be established: triggers (tg): { , } x updates (up): x observes (ob): x is. Executed. In (ex): x manipulates (ma): { , } x Newcastle, July 13– 15, 2005 17

Newcastle, July 13– 15, 2005 18

• diagrams - models (usixml) • pattern description (xml) • example figures Newcastle, July 13– 15, 2005 19

Patterns are experience Experience can be modelled (learned, and reused) Newcastle, July 13– 15, 2005 20

Domain model • Collaboration patterns [Nicola et al. , 2001] Actor 1 0. . * performs 1 Outer. Place Item 1 Role Place 0. . * Specific. Item has copies 1 Assembly 1 Container 0. . * Group 1. . * Role 1. . * 0. . * Newcastle, July 13– 15, 2005 1 0. . * handles 1 0. . * conducts 1 Composite. Tr Part Specific. It Content Specific. It Member Transaction 1. . * Transaction Line. Item 1 0. . * Transaction involved in 1 0. . * appeared in 1 0. . * related to Line. Item Followup. Tr 21

Task and Presentation models • Just-UI [Molina, 2002] patterns are documented using CTT [Paternò, 1999], but these patterns are not used using these models. • We have many interaction patterns catalogs – [Tidwell, 1999] but, these patterns are only descriptions using – [Welie, 2000] natural language – [van Duyne et al. , 2002] – [Graham, 2002] – [Montero et al. , 2002] These patterns need to – many other references be modelled Newcastle, July 13– 15, 2005 22

Presentation model • Patterns are solutions recurring solutions to design problems you see over and over [The Smalltalk Companion] • A pattern addresses a recurring design problem that arises in specific design situations and presents a solution to it. [Buschmann et al. 1996] Newcastle, July 13– 15, 2005 23

Mapping model (i) (an example: narrative pattern [Tidwell, 1999]) • Context: There is a need to convey information to the user; the information is closely interrelated, but of diverse kinds, and there may be some subjectivity involved. • Problem: In what form should the information be displayed to the user? • Solution: Convey the information via natural language. Use all you learned in high-school English class about good writing. If users might be skimming the text to find specific data items, use color, fonts, and white space to set off items of interest; for readability in some situations, try using "senselining. " Newcastle, July 13– 15, 2005 24

Mapping model (ii) (an example: narrative pattern [Tidwell, 1999]) create Item. Name : string notify/update description : string has copies get Root 1 info close Task* close view [collaction] 0. . * Specific. Item Sp. Name : string description : string create show. Status* create/service Newcastle, July 13– 15, 2005 25

Mapping model (iii) (an example: narrative pattern [Tidwell, 1999]) create get info Root close link Task* notify/update down close Item. Name : string description : string collaction show* view [task] [home] [next] [back] [print] [search] show. Error confirm link [download] download Newcastle, July 13– 15, 2005 1 0. . * Specific. Item Sp. Name : string description : string service select [error] has copies . . service 26

Mapping model (iv) Swing Newcastle, July 13– 15, 2005 27

Mapping model (v) MIDP Newcastle, July 13– 15, 2005 28

Conclusions • • • MDA is the actual tendency Everithing are models Patterns can be modeled Patterns are design solutions Quality features are related with patterns User interface development can be improved by using interaction patterns • Patterns can be used by users and designers, examples and models are useful to them respectively Newcastle, July 13– 15, 2005 29

Thank you! Francisco Montero Lo. UISE Research Group University of Castilla-La Mancha Belgian Laboratory of Computer-Human Interaction Université catholique de Louvain fmontero@info-ab. uclm. es Newcastle, July 13– 15, 2005 30