Slide 1

Slide 1 text

There is a better way 1 Un grand merci à nos sponsors et partenaires @espritagile #atam22 http://atmrs.esprit-agile.com

Slide 2

Slide 2 text

2 There is a better way OCTO Part of Accenture © 2022 - All rights reserved Concevoir et réaliser un produit responsable dans une démarche agile OCTO Technology Agile Tour Aix-Marseille 10 Novembre 2022

Slide 3

Slide 3 text

3 There is a better way OCTO Part of Accenture © 2022 - All rights reserved La raison de votre présence avec nous : A : Je découvre le sujet B : Je souhaite approfondir mes connaissances C : Les autres conférences ne me tentaient pas D : La réponse D

Slide 4

Slide 4 text

There is a better way 4 OCTO Part of Accenture © 2022 - All rights reserved ● Orienter les choix techniques et archi ● Faire respecter les exigences de qualité technique du produit ● Superviser la conception ● Piloter et prioriser les arbitrages sur le produit ● Spécifier les besoins ● Effectuer les tests fonctionnels ● Recueillir et analyser les besoins utilisateurs ● Contribuer à la priorisation des fonctionnalités ● Concevoir et formaliser les parcours utilisateurs les plus pertinents possibles Lina Yahi Product Owner [email protected] Joy Desdevises UX-UI Designer [email protected] Florian Leroy Tech Lead [email protected]

Slide 5

Slide 5 text

There is a better way 5 OCTO Part of Accenture © 2022 - All rights reserved Produit web Ce qui nous a réunit

Slide 6

Slide 6 text

There is a better way 6 OCTO Part of Accenture © 2022 - All rights reserved Produit web Reprise d’un site avec un nouveau départ Ce qui nous a réunit

Slide 7

Slide 7 text

There is a better way 7 OCTO Part of Accenture © 2022 - All rights reserved Produit web Reprise d’un site avec un nouveau départ Optimisation ergonomique des pages et parcours Ce qui nous a réunit

Slide 8

Slide 8 text

There is a better way 8 OCTO Part of Accenture © 2022 - All rights reserved Produit web Reprise d’un site avec un nouveau départ Produit ayant du sens pour nos utilisateurs Optimisation ergonomique des pages et parcours Ce qui nous a réunit

Slide 9

Slide 9 text

There is a better way 9 OCTO Part of Accenture © 2022 - All rights reserved Produit web Reprise d’un site avec un nouveau départ Produit ayant du sens pour nos utilisateurs Optimisation ergonomique des pages et parcours Équipe sensibilisée aux produits responsables Ce qui nous a réunit

Slide 10

Slide 10 text

There is a better way 10 OCTO Part of Accenture © 2022 - All rights reserved OCTO s’engage vers le Numérique Responsable Eco-conçu Inclusif et accessible Respect de la vie privée

Slide 11

Slide 11 text

There is a better way 11 OCTO Part of Accenture © 2022 - All rights reserved Respect de la vie privée 01

Slide 12

Slide 12 text

12 There is a better way OCTO Part of Accenture © 2022 - All rights reserved Un site vous demande votre consentement pour le dépôt de cookies Et il n’a pas de bouton pour tout refuser d’un coup… A : J’accepte tout B : Je refuse chaque cookie unitairement C : Je quitte le site D : La réponse D

Slide 13

Slide 13 text

13 There is a better way OCTO Part of Accenture © 2022 - All rights reserved Un droit et besoin utilisateur bien encadré

Slide 14

Slide 14 text

There is a better way 14 OCTO Part of Accenture © 2022 - All rights reserved Les données à caractère personnel Données personnelles ● Nominative ou qui se rattache à une personne ● Permettent de l’identifier directement ou indirectement. ● Régies par le RGPD, leur transfert et leur hébergement hors UE est restreint et implique un avenant au contrat Données sensibles ● Toute donnée pouvant entrainer une discrimination : origine ethnique, orientation sexuelle, données de santé ● Très régulées, toute collecte ou traitement de ces données suppose une analyse d’impact et des mesures de sécurité spécifiques. ● Leur transfert hors UE est également très strictement contrôlé

Slide 15

Slide 15 text

15 There is a better way OCTO Part of Accenture © 2022 - All rights reserved ๏ Quelles sont les données jugées nécessaires ? ๏ Quels traitements allez-vous appliquer ? (enregistrement, conservation, transmission…) ๏ Pour quelle finalité de traitement (objectif) ? ๏ Se renseigner sur les contraintes légales liées aux données soumises à une réglementation spécifique. ๏ Avez-vous identifié les responsables de traitement ? ๏ Comment comptez-vous tracer et protéger l’accès aux données ? ๏ Comment allez-vous pseudonymiser ou anonymiser les données ? Toujours challenger le besoin de récolter une donnée par rapport à l’utilisation finale. Identifier les données collectées

Slide 16

Slide 16 text

16 There is a better way OCTO Part of Accenture © 2022 - All rights reserved ๏ Consentement de l’utilisateur ๏ Informer sur les données récoltées et la finalité de traitement ๏ Donner la possibilité de modifier ses données personnelles ๏ Donner la possibilité de supprimer ses données personnelles ๏ Donner la possibilité de recevoir ses données personnelles en format structuré Point d’attention Respecter le droit des personnes

Slide 17

Slide 17 text

There is a better way 17 OCTO Part of Accenture © 2022 - All rights reserved Respect de la vie privée en design

Slide 18

Slide 18 text

There is a better way 18 OCTO Part of Accenture © 2022 - All rights reserved Théorie des Nudges Le respect de la vie privée en design

Slide 19

Slide 19 text

There is a better way 19 OCTO Part of Accenture © 2022 - All rights reserved Théorie des Nudges Le respect de la vie privée en design incitation douce qui va modifier le comportement d’un individu/consommateur

Slide 20

Slide 20 text

There is a better way 20 OCTO Part of Accenture © 2022 - All rights reserved Exemples de nudges Passage piéton en Islande

Slide 21

Slide 21 text

There is a better way 21 OCTO Part of Accenture © 2022 - All rights reserved Exemples de nudges Passage piéton en Islande Escalier piano à côté des escalators

Slide 22

Slide 22 text

There is a better way 22 OCTO Part of Accenture © 2022 - All rights reserved Théorie des Nudges Le respect de la vie privée en design Light Pattern

Slide 23

Slide 23 text

There is a better way 23 OCTO Part of Accenture © 2022 - All rights reserved Théorie des Nudges Le respect de la vie privée en design Light Pattern Dark Pattern

Slide 24

Slide 24 text

There is a better way 24 OCTO Part of Accenture © 2022 - All rights reserved Focus sur le bandeau de cookies

Slide 25

Slide 25 text

There is a better way 25 OCTO Part of Accenture © 2022 - All rights reserved Focus sur le bandeau de cookies

Slide 26

Slide 26 text

There is a better way 26 OCTO Part of Accenture © 2022 - All rights reserved Focus sur le bandeau de cookies

Slide 27

Slide 27 text

There is a better way 27 OCTO Part of Accenture © 2022 - All rights reserved Nos convictions : synthèse des bonnes pratiques Le RGPD n'est pas qu'une affaire de juristes, elle est le fruit de la collaboration entre les équipes technique et juridique RGPD

Slide 28

Slide 28 text

There is a better way 28 OCTO Part of Accenture © 2022 - All rights reserved Nos convictions : synthèse des bonnes pratiques Bien expliciter le besoin dès la la phase de cadrage RGPD Le RGPD n'est pas qu'une affaire de juristes, elle est le fruit de la collaboration entre les équipes technique et juridique

Slide 29

Slide 29 text

There is a better way 29 OCTO Part of Accenture © 2022 - All rights reserved Les mises en évidence : boutons ou autre contenu Nos convictions : synthèse des bonnes pratiques Bien expliciter le besoin dès la la phase de cadrage RGPD Le RGPD n'est pas qu'une affaire de juristes, elle est le fruit de la collaboration entre les équipes technique et juridique

Slide 30

Slide 30 text

There is a better way 30 OCTO Part of Accenture © 2022 - All rights reserved Les mises en évidence : boutons ou autre contenu Nos convictions : synthèse des bonnes pratiques La liberté d’action Bien expliciter le besoin dès la la phase de cadrage RGPD Le RGPD n'est pas qu'une affaire de juristes, elle est le fruit de la collaboration entre les équipes technique et juridique

Slide 31

Slide 31 text

There is a better way 31 OCTO Part of Accenture © 2022 - All rights reserved Nos convictions : synthèse des bonnes pratiques La transparence Les mises en évidence : boutons ou autre contenu La liberté d’action Bien expliciter le besoin dès la la phase de cadrage RGPD Le RGPD n'est pas qu'une affaire de juristes, elle est le fruit de la collaboration entre les équipes technique et juridique

Slide 32

Slide 32 text

There is a better way 32 OCTO Part of Accenture © 2022 - All rights reserved L’écoconception numérique 02

Slide 33

Slide 33 text

33 There is a better way OCTO Part of Accenture © 2022 - All rights reserved En 2025, l’empreinte carbone du numérique devrait… A : Doubler celle du transport aérien B : Égaler celle du trafic automobile mondial C : Dépasser celle de l’industrie du ciment D : A, B et C donc D

Slide 34

Slide 34 text

There is a better way 34 OCTO Part of Accenture © 2022 - All rights reserved L’empreinte carbone en hypercroissance 10% Mode 7% 8% Industrie du ciment 3,8% Numérique 9% Industrie automobile 4% Transport aérien 2020 2025 Sources : Bordage et al., 2019 ; Kaizen+Zenika, 2020 Part de responsabilité des émissions de gaz à effet de serre

Slide 35

Slide 35 text

There is a better way 35 OCTO Part of Accenture © 2022 - All rights reserved La fabrication est plus impactante que l’usage Part du coût en ressources de terminaux fabrication usage smartphone 85% 35 - 45 AR Paris-Brest en TGV 15% laptop 75% 250 - 500 AR Paris-Brest en TGV 25% Source : GreenIT.fr

Slide 36

Slide 36 text

36 There is a better way OCTO Part of Accenture © 2022 - All rights reserved Comment réduire l’empreinte carbone de nos produits numériques ?

Slide 37

Slide 37 text

There is a better way 37 OCTO Part of Accenture © 2022 - All rights reserved Promouvoir un numérique sobre Grâce aux composants réutilisables, la mission des designers et développeurs est plus rapide et facile. Sobriété et efficience Outils au service de l’éco-conception numérique Se recentrer sur les besoins primaires utilisateur Éviter le développement et la maintenance de fonctionnalités ou services sans usage en se concentrant sur l’essentiel. Green it Assurer un développement sobre et l’efficience des fonctionnalités. Optimiser l’expérience en réduisant le temps d’usage.

Slide 38

Slide 38 text

There is a better way 38 OCTO Part of Accenture © 2022 - All rights reserved 2.1 Focus sur les images

Slide 39

Slide 39 text

There is a better way 39 OCTO Part of Accenture © 2022 - All rights reserved Est-ce que la photo a un sens, une utilité, une valeur informative ?

Slide 40

Slide 40 text

There is a better way 40 OCTO Part of Accenture © 2022 - All rights reserved Est-ce que la photo a un sens, une utilité, une valeur informative ? NON

Slide 41

Slide 41 text

There is a better way 41 OCTO Part of Accenture © 2022 - All rights reserved Est-ce que la photo a un sens, une utilité, une valeur informative ? Remplacer par une illustration NON Supprimer

Slide 42

Slide 42 text

There is a better way 42 OCTO Part of Accenture © 2022 - All rights reserved Est-ce que la photo a un sens, une utilité, une valeur informative ? OUI (ou souhaitée quand même) Remplacer par une illustration NON Supprimer

Slide 43

Slide 43 text

There is a better way 43 OCTO Part of Accenture © 2022 - All rights reserved Est-ce que la photo a un sens, une utilité, une valeur informative ? OUI (ou souhaitée quand même) Remplacer par une illustration NON Supprimer La télécharger à la taille minimale nécessaire

Slide 44

Slide 44 text

There is a better way 44 OCTO Part of Accenture © 2022 - All rights reserved Est-ce que la photo a un sens, une utilité, une valeur informative ? OUI (ou souhaitée quand même) Remplacer par une illustration NON Supprimer La télécharger à la taille minimale nécessaire La télécharger ou la convertir au format WebP

Slide 45

Slide 45 text

There is a better way 45 OCTO Part of Accenture © 2022 - All rights reserved Est-ce que la photo a un sens, une utilité, une valeur informative ? OUI (ou souhaitée quand même) Remplacer par une illustration NON Supprimer La télécharger à la taille minimale nécessaire La télécharger ou la convertir au format WebP Retravailler les trames, la qualité, les couleurs pour réduire sa taille au maximum (exemple : Squoosh.app)

Slide 46

Slide 46 text

There is a better way 46 OCTO Part of Accenture © 2022 - All rights reserved Est-ce que la photo a un sens, une utilité, une valeur informative ? OUI (ou souhaitée quand même) Remplacer par une illustration NON Supprimer La télécharger à la taille minimale nécessaire La télécharger ou la convertir au format WebP Retravailler les trames, la qualité, les couleurs pour réduire sa taille au maximum (exemple : Squoosh.app) Pour les logos : format png

Slide 47

Slide 47 text

There is a better way 47 OCTO Part of Accenture © 2022 - All rights reserved 2.2 La quantité et qualité d’informations

Slide 48

Slide 48 text

48 There is a better way OCTO Part of Accenture © 2022 - All rights reserved Adoptez une approche mobile first

Slide 49

Slide 49 text

49 There is a better way OCTO Part of Accenture © 2022 - All rights reserved “Sélection naturelle” des informations à afficher Adoptez une approche mobile first

Slide 50

Slide 50 text

50 There is a better way OCTO Part of Accenture © 2022 - All rights reserved “Sélection naturelle” des informations à afficher ๏ Supprimer la programmation superflue Point d’attention Adoptez une approche mobile first

Slide 51

Slide 51 text

51 There is a better way OCTO Part of Accenture © 2022 - All rights reserved “Sélection naturelle” des informations à afficher ๏ Supprimer la programmation superflue ๏ Permettre un accès rapide à l’information Point d’attention Adoptez une approche mobile first

Slide 52

Slide 52 text

52 There is a better way OCTO Part of Accenture © 2022 - All rights reserved “Sélection naturelle” des informations à afficher ๏ Supprimer la programmation superflue ๏ Permettre un accès rapide à l’information ๏ Limiter voire supprimer les grandes images ou fonctions inutiles Point d’attention Adoptez une approche mobile first

Slide 53

Slide 53 text

53 There is a better way OCTO Part of Accenture © 2022 - All rights reserved “Sélection naturelle” des informations à afficher ๏ Supprimer la programmation superflue ๏ Permettre un accès rapide à l’information ๏ Limiter voire supprimer les grandes images ou fonctions inutiles ๏ Développer un code source le plus léger possible Point d’attention Adoptez une approche mobile first

Slide 54

Slide 54 text

54 There is a better way OCTO Part of Accenture © 2022 - All rights reserved “Sélection naturelle” des informations à afficher ๏ Supprimer la programmation superflue ๏ Permettre un accès rapide à l’information ๏ Limiter voire supprimer les grandes images ou fonctions inutiles ๏ Développer un code source le plus léger possible ๏ proposer des contenus clairs, faciles et rapides à comprendre Point d’attention Adoptez une approche mobile first

Slide 55

Slide 55 text

There is a better way 55 OCTO Part of Accenture © 2022 - All rights reserved Exemple : optimisation d’une page d’accueil en mobile first

Slide 56

Slide 56 text

There is a better way 56 OCTO Part of Accenture © 2022 - All rights reserved Exemple : optimisation d’une page d’accueil en mobile first ? ? Image

Slide 57

Slide 57 text

There is a better way 57 OCTO Part of Accenture © 2022 - All rights reserved Exemple : optimisation d’une page d’accueil en mobile first Quantité d’information

Slide 58

Slide 58 text

There is a better way 58 OCTO Part of Accenture © 2022 - All rights reserved Exemple : optimisation d’une page d’accueil en mobile first Quantité d’information

Slide 59

Slide 59 text

There is a better way 59 OCTO Part of Accenture © 2022 - All rights reserved Exemple : optimisation d’une page d’accueil en mobile first Quantité d’information

Slide 60

Slide 60 text

There is a better way 60 OCTO Part of Accenture © 2022 - All rights reserved Exemple : optimisation d’une page d’accueil en mobile first Quantité d’information

Slide 61

Slide 61 text

There is a better way 61 OCTO Part of Accenture © 2022 - All rights reserved Exemple : optimisation d’une page d’accueil en mobile first Quantité d’information

Slide 62

Slide 62 text

There is a better way 62 OCTO Part of Accenture © 2022 - All rights reserved Exemple : optimisation d’une page d’accueil en mobile first

Slide 63

Slide 63 text

There is a better way 63 OCTO Part of Accenture © 2022 - All rights reserved 2.3 Technique et développement

Slide 64

Slide 64 text

64 There is a better way OCTO Part of Accenture © 2022 - All rights reserved Une application web, c’est… Des échanges Des calculs dans le navigateur Une application web impacte la conso électrique et la durée de vie du terminal

Slide 65

Slide 65 text

There is a better way 65 OCTO Part of Accenture © 2022 - All rights reserved Optimiser toutes les ressources Réduire au maximum la taille des cookies Minifier et compresser les assets Supprimer le code mort et les ressources inutiles Réduire la quantité de données transférées Levier d’action n°1

Slide 66

Slide 66 text

There is a better way 66 OCTO Part of Accenture © 2022 - All rights reserved Optimisation des assets .avif 50% plus petit que .jpeg .webp 30% plus petit que .jpeg .jpeg format le MOINS impactant format le PLUS impactant Support navigateur Transparence Sans perte .avif 73,4% ✅ ✅ .webp 97,23% ✅ ✅ Format d’images

Slide 67

Slide 67 text

There is a better way 67 OCTO Part of Accenture © 2022 - All rights reserved Optimisation des assets Font subsetting, exemple avec la police d’écriture Century Gothic Nettoyage des langues Nettoyage des caractères Compression 134 ko WOFF2 + WOFF 20 ko 24 ko 36 ko 48 ko

Slide 68

Slide 68 text

There is a better way 68 OCTO Part of Accenture © 2022 - All rights reserved Mettre en place du lazy loading pour les images, le CSS et les scripts Limiter les polices d’écriture Trouver le bon compromis entre la taille et le nombre d’assets à télécharger Utiliser le cache navigateur Réduire le nombre de requêtes aux assets Levier d’action n°2

Slide 69

Slide 69 text

There is a better way 69 OCTO Part of Accenture © 2022 - All rights reserved Optimisation des requêtes Focus APIs Utiliser le cache et les CDNs Stocker en local Service worker Web storage API IndexedDb Ajouter un back for front Minimiser les redirections Préférer les saisies assistées en offline

Slide 70

Slide 70 text

There is a better way 70 OCTO Part of Accenture © 2022 - All rights reserved Importer les modules à la demande Animer l’UI avec les bons attributs d’animation Valider les pages web via le W3C markup et trouver le bon compromis de rétrocompatibilité Ajuster la taille de l’image et éviter le redimensionnement à l’affichage Réduire les traitements côté navigateur Levier d’action n°3

Slide 71

Slide 71 text

There is a better way 71 OCTO Part of Accenture © 2022 - All rights reserved 2.4 S’auditer régulièrement

Slide 72

Slide 72 text

There is a better way 72 OCTO Part of Accenture © 2022 - All rights reserved La mesure instanée Green IT Analysis Outil de sensibilisation Calcul de l’éco-index Calcul d’empreinte (GES, eau) Google Lighthouse Orienté performances Mesure la performance, l’accessibilité, le respect des bonnes pratiques, le SEO et les capacités PWA

Slide 73

Slide 73 text

There is a better way 73 OCTO Part of Accenture © 2022 - All rights reserved PÉRIMÈTRE ● Analyse d’une page web et d’un parcours utilisateur ● Indicateurs mesurés : Taille du DOM HTML, nombre de requêtes, poids des pages ● Indicateurs environnementaux : Gaz à effet de serre, eau ● Vérification de 24 bonnes pratiques AVANTAGES ● Rapide à utiliser (quelques minutes suffisent) ● Facile de s’auto-évaluer : un site éco-conçu c’est A à B voir C POINTS D’ATTENTION ● Chaque croix n’est pas équivalente en gain ● Bon outil mais mesure instable suivant les navigateurs GreenIT Analysis

Slide 74

Slide 74 text

There is a better way 74 OCTO Part of Accenture © 2022 - All rights reserved Le score GreenIT au même titre que les indicateurs de suivi “classiques”

Slide 75

Slide 75 text

75 There is a better way OCTO Part of Accenture © 2022 - All rights reserved Partager son score en Sprint Review pour sensibiliser au sujet.

Slide 76

Slide 76 text

There is a better way 76 OCTO Part of Accenture © 2022 - All rights reserved 2.5 Pour résumer

Slide 77

Slide 77 text

There is a better way 77 OCTO Part of Accenture © 2022 - All rights reserved Nos convictions : synthèse des bonnes pratiques UX, DEV, PO : garants d’une conception sobre et raisonnée Le mieux qu’on puisse faire c’est de ne rien faire Au quotidien : priorisation, pousser les réflexions notamment avec la data… UX, DEV, PO : garants d’une conception sobre et raisonnée Le mieux qu’on puisse faire c’est de ne rien faire Au quotidien : priorisation, pousser les réflexions notamment avec la data…

Slide 78

Slide 78 text

There is a better way 78 OCTO Part of Accenture © 2022 - All rights reserved Nos convictions : synthèse des bonnes pratiques Mettre le moins d’images possible et privilégier les formats moins coûteux en énergie UX, DEV, PO : garants d’une conception sobre et raisonnée Le mieux qu’on puisse faire c’est de ne rien faire Au quotidien : priorisation, pousser les réflexions notamment avec la data…

Slide 79

Slide 79 text

There is a better way 79 OCTO Part of Accenture © 2022 - All rights reserved Nos convictions : synthèse des bonnes pratiques Limiter le nombre d’informations et s’assurer de la pertinence de chacune Mettre le moins d’images possible et privilégier les formats moins coûteux en énergie UX, DEV, PO : garants d’une conception sobre et raisonnée Le mieux qu’on puisse faire c’est de ne rien faire Au quotidien : priorisation, pousser les réflexions notamment avec la data…

Slide 80

Slide 80 text

There is a better way 80 OCTO Part of Accenture © 2022 - All rights reserved Limiter le nombre d’informations et s’assurer de la pertinence de chacune Nos convictions : synthèse des bonnes pratiques Réduire la charge navigateur et limiter les échanges Mettre le moins d’images possible et privilégier les formats moins coûteux en énergie UX, DEV, PO : garants d’une conception sobre et raisonnée Le mieux qu’on puisse faire c’est de ne rien faire Au quotidien : priorisation, pousser les réflexions notamment avec la data…

Slide 81

Slide 81 text

There is a better way 81 OCTO Part of Accenture © 2022 - All rights reserved Limiter le nombre d’informations et s’assurer de la pertinence de chacune Nos convictions : synthèse des bonnes pratiques Sensibiliser le client et l’équipe, l’éco-conception a sa place dans les rituels Réduire la charge navigateur et limiter les échanges Mettre le moins d’images possible et privilégier les formats moins coûteux en énergie UX, DEV, PO : garants d’une conception sobre et raisonnée Le mieux qu’on puisse faire c’est de ne rien faire Au quotidien : priorisation, pousser les réflexions notamment avec la data…

Slide 82

Slide 82 text

There is a better way 82 OCTO Part of Accenture © 2022 - All rights reserved L’accessibilité 03

Slide 83

Slide 83 text

83 There is a better way OCTO Part of Accenture © 2022 - All rights reserved Quel est le pourcentage de personnes concernées par l’accessibilité ? A : Entre 20 et 40% B : Entre 12 et 15% C : Environ 8% D : La réponse D

Slide 84

Slide 84 text

There is a better way 84 84 There is a better way OCTO Part of Accenture © 2022 - All rights reserved ● 20 % de la population française est concernée par le handicap (permanent) et cela monte à 40 % en prenant en compte les situations de handicap temporaires, soit 28 millions de français et françaises. ● Avec le vieillissement de la population ces chiffres sont en hausse (1 français sur 3 aura plus de 60 ans en 2035). ● Et c’est sans compter les situations de handicap situationnel ou liées à l’équipement numérique non optimal… 20 à 40 % des utilisateurs/trices ont un accès difficile, partiel ou impossible aux informations et services en ligne. Sources : OCIRP / APF / INSEE / OMS

Slide 85

Slide 85 text

85 There is a better way OCTO Part of Accenture © 2022 - All rights reserved Mais qui sont ces utilisateurs ? Marie a roulé son siège sous la table et utilise le numérique sans difficulté. Lyès a une tendinite au poignet : il ne peut plus utiliser sa souris. Radka ne parle pas encore bien français : elle a besoin de textes simples. Olivier est daltonien : il ne perçoit pas toutes les couleurs.

Slide 86

Slide 86 text

86 There is a better way OCTO Part of Accenture © 2022 - All rights reserved L’accessibilité, c’est pouvoir utiliser un service numérique, quelle que soit sa façon d’y accéder. C’est un droit fondamental. Et une obligation légale en France depuis la loi de 2005 pour l'égalité des droits et des chances. Si l’accessibilité est essentielle pour certain(e)s, elle apporte du confort à tout le monde.

Slide 87

Slide 87 text

There is a better way 87 OCTO Part of Accenture © 2022 - All rights reserved Perte d’audience Surcoût et dette Mauvaise réputation Risque juridique Pour en savoir plus : https://blog.octo.com/accessibilite-faites-ce-minimum-pour-derisquer/ Risques du manque d’accessibilité

Slide 88

Slide 88 text

There is a better way 88 88 There is a better way OCTO Part of Accenture © 2022 - All rights reserved La dette technique d’accessibilité grossit tôt et vite. On ne corrige pas l’accessibilité numérique : on fabrique accessible. Risque de l’approche corrective

Slide 89

Slide 89 text

89 There is a better way OCTO Part of Accenture © 2022 - All rights reserved Approche corrective Conception accessible

Slide 90

Slide 90 text

There is a better way 90 OCTO Part of Accenture © 2022 - All rights reserved Erreurs d’accessibilité courantes Détectées par des tests automatisés Étude WebAIM de 2022 sur 1 million de sites web Source : https://webaim.org/projects/million/ Contraste faible Alternative textuelle manquante Lien vide Étiquette de champ manquante Langue du document manquante Bouton vide

Slide 91

Slide 91 text

There is a better way 91 OCTO Part of Accenture © 2022 - All rights reserved 3.1 Au quotidien

Slide 92

Slide 92 text

There is a better way 92 OCTO Part of Accenture © 2022 - All rights reserved Intégrer l’accessibilité à son quotidien BACKLOG priorisé US en rédaction US à estimer US prête DEV TO DO DEV DOING DEV REVIEW RECETTE PO DONE DOD - Tests d’accessibilité automatisés avec Lighthouse - … DOD - Tests d’accessibilité validés par le PO - … DOD DOD DOD DOD - Règles de gestion et tests d’acceptance liés à l’accessibilité sont rédigés dans l’US - … DOD - Estimer l’effort nécessaire pour que la fonctionnalité soit accessible -... DOD - Revue des maquettes (contraste..) - … UX/UI REVIEW DOD - Tests d’accessibilité validés par l’UX - … DOD A METTRE EN PROD

Slide 93

Slide 93 text

There is a better way 93 OCTO Part of Accenture © 2022 - All rights reserved Titre des pages Alternatives textuelles Hiérarchie des titres Contrastes suffisants Zoom du texte Navigation clavier Utilisabilité des formulaires Animations Alternative aux medias Structure de base Les 10 critères d’acceptance à ajouter à chaque US Voir en ligne : Easy Checks – A First Review of Web Accessibility, by Web Accessibility Initiative (WAI) : https://www.w3.org/WAI/test-evaluate/preliminary/

Slide 94

Slide 94 text

94 There is a better way OCTO Part of Accenture © 2022 - All rights reserved Outils de tests d’accessibilité Tests automatisables Seuls 25 % environ des tests d’accessibilité sont automatisables. Le reste doit être vérifié humainement, par des tests manuels. WAVE extension navigateur & API Tanaguru engine service auto-hébergé & web service Web developer extension navigateur

Slide 95

Slide 95 text

There is a better way 95 OCTO Part of Accenture © 2022 - All rights reserved Score RGAA 60% dès le premier audit

Slide 96

Slide 96 text

There is a better way 96 OCTO Part of Accenture © 2022 - All rights reserved 3.2 Focus sur les contrastes

Slide 97

Slide 97 text

There is a better way 97 OCTO Part of Accenture © 2022 - All rights reserved Vérifier les contrastes dès la phase de prototypage Colour contrast analyser (CCA)

Slide 98

Slide 98 text

There is a better way 98 OCTO Part of Accenture © 2022 - All rights reserved Vérifier les contrastes dès la phase de prototypage Colour contrast analyser (CCA)

Slide 99

Slide 99 text

There is a better way 99 OCTO Part of Accenture © 2022 - All rights reserved Vérifier les contrastes dès la phase de prototypage Colour contrast analyser (CCA)

Slide 100

Slide 100 text

There is a better way 100 OCTO Part of Accenture © 2022 - All rights reserved Vérifier les contrastes dès la phase de prototypage Colour contrast analyser (CCA)

Slide 101

Slide 101 text

There is a better way 101 OCTO Part of Accenture © 2022 - All rights reserved 3.3 Pour résumer

Slide 102

Slide 102 text

There is a better way 102 OCTO Part of Accenture © 2022 - All rights reserved Nos convictions : synthèse des bonnes pratiques L’accessibilité ne concerne pas que les personnes en situation de handicap visible Accessibilité Concevoir pour tous

Slide 103

Slide 103 text

There is a better way 103 OCTO Part of Accenture © 2022 - All rights reserved Concevoir dès le début, pour tous les utilisateurs Nos convictions : synthèse des bonnes pratiques Accessibilité Concevoir pour tous L’accessibilité ne concerne pas que les personnes en situation de handicap visible

Slide 104

Slide 104 text

There is a better way 104 OCTO Part of Accenture © 2022 - All rights reserved On ne corrige pas l’accessibilité, on fabrique accessible Concevoir dès le début, pour tous les utilisateurs Nos convictions : synthèse des bonnes pratiques Accessibilité Concevoir pour tous L’accessibilité ne concerne pas que les personnes en situation de handicap visible

Slide 105

Slide 105 text

There is a better way 105 OCTO Part of Accenture © 2022 - All rights reserved On ne corrige pas l’accessibilité, on fabrique accessible Concevoir dès le début, pour tous les utilisateurs Nos convictions : synthèse des bonnes pratiques Adopter une démarche d’amélioration progressive en agilité Accessibilité Concevoir pour tous L’accessibilité ne concerne pas que les personnes en situation de handicap visible

Slide 106

Slide 106 text

There is a better way 106 OCTO Part of Accenture © 2022 - All rights reserved Nos convictions : synthèse des bonnes pratiques L’accessibilité est un travail d’ équipe impliquant tous les profils On ne corrige pas l’accessibilité, on fabrique accessible Adopter une démarche d’amélioration progressive en agilité Concevoir dès le début, pour tous les utilisateurs Accessibilité Concevoir pour tous L’accessibilité ne concerne pas que les personnes en situation de handicap visible

Slide 107

Slide 107 text

There is a better way 107 OCTO Part of Accenture © 2022 - All rights reserved Conclusion 4

Slide 108

Slide 108 text

There is a better way 108 OCTO Part of Accenture © 2022 - All rights reserved Concevoir un produit responsable Tous les profils sont concernés : c’est un travail d’équipe Dev Bonnes pratiques de développement PO chef d’orchestre priorise et recette les fonctionnalités Commanditaire Donne le cap sur les priorités Designer Design inclusif, respectueux des utilisateurs

Slide 109

Slide 109 text

There is a better way 109 OCTO Part of Accenture © 2022 - All rights reserved Pour approfondir NOS RÉFÉRENCES Atelier 2 tonnes https://app.2tonnes.org/participant/carbonfootprint Digital technologies in Europe: an environmental life cycle approach. Bordage, F., de Montenay, L., Bengassem, S., Delmas-Orgelet, J., Domon, F., Prunel, D., Vateau, C. et Lees Perasso, E. GreenIT.fr.2021. Empreinte environnementale du numérique mondial, GreenIT.fr Bordage et al. Numérique responsable : l’informatique peut-elle être écologique ? Kaizen + Zenika (2020) NOS FORMATIONS Informations et inscription sur https://www.octo.academy/ (Éco)conception responsable de service numérique Tous profils Piloter la conception et la réalisation de produits et services responsables Product Owner, Chef de projet Masterclass Digital Kaizen Dirigeants, managers

Slide 110

Slide 110 text

There is a better way 110 OCTO Part of Accenture © 2022 - All rights reserved

Slide 111

Slide 111 text

111 There is a better way OCTO Part of Accenture © 2022 - All rights reserved https://roti.express/r/atam2022-25 Merci ! Un petit ROTI ?

Slide 112

Slide 112 text

There is a better way 112 Un grand merci à nos sponsors et partenaires @espritagile #atam22 http://atmrs.esprit-agile.com