triad: triad-based rich internet application design
DESCRIPTION
Current trends in web development still are attached to the web page paradigm. Nevertheless, new uses of already available technology and recent development in terms of concepts, as the asynchronous communication, have produced a new generation of web applications: Rich Internet Applications (RIAs). These web applications essays to fulfill user expectations in terms of usability, reliability, quality, maintainability and performance. In this paper, we are going to present a designing methodology that pursued as goal describing and developing User Interfaces of RIAs in a standardized way. The name of this ensemble of models and meta-descriptions is, TRIAD (Triad-based Rich internet Application Design).TRANSCRIPT
R(T) U(T) D(T)
T’
TRIAD Triad-based
Rich Internet Application Design
AdvisorJean Vanderdonckt
Presented byFrancisco Javier Martinez-Ruiz
Université catholique de Louvain (UCL)Louvain School of Management (LSM)
Information Systems Unit (ISYS)Belgian Laboratory of Computer-Human Interaction (BCHI)
04/12/2023 UsiXML workshop - Francisco Javier Martinez Ruiz
Methodology Case study Contributions Conclusions
TRIAD :: Triad-based UI Rich Internet Application Design
IntroductionIntroduction
From Web 1.0 to Web 2.0
Web 1.0 features Static Web Content Non interactive sites HTML widgets
Web 2.0 features Single Page Paradigm Mash-up approach Highly interactive sites Composite widgets
2
04/12/2023 UsiXML workshop - Francisco Javier Martinez Ruiz
Methodology Case study Contributions Conclusions
TRIAD :: Triad-based UI Rich Internet Application Design
Introduction
web application
that exhibit similar behavior, widgets and features that those present in
desktop applications.
they are more responsive, Secure,
advanced look and feel.
the Single Page Paradigm, An advanced communications
scheme:Push technology and AJAX
A client engine
What is RIA?
Introduction
3
04/12/2023 UsiXML workshop - Francisco Javier Martinez Ruiz
Methodology Case study Contributions Conclusions
TRIAD :: Triad-based UI Rich Internet Application Design
Introduction
Dynamic data retrieval Perceptive continuity Adaptability Multimedia. Collaborative faculties User Interface
Description Language Push technology The Use of Browser area.
RIA Features
Introduction
4
04/12/2023 UsiXML workshop - Francisco Javier Martinez Ruiz
Methodology Case study Contributions Conclusions
TRIAD :: Triad-based UI Rich Internet Application Design
Introduction
LEVEL I II III
Dynamical retrieval100 100 100
Perceptive continuity50 50 100
Adaptability0 50 100
Multimedia30 60 100
Collaborative faculties0 50 100
User Interface language 0 100 100
Push Technology0 100 100
use of Browser window 30 60 100
I
II
III
5
04/12/2023 UsiXML workshop - Francisco Javier Martinez Ruiz
Methodology Case study Contributions Conclusions
TRIAD :: Triad-based UI Rich Internet Application Design
Introduction Methodology
The method
6
04/12/2023 UsiXML workshop - Francisco Javier Martinez Ruiz
Methodology Case study Contributions Conclusions
TRIAD :: Triad-based UI Rich Internet Application Design
Introduction
R(T) U(T)D(T)
T’
Methodology
First step: T&D models :: Triad-based Design
|[]| |[]|
7
04/12/2023 UsiXML workshop - Francisco Javier Martinez Ruiz
Methodology Case study Contributions Conclusions
TRIAD :: Triad-based UI Rich Internet Application Design
Introduction Methodology
First step: T&D models :: Triad-based Design
Get Info
Login
Submit[]>>
Input User Name
Input Password|||
D R
D R D R
D R D R
Login’
Login
Get Info’ Submit’
Get Info
Password’User Name’
User Name Password
Submit
Task Tree for a Login application
TRIAD version of Login application
8
04/12/2023 UsiXML workshop - Francisco Javier Martinez Ruiz
Methodology Case study Contributions Conclusions
TRIAD :: Triad-based UI Rich Internet Application Design
Introduction
R(T)
|[]|
U(T)D(T)
T’Color Operator/task Type
Operators
Sequential [>, |>, >>, []>>
Concurrent |=|, ||| , |[]|Choice []Interactive taskSystem taskAbstract task
Methodology
First step: T&D models :: ZUIT
A B
…
C D
ZUIT
9
04/12/2023 UsiXML workshop - Francisco Javier Martinez Ruiz
Methodology Case study Contributions Conclusions
TRIAD :: Triad-based UI Rich Internet Application Design
Introduction Methodology
First step: T&D models :: Triad-based Design
10
04/12/2023 UsiXML workshop - Francisco Javier Martinez Ruiz
Methodology Case study Contributions Conclusions
TRIAD :: Triad-based UI Rich Internet Application Design
Introduction Methodology
2nd step: AUI :: RIA notation
11
04/12/2023 UsiXML workshop - Francisco Javier Martinez Ruiz
Methodology Case study Contributions Conclusions
TRIAD :: Triad-based UI Rich Internet Application Design
Introduction
•Introduce a behavior not available in classical widgets.•Introduce a complex behavior (a compilation of behavior) not available in classical widgets.•Introduce constructs that resolve problems in an alternative way.
Methodology
3rd step: CUI :: RIA CONSTRUCTS
12
04/12/2023 UsiXML workshop - Francisco Javier Martinez Ruiz
Methodology Case study Contributions Conclusions
TRIAD :: Triad-based UI Rich Internet Application Design
Introduction Case study
Reservation System: Book a room
13
04/12/2023 UsiXML workshop - Francisco Javier Martinez Ruiz
Methodology Case study Contributions Conclusions
TRIAD :: Triad-based UI Rich Internet Application Design
Introduction Case study
Reservation System: ZUIT Representation
14
04/12/2023 UsiXML workshop - Francisco Javier Martinez Ruiz
Methodology Case study Contributions Conclusions
TRIAD :: Triad-based UI Rich Internet Application Design
Introduction Case study
Reservation System: Mapping to Domain model
15
04/12/2023 UsiXML workshop - Francisco Javier Martinez Ruiz
Methodology Case study Contributions Conclusions
TRIAD :: Triad-based UI Rich Internet Application Design
Introduction Case study
Reservation System: Modifying the TRIAD
16
04/12/2023 UsiXML workshop - Francisco Javier Martinez Ruiz
Methodology Case study Contributions Conclusions
TRIAD :: Triad-based UI Rich Internet Application Design
Introduction Case study
Layers Weight Calculated cost
per level
C1 C2 C31 3 16 16 162 1 32 28 203 2 84 84 84Weighted average
41,33
40,66
39,33
Reservation System: Modifying the containment structure
SopLT
SopITn
FopLT
FopITnCopLT
CopITnB
nJ
0
1
0
0)(
17
04/12/2023 UsiXML workshop - Francisco Javier Martinez Ruiz
Methodology Case study Contributions Conclusions
TRIAD :: Triad-based UI Rich Internet Application Design
Introduction Case study
Reservation System: Adding the RIA notation to AUI
18
04/12/2023 UsiXML workshop - Francisco Javier Martinez Ruiz
Methodology Case study Contributions Conclusions
TRIAD :: Triad-based UI Rich Internet Application Design
Introduction Case study
Reservation System: Applying QOC to select RIA construct
19
04/12/2023 UsiXML workshop - Francisco Javier Martinez Ruiz
Methodology Case study Contributions Conclusions
TRIAD :: Triad-based UI Rich Internet Application Design
Introduction Case study
Reservation System: FUI
20
04/12/2023 UsiXML workshop - Francisco Javier Martinez Ruiz
Methodology Case study Contributions Conclusions
TRIAD :: Triad-based UI Rich Internet Application Design
Introduction
Quality review
Contributions
21
04/12/2023 UsiXML workshop - Francisco Javier Martinez Ruiz
Methodology Case study Contributions Conclusions
TRIAD :: Triad-based UI Rich Internet Application Design
IntroductionThe purpose of this work was to present a methodology developing RUIs.
All the steps have been presented in the current document. These steps are variations and/or extensions of the UsiXML family of tools and models in order to target RIAs.
We proposed a novel approach to model RUIs which includes:
the complete software development life cycle. The proposed method organizes the development life cycle for RUIs from the conceptual to the final implementation stages, using as guide, the user requirements instead of being focus in the content.
Furthermore, our method is Model Driven Engineering compliant since there is a separation of concerns of the different aspects in the RUI development. That is the UI representation starts with abstract models which are progressively refined to concrete models, as defined by OMG [OMG07].
Conclusions
22
04/12/2023 UsiXML workshop - Francisco Javier Martinez Ruiz
Methodology Case study Contributions Conclusions
TRIAD :: Triad-based UI Rich Internet Application Design
Introduction
Thank you very for your attention
Q&AAlea jacta est
23
04/12/2023 UsiXML workshop - Francisco Javier Martinez Ruiz
Methodology Case study Contributions Conclusions
TRIAD :: Triad-based UI Rich Internet Application Design
Introduction Case study
Reservation System: Defining Behavior (ADV-Charts)
24