Télécharger pour lire hors ligne
Téléchargé parChristophe Rochefolle
Une App responsable pour de la mobilité durable
SNCF Connect s'engage à rendre les mobilités durables accessibles à tous en intégrant des valeurs de responsabilité numérique et d'inclusivité à travers un programme d'innovation. Ce programme repose sur quatre piliers : accessibilité, sobriété, confidentialité et respect des libertés, et vise à améliorer l'expérience utilisateur tout en réduisant l'empreinte écologique et sociale. Les actions comprennent la formation des équipes, le développement d'outils mesurant la performance écologique et l'accessibilité, ainsi que des initiatives pour sensibiliser et former les collaborateurs aux pratiques numériques responsables.
![[WEBINAR] Kaliterre : 10 raisons d'intégrer l'éco-conception logicielle](https://cdn.slidesharecdn.com/ss_thumbnails/webinar-10raisonspourecoconceptionlogicielle-150407023235-conversion-gate01-thumbnail.jpg?width=640&height=640&fit=bounds)
Une App responsable pour de la mobilité durable
- 1. UNE APP RESPONSABLEPOUR DE LA MOBILITÉ DURABLE Christophe Rochefolle – Dir Operations Tech SNCF Connect
- 2. QUI SOMMES-NOUS ? Raison d’être •INNOVERPOUR RENDRE LES MOBILITÉS DURABLES ACCESSIBLES A TOUS Mission •LA PLUS GRANDE COMMUNAUTÉ DE #DIGITALMOBILITYCHANGERS EN FRANCE, AU CŒUR DES TRANSFORMATIONS NUMÉRIQUES. Valeurs •CITOYENNETÉ, AUDACE, PERFORMANCE, OUVERTURE, CONFIANCE # Citoyenneté : Nous sommes au service d’une société durable et solidaire, et favorisons des comportements, des mobilités et des usages responsables
- 3. La Responsabilité Numériqueest une démarche d’ amélioration continue qui tente de réduire l’empreinte écologique et sociale des technologies de l’information et de la communication. Référence : https://www.strategie.gouv.fr/publications/responsabilite- numerique-entreprises-synthese Le numérique responsable repose sur 4 piliers : • accessibilité, • sobriété, • confidentialité, • respect des libertés.
- 4. Programme Numérique Responsable Ce programme accompagnela stratégie du groupe et notre mission d'entreprise : Innover pour rendre les mobilités durables accessibles à tous. "Construire un produit vertueux incluant des objectifs environnementaux et sociaux afin de produire un impact positif sur nos utilisateurs, la société, l'environnement et être générateur de valeur." Notre ambition pour SNCF Connect
- 5. Objectifs du programme Anticiperles régulations gouvernementales Une amélioration de l’expérience utilisateur Des économies sur les frais d’infrastructure Une amélioration de l’image de marque Un levier d’engagement interne Un vecteur d'innovation et création de valeur 1 2 3 4 Montée en compétences de nos équipes
- 6. Sponsors Comex SNCF Connect & Tech Sponsors SNCF Leadteam et contributeurs Sponsor Codir SNCF Connect & Tech Référent Expert Mobile Référent Expert Web Directeur Numérique Responsable SNCF Directrice Communication et RSE Directrice Générale SNCF Connect & Tech Directeur Produit CPO Christophe Rochefolle, Directeur des Opérations Tech Directeur Customer Experience Head of Research & vision Head of Quality and Operation Head of Product Management Service Designer Alternante Service Designer Expert parcours et référent Handicap et accessibilité Chef de projet qualité CX et accessibilité Référent Tech expert accessibilité Référents Tech expert accessibilité Product Designer Product Management Directeur des Technologies CTO Scrum master, Communauté SoGreen Référents Expert et Tech Community Ambassador Architectes entreprise Une implication à tous les niveaux Directrice Ressources Humaines Directrice Talent Management Learning & Development
- 7. AXE FORMATION Sensibiliser, former etdéployer les pratiques du Numérique Responsable
- 8. Des actions desensibilisation, de partage de pratiques et de communication à différents niveaux au sein de l'entreprise Sensibilisation et montée en compétence Conception et nouvelles pratiques Communication et valorisation Interview, plénière interne et conférence externe CX Communauté SoGreen Hackathon Sensibilisation à l’écoconception Meet &Share Enterprise Architect Conférences :
- 9. Des engagements prispar l'entreprise et les collaborateurs Accord intéressement 2021-2023 Suivi des formations dédiées à l’accessibilité, la diversité, l’inclusion et l’environnement KPI 2 sessions en moyenne / salarié Glob’all 2023 Développer notre stratégie numérique responsable KPI former 30 % de nos développeurs et tech lead à l’écodéveloppement
- 10. 0 100 200 300 400 500 600 700 800 900 Accessibilité Diversité, Inclusionet égalité professionnelle Agir pour la planète 2022 2023 Un catalogue de formation riche alliant Présentiel et Formation en ligne qui continue à faire ses preuves En cours de lancement 7 formations, de l’initiation à l’analyse des référentiels RGAA 17 formations, pour les collaborateurs comme pour les managers 4 formations Ce programme s’articule autour de 2 modules de formation d’une journée chacun, qui peuvent être complétés par une certification.
- 11. AXE MESURE Au travers d'unedémarche d'amélioration continue, mesurer la performance de notre produit Web/App en matière de sobriété (temps de chargement, échange de données, consommation d'énergie) et d'accessibilité.
- 12. Une gamme d’outilsà explorer Datacenter / Cloud Fronts applicatifs Infrastruc ture back- end Analyse de pages / parcours simulant une navigation client Infra de virtualisation Agent Scaphandre Hubblo Réseau Terminaux utilisateurs Outils navigateurs Green IT analysis - Extension Chrome et Firefox pour réaliser une mesure EcoIndex et une analyse des bonnes pratiques Ecometer d'un site. Lighthouse - Outil de développement technique open- source proposé sur le navigateur Google Chrome sous forme d'extension et dans les outils d'examen du code source. Estimation de l’empreinte environnementale et sociale d’un front (nb : évolution avec module d’analyse back end) … Mesures d’un front réalisées sur un banc d’essais (smartphones) Estimation de l’empreinte environnementale d’un front GreenFrame Enterprise SaaS – Se connecte en lecture à une chaine CI, fait des simulations énergétiques sur une infrastructure container Automatisation de la mesure environnementale sur les infrastructures en datacenter Automatisation mesure kWH à l’échelle d’un container Infra containers Audit de code applicatif sur la base de règles (dont une partie a minima est en open source suite à des hackathon éco-conception) Outils GreenOps
- 13. AXE MESURE : SOBRIÉTÉ Unpartenaire historique + Une approche : la sobriété numérique • Objectif : que les logiciels consomment moins de ressources matérielles (énergie, data...) quand ils sont utilisés + Un savoir-faire technologique : la mesure d'énergie • Mesure de consommation d'énergie sur terminaux réels • Automatisée, ponctuelle ou en CI/CD Ses métiers : • Édition de solutions logicielles innovantes pour équipes digitales • Services experts d’audits et de mesures
- 14. 1 4 4 POINTS DEGAGNÉS ENTRE DEUX MESURES Améliorations apportées + Travailler l’usage des thread pour économiser la batterie et optimiser l’expérience utilisateur + Utiliser des composants en mode différé + Fermer les connections aux capteurs (GPS, réseau, ..) + Optimiser la taille de l’app + Exploiter les caches (réseau, HTTP2) et le stockage local + Désactiver tout ce qui peut l’être en mode « économie d’énergie » ou si on détecte du matériel ancien. « Mind your App Footprint : Your app footprint is important. » Vendredi 2 Juin 2023
- 15. Résultats 1 5 10 TONNES EQ.CO2 ÉCONOMISÉES,PLUS DE RAPIDITÉ Soient les émissions annuelles d’environ 8 français SNCF CONNECT NOTÉE 75/100 OBTIENT LE NIVEAU ARGENT DU CERTIFICAT GREENSPECTOR
- 16. AXE MESURE : ACCESSIBILITÉ L’inclusivitéau cœur du groupe SNCF Connect & Tech Dématérialiser sans exclure « The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect. » Tim Berners-Lee, W3C Director and inventor of the World Wide Web
- 17. 1 7 • 12 millionsde personnes en France ont un handicap + 15 millions vont développer des handicaps (âge, maladie) • La réglementation • Et de manière générale, faciliter les usages pour tous Pourquoi ?
- 18. 1 8 Organisation : viser «l’accessibilité par design » Toutes les équipes web/appli sont formées Référent Handicap & Accessibilité •Testeur malvoyant Auditeur indépendant certifié RGAA & RAAM •Référent Design •Expert Technique Accessibilité
- 19. 1 9 Emergence et cadraged’un projet Expérience maps et personae Conception du projet Design System 100% accessible + Guidelines + référents Développement du projet By Design grâce au Design System 100% accessible + Guidelines + référents + testeurs manuel + automatisation Amélioration continue Des correctifs sont apportés en continu sur la base : - Des tests internes - des audits externes réguliers - des retours utilisateurs L’accessibilité numérique dans nos process de delivery
- 20. 2 0 Jean le prévoyant Marie la prévoyante HandicapMoteur en fauteuil roulant En cours le prévoyant malentendant En cours la prévoyante malvoyante Emma l’improviste 5 personae, dont 1 persona PMR + 2 PSH en construction 4 experience maps, dont 2 adressant le persona PMR dans ses mobilités récurrentes ou occasionnelles Michel le préoccupé Emma l’improviste + 2 experience maps qui découleront des personae PSH malentendant et malvoyant Comprendre les comportements de mobilité
- 21. 2 1 Formes & Couleurs Latotalité du contenu horizontal est présenté sur un autre écran. Défilements horizontaux Contrastes Bonnes pratiques de conception
- 22.
- 23. 2 3 • Tests manuelsWeb : • Augmenter la taille du texte à 200% via Zoom navigateur • Augmenter la taille du texte à 200% via Zoom texte du navigateur (Firefox seulement) • Tests manuels Mobile paramètres systèmes • Agrandir la taille des boutons • Agrandir la taille du texte à 200% • Vérifier : • Absence de chevauchements de textes • Absence de textes tronqués • Les boutons & textes s’agrandissent fonction des paramètres (applications mobiles) Référence WCAG : Success Criterion 1.4.4: Resize Text (w3.org) TESTER l’Accessibilité « Augmenter la taille du texte »
- 24. TESTER l’Accessibilité en modeAuto 2 4 Vérifications automatiques (présence de label) et semi automatique (pertinence du label) : axe-core et outils basés dessus. testWidgets('Expect first tab title to be have the infoTrafficRegion label’, (WidgetTester tester) async { await tester.pumpWidgetBuilder(TrafficInfoScreen(), textScaleSize: 2); final finder = find.byWidgetPredicate( (widget) => widget is Text && widget.semanticsLabel == I18n.current.infoTrafficRegion_title, ); expect(finder, findsOneWidget); }); https://paristestconf.com/wp- content/uploads/2022/12/Tester_laccessibilite.pdf https://www.youtube.com/watch?v=kuW-uvywcWo
- 25. 2 5 71% 70,4% 90% Simpleà utiliser Conformité légale Conformité moyenne par page Source : baromètre CSA SNCF Connect – Octobre 2022 Source : audit externe e-SNCF - Juillet 2022 Des efforts payants sur lesquels nous continuons à investir RGAA 4.1 Référentiel Général d'Amélioration de l'Accessibilité RAAM1 Référentiel d'évaluation de l'Accessibilité des Applications Mobiles
- 26. Mais encore? Diversité & Inclusion Echangeavec ADA Tech, Première alternante en Juillet 2023 Open Source Utiliser (et partager avec la communauté) des solutions IA ouvertes, pour plus d’ « explicabilité » et la maîtrise/respect des données Exemple de Tock 👉 solution Chatbot opensource créée par SNCF Connect & Tech utilisée par de nombreuses entreprises et universités
- 27. La suite ?VISION NUMÉRIQUE RESPONSABLE Définir les principes sur lesquels repose notre stratégie numérique responsable pour nos produits et les engagements que nous souhaitons prendre et incarner sur les prochains mois (fin 2023/2024). A RETENIR Il s’agit d’une démarche d’entreprise en amélioration continue, qui s’incarne à 360°.
- 28.
Notes de l'éditeur
- #6 Une amélioration de l’expérience utilisateur Par la montée en exigence sur des principes d'expérience tels que la sobriété, le privacy, l'accessibilité... le parcours utilisateur et éléments de l’interface participent à une meilleure utilisabilité du service par les usagers. Des économies sur les frais d’infrastructure Un site optimisé apportera une économie directe sur les frais d’infrastructure (espaces d’hébergement, utilisation de la bande passante…), particulièrement sur les sites à fort trafic. Une amélioration de l’image de marque Face aux dérives du « greenwashing » les marques sont scrutées dans l’ensemble de leur politique. La prise en compte des préoccupations de numérique responsable dans la conception des services numériques accentue l’image d’une marque non seulement engagée mais aussi cohérente. Un levier d’engagement interne Le numérique responsable est un fort levier interne de motivation pour les métiers du numérique. Face aux enjeux environnementaux, sociaux actuels ce défi permet aux équipes de se mobiliser autour de valeurs fédératrices et d’être fières de leurs contributions. Anticiper les régulations gouvernementales En France la loi REEN (loi visant à réduire l’empreinte environnementale du numérique en France) a été adoptée en novembre 2021, elle vise à faire converger la transition écologique et la transition numérique. Un vecteur d'innovation et création de valeur Le numérique responsable au delà d'un engagement social et environnemental est une opportunité d'innovation permettant un positionnement stratégique et résilient du produit.
- #9 Nous avons de nombreuses initiatives depuis plusieurs années et nous nous organisons pour aller plus loin à travers un Programme NR.
- #15 Ex sur les thread : Un thread principal pour les UI simples et la logique associée Isoler les taches complexes (exdésérialisation avec ‘compute dio_flutter_transformer’ ou requêtes multiple en // avec « isolate » ) scheduleMicrotask (ex : appel réseau nécessaire à l’affichage, …) Workmanager pour les taches natives en arrière plan (ex: échange proactif en arrière plan basé sur la géoloc) Ex module différé : ne charger le module IDFM (Billeterie Ile de France) qu’à la demande Ex taille de l’app : En utilisant des bundles optimizés pour différents devices -48% en moyenne sur notre App Greenspector results (testing our app): Dark blue theme on AMOLED: 3.0 g CO2 Light theme on AMOLED: 3.0 g CO2 Light theme on AMOLED / LCD: 3.9 g CO2 Light theme on AMOLED / LCD: 3.9 g CO2 Per year estimation (all shopping on dark blue mode): 22.5 M transactions on LCD + 7 M on AMOLED = 7 T of CO2 would be saved each year
- #16 > à chaque réservation, 300 ko de données échangées en moins > un parcours de réservation de billet TER plus rapide de 8 secondes > 15 mAh de batterie consommée en moins à chaque réservation TER En prenant l'hypothèse de 30 millions de réservations par an sur Android, l’impact de l’utilisation de SNCF Connect est de = 86,9 tonnes eq. CO2. Cela représente les émissions annuelles d’environ 8 français. Le gain obtenu entre les deux mesures est de 10 tonnes eq.CO2.
- #18 Nico 2' 12 millions de personnes en France ont un handicap 15 millions de personnes vont développer des handicaps suite à l’âge et/ou la maladie handicap moteur handicap visuel handicap auditif handicap cognitif La loi française impose qu’une application de service public soit accessible SNCF Connect & Tech ainsi que d’autres entités SNCF rencontrent régulièrement les associations représentatives des personnes en situation de handicap. Certains services, comme la réplication des annonces à bord sous forme de notifications sur smartphone, sont indispensables aux voyageurs avec un handicap auditif.
- #19 Un Référent Handicap & Accessibilité co-constuit avec chaque équipe ou direction comment faire aboutir les actions de mise en conformité de nos services et d’amélioration d’usage, en interaction avec la Direction Accessibilité SNCF et les Associations partenaires Toutes les équipes web/appli sont formées via formations externes ou elearning interne, avec relance régulière Un Référent Design oriente l’élaboration des interfaces afin qu’elles soient compatibles avec les règles d’accessibilité Un Expert Technique accompagne les développeurs et vérifie que les fonctionnalités produites sont accessibles Un testeur malvoyant vérifie chaque semaine les principales évolutions pour nous signaler ses écueils Un auditeur indépendant certifié RGAA & RAAM évalue régulièrement la conformité de nos services Nous suivons bien sûr les retours de clients et d’Associations avec lesquelles nous maintenons un lien permanent Un arbitrage de « meilleure correction » a lieu pour chaque anomalie (d’usage) et non-conformité (vs. référentiels)
- #20 Emergence et cadrage d’un projet Les experience maps et personae permettent d’identifier rapidement les impacts en matière d’inclusivité. + Rôle de référent pour accompagner ces cadrages Conception du projet Le Design System conçu 100% accessible facilite la conception d’interfaces simples d’usage. Les Designers s’appuient sur des guidelines d’accessibilité numérique et une référente en QA Design les épaule dans leurs revues de conception avant transmission aux Développeurs. Développement du projet Le Design System sécurise l’implémentation simple et homogène des composants du parcours. Les Développeurs s’appuient sur des guidelines d’accessibilité numérique et un référent Technique dédié à l’Accessibilité numérique les épaule pour sécuriser le développement dans le bon respect de la norme RGAA. Des vérifications techniques et design ainsi que notre testeur malvoyant permettent de s’assurer du bon niveau d’accessibilité des interfaces avant publication.
- #21 Ingrid
- #22 Formes & Couleurs Intégration d’indicateurs visuels (picto, tiret, taille différente) pour les mises en avant afin d’éviter de donner une information uniquement via la couleur Contrastes le rapport de contraste minimum à atteindre entre les éléments graphiques informatifs et la couleur d’arrière-plan est de 3. Pour les textes, c'est selon leur taille Défilements horizontaux Lors d’une présentation de plusieurs blocs à l’horizontal (cachant une partie) il est essentiel de proposer une action (ici « voir tout ») et/ou un geste alternatif simple. Le lecteur d’écran pourra énoncer cette action à l’utilisateur mal voyant.
- #24 Nicolas 30’
- #26 Basé sur des référentiels : RGAA 4.1, RAAM1 Sur un échantillon représentatif des usages et/ou des contenus Vérifie les critères applicables sur chaque page/écran Un critère KO sur une page = KO sur tout l’échantillon Taux de conformité légale = nombre de critères OK / nombre de critères applicables 71% des utilisateurs et clients interrogés jugent l’application et le site web simples à utiliser. 70,4% C’est la conformité bout-en-bout mesurée sur nos parcours web d’usage principaux, sur la base des critères accessibilité du RGAA. +16pts vs Janvier 2022. 90% C’est la moyenne des critères respectés par page dans nos parcours web principaux, sur la base du RGAA (ce taux est de 67% sur app). Ce score se rapproche davantage d’un ressenti d’utilisabilité mais n’a pas de valeur légale.