Vers des interfaces graphiques flexibles de configurations

Preview:

Citation preview

Vers des interfaces graphiques flexibles de

configurationSimon Urli, Guillaume Perez, Heytem Zitoun, Mireille Blay-Fornarino,

Philippe Collet, Philippe Renevier-Gonin

urli@i3s.unice.frLaboratoire I3S

Université Nice Sophia Antipolis

Journée Lignes de Produits 2012 S. Urli/ 34

Introduction

• Importante complexité des configurations dans les SPL

• Existence d’IHM de configurations très esthétiques mais fortement ad-hoc

• Existence d’outils de configurations directement générés à partir de FMs mais difficilement utilisables

2

Journée Lignes de Produits 2012 S. Urli/ 34

Exemple d’interfaces ad-hoc

3

Journée Lignes de Produits 2012 S. Urli/ 34

Exemple d’interfaces ad-hoc

3

Journée Lignes de Produits 2012 S. Urli/ 34

Configuration à partir d’un FM

4

Source

TypeInfo Criteria

Tweets Calendar PictureAlbum Filter Sort

Twitter ICalReader FlickR Picasa TimeLine Album Period Popularity Date NameHyperCal

Journée Lignes de Produits 2012 S. Urli/ 34

Configurateur Associé (FeatureIDE)

5

Journée Lignes de Produits 2012 S. Urli/ 34

Configurateur Associé (FeatureIDE)

Sélection : double clic

6

Journée Lignes de Produits 2012 S. Urli/ 34

Configurateur Associé (FeatureIDE)

Sélection : double clicDéselection : quatre clics

7

Journée Lignes de Produits 2012 S. Urli/ 34

Configurateur Associé (FeatureIDE)

Sélection : double clicDéselection : quatre clics

Impossible de changer le type d’information ?

8

Journée Lignes de Produits 2012 S. Urli/ 34

Configurateur Associé (FeatureIDE)

Sélection : double clicDéselection : quatre clics

Impossible de changer le type d’information ?

Que signifie ce filtre ?

9

Journée Lignes de Produits 2012 S. Urli/ 34

Perspectives et

discussions

10Journée Lignes de Produits 2012

Journée Lignes de Produits 2012 S. Urli/ 34

Cas d’étude :YourCast

Perspectives et

discussions

10Journée Lignes de Produits 2012

Journée Lignes de Produits 2012 S. Urli/ 34

Cas d’étude :YourCastBesoins

Perspectives et

discussions

10Journée Lignes de Produits 2012

Journée Lignes de Produits 2012 S. Urli/ 34

Cas d’étude :YourCastBesoins

Première solution

Perspectives et

discussions

10Journée Lignes de Produits 2012

Journée Lignes de Produits 2012 S. Urli/ 34

Cas d’étude :YourCastBesoins

Première solution

Perspectives et

discussions

10Journée Lignes de Produits 2012

Journée Lignes de Produits 2012 S. Urli/ 34

Cas d’étude

Imaginez votre diffuseur d’informations personnalisé

11

Journée Lignes de Produits 2012 S. Urli/ 34

Cas d’étude : YourCast

12

Journée Lignes de Produits 2012 S. Urli/ 34

Cas d’étude : YourCast

13

Journée Lignes de Produits 2012 S. Urli/ 34

Cas d’étude : YourCast

13

Journée Lignes de Produits 2012 S. Urli/ 34

Différentes Lignes de Produits

14

Journée Lignes de Produits 2012 S. Urli/ 34

Différentes Lignes de ProduitsSources

14

Journée Lignes de Produits 2012 S. Urli/ 34

Différentes Lignes de Produits

Layouts

Sources

14

Journée Lignes de Produits 2012 S. Urli/ 34

Différentes Lignes de Produits

Layouts

Renderers

Sources

14

Journée Lignes de Produits 2012 S. Urli/ 34

Ce que l’on souhaiterait montrer

• Des niveaux de sélection

• Une sémantique intuitive sur la signification des features

• Des explications dans le cas où on ne peut expliquer simplement le rôle d’une feature

15

Journée Lignes de Produits 2012 S. Urli/ 34

Source

16

Source

TypeInfo Criteria

Tweets Calendar PictureAlbum Filter Sort

Twitter ICalReader FlickR Picasa TimeLine Album Period Popularity Date NameHyperCal

Journée Lignes de Produits 2012 S. Urli/ 34

Feature : AlbumPhotoSélectionnez cette feature si vous souhaitez diffuser un ou plusieurs albums photos.

Solution : interface ad-hoc

17

Journée Lignes de Produits 2012 S. Urli/ 34

Feature : AlbumPhotoSélectionnez cette feature si vous souhaitez diffuser un ou plusieurs albums photos.

Solution : interface ad-hoc

17

Principaux critères de

discrimination

Journée Lignes de Produits 2012 S. Urli/ 34

Feature : AlbumPhotoSélectionnez cette feature si vous souhaitez diffuser un ou plusieurs albums photos.

Solution : interface ad-hoc

17

Principaux critères de

discrimination

Critères supplémentaires (arborescents)

Journée Lignes de Produits 2012 S. Urli/ 34

Feature : AlbumPhotoSélectionnez cette feature si vous souhaitez diffuser un ou plusieurs albums photos.

Solution : interface ad-hoc

17

Principaux critères de

discrimination

Critères supplémentaires (arborescents)

Zone d’explications

Journée Lignes de Produits 2012 S. Urli/ 34

Feature : AlbumPhotoSélectionnez cette feature si vous souhaitez diffuser un ou plusieurs albums photos.

Solution : interface ad-hoc

17

Principaux critères de

discrimination

Critères supplémentaires (arborescents)

Zone d’explications

Utilisation d’images

Journée Lignes de Produits 2012 S. Urli/ 34

Feature : AlbumPhotoSélectionnez cette feature si vous souhaitez diffuser un ou plusieurs albums photos.

Solution : interface ad-hoc

17

Principaux critères de

discrimination

Critères supplémentaires (arborescents)

Zone d’explications

Utilisation d’images

Utilisation d’explications

Journée Lignes de Produits 2012 S. Urli/ 34

Gérer l’évolution de la ligne ?

18

Source

TypeInfo Criteria

Tweets Calendar PictureAlbum Filter Sort

Twitter ICalReader FlickR Picasa TimeLine Album Period Popularity Date NameHyperCal

Forecast

Weather2

Journée Lignes de Produits 2012 S. Urli/ 34

Gérer l’évolution de la ligne ?

19

Source

TypeInfo Criteria

Tweets Calendar PictureAlbum Filter Sort

TimeLine Album Period Popularity Date Name

Services

Twitter IcalReader HyperCal FlickR Picasa

Journée Lignes de Produits 2012 S. Urli/ 34

Conserver la même interface pour les différentes lignes ?

20

Layout

Property Design Product Zones

Usage Target EPU NoelCA N2IIRSAM LayoutIRSAM LayoutEPU LayoutCA BigSquareCenter ThinBarBottom

Academic Disabilities

Visual

Students Children AnyPeople ThinBarBottomNoLogo ThinBarBottomLogo

Journée Lignes de Produits 2012 S. Urli/ 34

Changer l’interface sans modifier la ligne ?

21

Journée Lignes de Produits 2012 S. Urli/ 34

Solution : annoter les FMs pour adapter automatique l’interface

22

Source

TypeInfo Criteria

Tweets Calendar PictureAlbum Filter Sort

Twitter ICalReader FlickR Picasa TimeLine Album Period Popularity Date NameHyperCal

Journée Lignes de Produits 2012 S. Urli/ 34

Solution : annoter les FMs pour adapter automatique l’interface

22

Source

TypeInfo Criteria

Tweets Calendar PictureAlbum Filter Sort

Twitter ICalReader FlickR Picasa TimeLine Album Period Popularity Date NameHyperCal

1er niveau de sélection

Journée Lignes de Produits 2012 S. Urli/ 34

Solution : annoter les FMs pour adapter automatique l’interface

22

Source

TypeInfo Criteria

Tweets Calendar PictureAlbum Filter Sort

Twitter ICalReader FlickR Picasa TimeLine Album Period Popularity Date NameHyperCal

Feature : Sélectionnez cette feature si vous souhaitez diffuser un ou plusieurs albums

1er niveau de sélection

Journée Lignes de Produits 2012 S. Urli/ 3423

Source

TypeInfo Criteria

Tweets Calendar PictureAlbum Filter Sort

Twitter ICalReader FlickR Picasa TimeLine Album Period Popularity Date NameHyperCal

Solution : annoter les FMs pour adapter automatique l’interface

Journée Lignes de Produits 2012 S. Urli/ 3423

Source

TypeInfo Criteria

Tweets Calendar PictureAlbum Filter Sort

Twitter ICalReader FlickR Picasa TimeLine Album Period Popularity Date NameHyperCal

2ème niveau de sélection

Solution : annoter les FMs pour adapter automatique l’interface

Journée Lignes de Produits 2012 S. Urli/ 3423

Source

TypeInfo Criteria

Tweets Calendar PictureAlbum Filter Sort

Twitter ICalReader FlickR Picasa TimeLine Album Period Popularity Date NameHyperCal

Feature : Sélectionnez cette feature si vous souhaitez diffuser un ou plusieurs albums

2ème niveau de sélection

Solution : annoter les FMs pour adapter automatique l’interface

Journée Lignes de Produits 2012 S. Urli/ 3424

Source

TypeInfo Criteria

Tweets Calendar PictureAlbum Filter Sort

Twitter ICalReader FlickR Picasa TimeLine Album Period Popularity Date NameHyperCal

Solution : annoter les FMs pour adapter automatique l’interface

Journée Lignes de Produits 2012 S. Urli/ 3424

Source

TypeInfo Criteria

Tweets Calendar PictureAlbum Filter Sort

Twitter ICalReader FlickR Picasa TimeLine Album Period Popularity Date NameHyperCal

Définition des «critères»

Solution : annoter les FMs pour adapter automatique l’interface

Journée Lignes de Produits 2012 S. Urli/ 3424

Source

TypeInfo Criteria

Tweets Calendar PictureAlbum Filter Sort

Twitter ICalReader FlickR Picasa TimeLine Album Period Popularity Date NameHyperCal

Feature : Sélectionnez cette feature si vous souhaitez diffuser un ou plusieurs albums

Définition des «critères»

Solution : annoter les FMs pour adapter automatique l’interface

Journée Lignes de Produits 2012 S. Urli/ 34

Annotations

• 1 fichier d’annotation par FM

• 1 règle par feature

• 3 niveaux possibles + 1 niveau «caché»

• 1 image possible

• 1 description (explication) possible

• + héritage des niveaux et des images

25

Journée Lignes de Produits 2012 S. Urli/ 34

Exemple de fichier d’annotation

26

Source

TypeInfo Criteria

Tweets Calendar PictureAlbum Filter Sort

Twitter ICalReader FlickR Picasa TimeLine Album Period Popularity Date NameHyperCal

Tweets logo=logoTwitter.png : first ; DescriptionCalendar logo=logoCalendar.png : first ; ...PictureAlbum logo=logoAlbum.png : first ; ...Twitter : secondICalReader : second ; ...HyperCal : second ; ...FlickR logo=FlickR.png : secondPicasa logo=Picasa.png : secondCriteria : criteriaPeriod : criteria ; Filtre sur une période de temps

3 niveaux : first, second et criteria

Utilisation de l’héritage dans les critères et dans les images pour Twitter et les calendriers

Journée Lignes de Produits 2012 S. Urli/ 34

Interface obtenue

27

Feature : AlbumPhoto

Sélectionnez cette feature si vous souhaitez diffuser un ou plusieurs albums photos.

Journée Lignes de Produits 2012 S. Urli/ 34

Architecture globale du système

28

SpineFMMoteur de

raisonnement

TocsinInterface de

Configuration

featuremodelssélections

Feature Models

FAMILIAR

Annotationsnotifications

IHM

Journée Lignes de Produits 2012 S. Urli/ 34

Etat des lieux

• Possibilité d’annoter des FMs

• Adaptation automatique d’une interface à partir des FMs

• Séparation nette des préoccupations entre les FMs et les annotations

29

Journée Lignes de Produits 2012 S. Urli/ 34

Perspectives

30

Journée Lignes de Produits 2012 S. Urli/ 34

Perspectives

• Redéfinition de l’interface avec des ergonomes

30

Journée Lignes de Produits 2012 S. Urli/ 34

Perspectives

• Redéfinition de l’interface avec des ergonomes

• Enrichissement de la grammaire en fonction des besoins (ex: modularité de l’héritage...)

30

Journée Lignes de Produits 2012 S. Urli/ 34

Perspectives

• Redéfinition de l’interface avec des ergonomes

• Enrichissement de la grammaire en fonction des besoins (ex: modularité de l’héritage...)

• Apparition de nouveaux problèmes et besoins : définition d’une interface pour gérer une MSPL

30

Journée Lignes de Produits 2012 S. Urli/ 34

Principe d’une MSPL

31

Source

TypeInfo Criteria

Tweets Calendar PictureAlbum Filter Sort

Twitter ICalReader FlickR Picasa TimeLine Album Period Popularity Date NameHyperCal

Layout

Property Design Product Zones

Usage Target EPU NoelCA N2IIRSAM LayoutIRSAM LayoutEPU LayoutCA BigSquareCenter ThinBarBottom

Academic Disabilities

Visual

Students Children AnyPeople ThinBarBottomNoLogo ThinBarBottomLogo

Renderer

TypeInfo Format

Tweets Calendar PictureAlbum Ligne Cadre

ContentOnly Day Mosaic Slide Content Logo Text PictureWeek MonthFullTweet Title

Journée Lignes de Produits 2012 S. Urli/ 34

Principe d’une MSPL

31

Source

TypeInfo Criteria

Tweets Calendar PictureAlbum Filter Sort

Twitter ICalReader FlickR Picasa TimeLine Album Period Popularity Date NameHyperCal

Layout

Property Design Product Zones

Usage Target EPU NoelCA N2IIRSAM LayoutIRSAM LayoutEPU LayoutCA BigSquareCenter ThinBarBottom

Academic Disabilities

Visual

Students Children AnyPeople ThinBarBottomNoLogo ThinBarBottomLogo

Renderer

TypeInfo Format

Tweets Calendar PictureAlbum Ligne Cadre

ContentOnly Day Mosaic Slide Content Logo Text PictureWeek MonthFullTweet Title

Journée Lignes de Produits 2012 S. Urli/ 34

Interface de configuration d’une MSPL

32

Journée Lignes de Produits 2012 S. Urli/ 34

Interface de configuration d’une MSPL

32

Journée Lignes de Produits 2012 S. Urli/ 34

Interface de configuration d’une MSPL : de nouveaux besoins

33

Journée Lignes de Produits 2012 S. Urli/ 34

Interface de configuration d’une MSPL : de nouveaux besoins

33

• Configuration de différents composants

Journée Lignes de Produits 2012 S. Urli/ 34

Interface de configuration d’une MSPL : de nouveaux besoins

33

• Configuration de différents composants

‣ Besoin d’homogénéité dans l’interface

Journée Lignes de Produits 2012 S. Urli/ 34

Interface de configuration d’une MSPL : de nouveaux besoins

33

• Configuration de différents composants

‣ Besoin d’homogénéité dans l’interface

• Absence d’ordre dans les configurations

Journée Lignes de Produits 2012 S. Urli/ 34

Interface de configuration d’une MSPL : de nouveaux besoins

33

• Configuration de différents composants

‣ Besoin d’homogénéité dans l’interface

• Absence d’ordre dans les configurations

‣ Besoin de pouvoir accéder à n’importe quel SPL à tout moment

Journée Lignes de Produits 2012 S. Urli/ 34

Interface de configuration d’une MSPL : de nouveaux besoins

33

• Configuration de différents composants

‣ Besoin d’homogénéité dans l’interface

• Absence d’ordre dans les configurations

‣ Besoin de pouvoir accéder à n’importe quel SPL à tout moment

• Contraintes inter-SPLs

Journée Lignes de Produits 2012 S. Urli/ 34

Interface de configuration d’une MSPL : de nouveaux besoins

33

• Configuration de différents composants

‣ Besoin d’homogénéité dans l’interface

• Absence d’ordre dans les configurations

‣ Besoin de pouvoir accéder à n’importe quel SPL à tout moment

• Contraintes inter-SPLs

‣ Besoin de réduire les choix de l’utilisateur sans le perdre

Journée Lignes de Produits 2012 S. Urli/ 34

Interface de configuration d’une MSPL : de nouveaux besoins

33

• Configuration de différents composants

‣ Besoin d’homogénéité dans l’interface

• Absence d’ordre dans les configurations

‣ Besoin de pouvoir accéder à n’importe quel SPL à tout moment

• Contraintes inter-SPLs

‣ Besoin de réduire les choix de l’utilisateur sans le perdre

• Création d’un produit global conforme à la MSPL

Journée Lignes de Produits 2012 S. Urli/ 34

Interface de configuration d’une MSPL : de nouveaux besoins

33

• Configuration de différents composants

‣ Besoin d’homogénéité dans l’interface

• Absence d’ordre dans les configurations

‣ Besoin de pouvoir accéder à n’importe quel SPL à tout moment

• Contraintes inter-SPLs

‣ Besoin de réduire les choix de l’utilisateur sans le perdre

• Création d’un produit global conforme à la MSPL

‣ Besoin de voir et créer les relations entre les composants

Journée Lignes de Produits 2012 S. Urli/ 34

Interface de configuration d’une MSPL : de nouveaux besoins

33

• Configuration de différents composants

‣ Besoin d’homogénéité dans l’interface

• Absence d’ordre dans les configurations

‣ Besoin de pouvoir accéder à n’importe quel SPL à tout moment

• Contraintes inter-SPLs

‣ Besoin de réduire les choix de l’utilisateur sans le perdre

• Création d’un produit global conforme à la MSPL

‣ Besoin de voir et créer les relations entre les composants

‣ Besoin d’avoir une vue synthétique du produit

S. UrliJournée Lignes de Produits 2012 / 34

Merci !

34

S. UrliJournée Lignes de Produits 2012 / 34

Merci !

34