SlideShare une entreprise Scribd logo
@3k1n0

GUIDE DE SURVIE EN MILIEU
RESPONSIVE
Guillaume ABEL @MoreThanScreens
Nicolas MASSOUH @NicolasMassouh
Cyril BALIT @cbalit
DE QUOI ALLONS-NOUS
VOUS PARLER ?
TROIS MÉTIERS

L’UX designer

Le
développeur
front

L’architecte

Guillaume

Nicolas

Cyril

3
UNE PROBLÉMATIQUE

RESPONSIVE
WEB DESIGN

4
UN PROJET
C’est pour qui ?
Pour les employés
Renault

C’est quoi ?

Comment ?

Catalogue de
voiture (avant
en PDF)

Un site
centralisant
les demandes

RWD
+
RIA

PROMO FLASH

PROJET PILOTE
5
Le Designer d’expérience utilisateur

@MoreThanScreens

6
è Comment je vais adapter la méthodologie UX ?
è Quels sont les usages ?
è Quelles sont les bonnes pratiques RWD ?
è Comment avoir une expérience qui soit

cohérente sur plusieurs écrans ?
è Quelle est la Grande Question sur la vie,

l'univers et le reste ?

@MoreThanScreens

7
NOTRE PROCESSUS UXD
et vision de l’UX

@MoreThanScreens
LES GRANDES ÉTAPES

RECHERCHE &
DÉCOUVERTE

Projection

IDÉATION &
CONCEPT

DESIGN &
PROTOTYPAGE

Explorer les
solutions possibles.

GRAPHISME
& DÉV

ANALYTICS
AMÉLIORATION

BESOIN
CLIENT

Quelle est la
problématique ?

Réaliser la solution

@MoreThanScreens

9
RECHERCHE & DÉCOUVERTE
Quelle est la problématique ?

@MoreThanScreens
QUELLE EST LA PROBLÉMATIQUE ?
UTILISATEUR

CONTEXTE CLIENT

ANALYSE EXISTANT

ANALYSE DATA

@MoreThanScreens

11
QUELLE EST LA PROBLÉMATIQUE ?

PERIMÈTRE

FONCTIONNALITÉS

PATTERNS

Flickr - YujiHayashi

@MoreThanScreens

12
DEVICES CIBLE Responsive mais responsable

+ 1024

1023-768

767-480

Up to 479

1
4
2

1
2

3
3

5

7
10

6

@MoreThanScreens

13
PATTERNS Ne pas réinventer la roue

MOSTLY FLUID

LAYOUT SHIFTER

COLUMN DROP

OFF CANVAS

TROUVER UN LANGAGE COMMUN
Lukew.com

@MoreThanScreens

14
IDÉATION & CONCEPT
Explorer les solutions possibles.

@MoreThanScreens
EXPLORER LES SOLUTIONS POSSIBLES.

ATELIERS

BRAINSTORMING

SKETCHING

Flickr - marlenekzio

@MoreThanScreens

16
SKETCHING Dessiner, c’est gagné !

stat.us

@MoreThanScreens

17
SKETCHING Trucs & astuces

FEUILLE A4
01

PRENDRE 2 FEUILLES A4

FEUILLE A4
02

@MoreThanScreens

18
SKETCHING Trucs & astuces

1 FEUILLE A4 = DESKTOP

FEUILLE A4
01

@MoreThanScreens

19
SKETCHING Trucs & astuces

1/2 FEUILLE A4 = TABLETTE

FEUILLE A4
02

1/4 FEUILLE A4 = MOBILE

@MoreThanScreens

20
SKETCHING Résultats

1 FEUILLE A4 = DESKTOP
@MoreThanScreens

21
SKETCHING Résultats

1/2 FEUILLE A4 = TABLETTE
@MoreThanScreens

22
SKETCHING Résultats

1/4 FEUILLE A4 = MOBILE
@MoreThanScreens

23
DESIGN & PROTOTYPE
Projection

@MoreThanScreens
DESIGN & PROTOTYPE
ZONING

PRINCIPES D’INTERACTION

WIREFRAME

POC

DOCUMENTATION
Flickr - marlenekzio

@MoreThanScreens

25
DESIGN & PROTOTYPE

TESTS UTILISATEUR

ITÉRATIONS
Flickr - nobleup Coming Back Slowly

@MoreThanScreens

26
ZONING Une vue macro des interfaces

Web

Mobile

Header
Header

Header

Navigation
< Recherche
Résultat
01

Résultat
02

Résultat
03

Recherche

Résultat 01
Recherche

Résultat
04

Résultat
05

Résultat
06
Valider

Résultat 02
Résultat 03

DÉFINIR LES PRINCIPES RESPONSIVE
@MoreThanScreens

27
PRINCIPES D’INTERACTION Mobile
Étape 01

Étape 02

Étape 03

▾

Sélectionner un modèle

Header

Header
Modèle

Zone géographie

Limitrophe

Modèle

Nom

Nom

Nom

Modèle

Modèle

Nom

▾

Modèle

Modèle

Modèle

Nom

Nom

Modèle

▾

Mégane
Zone géographie

Limitrophe

Budget

Budget
xx€

Modèle

Modèle

xx€

Modèle

xx€

xx€

Nom

Energie
ESS

DIE

GPL

E85

Nom

Nom

VALIDER

Energie
ESS

DIE

GPL

E85

RECHERCHER

RECHERCHER

MÉCANIQUE DE RECHERCHE MOBILE
@MoreThanScreens

28
PRINCIPES D’INTERACTION Desktop

Étape 01

Étape 02

Modèle

Modèle
Nom
Nom

Zone géographie

Nouvelle Mégane

Limitrophe

xx€

Nom

ESS

DIE

Nom

GPL

E85

Nom
Nom

Autre critère
RECHERCHER

▾

Nom

Modèle

Modèle

Nom

Nom

Limitrophe

Budget

▾

Zone géographie
73

xx€

Nom

Energie

Modèle

Version
Initiale

Nom

xx€

Nom

Modèle

Nom

Budget

▾

Modèle

Nom

Zone géographie

▾

Nouvelle Mégane

Modèle

Nom
Nom

Mégane

▾

Mégane

▾

▾

Modèle

Étape 03

xx€

DIE

Budget
xx€

Energie
ESS

Limitrophe

GPL

xx€

E85

Energie
Autre critère

RECHERCHER

▾

ESS

DIE

GPL

Autre critère

E85

▾

RECHERCHER

MÉCANIQUE DE RECHERCHE DESKTOP / TABLETTE
@MoreThanScreens

29
WIREFRAME Fifty Shades of Grey

@MoreThanScreens

30
WIREFRAME Fifty Shades of Grey

@MoreThanScreens

31
POC Proof Of Concept

@MoreThanScreens

32
DOCUMENTATION Approche modulaire
1.  Identifier les écrans et fonctionnalités clefs de

l’application
2.  Découper l’interface en modules.
3.  Décrire chaque module pour chaque devices

1

2
1

3
1a

1a

1b
2

1c

3

@MoreThanScreens

33
GRAPHISME
Réaliser la solution

@MoreThanScreens
GRAPHISME
CHARTE

DÉCLINAISON

PLANCHE DE COMPOSANT
Flickr - Degilbo

@MoreThanScreens

35
LES MAQUETTES

@MoreThanScreens

36
LES MAQUETTES

@MoreThanScreens

37
LES MAQUETTES

@MoreThanScreens

38
LES MAQUETTES

@MoreThanScreens

39
LES MAQUETTES

@MoreThanScreens

40
LES MAQUETTES

@MoreThanScreens

41
@MoreThanScreens

42
PLANCHE DE COMPOSANT

@MoreThanScreens

43
ENSEIGNEMENT
Retour d’expérience sur le design d’expérience
utilisateur.
ÊTRE MULTILINGUE …mais encore plus

@MoreThanScreens

45
ITÉRER SUR LE PROCESSUS

Flickr -

avrene

@MoreThanScreens

46
RECHERCHE &
DÉCOUVERTE

IDÉATION &
CONCEPT

DESIGN &
PROTOTYPAGE

GRAPHISME
& DÉV

@MoreThanScreens

ANALYTICS
AMÉLIORATION

BESOIN
CLIENT

ITÉRER SUR LE PROCESSUS Avant

47
ITÉRER SUR LE PROCESSUS Après

BESOIN
CLIENT

POC

RECHERCHE &
DÉCOUVERTE

GRAPHISME
& DÉV

ou prototype
HTML

IMPLICATION

ATELIERS

ANALYTICS
AMÉLIORATION

TESTS
UTILISATEURS

SKETCHING

ITÉRATION

VALIDATION
@MoreThanScreens

48
Le développeur front

@NicolasMassouh

49
APPLI RIA EN HTML 5 CROSSPLATFORM

@NicolasMassouh

50
DE LA NÉCESSITÉ DU POC
DE LA NÉCESSITÉ DU POC

@NicolasMassouh
DE LA NÉCESSITÉ DU POC

RASSURER

LES CONCEPTEURS
LES
DÉVELOPPEURS
LE CLIENT

Flickr - .reid.

@NicolasMassouh

53
DE LA NÉCESSITÉ DU POC

SOULEVER DES PROBLÉMATIQUES AUXQUELS NOUS
N’ÉTIONS PAS PRÉPARÉES
Flickr - . the pale side of insomnia

@NicolasMassouh

54
DE LA NÉCESSITÉ DU POC

MIEUX APPRÉCIER LES COÛT DE DÉVELOPPEMENT
Flickr - Ashley Pollak

@NicolasMassouh

55
DE LA NÉCESSITÉ DU POC

SOCLE DANS LEQUEL PIOCHER UN SAVOIR FAIRE
IMMÉDIAT ET POUR LE COUP ÉPROUVÉ
Flickr - AXEL BRUNST photography

@NicolasMassouh

56
DE LA NÉCESSITÉ DU POC

MONTÉE EN COMPÉTENCES DES ÉQUIPES.
Team Ekino Front 2011

@NicolasMassouh

57
LES CONCEPTS CLÉS DU RESPONSIVE
LES CONCEPTS CLÉS DU RESPONSIVE

COMMENT ON FAIT DU
RESPONSIVE ?

@NicolasMassouh

59
LES CONCEPTS CLÉS DU RESPONSIVE

COMMENT ON
FAIT DU
RESPONSIVE ?

@NicolasMassouh

60
LES CONCEPTS CLÉS DU RESPONSIVE

COMMENT ON FAIT LES
BÉBÉS ?

@NicolasMassouh

61
LES CONCEPTS CLÉS DU RESPONSIVE

ALORS LE
RESPONSIVE …

@NicolasMassouh

62
LES CONCEPTS CLÉS DU RESPONSIVE

IMAGE FLEXIBLE
AMELIORATION PROGRESSIVE
DEGRADATION GRACIEUSE
MOBILE FIRST
DESKTOP FIRST
PERFORMANCE
GRILLE FLUIDE

@NicolasMassouh

63
LES “OUTILS” DE L’INTÉGRATEUR
LES “OUTILS” DE L’INTÉGRATEUR
LES BREAKS POINTS

LA BALISE META (VIEWPORT)

MODERNIZR

LE SNIFFING

A

JQUERY

NORMALIZE/RESET CSS

LES MEDIAS QUERIES

LES UNITÉS DES FONTS

LES COMMENTAIRES CONDITIONNNELS
LES ANIMATIONS CSS3
@NicolasMassouh

65
DE LA CONCEPTION À LA RÉALISATION
TECHNIQUE
Les choix appliqués à ce projet
DE LA CONCEPTION À LA RÉALISATION TECHNIQUE

Mobile first / amélioration progressive

@NicolasMassouh

67
DE LA CONCEPTION À LA RÉALISATION TECHNIQUE

Les médias queries

@NicolasMassouh

68
DE LA CONCEPTION À LA RÉALISATION TECHNIQUE

Layout du projet mobile
viewport
PANEL 1

PANEL 2
RESULT LIST

@NicolasMassouh

69
DE LA CONCEPTION À LA RÉALISATION TECHNIQUE

Layout du projet desktop / tablet
PANEL 1

PANEL 2

RESULT LIST

160px

238px

100%

@NicolasMassouh

70
DE LA CONCEPTION À LA RÉALISATION TECHNIQUE

La grille desktop / tablet

§  Tous les li
§ 

positionnés en
float left
Jeux de clear:
left; sur les
différents paliers

http://bradfrost.github.io/this-is-responsive/patterns.html

@NicolasMassouh

71
DE LA CONCEPTION À LA RÉALISATION TECHNIQUE

Les animations CSS

§  Meilleure
§ 
§ 
§ 

Performance
Pas de scripting
transformstyle:preserve-3d
backface-visibility:hidden

@NicolasMassouh

72
DE LA CONCEPTION À LA RÉALISATION TECHNIQUE

Les animations sur ie

§  float: left pour ie

@NicolasMassouh

73
DE LA CONCEPTION À LA RÉALISATION TECHNIQUE

Utilisation de jQuery pour les composants ui

§  Gain de temps sur ce
type de composant

§  Compatibilité
https://github.com/furf/jquery-ui-touch-punch

@NicolasMassouh

74
DE LA CONCEPTION À LA RÉALISATION TECHNIQUE

Image Fluide

@NicolasMassouh

75
DE LA CONCEPTION À LA RÉALISATION TECHNIQUE

Conception de bloc responsive
è Bloc Fluide – Contextualisé au

maximum
è Box Sizing : border-box (un
ami précieux)
è Min/Max width/height

@NicolasMassouh

76
DE LA CONCEPTION À LA RÉALISATION TECHNIQUE

ImageOptim pour les images et les sprites

@NicolasMassouh

77
LE DEBUG SUR LES DIFFÉRENTS TERMINAUX
LE DÉBUG SUR LES DIFFÉRENTS TERMINAUX

@NicolasMassouh

79
LE DÉBUG SUR LES DIFFÉRENTS TERMINAUX
Sur iOS pour les macs users

§ 

Simulateur
iOS

§ 

Appareil branché
en usb

§ 

Possibilité d’utiliser
Safari à partir d’iOS6
@NicolasMassouh

80
LE DÉBUG SUR LES DIFFÉRENTS TERMINAUX
Sur iOS pour les windows users

@NicolasMassouh

81
LE DÉBUG SUR LES DIFFÉRENTS TERMINAUX
Sur Android

§ 

Version
Minimum:
Android 3.2

§ 

Appareil branché
en usb

§ 

Pas de débug sur
les navigateurs
d’origines

https://developers.google.com/chrome-developer-tools/docs/remote-debugging

@NicolasMassouh

82
LE DÉBUG SUR LES DIFFÉRENTS TERMINAUX
Utilisation de VM pour IE7, IE8, IE9

@NicolasMassouh

83
LA RÉALITÉ
Lendemain de cuite
LA RÉALITÉ

DevianART- CryingDoom

@NicolasMassouh

85
LA RÉALITÉ

§  Bilan :
è Éviter le fallback pour les animations
è Limiter l’utilisation de jQuery
è Mobile First / Amélioration Progressive vs IE7
è Réduire le scope
è Utiliser Sass dans le processus de développement
è Intervenir davantage au moment de la conception
è Les fonts en em vs rem

@NicolasMassouh

86
LA RÉALITÉ

ON A PAS PU SE PASSER DU SNIFFING (USER AGENT)
@NicolasMassouh

87
LA RÉALITÉ
Les medias queries se sont multipliées

@NicolasMassouh

88
LA RÉALITÉ
Rendering et Painting : tendre vers 60 fps

@NicolasMassouh

89
L’architecte

@cbalit

90
LES QUESTIONS
PRODUCTIVITÉ

QUALITÉ

RIA

PÉRENNITÉ

INDUSTRIALISATION

@cbalit

92
UTILISER ANGULAR

@cbalit

93
@cbalit

94
LES FEATURES
On a tout ce qu’il faut
è Le databinding
è La vue c’est le HTML
è Validation de formulaires, filtres…

@cbalit

95
L’ARCHITECTURE
è L’injection de dépendances
è Orientée module

Flickr - Lauren Manning

@cbalit

96
LE TEST …

@cbalit

97
MÉTHODOLOGIE
PRISE EN MAIN

Somewhere - internet

@cbalit

99
PROTOTYPE

Flickr - ilamont.com

@cbalit

100
BON ALORS ANGULAR, ÇA MARCHE AVEC LE RWD ?

Flickr - hilpalny

@cbalit

101
LA MISE EN PLACE
ORGANISATION

@cbalit

103
DES CONTRAINTES TECHNIQUES ?
Vue = HTML5
è Un DOM responsive ne sera pas altéré par Angular

@cbalit

104
LES TRANSITIONS
Pas de vues uniques
è Écoute changements de vues
è Utilisation de ng-class

ANIMATION
@cbalit

105
RESPONSIVE … MAIS ADAPTIF
COMMENT ?
On doit connaître le contexte en JavaScript
§  matchMedia
§  Refresh (resize)

@cbalit

107
POUR LES IMAGES
Une convention
è 3 tailles d’images SMALL, MEDIUM et LARGE
è Un pattern d’url : /monurl/[size]/veh1.png

@cbalit

108
FONCTIONNELLEMENT

@cbalit

109
TECHNIQUEMENT

@cbalit

110
VISUELLEMENT

@cbalit

111
LES OUTILS À NOTRE DISPOSITION
Enrichir le HTML : les directives
è ng-switch, ng-show, ng-hide
è ng-class

@cbalit

112
LES PERFORMANCES
è Le databinding
è Parsing du json
è Redraw

@cbalit

113
LES LEÇONS
L’URL

@cbalit

115
LA COMPLEXITÉ

@cbalit

116
CONCLUSION

117
TROIS MÉTIERS

Simplicité
POC ! POC !
Impliquer
Tester

Performance
Souplesse
Tester

Adaptive
Dream team
Rigueur
Tester

118
ONE MORE THING

119
www.renaultshop.fr

120
@3k1n0

MERCI
Guillaume ABEL @MoreThanScreens
Nicolas MASSOUH @nicolasmassouh
Cyril BALIT @cbalit
121

Contenu connexe

En vedette

Caddie scholarship open 1
Caddie scholarship open 1Caddie scholarship open 1
Caddie scholarship open 1
Tyce Calvert
 
Tyce Calvert Results Sheet Portfolio
Tyce Calvert Results Sheet PortfolioTyce Calvert Results Sheet Portfolio
Tyce Calvert Results Sheet Portfolio
Tyce Calvert
 
Jane Birrell Artist Introduction
Jane Birrell Artist IntroductionJane Birrell Artist Introduction
Jane Birrell Artist Introduction
Hilary Collins
 
9th Aboriginal Energy Forum
9th Aboriginal Energy Forum9th Aboriginal Energy Forum
9th Aboriginal Energy Forum
Madeliene Alyson Merrick
 
Asuntos tratados en la reunión general de 1º trimestre
Asuntos tratados en la reunión general de 1º trimestreAsuntos tratados en la reunión general de 1º trimestre
Asuntos tratados en la reunión general de 1º trimestre
Luisgzparra
 
Live app.pro конструктор бизнес приложений 3
Live app.pro   конструктор бизнес приложений 3Live app.pro   конструктор бизнес приложений 3
Live app.pro конструктор бизнес приложений 3
Sergey Khristolyubov
 
Deel 1 waarom beschermen
Deel 1   waarom beschermenDeel 1   waarom beschermen
Deel 1 waarom beschermen
Sealer bvba
 
the-haven-south-mdp
the-haven-south-mdpthe-haven-south-mdp
the-haven-south-mdp
Nicholas W. Ruickoldt, CPIA
 
Interesandome revista
Interesandome revistaInteresandome revista
Interesandome revista
angiedtique
 
A very juicy chiken
A  very juicy  chiken A  very juicy  chiken
A very juicy chiken
Leily Velaskz
 
12345
1234512345
Currículo nuevo código BIDI
Currículo nuevo código BIDICurrículo nuevo código BIDI
Currículo nuevo código BIDI
CEAPES
 

En vedette (13)

Caddie scholarship open 1
Caddie scholarship open 1Caddie scholarship open 1
Caddie scholarship open 1
 
Meetup angular rshop
Meetup angular rshopMeetup angular rshop
Meetup angular rshop
 
Tyce Calvert Results Sheet Portfolio
Tyce Calvert Results Sheet PortfolioTyce Calvert Results Sheet Portfolio
Tyce Calvert Results Sheet Portfolio
 
Jane Birrell Artist Introduction
Jane Birrell Artist IntroductionJane Birrell Artist Introduction
Jane Birrell Artist Introduction
 
9th Aboriginal Energy Forum
9th Aboriginal Energy Forum9th Aboriginal Energy Forum
9th Aboriginal Energy Forum
 
Asuntos tratados en la reunión general de 1º trimestre
Asuntos tratados en la reunión general de 1º trimestreAsuntos tratados en la reunión general de 1º trimestre
Asuntos tratados en la reunión general de 1º trimestre
 
Live app.pro конструктор бизнес приложений 3
Live app.pro   конструктор бизнес приложений 3Live app.pro   конструктор бизнес приложений 3
Live app.pro конструктор бизнес приложений 3
 
Deel 1 waarom beschermen
Deel 1   waarom beschermenDeel 1   waarom beschermen
Deel 1 waarom beschermen
 
the-haven-south-mdp
the-haven-south-mdpthe-haven-south-mdp
the-haven-south-mdp
 
Interesandome revista
Interesandome revistaInteresandome revista
Interesandome revista
 
A very juicy chiken
A  very juicy  chiken A  very juicy  chiken
A very juicy chiken
 
12345
1234512345
12345
 
Currículo nuevo código BIDI
Currículo nuevo código BIDICurrículo nuevo código BIDI
Currículo nuevo código BIDI
 

Similaire à Guide_de_survie_en_milieu_responsive

L'ADN d'un développement produit réussi
L'ADN d'un développement produit réussiL'ADN d'un développement produit réussi
L'ADN d'un développement produit réussi
OCTO Technology Suisse
 
Afterwork OCTO Delivery - L'ADN d'un développement produit réussi
Afterwork OCTO Delivery - L'ADN d'un développement produit réussiAfterwork OCTO Delivery - L'ADN d'un développement produit réussi
Afterwork OCTO Delivery - L'ADN d'un développement produit réussi
cyrilpicat
 
Responsive web design new14
Responsive web design new14Responsive web design new14
Responsive web design new14
FullSIX Group
 
Vers une nouvelle ère de vos expériences
Vers une nouvelle ère de vos expériencesVers une nouvelle ère de vos expériences
Vers une nouvelle ère de vos expériences
Fabernovel
 
Responsive Web Design - Enjeux, Solutions, Méthodologie
Responsive Web Design - Enjeux, Solutions, MéthodologieResponsive Web Design - Enjeux, Solutions, Méthodologie
Responsive Web Design - Enjeux, Solutions, Méthodologie
ekino
 
Réussissez le développement de votre prochaine application web ou mobile
Réussissez le développement de votre prochaine application web ou mobileRéussissez le développement de votre prochaine application web ou mobile
Réussissez le développement de votre prochaine application web ou mobile
OCTO Technology Suisse
 
Développement artisanal d'un logiciel en 20 itérations - Paris Web 2016
Développement artisanal d'un logiciel en 20 itérations - Paris Web 2016Développement artisanal d'un logiciel en 20 itérations - Paris Web 2016
Développement artisanal d'un logiciel en 20 itérations - Paris Web 2016
Damien Beaufils
 
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.infoL’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
TP1
 
Star d'UX bordeaux #1 - en UXmmersion
Star d'UX bordeaux #1 - en UXmmersion Star d'UX bordeaux #1 - en UXmmersion
Star d'UX bordeaux #1 - en UXmmersion
UX Republic Bordeaux
 
Confoo 2017 - Nouveau socle pour une nouvelle vie
Confoo 2017 - Nouveau socle pour une nouvelle vieConfoo 2017 - Nouveau socle pour une nouvelle vie
Confoo 2017 - Nouveau socle pour une nouvelle vie
mikaelrandy
 
Catopsys - Une startup agile et lean
Catopsys - Une startup agile et lean Catopsys - Une startup agile et lean
Catopsys - Une startup agile et lean
Daniel Duhautbout
 
SPA avec SignalR et Angular Js
SPA avec SignalR et Angular JsSPA avec SignalR et Angular Js
SPA avec SignalR et Angular Js
Microsoft
 
Seminaire Drupal 8 à Nantes
Seminaire Drupal 8 à NantesSeminaire Drupal 8 à Nantes
Seminaire Drupal 8 à Nantes
Smile I.T is open
 
Techniques d’UX & UI Design
Techniques d’UX & UI DesignTechniques d’UX & UI Design
Techniques d’UX & UI Design
Microsoft
 
Petit-déjeuner "Secteur Public : Retour d'expérience sur la refonte en agile ...
Petit-déjeuner "Secteur Public : Retour d'expérience sur la refonte en agile ...Petit-déjeuner "Secteur Public : Retour d'expérience sur la refonte en agile ...
Petit-déjeuner "Secteur Public : Retour d'expérience sur la refonte en agile ...
OCTO Technology
 
Olivier Besson Portfolio
Olivier Besson PortfolioOlivier Besson Portfolio
Olivier Besson PortfolioOlivier Besson
 
SymBiOT-X portfolio
SymBiOT-X portfolioSymBiOT-X portfolio
SymBiOT-X portfolio
SymBiOT-X
 
Cas de la refonte de STM.info
Cas de la refonte de STM.infoCas de la refonte de STM.info
Cas de la refonte de STM.info
TP1
 
XebiCon'16 : Le futur de la télévision, les applications ! Par Fabien Mirault...
XebiCon'16 : Le futur de la télévision, les applications ! Par Fabien Mirault...XebiCon'16 : Le futur de la télévision, les applications ! Par Fabien Mirault...
XebiCon'16 : Le futur de la télévision, les applications ! Par Fabien Mirault...
Publicis Sapient Engineering
 
Réussir dans un monde en perpétuel changement
Réussir dans un monde en perpétuel changementRéussir dans un monde en perpétuel changement
Réussir dans un monde en perpétuel changement
Jean-Marc De Jonghe
 

Similaire à Guide_de_survie_en_milieu_responsive (20)

L'ADN d'un développement produit réussi
L'ADN d'un développement produit réussiL'ADN d'un développement produit réussi
L'ADN d'un développement produit réussi
 
Afterwork OCTO Delivery - L'ADN d'un développement produit réussi
Afterwork OCTO Delivery - L'ADN d'un développement produit réussiAfterwork OCTO Delivery - L'ADN d'un développement produit réussi
Afterwork OCTO Delivery - L'ADN d'un développement produit réussi
 
Responsive web design new14
Responsive web design new14Responsive web design new14
Responsive web design new14
 
Vers une nouvelle ère de vos expériences
Vers une nouvelle ère de vos expériencesVers une nouvelle ère de vos expériences
Vers une nouvelle ère de vos expériences
 
Responsive Web Design - Enjeux, Solutions, Méthodologie
Responsive Web Design - Enjeux, Solutions, MéthodologieResponsive Web Design - Enjeux, Solutions, Méthodologie
Responsive Web Design - Enjeux, Solutions, Méthodologie
 
Réussissez le développement de votre prochaine application web ou mobile
Réussissez le développement de votre prochaine application web ou mobileRéussissez le développement de votre prochaine application web ou mobile
Réussissez le développement de votre prochaine application web ou mobile
 
Développement artisanal d'un logiciel en 20 itérations - Paris Web 2016
Développement artisanal d'un logiciel en 20 itérations - Paris Web 2016Développement artisanal d'un logiciel en 20 itérations - Paris Web 2016
Développement artisanal d'un logiciel en 20 itérations - Paris Web 2016
 
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.infoL’expérience utilisateur, 
plus importante que jamais: le cas STM.info
L’expérience utilisateur, 
plus importante que jamais: le cas STM.info
 
Star d'UX bordeaux #1 - en UXmmersion
Star d'UX bordeaux #1 - en UXmmersion Star d'UX bordeaux #1 - en UXmmersion
Star d'UX bordeaux #1 - en UXmmersion
 
Confoo 2017 - Nouveau socle pour une nouvelle vie
Confoo 2017 - Nouveau socle pour une nouvelle vieConfoo 2017 - Nouveau socle pour une nouvelle vie
Confoo 2017 - Nouveau socle pour une nouvelle vie
 
Catopsys - Une startup agile et lean
Catopsys - Une startup agile et lean Catopsys - Une startup agile et lean
Catopsys - Une startup agile et lean
 
SPA avec SignalR et Angular Js
SPA avec SignalR et Angular JsSPA avec SignalR et Angular Js
SPA avec SignalR et Angular Js
 
Seminaire Drupal 8 à Nantes
Seminaire Drupal 8 à NantesSeminaire Drupal 8 à Nantes
Seminaire Drupal 8 à Nantes
 
Techniques d’UX & UI Design
Techniques d’UX & UI DesignTechniques d’UX & UI Design
Techniques d’UX & UI Design
 
Petit-déjeuner "Secteur Public : Retour d'expérience sur la refonte en agile ...
Petit-déjeuner "Secteur Public : Retour d'expérience sur la refonte en agile ...Petit-déjeuner "Secteur Public : Retour d'expérience sur la refonte en agile ...
Petit-déjeuner "Secteur Public : Retour d'expérience sur la refonte en agile ...
 
Olivier Besson Portfolio
Olivier Besson PortfolioOlivier Besson Portfolio
Olivier Besson Portfolio
 
SymBiOT-X portfolio
SymBiOT-X portfolioSymBiOT-X portfolio
SymBiOT-X portfolio
 
Cas de la refonte de STM.info
Cas de la refonte de STM.infoCas de la refonte de STM.info
Cas de la refonte de STM.info
 
XebiCon'16 : Le futur de la télévision, les applications ! Par Fabien Mirault...
XebiCon'16 : Le futur de la télévision, les applications ! Par Fabien Mirault...XebiCon'16 : Le futur de la télévision, les applications ! Par Fabien Mirault...
XebiCon'16 : Le futur de la télévision, les applications ! Par Fabien Mirault...
 
Réussir dans un monde en perpétuel changement
Réussir dans un monde en perpétuel changementRéussir dans un monde en perpétuel changement
Réussir dans un monde en perpétuel changement
 

Dernier

Les écrans informatiques au fil du temps.pptx
Les écrans informatiques au fil du temps.pptxLes écrans informatiques au fil du temps.pptx
Les écrans informatiques au fil du temps.pptx
abderrahimbourimi
 
Ouvrez la porte ou prenez un mur (Agile Tour Genève 2024)
Ouvrez la porte ou prenez un mur (Agile Tour Genève 2024)Ouvrez la porte ou prenez un mur (Agile Tour Genève 2024)
Ouvrez la porte ou prenez un mur (Agile Tour Genève 2024)
Laurent Speyser
 
Le support de présentation des Signaux 2024
Le support de présentation des Signaux 2024Le support de présentation des Signaux 2024
Le support de présentation des Signaux 2024
UNITECBordeaux
 
Le Comptoir OCTO - Qu’apporte l’analyse de cycle de vie lors d’un audit d’éco...
Le Comptoir OCTO - Qu’apporte l’analyse de cycle de vie lors d’un audit d’éco...Le Comptoir OCTO - Qu’apporte l’analyse de cycle de vie lors d’un audit d’éco...
Le Comptoir OCTO - Qu’apporte l’analyse de cycle de vie lors d’un audit d’éco...
OCTO Technology
 
MongoDB in a scale-up: how to get away from a monolithic hell — MongoDB Paris...
MongoDB in a scale-up: how to get away from a monolithic hell — MongoDB Paris...MongoDB in a scale-up: how to get away from a monolithic hell — MongoDB Paris...
MongoDB in a scale-up: how to get away from a monolithic hell — MongoDB Paris...
Horgix
 
De l'IA comme plagiat à la rédaction d'une « charte IA » à l'université
De l'IA comme plagiat à la rédaction d'une « charte IA » à l'universitéDe l'IA comme plagiat à la rédaction d'une « charte IA » à l'université
De l'IA comme plagiat à la rédaction d'une « charte IA » à l'université
Université de Franche-Comté
 
PRESENTATION DE L'ACTIVE DIRECTORY SOUS WINDOWS SERVEUR.pptx
PRESENTATION DE L'ACTIVE DIRECTORY SOUS WINDOWS SERVEUR.pptxPRESENTATION DE L'ACTIVE DIRECTORY SOUS WINDOWS SERVEUR.pptx
PRESENTATION DE L'ACTIVE DIRECTORY SOUS WINDOWS SERVEUR.pptx
AlbertSmithTambwe
 

Dernier (7)

Les écrans informatiques au fil du temps.pptx
Les écrans informatiques au fil du temps.pptxLes écrans informatiques au fil du temps.pptx
Les écrans informatiques au fil du temps.pptx
 
Ouvrez la porte ou prenez un mur (Agile Tour Genève 2024)
Ouvrez la porte ou prenez un mur (Agile Tour Genève 2024)Ouvrez la porte ou prenez un mur (Agile Tour Genève 2024)
Ouvrez la porte ou prenez un mur (Agile Tour Genève 2024)
 
Le support de présentation des Signaux 2024
Le support de présentation des Signaux 2024Le support de présentation des Signaux 2024
Le support de présentation des Signaux 2024
 
Le Comptoir OCTO - Qu’apporte l’analyse de cycle de vie lors d’un audit d’éco...
Le Comptoir OCTO - Qu’apporte l’analyse de cycle de vie lors d’un audit d’éco...Le Comptoir OCTO - Qu’apporte l’analyse de cycle de vie lors d’un audit d’éco...
Le Comptoir OCTO - Qu’apporte l’analyse de cycle de vie lors d’un audit d’éco...
 
MongoDB in a scale-up: how to get away from a monolithic hell — MongoDB Paris...
MongoDB in a scale-up: how to get away from a monolithic hell — MongoDB Paris...MongoDB in a scale-up: how to get away from a monolithic hell — MongoDB Paris...
MongoDB in a scale-up: how to get away from a monolithic hell — MongoDB Paris...
 
De l'IA comme plagiat à la rédaction d'une « charte IA » à l'université
De l'IA comme plagiat à la rédaction d'une « charte IA » à l'universitéDe l'IA comme plagiat à la rédaction d'une « charte IA » à l'université
De l'IA comme plagiat à la rédaction d'une « charte IA » à l'université
 
PRESENTATION DE L'ACTIVE DIRECTORY SOUS WINDOWS SERVEUR.pptx
PRESENTATION DE L'ACTIVE DIRECTORY SOUS WINDOWS SERVEUR.pptxPRESENTATION DE L'ACTIVE DIRECTORY SOUS WINDOWS SERVEUR.pptx
PRESENTATION DE L'ACTIVE DIRECTORY SOUS WINDOWS SERVEUR.pptx
 

Guide_de_survie_en_milieu_responsive