$30 off During Our Annual Pro Sale. View Details »

ATAM 2022 - Concevoir et réaliser un produit responsable dans une démarche agile

Esprit Agile
November 10, 2022
8

ATAM 2022 - Concevoir et réaliser un produit responsable dans une démarche agile

Agile Tour Aix-Marseille 2022
L'accélération des effets indésirables socio-environnementaux du numérique nous amène à repenser nos façons de faire pour les minimiser.
Lors de cette présentation, nous partagerons la démarche d'éco-conception mise en place dans le cadre de la refonte d'un site.
Nous y parlerons challenge de proposition de valeur, responsible by design, responsabilités des membres de l'équipe produit et développement, adaptation des rituels agiles...

Esprit Agile

November 10, 2022
Tweet

Transcript

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

    View Slide

  2. 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

    View Slide

  3. 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

    View Slide

  4. 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]

    View Slide

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

    View Slide

  6. 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

    View Slide

  7. 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

    View Slide

  8. 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

    View Slide

  9. 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

    View Slide

  10. 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

    View Slide

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

    View Slide

  12. 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

    View Slide

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

    View Slide

  14. 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é

    View Slide

  15. 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

    View Slide

  16. 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

    View Slide

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

    View Slide

  18. 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

    View Slide

  19. 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

    View Slide

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

    View Slide

  21. 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

    View Slide

  22. 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

    View Slide

  23. 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

    View Slide

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

    View Slide

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

    View Slide

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

    View Slide

  27. 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

    View Slide

  28. 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

    View Slide

  29. 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

    View Slide

  30. 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

    View Slide

  31. 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

    View Slide

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

    View Slide

  33. 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

    View Slide

  34. 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

    View Slide

  35. 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

    View Slide

  36. 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 ?

    View Slide

  37. 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.

    View Slide

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

    View Slide

  39. 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 ?

    View Slide

  40. 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

    View Slide

  41. 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

    View Slide

  42. 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

    View Slide

  43. 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

    View Slide

  44. 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

    View Slide

  45. 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)

    View Slide

  46. 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

    View Slide

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

    View Slide

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

    View Slide

  49. 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

    View Slide

  50. 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

    View Slide

  51. 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

    View Slide

  52. 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

    View Slide

  53. 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

    View Slide

  54. 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

    View Slide

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

    View Slide

  56. 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

    View Slide

  57. 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

    View Slide

  58. 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

    View Slide

  59. 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

    View Slide

  60. 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

    View Slide

  61. 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

    View Slide

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

    View Slide

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

    View Slide

  64. 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

    View Slide

  65. 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

    View Slide

  66. 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

    View Slide

  67. 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

    View Slide

  68. 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

    View Slide

  69. 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

    View Slide

  70. 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

    View Slide

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

    View Slide

  72. 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

    View Slide

  73. 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

    View Slide

  74. 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”

    View Slide

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

    View Slide

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

    View Slide

  77. 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…

    View Slide

  78. 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…

    View Slide

  79. 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…

    View Slide

  80. 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…

    View Slide

  81. 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…

    View Slide

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

    View Slide

  83. 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

    View Slide

  84. 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

    View Slide

  85. 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.

    View Slide

  86. 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.

    View Slide

  87. 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é

    View Slide

  88. 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

    View Slide

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

    View Slide

  90. 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

    View Slide

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

    View Slide

  92. 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

    View Slide

  93. 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/

    View Slide

  94. 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

    View Slide

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

    View Slide

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

    View Slide

  97. 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)

    View Slide

  98. 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)

    View Slide

  99. 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)

    View Slide

  100. 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)

    View Slide

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

    View Slide

  102. 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

    View Slide

  103. 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

    View Slide

  104. 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

    View Slide

  105. 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

    View Slide

  106. 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

    View Slide

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

    View Slide

  108. 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

    View Slide

  109. 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

    View Slide

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

    View Slide

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

    View Slide

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

    View Slide