3. Cinéma
• Obtenir les cinémas les plus proches de son hôtel
• Visualiser les séances de film d’un cinéma sélectionné
3 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
4. Maps
• Obtenir le trajet entre son hôtel et le cinéma choisi
• Lister les principales intersections du trajet
4 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
5. Problèmes liés à l’utilisation simultanée d’applications
• Manipulations nombreuses
• Perte d’informations
• Risque d’erreur de copies d’informations
• Obtenir les cinémas les plus proches de son hôtel
• Obtenir le trajet entre son hôtel et le cinéma choisi
5 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
6. Problèmes des éditeurs d’applications
6 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
7. Besoins liés aux problèmes de l’utilisateur et de l’éditeur
• Construire rapidement de nouvelles applications dans un but fixé
• Réutiliser l’existant
– Exploiter les fonctionnalités existantes
– Exploiter l’usage existant des fonctionnalités
– Exploiter l’intégration de ces fonctionnalités dans une interface
graphique existante
• Obtenir une application cohérente:
– Du point de vue utilisateur: utilisable et exécutable
7 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
8. Développement d’une application en GL et en IHM
Interface graphique (IG)
Noyau Fonctionnel (NF)
Arbre de tâches
[CRF]
T
T T
T T T
C
C
CC C
C
[UML]
Cas d’utilisations
8 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
9. Cohérence: du point de vue logiciel
Interface graphique (IG)
Noyau Fonctionnel (NF)
Arbre de tâches
T
T T
T T T
C
C
CC C
C
C
C
C
• Cohérence:
– Pouvoir atteindre un but
– A travers une interface
graphique
– Couplée à la partie
fonctionnelle
9 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
10. Une composition cohérente d’applications
Extraction de sous-parties cohérentes
Modélisation d’une application cohérente par des
correspondances entre plusieurs modèles
C
C
CC C
C
C
C
CC C
C
C
C
CC C
C
T
T T
T T T
T
T T
T T T
T
T T
T T T
Interconnexions des sous parties extraites
10 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
11. Plan
• Contexte et enjeux de la composition d’applications
• Etat de l’art: Composition d’applications
• Modèles de description d’une application
• Sélection
• Composition par substitutions
• Validation à travers un prototype et des tests utilisateurs
• Synthèse et perspectives
Processus de composition
11 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
12. ETAT DE L’ART:
COMPOSITION D’APPLICATIONS
- Composition au niveau graphique
- Composition au niveau fonctionnel
- Composition au niveau tâches
12 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
13. Composition d’applications:
Trois points d’entrées
T
T T
T T T
C
C
CC C
C
13 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
14. Point d’entrée pour la composition:
l’interface graphique
IG 1 IG 2
[ComposiXML]
[WinCuts]
[UI Façades]
[COTS-UI]
Nouveau NF
IG 3 = IG 1 + IG 2
C
C
CC C
C
14 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
15. Point d’entrée pour la composition:
le noyau fonctionnel
NF 1 NF 2 NF 3 = NF 1 + NF 2
C
C
CC C
C
C
C
CC C
C
C
C
CC C
C
[ServFace]
[ALIAS]
[BPEL]
[BPEL4WS]
Nouvelle IG
15 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
16. Point d’entrée pour la composition:
les tâches
T
T T
T T T
T
T T
T T T
Tâches 1 Tâches 2
Tâches 3 =
Tâches 1 + Tâches 2
T
T T
T T T
[Composants
de tâches]
[Compose]
[ServFace]
C
C
CC C
C
Nouveau NF Nouvelle IG
16 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
17. Synthèse de l’état de l’art
• Perte de la cohérence globale de l’application
Risque d’application non exécutable
Risque d’application non utilisable
Utilisation de modèles pour chaque partie de
l’application
Mise en évidence de correspondances entre
ces modèles
17 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
18. MODÈLES DE DESCRIPTION D’UNE
APPLICATION - Modèle de l’Interface Graphique
- Modèle du noyau fonctionnel
- Modèle de l’arbre de tâches
- Liaisons entre modèlesINTERACT’11
WEBIST’11
IHM’11
HCSE’10
{ }
18 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
19. Modèle pour l’Interface Graphique
19 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
20. Modèle hiérarchique
Element d'IG
Element d'IGElement d'IG
Element d'IGElement d'IG Element d'IG
SunML
UIML
MARIA
UsiXML
XAML
SWING
[ ]
• Cohérence graphique « de contenance »
20 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
21. Positionnement des éléments de l’interface
Element d'IG
Element d'IGElement d'IG
Element d'IGElement d'IG Element d'IG
isBelowOf
isOnTheRightOfisOnTheRightOf
Situé
Au dessus
à gauche
de (uie1)
Situé
Au dessus
de (uie1)
Situé
Au dessus
à droite
de (uie1)
Situé
A gauche
de (uie1)
Elément de
référence
(uie1)
Situé
A droite
de (uie1)
Situé
En dessous
à gauche
de (uie1)
Situé
En dessous
de (uie1)
Situé
En dessous
à droite
de (uie1)
• Cohérence graphique « de proximité »
21 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
23. Modèle architectural pour l’interface graphique
et le noyau fonctionnel : Modèle à composants
Element
d'application
Element
d'application
Port Requis
Port Fourni
Lien Opérationnel
SCA
SLCA
FRACTAL[ ]
C
C
CC C
C
C
C
C
• Cohérence « opérationnelle »
23 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
25. Modèle pour l’Arbre de tâches:
Modèle « CTT »
HTA
UAN
GOMS
CTT
[ ] Task
(Abstract)
Task
(Interaction)
Task
(Abstract)
Task
(System)
Task
(User)
[]
[]>>
(User)
(System)
(Interaction)
(Abstract)
Tâche Utilisateur
Tâche Système
Tâche d'Interaction
Tâche Abstraite
[]
>>
[]>>
|||
choix
activation
séquence-transfert
parallélisme
LOTOS
[ ]
T
T T
T T T
• Cohérence « intentionnelle »
25 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
26. Arbre de tâches
Cinema
Cinema
TaskTree
(Abstract)
GetClosestMovie
Theaters
(Abstract)
Retrieve closest movie
theaters from given
address
(System)
Update movie
theaters list
(Interaction)[]>>
[]>>Fill Address
(Interaction)
Trigger search
for closest
movie theaters
(Interaction)
[]>>
GetMovies
(Abstract)
Get movies
(System)
Update movies
list
(Task)[]>>
[]>>
Select Movie
Theater
(Interaction)
Trigger
search for
movies
(Interaction)
||
>>
26 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
27. Cohérence globale de l’application:
Correspondances entre les parties
C
C
CC C
C
Composants
Interface Graphique
Arbre de tâches
T
T T
T T T
27 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
29. CheckPointsList
ZoomSlider VisualizationMap
AddressAInput
AddressBInput
RouteCalculButton
RouteCalcul
Controller
RouteMap
Service
Fill
Position A
(Interaction)
Fill
Position B
(Interaction)
Update Map and
Checkpoints list
(Interaction)
|||
Fill begin and
arrival positions
(Interaction)
Update Map
(Interaction)
Update
slider
(Interaction)
|||
Update Map
(Interaction)
Update
Checkpoints List
(Interaction)
|||
Route
Calcul
(System)
Trigger Route
Calcul
(Interaction)
[]>> []>> []>>
ZoomSlider
Controller
Visualization
Map
Controller
CheckPoints
List
Controller
MapsInterface
MainContainer MapContainer
PositionsContainer
RouteContainer
CheckPointsList
ZoomSlider VisualizationMap
AddressAInput
AddressBInput
RouteCalculButton
RouteCalcul
Controller
RouteMap
Service
Fill
Position A
(Interaction)
Fill
Position B
(Interaction)
Update Map and
Checkpoints list
(Interaction)
|||
Fill begin and
arrival positions
(Interaction)
Update Map
(Interaction)
Update
slider
(Interaction)
|||
Update Map
(Interaction)
Update
Checkpoints List
(Interaction)
|||
Route
Calcul
(System)
Trigger Route
Calcul
(Interaction)
[]>> []>> []>>
ZoomSlider
Controller
Visualization
Map
Controller
CheckPoints
List
Controller
MapsInterface
MainContainer MapContainer
PositionsContainer
RouteContainer
Port Requis
Port Fourni
Lien Opérationnel
Réalisation (métier et interaction) d’une tâche:
Correspondance Tâches – Composants
29 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
30. Maps
TaskTree
(Abstract)
Zoom on Map
(Abstract)
Trigger
Zoom
(Interaction)
Calcul
Zoom
(System)
Update Map and slider
(Interaction)[]>> []>>
Highlight a
checkpoint
(Interaction)
Retrieve a Route
(Abstract) >>[]
Select a
checkpoint
(Interaction)
Hig
checkpo
(Inte
[]>>
Fill
Position A
(Interaction)
Fill
Position B
(Interaction)
Upd
Che
(I
|||
Fill begin and
arrival positions
(Interaction)
Update Map
(Interaction)
Update
slider
(Interaction)
|||
Update Map
(Interaction)
Route
Calcul
(System)
Trigger Route
Calcul
(Interaction)
[]>> []>> []>>
MapsInterface
MainContainer
CheckPointsList
VisualizationMap
ontainer
Label "Position B"AddressAInput AddressBInput
RouteCalculButton
RouteContainer
PositionsContainer
LefOf
isBelowOf
isBelowOf
isBelowOf isBelowOf isOnTheRightOf
isOnTheRightOf
Maps
TaskTree
(Abstract)
Zoom on Map
(Abstract)
Trigger
Zoom
(Interaction)
Calcul
Zoom
(System)
Update Map and slider
(Interaction)[]>> []>>
Highlight a
checkpoint
(Interaction)
Retrieve a Route
(Abstract) >>[]
Select a
checkpoint
(Interaction)
H
checkp
(In
[]>>
Fill
Position A
(Interaction)
Fill
Position B
(Interaction)
Up
C
|||
Fill begin and
arrival positions
(Interaction)
Update Map
(Interaction)
Update
slider
(Interaction)
|||
Update Map
(Interaction)
Route
Calcul
(System)
Trigger Route
Calcul
(Interaction)
[]>> []>> []>>
MapsInterface
MainContainer
CheckPointsList
VisualizationMap
ontainer
Label "Position B"AddressAInput AddressBInput
RouteCalculButton
RouteContainer
PositionsContainer
efOf
isBelowOf
isBelowOf
isBelowOf isBelowOf isOnTheRightOf
isOnTheRightOf
Réalisation (interaction) d’une tâche:
Correspondance Interface Graphique - Tâches
30 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
31. C
C
CC C
C
Ma proposition
Interface Graphique
Arbre de tâches
T
T T
T T T
Composants
C
C
C
31 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
32. Processus de composition
C
C
CC C
C
C
C
CC C
C
C
C
CC C
C
T
T T
T T T
T
T T
T T T
1) Sélection cohérente des sous-parties
2) Composition par substitutions
3) Placement des éléments graphiques dans la nouvelle interface
32 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
33. SÉLECTION
- Sélection cohérente
- Illustration de la sélection
INTERACT’11
WEBIST’11
IHM’11
HCSE’10
{ }
33 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
34. Sélection cohérente
C
C
CC C
C
T
T T
T T T
1) Cohérence globale de la sélection
2) Expression des intentions utilisateurs
34 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
35. Exploitation des capacités de chaque modèle:
expression des intentions utilisateurs
T
T T
T T T
C
C
CC C
C
35 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
36. Sélection cohérente
C
C
CC C
C
T
T T
T T T
1) Cohérence globale de la sélection
2) Expression des intentions utilisateurs
3) Considération de l’exécution
36 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
37. Application à l’étude de cas: Cinéma
37 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
38. CinemaInterface
CinemaContainer
GetClosestMovie
TheatersButton
AddressContainer
AddressInput
isBelowOf
isOnTheRightOf
MovieTheatersInfo
Container
Movies In Selected
Cinema
ClosestMovie
TheatersList
isOnTheRightOf
GetClosestMovie
Theaters
Controller
CinemaInterface CinemaContainer
AddressInput
AddressContainer
ClosestMovie
TheatersList
GetClosestMovie
TheatersButton
MovieTheatersInfo
Container
GetMovies
Controller
MoviesList
CinemaInterface
CinemaContainer
GetClosestMovie
TheatersButton
AddressContainer
AddressInput
isBelowOf
isOnTheRightOf
MovieTheatersInfo
Container
Movies In Selected
Cinema
ClosestMovie
TheatersList
isOnTheRightOf
Cinema
TaskTree
(Abstract)
GetClosestMovie
Theaters
(Abstract)
Retrieve closest movie
theaters from given
address
(System)
[]>>
Fill Address
(Interaction)
Trigger search
for closest
movie theaters
(Interaction)
[]>>
Select Movie
Theater
(Interaction)
Trigge
search
movie
(Interact
||
Cohérence globale:
Répercussion sur tâches et composants
38 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
39. Cinema
TaskTree
(Abstract)
GetClosestMovie
Theaters
(Abstract)
Retrieve closest movie
theaters from given
address
(System)
Update movie
theaters list
(Interaction)[]>>
[]>>Fill Address
(Interaction)
Trigger search
for closest
movie theaters
(Interaction)
[]>>
GetMovies
(Abstract)
Get movies
(System)[]>>
Select Movie
Theater
(Interaction)
Trigger
search for
movies
(Interaction)
||
>>
Exploitation du modèle de tâches
39 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
40. Cinema
TaskTree
(Abstract)
GetClosestMovie
Theaters
(Abstract)
Retrieve closest movie
theaters from given
address
(System)
Update movie
theaters list
(Interaction)[]>>
[]>>Fill Address
(Interaction)
Trigger search
for closest
movie theaters
(Interaction)
[]>>
GetMovies
(Abstract)
Get movies
(System)
Update movies
list
(Task)[]>>
[]>>
Select Movie
Theater
(Interaction)
Trigger
search for
movies
(Interaction)
||
>>
GetClosestMovie
Theaters
Controller
GetClosestMovie
Theaters
Service
CinemaInterface CinemaContainer
AddressInput
AddressContainer
ClosestMovie
TheatersList
GetClosestMovie
TheatersButton
MovieTheatersInfo
Container
GetMovies
Controller
GetMovies
Service
MoviesList
Cohérence globale:
répercussion sur les composants
40 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
41. Considération de l’exécution
GetClosestMovie
Theaters
Controller
GetClosestMovie
Theaters
Service
CinemaInterface CinemaContainer
AddressInput
AddressContainer
ClosestMovie
TheatersList
GetClosestMovie
TheatersButton
MovieTheatersInfo
Container
GetMovies
Controller
GetMovies
Service
MoviesList
GetClosestMovie
Theaters
Controller
GetClosestMovie
Theaters
Service
CinemaInterface CinemaContainer
AddressInput
AddressContainer
ClosestMovie
TheatersList
GetClosestMovie
TheatersButton
MovieTheatersInfo
Container
GetMovies
Controller
GetMovies
Service
MoviesList
41 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
48. VALIDATION À TRAVERS UN PROTOTYPE
ET DES TESTS UTILISATEURS
- OntoCompo: Outil de composition d’applications
- Tests UtilisateursINTERACT’11
IHM’11{ }
48 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
49. Compréhension et pertinence des extensions – Apport des tâches et liens entre modèles
Tests Utilisateurs:
Objectifs et Déroulement
Phase
« d’apprentissage »
Sélection et
substitutions
sans aide
Ajout de l’aide à
travers les extensions
de sélection
Présentation
des différents
modèles
Entretien de fin de
tests
Etude rapide du code
généré pour une
substitution
Compréhension du processus de composition « Sélection – Substitution - Placement »
Aptitude à effectuer la composition à l’aide du prototype
Suffisance des informations fournies (accès uniquement à l’Interface Graphique)
49 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
50. Utilisateurs et Environnement de test
• 9 développeurs-informaticiens répartis en 2 groupes
– 4 n’ayant jamais manipulé d’outils de composition
d’applications
– 5 ayant utilisé au moins un outil
Pas de différence significative
• Environnement de test
Développeur
Testeur
Observateur
50 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
51. Résultats
Compréhension et pertinence des extensions – Apport des tâches et liens entre modèles
Compréhension du processus de composition « Sélection – Substitution - Placement »
Aptitude à effectuer la composition à l’aide du prototype
Suffisance des informations fournies (accès uniquement à l’Interface Graphique)
Bonne appréhension du processus
Réussite dans la concrétisation des intentions…
mais des difficultés
Extensions: Compréhension difficiles – Utilité comprise
Utilisation principalement de l’extension utilisant les tâches
Modèle de tâches: le plus intuitif pour effectuer les sélections
Modèle à composants: celui qui convient pour effectuer les
substitutions
51 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
52. SYNTHÈSE ET PERSPECTIVES
52 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
53. Modélisation multi-niveaux d’une application
cohérente par des correspondances entre modèles
– Extraction de sous-parties cohérentes
– Interconnexions des sous parties extraites
OntoCompo: un prototype pour la composition
Des expérimentations
Composition d’applications dirigée par
la composition des Interfaces Graphiques
C
C
CC C
C
C
C
CC C
C
C
C
CC C
C
T
T T
T T T
T
T T
T T T
T
T T
T T T
53 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
54. Suite des tests utilisateurs:
Déterminer la représentation des modèles
GetClosestMovie
Theaters
Controller
GetClosestMovie
Theaters
Service
CinemaInterface CinemaContainer
Port Requis
Port Fourni
Lien Opérationnel
AddressInput
AddressContainer
ClosestMovie
TheatersList
GetClosestMovie
TheatersButton
MovieTheatersInfo
Container
GetMovies
Controller
GetMovies
Service
MoviesList
Cinema
TaskTree
(Abstract)
GetClosestMovie
Theaters
(Abstract)
Retrieve closest movie
theaters from given
address
(System)
Update movie
theaters list
(Interaction)[]>>
[]>>Fill Address
(Interaction)
Trigger search
for closest
movie theaters
(Interaction)
[]>>
GetMovies
(Abstract)
Get movies
(System)
Update movies
list
(Task)[]>>
[]>>
Select Movie
Theater
(Interaction)
Trigger
search for
movies
(Interaction)
||
>> CheckPointsList
ZoomSlider VisualizationMap
AddressAInput
AddressBInput
RouteCalculButton
RouteCalcul
Controller
RouteMap
Service
ZoomSlider
Controller
Visualization
Map
Controller
CheckPoints
List
Controller
MapsInterface
MainContainer MapContainer
PositionsContainer
RouteContainer
Port Requis
Port Fourni
Lien Opérationnel
Maps
TaskTree
(Abstract)
Zoom on Map
(Abstract)
Trigger
Zoom
(Interaction)
Calcul
Zoom
(System)
Update Map and slider
(Interaction)[]>> []>>
Highlight a
checkpoint
(Interaction)
Retrieve a Route
(Abstract) >>[]
Select a
checkpoint
(Interaction)
Highlight
checkpoint on Map
(Interaction)
[]>>
Fill
Position A
(Interaction)
Fill
Position B
(Interaction)
Update Map and
Checkpoints list
(Interaction)
|||
Fill begin and
arrival positions
(Interaction)
Update Map
(Interaction)
Update
slider
(Interaction)
|||
Update Map
(Interaction)
Update
Checkpoints List
(Interaction)
|||
Route
Calcul
(System)
Trigger Route
Calcul
(Interaction)
[]>> []>> []>>
54 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
55. C
C
CC C
C
C
C
CC C
C
C
C
CC C
C
« Algèbre » d’applications
Cinema
TaskTree
(Abstract)
GetClosestMovie
Theaters
(Abstract)
Retrieve closest movie
theaters from given
address
(System)
Update movie
theaters list
(Interaction)[]>>
[]>>Fill Address
(Interaction)
Trigger search
for closest
movie theaters
(Interaction)
[]>>
GetMovies
(Abstract)
Get movies
(System)
Update movies
list
(Task)[]>>
[]>>
Select Movie
Theater
(Interaction)
Trigger
search for
movies
(Interaction)
||
>>
Maps
TaskTree
(Abstract)
Zoom on Map
(Abstract)
Trigger
Zoom
(Interaction)
Calcul
Zoom
(System)
Update Map and slider
(Interaction)[]>> []>>
Highlight a
checkpoint
(Interaction)
Retrieve a Route
(Abstract) >>[]
Select a
checkpoint
(Interaction)
Highlight
checkpoint on Map
(Interaction)
[]>>
Fill
Position A
(Interaction)
Fill
Position B
(Interaction)
Update Map and
Checkpoints list
(Interaction)
|||
Fill begin and
arrival positions
(Interaction)
Update Map
(Interaction)
Update
slider
(Interaction)
|||
Update Map
(Interaction)
Update
Checkpoints List
(Interaction)
|||
Route
Calcul
(System)
Trigger Route
Calcul
(Interaction)
[]>> []>> []>>
55 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
56. Obtention des modèles d’une application
CheckPointsList
ZoomSlider VisualizationMap
AddressAInput
AddressBInput
RouteCalculButton
RouteCalcul
Controller
RouteMap
Service
Maps
TaskTree
(Abstract)
Zoom on Map
(Abstract)
Trigger
Zoom
(Interaction)
Calcul
Zoom
(System)
Update Map and slider
(Interaction)[]>> []>>
Highlight a
checkpoint
(Interaction)
Retrieve a Route
(Abstract) >>[]
Select a
checkpoint
(Interaction)
Highlight
checkpoint on Map
(Interaction)
[]>>
Fill
Position A
(Interaction)
Fill
Position B
(Interaction)
Update Map and
Checkpoints list
(Interaction)
|||
Fill begin and
arrival positions
(Interaction)
Update Map
(Interaction)
Update
slider
(Interaction)
|||
Update Map
(Interaction)
Update
Checkpoints List
(Interaction)
|||
Route
Calcul
(System)
Trigger Route
Calcul
(Interaction)
[]>> []>> []>>
ZoomSlider
Controller
Visualization
Map
Controller
CheckPoints
List
Controller
MapsInterface
MainContainer MapContainer
PositionsContainer
RouteContainer
Port Requis
Port Fourni
Lien Opérationnel
MapsInterface
MainContainer
CheckPointsList
ZoomSlider VisualizationMap
MapContainer
Label "Position A" Label "Position B"AddressAInput AddressBInput
RouteCalculButton
RouteContainer
PositionsContainer
isOnTheLefOf
isBelowOf
isBelowOf
isBelowOf isBelowOfisOnTheRightOf isOnTheRightOf
isOnTheRightOf
UI
UI
UI
UI
UI
UI
UI
UI
UI
UI
UI
Component
UI
Component
UI
Component
UI
Component
Input
Input
Input
Input
Input
Input
Input
Input
Input
Output
Output
Output
Output
Output
Output
Output
Output
Output
Output
Trigger
Trigger
Trigger
Trigger
Trigger
Trigger
Trigger Trigger
Input
Input
Input Input
Input
Input
Input
Input
Input
Input
Input Input
Input
Input
Input
Input
Input
Input
Input
Input
56 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
57. Composition menée par l’utilisateur final
57 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
58. Merci de votre attention!
58 / 58
Introduction Etat de l'art Modèles Sélection Substitutions Validation Synthèse Perspectives
Notes de l'éditeur
En vacances, à mon hôtel, et je veux aller au cinéma.
Les manipulations vont être nombreuses et les aller-retour entre les applications se multiplient assez vite.Il y a un risque de perdre des informations durant ces manipulations et surtout une copie d'informations est nécessaire pour réaliser la tâche que nous nous sommes fixée.Dans le meilleur des cas, nous arrivons à effectuer un copier-coller correct et la tâche sera atteinte correctement.Dans le moins bon des cas, la copie s'effectue en introduisant des erreurs qui peuvent conduire à un résultat erronée et à un échec de la tâche fixée.
Ils sont confrontés alors à différents problèmes qui sont la recherche de la ou les bonnes API pour ajouter de nouvelles fonctionnalités à leur application, et surtout la bonne API permettant de répondre aux besoins des utilisateurs, qui vont avoir des buts à atteindre potentiellement différents. Puis lorsque le choix de l'API est effectué, il faut alors l'intégrer à son application et ici, hors mis les problèmes liés à cette intégration en terme d'interopérabilité avec l'existant, il faut aussi construire l'interface graphique afin que ces nouvelles fonctionnalités soient utilisables dans l'application.
Pour définir une telle application, si nous regardons le développement d'une application en GL et en IHM, nous pouvons constater qu'une application est constituée de trois parties. Les deux parties exécutables de l'application sont la partie visible de l'application qui est son interface graphique et la partie cachée de l'application qui le noyau fonctionnel. Du côté du GL, après avoir capturé les besoins, le noyau fonctionnel est développé puis l'interface graphique de l'application est développé et liée à sa partie fonctionnelle. En IHM, le cycle part de l'expression des besoins à travers un arbre de tâches de l'application, puis par raffinement de cet arbre, l'interface graphique de l'application est obtenue. Enfin, le noyau fonctionnel est alors développé et liée à l'interface graphique de l'application.
3 parties qui vont être l'arbre de tâches de l'application, qui va permettre de décrire l'ensemble des fonctionnalités disponibles dans l'application et comment elles se réalisent, l'interface graphique de l'application et son noyau fonctionnel pour la partie opérationnelle de l’application.
[Composantsde tâches] => G. Bourguin, A. Lewandowski, JC. Tarby (TMDUID, 2007)=> A. Lewandowski, S. Lepreux, G. Bourguin (HCI, 2007)
Nous pouvons alors établir une synthèse sur ces travaux en composition d'applications. La cohérence globale de l'application telle que nous l'avons définie n'est pas maintenue. Effectivement, les travaux s'appuient sur une seule partie de l'application pour effectuer la composition, et sont ammenés à générer tout une partie de l'application. Les liens entre les différentes parties ne sont pas préservées qui se traduit par un manque en terme d'utilisabilité de l'application ou par une lacune en terme d'exécution. Cependant, chacun des ses travaux s'appuient sur des modèles permettant d'effectuer ces compositions et pour certains mettent déjà en place des liens entre certaines parties de l'application.
Donner plus d’explications (cf Question Jean)
Bien positionner à l’oral! => Granularité, positionnement entre AUI et CUIOn n’a pas d’infos sur les MODALITES!!!!
Après ce slide: ma contrib mettre les liens entre modèles
Titre : Hypothèse (point de vue + cohérence) ; thèse : la modélisation pour la composition
Parler arbre / graphe
Partir du bouton
Revoir discours
Justifier substitutions!Union, juxtaposition => pas de pb, et pas ce que je veux obtenirEntrelacer les entrées/sortiesEntrelacer complètement au niveau code (pas dans mon hypothèse)