solving the mapping problem in ui design by seamless integration in i deal xml francisco montero...

30
Solving the Mapping Problem in UI Design by Seamless Integration in IDEALXML Francisco Montero LoUISE Research Group University of Castilla-La Mancha Belgian Laboratory of Computer-Human Interaction Université catholique de Louvain [email protected]

Upload: jack-robinson

Post on 20-Jan-2016

217 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Solving the Mapping Problem in UI Design by Seamless Integration in I DEAL XML Francisco Montero LoUISE Research Group University of Castilla-La Mancha

Solving the Mapping Problem in UI Design by Seamless Integration in

IDEALXML

Francisco MonteroLoUISE Research Group

University of Castilla-La Mancha

Belgian Laboratory of Computer-Human Interaction

Université catholique de [email protected]

Page 2: Solving the Mapping Problem in UI Design by Seamless Integration in I DEAL XML Francisco Montero LoUISE Research Group University of Castilla-La Mancha

Newcastle, July 13–15, 2005 DSV-IS’05

Table of contents

• The problem with mapping models• A language: usiXML• A tool: IDEALXML

• Solution: experience documented by using patterns– Domain model– Task model– Presentation model– Mapping model

• Conclusions and future works

Page 3: Solving the Mapping Problem in UI Design by Seamless Integration in I DEAL XML Francisco Montero LoUISE Research Group University of Castilla-La Mancha

Newcastle, July 13–15, 2005 DSV-IS’05

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 model-based standards that are necessary to extend integration beyond the middleware approach... Now is the time for the MDA [Soley, 2000].

Page 4: Solving the Mapping Problem in UI Design by Seamless Integration in I DEAL XML Francisco Montero LoUISE Research Group University of Castilla-La Mancha

Newcastle, July 13–15, 2005 DSV-IS’05

source: www.omg.org

Page 5: Solving the Mapping Problem in UI Design by Seamless Integration in I DEAL XML Francisco Montero LoUISE Research Group University of Castilla-La Mancha

Newcastle, July 13–15, 2005 DSV-IS’05

Tendency

In the 1980’s: Everything is an object

In the 2000’s: Everything is a model

models: explicitly capture knowledge about UI and

Interactive Applications with appropriate abstractions

Page 6: Solving the Mapping Problem in UI Design by Seamless Integration in I DEAL XML Francisco Montero LoUISE Research Group University of Castilla-La Mancha

Newcastle, July 13–15, 2005 DSV-IS’05

usiXMLUSer Interface eXtensible Markup Language

• usiXML 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.

• usiXML 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.

Page 7: Solving the Mapping Problem in UI Design by Seamless Integration in I DEAL XML Francisco Montero LoUISE Research Group University of Castilla-La Mancha

Newcastle, July 13–15, 2005 DSV-IS’05

Mappings in usiXML

• Observes: ........... (IO x domain (a/m))• Updates: ............. (IO x attribute)• Triggers: ............. (IO x method)• isExecutedIn: ......(task x IO)• isReified: .............(AIO x CIO)• IsAbstractedInto: .(CIO x AIO)• IsAdapted: .......... (IO x IO)• Manipulates: .......(task x domain)• HasContext: ........(ANY x context of use)

Captions:

IO: Interaction Object

AIO: Abstract IO

CIO: Concrete IO

Page 8: Solving the Mapping Problem in UI Design by Seamless Integration in I DEAL XML Francisco Montero LoUISE Research Group University of Castilla-La Mancha

Newcastle, July 13–15, 2005 DSV-IS’05

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).

Page 9: Solving the Mapping Problem in UI Design by Seamless Integration in I DEAL XML Francisco Montero LoUISE Research Group University of Castilla-La Mancha

Newcastle, July 13–15, 2005 DSV-IS’05

Page 10: Solving the Mapping Problem in UI Design by Seamless Integration in I DEAL XML Francisco Montero LoUISE Research Group University of Castilla-La Mancha

Newcastle, July 13–15, 2005 DSV-IS’05

Page 11: Solving the Mapping Problem in UI Design by Seamless Integration in I DEAL XML Francisco Montero LoUISE Research Group University of Castilla-La Mancha

Newcastle, July 13–15, 2005 DSV-IS’05

Page 12: Solving the Mapping Problem in UI Design by Seamless Integration in I DEAL XML Francisco Montero LoUISE Research Group University of Castilla-La Mancha

Newcastle, July 13–15, 2005 DSV-IS’05

Page 13: Solving the Mapping Problem in UI Design by Seamless Integration in I DEAL XML Francisco Montero LoUISE Research Group University of Castilla-La Mancha

Newcastle, July 13–15, 2005 DSV-IS’05

Page 14: Solving the Mapping Problem in UI Design by Seamless Integration in I DEAL XML Francisco Montero LoUISE Research Group University of Castilla-La Mancha

Newcastle, July 13–15, 2005 DSV-IS’05

Page 15: Solving the Mapping Problem in UI Design by Seamless Integration in I DEAL XML Francisco Montero LoUISE Research Group University of Castilla-La Mancha

Newcastle, July 13–15, 2005 DSV-IS’05

Page 16: Solving the Mapping Problem in UI Design by Seamless Integration in I DEAL XML Francisco Montero LoUISE Research Group University of Castilla-La Mancha

Newcastle, July 13–15, 2005 DSV-IS’05

CTT notation (task model)

class diagram (domain model)

AIO notation (presentation model)

container

component

input

outputnavigation

control

select

abstract task

interaction task

application task

user task

cooperation task

class

attributemethoddependency

associationgeneralization

aggregation

composition

Page 17: Solving the Mapping Problem in UI Design by Seamless Integration in I DEAL XML Francisco Montero LoUISE Research Group University of Castilla-La Mancha

Newcastle, July 13–15, 2005 DSV-IS’05

triggers (tg): { , } x

updates (up): x

observes (ob): x

isExecutedIn (ex): x

manipulates (ma): { , } x

These mappings can be established:

Page 18: Solving the Mapping Problem in UI Design by Seamless Integration in I DEAL XML Francisco Montero LoUISE Research Group University of Castilla-La Mancha

Newcastle, July 13–15, 2005 DSV-IS’05

Page 19: Solving the Mapping Problem in UI Design by Seamless Integration in I DEAL XML Francisco Montero LoUISE Research Group University of Castilla-La Mancha

Newcastle, July 13–15, 2005 DSV-IS’05

• example figures

• pattern description (xml)

• diagrams - models (usixml)

Page 20: Solving the Mapping Problem in UI Design by Seamless Integration in I DEAL XML Francisco Montero LoUISE Research Group University of Castilla-La Mancha

Newcastle, July 13–15, 2005 DSV-IS’05

Patterns are experience

Experience can be modelled (learned, and reused)

Page 21: Solving the Mapping Problem in UI Design by Seamless Integration in I DEAL XML Francisco Montero LoUISE Research Group University of Castilla-La Mancha

Newcastle, July 13–15, 2005 DSV-IS’05

Domain model

• Collaboration patterns [Nicola et al., 2001]

Actor Role1 0..*

OuterPlace Place1

1..*

performs

Item SpecificItem1 0..*

has copies

Assembly Part1

1..*

Container Content1

0..*

Group Member0..*

0..*

Role Transaction1 0..*

CompositeTr LineItem1

1..*

handles

SpecificIt Transaction1 0..*

involved in

SpecificIt LineItem1 0..*

appeared in

Transaction FollowupTr1 0..*

related to

Place Transaction1 0..*

conducts

Page 22: Solving the Mapping Problem in UI Design by Seamless Integration in I DEAL XML Francisco Montero LoUISE Research Group University of Castilla-La Mancha

Newcastle, July 13–15, 2005 DSV-IS’05

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]– [Welie, 2000]– [van Duyne et al., 2002]– [Graham, 2002]– [Montero et al., 2002]– many other references

but, these patterns are only descriptions using

natural language

These patterns need to be modelled

Page 23: Solving the Mapping Problem in UI Design by Seamless Integration in I DEAL XML Francisco Montero LoUISE Research Group University of Castilla-La Mancha

Newcastle, July 13–15, 2005 DSV-IS’05

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]

Page 24: Solving the Mapping Problem in UI Design by Seamless Integration in I DEAL XML Francisco Montero LoUISE Research Group University of Castilla-La Mancha

Newcastle, July 13–15, 2005 DSV-IS’05

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."

Page 25: Solving the Mapping Problem in UI Design by Seamless Integration in I DEAL XML Francisco Montero LoUISE Research Group University of Castilla-La Mancha

Newcastle, July 13–15, 2005 DSV-IS’05

Mapping model (ii)(an example: narrative pattern [Tidwell, 1999])

Item

ItemName : string

description : string

SpecificItem

SpName : string

description : string

1

0..*

ha

s c o

pi e

s

info close

showStatus* [collaction]

closeTask*

Root

view

get

create

create

notify/update

create/service

Page 26: Solving the Mapping Problem in UI Design by Seamless Integration in I DEAL XML Francisco Montero LoUISE Research Group University of Castilla-La Mancha

Newcastle, July 13–15, 2005 DSV-IS’05

Mapping model (iii)(an example: narrative pattern [Tidwell, 1999])

Item

ItemName : string

description : string

SpecificItem

SpName : string

description : string

1

0..*

ha

s c o

pi e

s

show* collaction

closeTask*

Root info close

link

down

view [task]

link [download]

select download

[next] [back] [print] [search] [error]

showError confirm

[home]

....

notify/update

get

create

service

service

Page 27: Solving the Mapping Problem in UI Design by Seamless Integration in I DEAL XML Francisco Montero LoUISE Research Group University of Castilla-La Mancha

Newcastle, July 13–15, 2005 DSV-IS’05

Mapping model (iv)

Swing

Page 28: Solving the Mapping Problem in UI Design by Seamless Integration in I DEAL XML Francisco Montero LoUISE Research Group University of Castilla-La Mancha

Newcastle, July 13–15, 2005 DSV-IS’05

Mapping model (v)

MIDP

Page 29: Solving the Mapping Problem in UI Design by Seamless Integration in I DEAL XML Francisco Montero LoUISE Research Group University of Castilla-La Mancha

Newcastle, July 13–15, 2005 DSV-IS’05

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

Page 30: Solving the Mapping Problem in UI Design by Seamless Integration in I DEAL XML Francisco Montero LoUISE Research Group University of Castilla-La Mancha

Newcastle, July 13–15, 2005 DSV-IS’05

Thank you!

Francisco MonteroLoUISE Research Group

University of Castilla-La Mancha

Belgian Laboratory of Computer-Human Interaction

Université catholique de [email protected]