SlideShare une entreprise Scribd logo
FLUPA UX DAYS ‘18
OOUX !… ou comment concevoir une expérience utilisateur
orientée objets
Tous droits réservés
#OOUX
#UXdays18
@HugoLabonde
@ghyslain_olier
Tous droits réservés
USABILIS © | CONFIDENTIEL
GHYSLAIN OLIER
ghyslain.olier@usabilis.com
Consultant UX expert
+ Coach @Usabilis
HUGO LABONDE
hugo.labonde@usabilis.com
Consultant UX expert
+ Formateur @Usabilis
Tous droits réservés
Workshop Ooux
OOUX : Origine & philosophie
OOUX : Workshop
Identification des objets
Description
Liaisons et encapsulations
Priorisation
Interactions
OOUX : Synthèse & discussion
Tous droits réservés
Tous droits réservés
Workshop Ooux
Tous droits réservés
Quels sont les objets ?
Où sont ces objets ?
Comment ces objets sont rattachés à moi ?
Comment ces objets sont reliés les uns aux autres ?
Tous droits réservés
Tous droits réservés
sonne
Personne
Personne
Personne
Personne
Personne
Personne
Verre
Verre
Verre
Verre
Verre
Serviette
Serviette
Serviette
Serviette
Serviette
Serviette
Montre
Téléphone
BagueVerre
Verre
Verre
Verre
Table
Nappe
Tous droits réservés
Tous droits réservés
Tous droits réservés
Tous droits réservés
Tous droits réservés
Tous droits réservés
Tous droits réservés
Du coup OOUX qu’est ce que c’est ?
Tous droits réservés
OOUX = Object Oriented UX
C’est un système digital intentionnellement organisé
autour d’objets réels et de leurs relations dans lequel
les interactions et la navigation sont facilités car les
objets correspondent au modèle mental de l’utilisateur.
Tous droits réservés
...et faire de l’OOUX ?
Tous droits réservés
Pratiquer l’OOUX c’est concevoir en mettant les
objets en priorité sur les actions procédurales.
C’est déterminer les actions après avoir défini les
objets, contrairement à la méthodes qui consiste à
sauter directement aux enchaînements d’écrans,
interactions, caractéristiques du produit.
Tous droits réservés
La Maman
de l’OOUX
www.rewiredux.com/ooux
Pourquoi faire de l’OOUX ?
Tous droits réservés
Placer ici
une image de cette taille
Placer ici
une image de cette taille
CONFIDENTIEL | © USABILIS | TOUS DROITS RÉSERVÉS
Ça renforce
l’ergonomie
générale
- Homogénéité
- Apprenabilité
- Permet de fluidifier la navigation
c’est à dire mieux répondre aux
questions “où je suis” et “où je peux
aller”
- Facilite la distinction et le
nommage des contenus
Tous droits réservés
Placer ici
une image de cette taille
Placer ici
une image de cette taille
CONFIDENTIEL | © USABILIS | TOUS DROITS RÉSERVÉS
Ça rationalise la
conception
- Favorise le design modulaire
- Plus efficient
- Réutilisabilité
Tous droits réservés
Placer ici
une image de cette taille
Placer ici
une image de cette taille
CONFIDENTIEL | © USABILIS | TOUS DROITS RÉSERVÉS
Ça simplifie la
maintenance
- La cohérence entre les différentes
vues facilite les mises à jour
- Système global plus évolutif
Tous droits réservés
Placer ici
une image de cette taille
Placer ici
une image de cette taille
CONFIDENTIEL | © USABILIS | TOUS DROITS RÉSERVÉS
Ça permet de mieux
échanger avec les
développeurs
Le modèle objet est populaire dans
le monde du développement. Le fait
de réutiliser un concept similaire sur
l’interface permet de renforcer les
liens et favorise la collaboration
avec les développeurs.
Tous droits réservés
Qu’est ce qu’un objet ?
Tous droits réservés
12 000 €Renault Clio
2018 • Neuve • Diesel
Faire une Offre Afficher plus de détails
Rémy Norbert
06 87 56 45 23
83 000 €Tesla Model S P100D
2016 • Occasion • Electrique
Faire une Offre Afficher plus de détails
Géraldine Hamont
06 67 56 12 23
Volvo 240 Break
1974 • Collection • Essence
Faire une Offre Affich
Rémy Norbert
06 87 56 45 23
Clio récupéré le 12 mars. Remise en état (peinture portière
arrière gauche, ampoule phare avant droit, pare-soleil). Prêt à
être vendu à partir du 30 mars.
Clio récupéré le 12 mars. Remise en état (peinture portière
arrière gauche, ampoule phare avant droit, pare-soleil). Prêt à
être vendu à partir du 30 mars.
Clio récupéré le 12 mars. Remise en état (p
arrière gauche, ampoule phare avant droit,
être vendu à partir du 30 mars.
Des instances
de l’objet “Voiture”
Tous droits réservés
Des
instances
Tous droits réservés
12 000 €Renault Clio
2018 • Neuve • Diesel
Faire une Offre Afficher plus de détails
Rémy Norbert
06 87 56 45 23
Clio récupéré le 12 mars. Remise en état (peinture portière
arrière gauche, ampoule phare avant droit, pare-soleil). Prêt
à être vendu à partir du 30 mars.
Une
instance
de l’objet
“Voiture”
Tous droits réservés
Photo
Année
Vendeur
Action principale Action secondaire
Partager
Marque Modèle Prix
Description
Type Energie
Structure
de l’objet
“Voiture”
Tous droits réservés
Tous droits réservés
Caractéristique
Méta.
Objet lié
Interaction Interaction
Interaction
Méta. Méta. Méta.
Caractéristique
Méta. Méta.
Tous droits réservés
Un Objet est composé de :
● Caractéristiques
● Métadonnées
● Objets liés
● Interactions
Tous droits réservés
Mais attention un objet peut avoir
plusieurs formes !
Tous droits réservés
Plusieurs
formes d’objet
Tous droits réservés
Tous droits réservés
Est ce-un objet ?
Tous droits réservés
CONSIGNE
Objet ou Pas Objet ?
Tous droits réservés
Header
Tous droits réservés
Header
C’est un élément
d’interface
Tous droits réservés
Vendeur
Tous droits réservés
Vendeur
Tous droits réservés
Patrick
Tous droits réservés
Patrick
C’est une instance
Tous droits réservés
Client
Tous droits réservés
Client
Tous droits réservés
Photo
Tous droits réservés
Photo
C’est une caractéristique (de
l’objet client par exemple)
Tous droits réservés
Recherche
Tous droits réservés
Recherche
C’est un élément
d’interface
Tous droits réservés
54
TP
WORKSHOP
OOUX
CONFIDENTIEL | © USABILIS | TOUS DROITS RÉSERVÉS
Placer ici
une image de cette taille
Placer ici
une image de cette taille
CONFIDENTIEL | © USABILIS | TOUS DROITS RÉSERVÉS
OOUX se pratique...
Tous droits réservés
Placer ici
une image de cette taille
Placer ici
une image de cette taille
CONFIDENTIEL | © USABILIS | TOUS DROITS RÉSERVÉS
Le matériel
Tous droits réservés
Placer ici
une image de cette taille
Placer ici
une image de cette taille
CONFIDENTIEL | © USABILIS | TOUS DROITS RÉSERVÉS
Entrants
Tous droits réservés
EXERCICE
MOOCY
est une plateforme responsive de cours en ligne
Tous droits réservés
MOOCY permet à n’importe quel expert
de construire et partager des cours en ligne
à des apprentis.
Les cours sont sous forme d’une ou
plusieurs sessions pouvant être
accompagnées de supports.
Le service est gratuit et est en phase de
construction.
La page d'accueil sera un dashboard
personnalisable (il sera possible de
drag’n’dropper des modules sur la page
d’accueil).
Le service permettra à l’apprenti de se
connecter pour marquer ses cours et ses
experts favoris.
Une fonction de recherche rapide
transverse à tous les cours est prévue.
Tous droits réservés
1LES
OBJETS
Tous droits réservés
L’OBJET
est une classe d’
élément pouvant
accueillir plusieurs
instances
Voiture
est un objet
La Renault Clio
est une instance
CONSIGNE
Extraire les objets
depuis la description actuelle
et éventuellement enrichir de nouveaux objets pertinents
Tous droits réservés
MOOCY permet à n’importe quel expert
de construire et partager des cours en ligne
à des apprentis.
Les cours sont sous forme d’une ou
plusieurs sessions pouvant être
accompagnées de supports.
Le service est gratuit et est en phase de
construction.
La page d'accueil sera un dashboard
personnalisable (il sera possible de
drag’n’dropper des modules sur la page
d’accueil).
Le service permettra à l’apprenti de se
connecter pour marquer ses cours et ses
experts favoris.
Une fonction de recherche rapide
transverse à tous les cours est prévue.
Tous droits réservés
MOOCY permet à n’importe quel expert
de construire et partager des cours en ligne
à des apprentis.
Les cours sont sous forme d’une ou
plusieurs sessions pouvant être
accompagnées de supports.
Le service est gratuit et est en phase de
construction.
La page d'accueil sera un dashboard
personnalisable (il sera possible de
drag’n’dropper des modules sur la page
d’accueil).
Le service permettra à l’apprenti de se
connecter pour marquer ses cours et ses
experts favoris.
Une fonction de recherche rapide
transverse à tous les cours est prévue.
+ thème ?
Tous droits réservés
2LES
MÉTADONNÉES
LES
CARACTÉRISTIQUES
&
Tous droits réservés
Les
Caractéristiques
définissent ce qu’est
l’objet, son contenu.
Elles sont spécifiques
à l’objet.
Les
Métadonnées
sont l’ensemble des
données sur
lesquelles l’utilisateur
souhaite filtrer.
Photo de la voiture,
description..
Année de fabrication,
énergie, marque...
Tous droits réservés
CONSIGNE
Lister les caractéristiques et
métadonnées de l’objet
COURS
et placez les sous le post-it représentant cet objet
Tous droits réservés
3
LES
OBJETS
LIÉS
Tous droits réservés
Les
Objets liés
sont des instances
des autres objets qui
sont contenus dans
l’objet qui nous
intéresse.
A chaque objet “voiture” est associé
un objet “vendeur” (le responsable
de la vente de cette voiture)
Tous droits réservés
CONSIGNE
Identifiez les objets liés de
l’objet COURS
et placez les sous l’objet principal
Tous droits réservés
4LA
PRIORISATION
Tous droits réservés
Photo
Année
Vendeur
Energie
Il s’agit de hiérarchiser les
caractéristiques,
métadonnées et objets liées
en fonction de leur
importance pour
l’utilisateur.
Tous droits réservés
CONSIGNE
Établissez une hiérarchie
du haut vers le bas, sur l’objet COURS, en fonction de
l’importance pour l’utilisateur
Tous droits réservés
5LES
INTERACTIONS
Tous droits réservés
Les
Interactions
sont toutes les
actions pouvant être
effectuées sur
l’objet
Pour l’objet “voiture” : mettre en
favoris la voiture, prendre contact
avec le vendeur responsable de la
voiture, acheter la voiture ...
CONSIGNE
Ajoutez les actions associées
au dessus de l’objet COURS
1
2
3
Tous droits réservés
Proposition
https://hyj0r9.axshare.com
Tous droits réservés
Placer ici
une image de cette taille
Placer ici
une image de cette taille
CONFIDENTIEL | © USABILIS | TOUS DROITS RÉSERVÉS
Utilisateurs
& OOUX
OOUX intervient entre l'enquête
terrain et les tests, il s'intègre
parfaitement dans le cycle de
Conception Centrée Utilisateur.
Tous droits réservés
Placer ici
une image de cette taille
Placer ici
une image de cette taille
CONFIDENTIEL | © USABILIS | TOUS DROITS RÉSERVÉS
Méthode miracle ?
OOUX fonctionne bien pour des
produits larges, complexes, qui
évoluent, plutôt de type
bibliothèque (Spotity, Linkedin,
Netflix, Banque...)
OOUX fonctionne moins bien pour
les services orientés tâche (tunnel
de souscription, interface de
paramétrage…)
Tous droits réservés
Placer ici
une image de cette taille
Placer ici
une image de cette taille
CONFIDENTIEL | © USABILIS | TOUS DROITS RÉSERVÉS
Après le OOUX
C’est un document évolutif qui
supporte le maquettage orienté
objet (Design system, Atomic
design)
Tous droits réservés
81
Tous droits réservés
Tous droits réservés
18, rue de Saisset, 92120 Montrouge
www.usabilis.com
01 57 63 86 58
Merci

Contenu connexe

Similaire à Workshop Ooux

Seminaire Drupal 8 à Nantes
Seminaire Drupal 8 à NantesSeminaire Drupal 8 à Nantes
Seminaire Drupal 8 à Nantes
Smile I.T is open
 
Ged Open Source - Documation 2010
Ged Open Source - Documation 2010Ged Open Source - Documation 2010
Ged Open Source - Documation 2010
Thomas Choppy
 
Lali Dugelay : interviews des drigeants qui font l'actu
Lali Dugelay : interviews des drigeants qui font l'actuLali Dugelay : interviews des drigeants qui font l'actu
Lali Dugelay : interviews des drigeants qui font l'actu
AGAMI Family Office
 
Drupal en bibliothèque (2009)
Drupal en bibliothèque (2009)Drupal en bibliothèque (2009)
Drupal en bibliothèque (2009)
Nicolas Morin
 
Claroline - Semaine du libre
Claroline - Semaine du libreClaroline - Semaine du libre
Claroline - Semaine du libre
Claroline
 
Presentation-Accessibilité-web.pptx
Presentation-Accessibilité-web.pptxPresentation-Accessibilité-web.pptx
Presentation-Accessibilité-web.pptx
Samah Filali
 
Dessin de pages web 536
Dessin de pages web 536Dessin de pages web 536
Dessin de pages web 536
quickredfox
 
Cours de gestion de Projet - Les Fondamentaux
Cours de gestion de Projet - Les FondamentauxCours de gestion de Projet - Les Fondamentaux
Cours de gestion de Projet - Les Fondamentaux
Rémi Bachelet
 
Atelier AgoraProject
Atelier AgoraProjectAtelier AgoraProject
Atelier AgoraProject
Bibliothèque de l'enssib
 
Créer un site web ? Méthode illustrée par la médiathèque de Roubaix - PARTIE 1
Créer un site web ? Méthode illustrée par la médiathèque de Roubaix - PARTIE 1Créer un site web ? Méthode illustrée par la médiathèque de Roubaix - PARTIE 1
Créer un site web ? Méthode illustrée par la médiathèque de Roubaix - PARTIE 1
Médiathèque de Roubaix - La Grand-Plage
 
Osez faire le premier pas vers office 365 hybridez vous! - yOS Tour Lyon
Osez faire le premier pas vers office 365 hybridez vous! - yOS Tour LyonOsez faire le premier pas vers office 365 hybridez vous! - yOS Tour Lyon
Osez faire le premier pas vers office 365 hybridez vous! - yOS Tour Lyon
Joris Faure
 
Les usages spiral octobre 2014
Les usages spiral octobre 2014Les usages spiral octobre 2014
Les usages spiral octobre 2014
Christophe Batier
 
Le web sémantique n'est pas antisocial (version de 2006)
Le web sémantique n'est pas antisocial (version de 2006)Le web sémantique n'est pas antisocial (version de 2006)
Le web sémantique n'est pas antisocial (version de 2006)
Fabien Gandon
 
coursUMLDiagrammeClasse.pdf
coursUMLDiagrammeClasse.pdfcoursUMLDiagrammeClasse.pdf
coursUMLDiagrammeClasse.pdf
ssuser192642
 
Guide de projet final
Guide de projet finalGuide de projet final
Guide de projet final
MamadouDIENG15
 
Flupa lille
Flupa lilleFlupa lille
Flupa lille
Tiago Rosa
 
Projet de semestre / 1ére partie / partage de contenus multimédias
Projet de semestre / 1ére partie / partage de contenus multimédiasProjet de semestre / 1ére partie / partage de contenus multimédias
Projet de semestre / 1ére partie / partage de contenus multimédias
Laurent Moccozet
 
Alt.Net France - Domain Driven Design - 2 Dec 2008
Alt.Net France - Domain Driven Design - 2 Dec 2008Alt.Net France - Domain Driven Design - 2 Dec 2008
Alt.Net France - Domain Driven Design - 2 Dec 2008
guest33ece8
 
Réussir son projet Drupal
Réussir son projet DrupalRéussir son projet Drupal
Réussir son projet Drupal
Adyax
 

Similaire à Workshop Ooux (20)

Seminaire Drupal 8 à Nantes
Seminaire Drupal 8 à NantesSeminaire Drupal 8 à Nantes
Seminaire Drupal 8 à Nantes
 
Ged Open Source - Documation 2010
Ged Open Source - Documation 2010Ged Open Source - Documation 2010
Ged Open Source - Documation 2010
 
Lali Dugelay : interviews des drigeants qui font l'actu
Lali Dugelay : interviews des drigeants qui font l'actuLali Dugelay : interviews des drigeants qui font l'actu
Lali Dugelay : interviews des drigeants qui font l'actu
 
Drupal en bibliothèque (2009)
Drupal en bibliothèque (2009)Drupal en bibliothèque (2009)
Drupal en bibliothèque (2009)
 
Claroline - Semaine du libre
Claroline - Semaine du libreClaroline - Semaine du libre
Claroline - Semaine du libre
 
Presentation-Accessibilité-web.pptx
Presentation-Accessibilité-web.pptxPresentation-Accessibilité-web.pptx
Presentation-Accessibilité-web.pptx
 
Découverte des outils Web 2.0
Découverte des outils Web 2.0Découverte des outils Web 2.0
Découverte des outils Web 2.0
 
Dessin de pages web 536
Dessin de pages web 536Dessin de pages web 536
Dessin de pages web 536
 
Cours de gestion de Projet - Les Fondamentaux
Cours de gestion de Projet - Les FondamentauxCours de gestion de Projet - Les Fondamentaux
Cours de gestion de Projet - Les Fondamentaux
 
Atelier AgoraProject
Atelier AgoraProjectAtelier AgoraProject
Atelier AgoraProject
 
Créer un site web ? Méthode illustrée par la médiathèque de Roubaix - PARTIE 1
Créer un site web ? Méthode illustrée par la médiathèque de Roubaix - PARTIE 1Créer un site web ? Méthode illustrée par la médiathèque de Roubaix - PARTIE 1
Créer un site web ? Méthode illustrée par la médiathèque de Roubaix - PARTIE 1
 
Osez faire le premier pas vers office 365 hybridez vous! - yOS Tour Lyon
Osez faire le premier pas vers office 365 hybridez vous! - yOS Tour LyonOsez faire le premier pas vers office 365 hybridez vous! - yOS Tour Lyon
Osez faire le premier pas vers office 365 hybridez vous! - yOS Tour Lyon
 
Les usages spiral octobre 2014
Les usages spiral octobre 2014Les usages spiral octobre 2014
Les usages spiral octobre 2014
 
Le web sémantique n'est pas antisocial (version de 2006)
Le web sémantique n'est pas antisocial (version de 2006)Le web sémantique n'est pas antisocial (version de 2006)
Le web sémantique n'est pas antisocial (version de 2006)
 
coursUMLDiagrammeClasse.pdf
coursUMLDiagrammeClasse.pdfcoursUMLDiagrammeClasse.pdf
coursUMLDiagrammeClasse.pdf
 
Guide de projet final
Guide de projet finalGuide de projet final
Guide de projet final
 
Flupa lille
Flupa lilleFlupa lille
Flupa lille
 
Projet de semestre / 1ére partie / partage de contenus multimédias
Projet de semestre / 1ére partie / partage de contenus multimédiasProjet de semestre / 1ére partie / partage de contenus multimédias
Projet de semestre / 1ére partie / partage de contenus multimédias
 
Alt.Net France - Domain Driven Design - 2 Dec 2008
Alt.Net France - Domain Driven Design - 2 Dec 2008Alt.Net France - Domain Driven Design - 2 Dec 2008
Alt.Net France - Domain Driven Design - 2 Dec 2008
 
Réussir son projet Drupal
Réussir son projet DrupalRéussir son projet Drupal
Réussir son projet Drupal
 

Workshop Ooux