 Alors, je ferai Yochum, ça se prononce à l'Allemande, j'ai vérifié, qui nous vient de France, actuellement en région Lyonnaise, mais qui va bien tout se rapprocher de la frontière franco-suisse, qui est donc designer, qui va nous parler de WordPress et design, et si on arrêtait de tout compliquer. Donc, ce n'est pas pourquoi faire simple quand on peut faire compliqué, mais c'est le contraire, pourquoi compliquer quand on peut faire simple. C'est ça ? En résumé. C'est exactement ça. Exactement. Alors, à tout à l'heure. Merci beaucoup. Déjà, merci à tous d'être là pour m'écouter. Je vais faire en sorte que cette reprise digestive soit aussi douce que stimulante, on va dire. Et aujourd'hui, on va parler de WordPress et design. En commençant par une chose, c'est qu'en général, quand on parle de ces deux sujets, WordPress et design, on parle souvent de potentiel inexploité, de choses un petit peu gâchées, de manque de communication. L'autre point, c'est que quand on est designer dans un écosystème WordPress, forcément, on peut parfois se sentir seul. Donc aujourd'hui, l'objectif, ça ne va pas être de faire le point sur les choses un petit peu négatives qui se passent. Ça va être de voir comment est-ce qu'on peut aller ailleurs faire autrement. Donc en fait, l'objectif de ma conférence, ça va être de vous aider, d'essayer de vous donner des clés pour muscler un petit peu, pour muscler la manière dont vous pouvez aborder un projet WordPress à travers un état d'esprit et des outils de design. Donc, on va introduire par une petite chose, c'est qu'en gros, pourquoi est-ce qu'aujourd'hui, moi je dis que le design est un sujet compliqué avec WordPress ? Il y a plusieurs choses. Souvent, c'est des observations de terrain. La première chose, c'est que quand on regarde notamment sur le marché francophone, pardon, c'est le marché que moi je connais, la notion de design est généralement rapportée au design d'interface, au pixel. Quand on parle de design d'expérience utilisateur, c'est aussi des notions qui sont abordées mais sur des niveaux assez basiques quand même. Donc ça, c'est le premier point. On peut prendre d'autres exemples, on est en 2023 et quand on parle de design au sein de l'écosystème WordPress, on parle encore très souvent de template, de zone un petit peu préfabriquée, de design de template qui restreint un petit peu la créativité. On n'a pas encore cette idée-là de possibilité de création libérée. Encore un autre exemple, c'est que si vous regardez un petit peu tous les sites qui peuvent exister et qui récompensent du site web pour des valeurs visuelles en fait, vous avez très peu de sites web récompensés qui sont montés avec un WordPress. Donc, on pourrait encore donner d'autres exemples. Le fameux, ça on ne peut pas le développer. L'observation de terrain qui est, comment dire, elle n'est pas forcément, elle n'est pas vraiment discutable. L'opération de terrain qui nous montre que dans beaucoup de structures, les équipes tech communiquent toujours pas assez avec les équipes design et les équipes design communiquent toujours pas assez avec les équipes tech. Et enfin, le dernier exemple qui montre que la notion de design a vraiment du mal à percer dans WordPress, c'est Gutenberg. Même si c'est l'éditeur de bloc, ça reste un éditeur qui correspond à la manière dont on fait du design aujourd'hui. Et en fait, étant donné les poches de résistance qui est par rapport à ce sujet, ça montre bien qu'il y a encore beaucoup de sujets design qui bloquent. Donc, même si on observe tout ça aujourd'hui, si on regarde les gros projets WordPress qui sont menés, par exemple des grosses agences ou en tout cas les projets d'envergure, on peut quand même observer que dans beaucoup de cas, l'état d'esprit, les méthodes design ont contribué à développer la valeur des grands projets. Quand je parle de valeur de projet, je parle de valeur d'un projet pour notre client, de la valeur d'un projet pour le client de notre client et forcément de la valeur d'un projet pour nous qui fabriquons du WordPress. Donc mon approche aujourd'hui, c'est de se dire qu'en fait, embrasser l'état d'esprit design aujourd'hui, c'est pas temps de se mettre des contraintes dans les pattes, mais c'est plus ouvrir des opportunités qui restent encore bloquées depuis très longtemps. Alors aujourd'hui, l'objectif, ça va être de vous proposer, donc une prise de biceps comme vous avez vu avant, de vous proposer une approche sur trois points. Le premier point, ça va être comment est-ce qu'on peut servir du design pour appuyer ses préparations de projets. Le deuxième point, c'est comment est-ce qu'on peut se servir du design, d'outils design pour mettre en place des conceptions communes dans les équipes. Et le troisième point, on va parler de full city design. Avant ça, j'ai été présenté, je m'appelle Geoffrey Rue. Je suis designer, j'ai eu une agence WordPress pendant 11 ans. Je travaille de nouveau à mon compte aujourd'hui. Petite chose que vous remarquerez très, très vite. Je fais partie des grands enthousiastes avec Gutenberg Full City Editing. C'est quelque chose où il n'y aura pas forcément de... Ça clôt un peu le débat sur plein d'autres choses. Mais voilà. Donc, on va commencer avec le point 1. Je rappelle l'objectif, c'est de voir comment est-ce qu'on peut servir du design pour muscler un petit peu notre niveau de jeu sur les projets WordPress. Le point 1, c'est avec la préparation appuyée d'un projet grâce au design. Quand je dis design, il faut bien comprendre design au sens anglo-saxon, pas au sens francophone. Je ne parle pas de production de design graphique, je parle de design au sens vraiment anglais. Donc, comment est-ce qu'on peut servir du design dans la préparation de projets ? Si on veut un raccourci, on peut tout simplement partir du principe qu'un des outils qu'on a dans le design aujourd'hui, c'est l'expérience utilisateur. Un des principes de l'expérience utilisateur, c'est de collecter des faits, des données, des informations sur nos utilisateurs pour derrière pouvoir adapter notre approche, notre produit, notre méthode et notre manière de construire une solution pour cet utilisateur. En fait, l'idée, c'est qu'on va prendre ces principes et on va les répliquer au lieu d'attaquer un utilisateur, on va les répliquer à un projet. C'est-à-dire qu'une des premières manières qu'on a d'utiliser le design, c'est, en avant projet, c'est de la même manière où on va questionner nos utilisateurs, en fait, là, ça va être de questionner les fondements du projet pour bien vérifier qu'en fait, avant qu'on attaque le projet, on adresse les bons besoins et pas uniquement les besoins transmis par le client, parce qu'en général, quand vous commencez un petit peu à les questionner, vous vous rendez compte que le client a besoin d'un site, mais ce n'est pas son besoin principal. Donc, en fait, ça va nous aider, cet état d'esprit-là va nous aider à questionner le besoin, à reformuler le besoin et vraiment à solidifier cette base-là. À partir de là, en fait, ça va nous permettre d'ajuster nos postures, de mettre le design au bon endroit, la tech au bon endroit, la stratégie au bon endroit, donc voilà. Surtout, ce qu'il faut garder à l'esprit, c'est le point 2, c'est que dans l'écosystème WordPress, on a quand même un gros réflexe quand on aborde un projet, c'est de parler technique très, très vite. Quand on parle de préparation de projet, en fait, on ne parle pas de technique. La technique, c'est un moyen pour arriver à... C'est un des nombreux moyens qu'on aura dans notre projet pour arriver à destination. Donc, l'idée, c'est vraiment de se dire, on profite de cet état d'esprit-design UX, vraiment, pour questionner à fond les avant-projet, pour, du coup, ajuster notre posture, pour vraiment devenir expert, et pour que, quand on part, en fait, quand on part à la bataille, en fait, on sache exactement ce qu'on fait pour qu'on le fait comment, etc. Alors... Bien sûr, les bonus, alors il faut les expliquer, parce que c'est pas... C'est une approche très... On pourrait se dire que c'est une approche très théorique, c'est un peu le monde des business. Un des premiers avantages que vous avez à opérer comme ça, c'est que quand vous allez démarrer le projet, vous allez identifier de manière hyper, hyper claire le territoire d'expression de chaque métier, en fait. Ça veut dire que vous éliminez les risques où les métiers vont se marcher les uns sur les autres. Éliminez les risques où le design va marcher sur la tech. La tech va marcher sur le design, où la gestion de projet va un petit peu être en défaut, parce qu'il y a des points tech qui ne sont pas suffisamment solidifiés. Le deuxième point, c'est que vous montrez, en fait, à votre client un niveau d'expertise qui vous place en expert. À partir du moment où vous répondez à un besoin par un questionnement plutôt que de répondre à la liste du Père Noël en donnant tous les cadeaux, en fait, vous embarquez le client dans une démarche beaucoup plus collaborative, vous l'invitez à réfléchir sur son modèle, sur son business, et vous l'impliquez dans le projet. Une des grosses raisons souvent de ratage de projet, c'est aussi quand les clients ne sont pas impliqués. Donc, ça approche là, vous permet de les embarquer avec vous. Et le dernier point, c'est qu'au plus vous préparerez votre projet, au plus vous identiferez les points bloquants ou les points un petit peu critiques, ce qui vous permettra d'ajuster le process projet et d'identifier, d'anticiper le plus tôt possible et de savoir, tiens, quand on va arriver à ce moment de projet, je ne sais pas quand on va commencer à déployer tel et tel niveau de maquette, en fait, on sait qu'on a des points qui ne sont pas verrouillés et on sait que c'est des points de vigilance. On les a anticipés dès le début, on n'est pas surpris, on arrive à y terrer. Donc pas mal de choses à retirer de ça. Les ingrédients et points d'alerte un petit peu de cette approche-là en préparation de projet, les ingrédients, c'est que vous devez réussir à placer la stratégie design au même niveau que la direction technique et au même niveau que la direction clientèle, en fait. C'est-à-dire dès l'avant de projet. Ce n'est pas quelque chose de natif dans les agences ou n'importe où de placer de la direction de création en avant de projet. Mais en tout cas, c'est une des manières via laquelle vous pourrez vraiment exploiter ça. Et pour le coup, là je parle d'expérience et certains ici pourront soutenir ça. Le deuxième élément d'agrédients, ça va être l'état d'esprit que vous avez, en fait. Pour réussir une préparation de projet appuyé, il faudrait vraiment réussir à se mettre en mode projet de mon client. C'est-à-dire, pas projet, pas client, projet de mon client. Et pas un projet qui vient soutenir quelque chose que j'ai envie de faire, que j'ai envie de tester, etc., etc. Le troisième ingrédient, ça va être d'éviter la liste opère nouvelle. Ça va être de voir un projet plutôt comme un cheminement dont, par exemple, le site WordPress fait partie, plutôt que comme simplement un site et rien d'autre tour. Les points d'alerte, ça va être. Ce qui peut vous empêcher de travailler à ce point, c'est la production, parce que tous les jours, on produit. Ça prend du temps, ça nous prend tout notre temps. Donc, il faut réussir quand même à dégager du temps pour ça. Le deuxième point, ça va être le manque de volonté de collaborer. C'est les démarches d'avant-projet de ce type-là. C'est des démarches sur lesquelles on doit avoir une forme d'investissement. Donc, quand on prend les agences, par exemple, c'est des démarches qui doivent être soutenues par la direction, qui doivent être vécues par les équipes, etc. Donc, on ne fait pas ça d'un claquement de doigt. Et le troisième point souvent qui fait un peu quac, c'est la peur du nom client. Parce que le client pourrait vous dire, bah moi, en fait, j'ai juste demandé à refaire mon WordPress, en fait. J'ai pas demandé un accompagnement complet. Bah oui, mais en fait, si vous voulez refaire votre WordPress par rapport aux objectifs que vous avez défini, bah en fait, il faut faire les choses bien. Donc, la peur du nom client, en fait, aujourd'hui, vous pouvez la travailler en travaillant l'onboarding de votre client. Et l'onboarding d'un client, il se travaille avant même la première prise de contact. Sur votre communication, sur votre site web. Donc ça, c'est le premier point. Le deuxième point en matière de design qui peut nous aider à élever le niveau de jeu des projets WordPress, c'est la conception commune. Alors, pour introduire un petit peu les slides qui vont suivre, l'idée de la conception commune, c'est de se dire qu'en fait, on ne va pas avoir pour créer un site web une équipe créative, une équipe technique, une équipe de suivi de projet, une équipe de contribution. On va avoir une équipe tout court, en fait. On va avoir une organisation plate et dès le début, on va mettre en place des principes dont le premier qui est là, il n'y a pas de design pour la tech, il n'y a pas de tech pour le design, en fait. Il y a une équipe pour le projet, c'est tout. Le deuxième point qu'il faut garder en tête, c'est la place de WordPress. WordPress, ça reste un outil, en fait. Ça reste un outil dans un processus projet. On n'est pas censé bâtir, vous n'êtes pas censé bâtir de la solution en fonction de ce que l'outil vous permet. Aujourd'hui, on n'a plus besoin de prouver qu'en fait, on fait à peu près tout avec WordPress à condition qu'on ait une conception de base qui soit solide. La tech, pas trop tôt. Et le dernier point, c'est ce qu'on va voir. Là, on va parler de Gutenberg. Donc, Gutenberg comme pilier de la conception commune. Donc, l'idée de la conception commune, ça va être, on va servir de Gutenberg parce que Gutenberg, c'est un refours entre votre client qui édite son contenu, le designer qui design en bloc, le design en bloc, le design atomique, vous l'appellerez comme vous voulez. C'est le design d'aujourd'hui. Et le développeur qui développe des blocs. En gros, Gutenberg, on pourrait dire que c'est du design orienté objet. On fait aussi une forme de développement orienté objet. Et en plus, c'est quelque chose que nos clients vont utiliser. Donc, en fait, c'est l'outil parfait pour créer du langage commun entre toutes les équipes. Et pour créer une conception commune. Donc, pour faire de la conception commune avec Gutenberg, il faut faire quoi ? Le premier point, c'est qu'il faut s'intéresser au métier de son voisin. C'est-à-dire si je veux designer au mieux avec WordPress, je dois m'intéresser à ce que c'est de faire du contenu, d'éditer du contenu, de mettre en page du contenu, en fait. Je ne peux pas juste faire mes designs de mon côté, sans m'intéresser à ce qui est l'utilisateur, à ce qui est l'expérience, pardon, d'un éditeur de contenu. De la même manière, je vais m'intéresser au métier technique qui sont à côté, je vais m'intéresser au process, au process projet de manière générale, voilà. Pour un technicien, ça va être la même chose. Travailler avec Gutenberg et avec ses collègues autour de Gutenberg, ça va être s'intéresser à la manière dont un designer va appréhender Gutenberg, par exemple. Ça va s'intéresser, ça va être s'intéresser à la manière dont un éditeur va travailler avec Gutenberg pour voir en fait de quelle manière que mes choix techniques vont pouvoir soutenir l'usage, en fait. Donc c'est avant tout beaucoup échanger, mettre à plat les process, identifier les contraintes de chaque métier, et une fois qu'on a cartographié tout ça, en fait, on va pouvoir tous parler le même langage. Le même langage, donc c'est le point numéro 3, nommant que la ture documentation, bien sûr, quand on fait, quand on met en place une conception de projet commune, on la documente. C'est-à-dire l'objectif, c'est que on appelle un seul élément de la même manière, en fait. Ça évite forcément de perdre des informations quand on communique. Ça vous évitera le fameux, en fait, le brief graphique, il n'a pas été fait correctement. Ah oui, il y a deux personnes qui parlaient de langages différents, c'est un peu normal. Donc voilà. Et bien sûr, le dernier élément pour assurer ça, c'est de partager des fondamentaux communs. Là-dessus, ça c'est un des points que je défend fermement. Il y a des points communs quand on travaille notamment sur du WordPress, que tous les métiers devraient partager, que ce soit les métiers graphiques, les métiers techniques, les métiers de suivi de projets, etc. Parmi ces points-là, il y en a au moins 3, c'est le template hierarchy. Voilà, vous êtes designer, vous ne connaissez pas le template hierarchy, vous savez ce que vous avez à faire ce soir. Il y a 5 notions à retenir, ça va aller vite. Les mécaniques, que fait le corps, que font les... que le corps est responsable de quoi, les plugins sont responsables de quoi, le thème est responsable de quoi, pareil, c'est 3 éléments à retenir, à comprendre, c'est vraiment pas grand chose, mais ça peut vous aider à vraiment comprendre le fonctionnement de l'outil avec lequel vous travaillez. Et enfin, Gutenberg, forcément, si c'est le pilier de la collaboration, l'idée c'est que les équipes s'en servent en fait. Découvrir Gutenberg pendant 10 minutes, c'est fouiller, c'est éditer du contenu, c'est essayer de le détourner, c'est essayer de comprendre jusqu'où on peut aller, jusqu'où on peut le triturer qu'elle ait sa limite. Donc, on va ouvrir une parenthèse avec quelques tips. Du coup, une fois qu'on crée un langage commun entre toutes les équipes basées sur Gutenberg, qu'est-ce qu'on fait ? Moi aujourd'hui, je vous conseillerai 2 choses. Je vous conseillerai de définir un territoire de choses à vous souhaiter, un territoire de choses que vous allez industrialiser et un territoire de choses sur lesquelles vous allez faire du sur-mesure. C'est un designer qui vous dit d'industrialiser du design. Notez-le, c'est quand même un peu gros. L'approche c'est de se dire que à chaque fois que vous allez monter sur un projet design, vous allez vouloir développer de la valeur visuelle pour vos clients. Vous allez vouloir faire vivre leur identité en fait. Le truc c'est que quand on prend du recul, on se rend compte que tout n'a pas valeur à être fait sur mesure en termes de design. De la même manière où on dève en développement, tout n'a pas valeur à être fait sur mesure à chaque fois. Donc on va vouloir industrialiser un certain nombre de choses pour pouvoir libérer justement du terrain à l'expression sur mesure. Donc si vous aviez un top si en tout cas si j'avais à vous conseiller un top de choses à industrialiser, ça resserrait. Tout ce qui est texte en fait. Partez du principe que imaginons sur un site, vous avez 2 polices de caractère vous mettez 7 tailles de texte, 8 tailles de texte vous mettez ce que vous voulez 8 tailles de texte, 2 polices de caractère ça vous fait 16 possibilités. Si avec 16 possibilités vous n'arrivez pas à faire 6 niveaux de hache et du paragraph on va avoir quelques problèmes. Donc ça c'est un premier élément. Deuxième niveau, les espacesments. Les espacesments en termes de design c'est une des choses les plus chaotiques qu'on retrouve en fait. Vous avez peu de designers qui sont capables de vous expliquer une démarche de pourquoi ici il y a tant et tant pour qu'entre ces deux éléments il y a tant et tant etc. Donc en fait là on va faire simple vu que c'est un truc où les designers savent pas s'en sortir et que c'est un truc où les développeurs ont toujours envie de taper les designers mais en fait on va bien industrialiser bon l'équipe, on met en place une série de variables sur les espacesments, on se débrouille voilà. En faisant ça vous pouvez même définir des variables pour une variable imaginons un spacer xxl vous pouvez même lui donner différentes tailles en fonction du device. Donc vous industrialisez encore plus. Ensuite il y a d'autres choses, vous pouvez continuer à industrialiser la grille native de Gutenberg qui marche très très bien plutôt que d'essayer de poser votre propre grille d'essayer de pourner un système et de passer un temps fou sur quelque chose qui au final n'aura pas tant de valeur que ça. Et le dernier point c'est vous pouvez industrialiser tout ce qui concerne les palettes de couleur. Donc couleur quand on parle d'accessibilité en design on parle souvent de couleur en premier donc industrialiser votre conception de palettes c'est aussi une manière d'industrialiser des bonnes pratiques d'accessibilité visuelle. Donc là vous pouvez vous dire que sur tous les projets en fait vous allez avoir 9 nuances de gris par exemple et ça marche très bien. Il y a des designers très célèbres qui ont fait leur carrière entièrement avec 3 polices de caractère. Donc si vous faites tous vos projets avec 9 variantes de gris, ça va très très bien se passer et que vous pouvez vous créer une petite moulinette pour que vous puissiez automatiser la création de variantes de couleurs basées sur une couleur. Prenez Figma, des petits des layers avec du blanc, du noir pour faire des teintes plus foncées, plus claires réglées. Vous pouvez du coup automatiser tout ce qui est contraste. Donc ça, une fois que vous avez industrié ça, vous avez libéré de l'espace pour plein de choses parce qu'en soi ça n'a pas valeur à être refait à zéro sur chaque projet ça c'est du temps perdu en fait. A l'inverse il y a des choses qui ont valeur à travailler de manière vraiment sur mesure sur chaque projet. Et vu que vous avez industrielisé une bonne partie, vous libérez du temps vous allez pouvoir travailler des styles de blocs des styles de blocs custom par exemple, ou bien détourner les styles de blocs natifs. Vous allez pouvoir travailler des exceptions de layouts qui se déclenchent en fonction de contexte ou d'ambrication vous allez pouvoir travailler des blocs custom des blocs paternes et vous allez pouvoir vraiment avoir un territoire beaucoup plus vaste pour l'expression de la marque de votre client en termes de création. En gros vous avez 5 points de départ après ça ne s'arrête jamais donc là c'est en fonction de votre pratique de vos évolutions. Vous allez construire votre propre industrielisation mais en soi on peut aller partout jusqu'où on veut. On ferme la parenthèse, on parlait de conception commune donc pour en arriver là, quels sont les ingrédients et quels sont un petit peu les risques l'ingrédient en premier en fait c'est que vous ayez une équipe qui est une seule vision partagée et que la vision partagée ce soit celle de délivrer aux clients en fait la meilleure version possible d'un projet qu'on est capable de délivrer aujourd'hui. Je ne dis pas le meilleur projet du monde je dis juste ok dans l'état dans lequel est l'équipe aujourd'hui qu'est ce qu'on peut délivrer de mieux. Donc ça c'est le premier ingrédient pour réussir à mettre en place cette conception commune. Le deuxième ingrédient c'est de faire en sorte et de s'assurer que notamment sur Guitainbert qui devient une petite conception commun. En fait c'est de faire en sorte que tout le monde explore correctement Guitainbert que vous puissiez prendre des temps pour échanger pour faire un peu de raider sur Guitainbert ensemble pour tester des trucs, pour bricoler bricoler ça marche toujours très très bien pour commencer à industrialiser plein de choses. Le dernier point c'est mesurer et atterrer, améliorer etc. c'est à chaque fois qu'on va faire mieux qu'on le documente. Donc là vous faites comme vous voulez vous le documentez via une stack commune où il y a un starter thème dans Figma, vous documentez aujourd'hui et les outils ne manquent pas pour documenter les choses. Les risques qu'on a et qui peuvent nous empêcher d'arriver à une conception commune le premier risque c'est les risques individuels vous êtes obligés d'avoir une équipe qui va dans un seul sens donc à partir du moment où vous avez des gens dans l'équipe qui ont pas envie d'évoluer en fait sur leur métier vous allez avoir des éléments bloquants dans le processus. Le deuxième risque qu'on trouve c'est les business qui veulent pas faire évoluer leurs modèles Gutenberg en fait alors là c'est un avis très personnel Gutenberg a rencontré des grosses poches de résistance aussi parce qu'il bouleversait le modèle économique d'énormément d'agence en fait. Donc si vous voulez évoluer sur des conceptions communes de Gutenberg vous avez aussi à faire remonter ces idées dans les sphères business des agences parce qu'on vend plus des builders ACF là on vend du Gutenberg, c'est complètement différent. Et le dernier point qui peut être un petit peu un risque quand on veut développer la conception commune dans les équipes c'est les ondis les fameux billets de confirmation qui nous arrangent bien le client a toujours fait comme ça, il aime bien il lui a jamais vraiment demandé en fait tous sont les clients sans fiche de ça pareil on leur a jamais vraiment demandé en fait, on n'aura jamais proposé autre chose donc c'est des arguments assez faciles mais c'est des arguments qu'il faut accumuler peuvent vous empêcher de faire évoluer votre pratique et peuvent vous empêcher d'arriver à plus de synergies entre les équipes le dernier point c'est le FSE, donc le full city editing le FSE aujourd'hui, alors j'ai dit FSE comme ça, j'ai pas besoin de dire full city editing à chaque fois le FSE en fait c'est dans la continuité la plus importante, c'est l'avantage du FSE, c'est qu'en fait tout ce que vous industrialisez dans Guttembeur c'est déjà prêt avec le full city editing vous allez faire les templates de page mais en fait toutes les bonnes pratiques que vous avez déjà industrialisé pour la mise en page du contenu sont déjà là donc vous avez rien à faire pareil, tout ce que vous industrialisez pour gérer les templates avec Guttembeur, pardon ça sera aussi industrialisé pour gérer les contenus, donc une seule interface l'avantage de Guttembeur du full city editing, on est arrivé c'est aussi qu'en fait on met de côté le frein technique quand on veut faire évoluer les projets c'est à dire qu'avec le full city editing on va pouvoir proposer à nos clients d'itérer beaucoup plus rapidement sur des évolutions de tablette des créations de nouveaux modèles de pages etc parce que sur une pré-production on pourra très rapidement faire des templates en direct avec nos clients et les templates comme ils sont déjà industrialisés avec Guttembeur en plus on fera des templates qui en termes de design seront complètement cohérents avec l'image de marque de nos clients donc c'est quand même vachement, vachement bien l'autre point c'est qu'en fait on va pouvoir retirer de la dépendance sur les métiers techniques déjà que les métiers techniques sont pris en 24, s'il faut faire 2-3 modèles sur un template en fait un créat ou un chef de projet pour elle faire son problème en fait le développeur n'a pas de valeur à faire ça et du coup, par la même occasion on conserve de manière 100% identique le territoire du sur mesure comme on l'a sur Guttembeur donc le full city editing c'est... vraiment je vous conseille de le tester franchement c'est très facile mais en tout cas si vous voulez réussir ce petit pivot ou en tout cas cette évolution sur full city editing le premier ingrédient c'est vraiment de réussir à intégrer la démarche voilà j'ai un layout j'ai un design comment est-ce que pour arriver à ça comment est-ce qu'un utilisateur pourrait faire en fait comment est-ce qu'un contributeur pourrait faire pour se débrouiller pour faire ça avec Guttembeur ça veut pas dire qu'il faut contraindre une création ou le potentiel créatif qu'il faut le contraindre à l'outil c'est juste qu'il faut intégrer intégrer tout ceci-là dans nos réflexions et aujourd'hui de toute façon l'outil ne contraint rien donc voilà le deuxième point c'est que c'est un travail avec Guttembeur et full city editing c'est un vrai pivot en fait c'est pas quelque chose que vous pouvez faire du jour au lendemain d'un claquement de doigts donc c'est quelque chose sur lequel il faut faire une roadmap une roadmap sur laquelle il y a des projets spécifiquement choisis qui vont être greffés pour justement faire vivre la roadmap c'est des projets avec lesquels il faut des clients qui soient embarqués dans cette démarche qui soient ok avec ça qui soient prêts à hiter avec vous etc donc c'est pas quelque chose on y va du jour au lendemain on change tout en fait ça marche pas et le dernier point c'est bah après chaque projet on hiter on voit ce qu'on peut généraliser on voit ce qu'on peut continuer à industrialiser dans notre stack qu'on maintient ou dans notre starter theme les dangers c'est quoi ? c'est le manque de tests de pratique de R&D forcément les égaux personnels donc si quelqu'un ne veut pas monter en compétence bah oui ça va bloquer et surtout le dernier danger c'est de pas laisser sa chance au processus c'est des processus transformatifs en fait Guttembeur, des gens en soi et un outil qui change la manière de concevoir, d'aborder un projet web de concevoir des sites de développer des sites de maintenir le contenu d'un site donc si en plus vous rajoutez la couche Fouscite Editing vous êtes vraiment dans des démarches transformatifs en fait c'est pas des choses qui prennent qui prennent deux mois c'est des choses qui prennent du temps donc à partir du moment que ça prend du temps bah il faut aussi laisser sa chance au process il y a le trosse de process de l'équipe américaine que vous connaissez peut-être alors si vous aviez enfin en tout cas si j'avais une sélection de choses à vous faire retenir pour vous aider à vous servir du design pour justement gonfler les muscles en tout cas de vos projets WordPress de demain ce serait quoi ? le premier ça serait Guttembeur en 2023 découvrir Guttembeur en 2023 c'est plus possible c'est simplement plus possible le Fouscite Editing maintenant et en production en beta c'est voilà maintenant il faut y aller il y a plus de discussions oui non peut-être on verra, on va faire un test on attend la fin d'année pour réfléchir non là on est en 2023 la fin d'année c'est demain l'an prochain il y aura encore plus d'heures tard la deuxième chose à retenir c'est le premier chapitre c'est en fait aborder les capacités du design comme les capacités du design pas les capacités du design graphique donc les capacités du design c'est celle de questionner de demander pourquoi, de demander à préciser de demander des données sur les utilisateurs de demander de demander de demander de reformuler etc etc ça vous permet d'identifier vraiment très précisément ça vous permet d'ajuster une posture vous êtes expert et à la fois vous avez un projet qui est vraiment solide qui a vraiment des bases solides ça vous permet de satisfaire satisfaire le client mais aussi satisfaire vos équipes de production je sais pas si pour ceux qui arrivent la satisfaction d'un projet où tout se déroule sur Zacro j'ai pas le cigar pour ceux qui auront la référence mais c'est une satisfaction qu'on n'a pas sur tous les projets mais qu'on aimera bien voir un peu plus souvent le dernier point c'est ce que je viens de dire avant c'est qu'en fait on est sur une vraie démarche transformative donc c'est pas quelque chose qui va changer du jour au lendemain intégrer plus de design dans l'écosystème WordPress, dans la conception c'est pas quelque chose qui va se faire du jour au lendemain ça prend du temps à l'inverse pour les gens qui engagent ça c'est un vrai moyen de stimuler les équipes de recréer du lien et de faire monter de manière vraiment drastique ce qu'on est capable de délivrer à nos clients si vous avez des questions ce sera avec plaisir merci beaucoup, Geoffrey et puis on a la possibilité de poser des questions on a bien du temps il y a le coureur de micro ou de ballons micro qui est là qui souhaite derrière toi, Marcos merci j'ai une petite curiosité de savoir ton point de vue par rapport à cette résistance que tu parlais de Tilly Segoutembert et que même j'ai des collègues qui conseillent de s'activer il existe même des plugins comment dire je pense qu'aujourd'hui, continuer à désactiver Tilly Segoutembert c'est un petit peu c'est un petit peu rampé alors qu'il y a un tsunami qui est derrière nous Tilly Segoutembert c'est maintenant c'est l'outil plus performant en termes de performance technique c'est l'outil qui sort le HTML le plus propre et le plus léger c'est un outil qui quand l'utilise pour personnaliser en fait se personnalise à base de classe il n'y a pas plus simple aujourd'hui pour faire ça c'est un outil où on a une vraie visualisation graphique entre le back office et le front office c'est un outil sur lequel bientôt on pourra faire du collaboratif pour moi le fait de le désactiver aujourd'hui c'est vraiment un témoignage des modèles qui veulent pas bouger et pour moi désactiver Tilly Segoutembert aujourd'hui c'est Steering Ball dans le pied parce que le jour où il n'y aura pas d'autres alternatives on n'aura pas un an, deux ans, trois ans de retard en fait on sera hors course mais c'est que mon avis juste pour réagir aussi par rapport à ça c'est intéressant qu'il aille appeler Guttembert parce que historiquement Guttembert on dit il a inventé l'imprimerie mais c'est pas exact parce que l'imprimerie existait déjà avant, elle était inventée en Chine mais ce qu'il a fait c'est qu'il a créé les lettres mobiles ça veut dire qu'on pouvait les sortir et les remettre dans des petits rails et puis comme ça on pouvait composer facilement des nouveaux textes et on pouvait changer le type de page qu'on allait imprimer en fait et puis là c'est la même chose comme t'as expliqué c'est qu'il y a une sorte d'atomisation de ces blocs et on va pouvoir réutiliser ces blocs dans plein de contexte c'est une autre pensée du design parce qu'elle est moins statique en fait je dirais aussi elle a définitivement coupé le cordon embélical avec le print parce que le web au début c'était un peu des pages print puis après on s'est écarté de plus en plus puis là on a vraiment une conception où on a des blocs il a l'air pas d'accord, je me réjouis de voir ce qu'il va faire où ces blocs en fait on va pouvoir leur donner une nouvelle vie puis c'est une autre façon de concevoir le traitement des contenus alors sur le volet ça a coupé les points avec le print je suis un petit peu moins d'accord dans le sens où je sais pas s'il y en a ici qui faisaient du print mais quand par exemple on faisait du print en deux langues en fait on partait de la même gris de composition avec les mêmes zones de texte mais on était quand même obligé d'anticiper le fait que ma composition elle va être en français et après elle va être en allemand donc on était déjà à l'époque sur du print obligé de se poser la question de en allemand quand mon mot va être deux fois plus long comment est-ce que je vais gérer ça je vais créer une zone plus grande je vais prendre plus de sécurité donc on était peut-être sans le remarquer on était peut-être déjà dans cette démarche et après là où je suis un petit peu moins d'accord c'est qu'avec le lien avec le print c'est que si on regarde la manière dont le design web a évolué en fait il a pusé 80% de ses ressources dans le design print et ça aujourd'hui pourquoi aussi parce que le web a évolué vers toujours plus de contenu donc en termes d'inspiration on avait besoin d'inspiration qui traite du contenu et l'inspiration qui traite le contenu c'est le print donc je je suis d'accord avec le fait qu'il y a deux mondes vraiment mais je pense que c'est surtout deux mondes parce que dans le monde des designers en fait c'est les designers qui créent ces deux mondes là en fait parce qu'aujourd'hui il y a des très bons designers web qui sont de base des designers print excellent en fait donc je pense que cette rupture des mondes est plus liée à justement le profil que je citais avant le profil qui veut pas mettre à jour ses compétences le designer qui veut pas le mettre à jour ses compétences ça c'est c'est un designer qui dit ça mais voilà ça arrive il y a encore là une question j'ai présenté une fois Gutenberg, j'avais dit mais les gens ils se disent pourquoi devoir chaque fois de faire un bloc pour faire un titre, un paragraphe un titre, un paragraphe voire faire ça très bien il y a juste à cliquer un style je pense que Gutenberg invite aussi à vraiment structurer son contenu et pas forcément à réfléchir en paragraphe et en titre mais justement il y a la citation qui est déjà un bloc tout à fait connu parce qu'on a beaucoup de citations est-ce qu'on veut mettre des choses en exergue sur sa page et ça c'est pas seulement du design visuel c'est aussi du design de contenu et puis est-ce qu'on veut peut-être des explications supplémentaires est-ce qu'on veut des approfondissements des références qui arrivent dans son texte donc c'est vraiment aussi une manière d'analyser ce qu'on veut mettre à disposition des gens le mark-up justement ne le fait pas parce qu'il s'est contenté de reproduire H1, H2, H3 avec d'autres symboles c'est vraiment une analyse de quel sont les différents types d'éléments et c'est là qu'on revient justement à ce que dit Pascal c'est les blocs qui sont des caractères qu'on peut ressortir de la boîte à plomb et composer différemment suivant les lieux dans lesquels on se trouve et ça c'est peut-être la plus difficile à faire passer à beaucoup de gens encore aujourd'hui on peut attaquer cette question-là en ce qui me concerne j'attaque cette question-là sous l'angue du marketing ce que je trouve intéressant avec Gutenberg quand vous commencez à le détourner bien sûr mais avec quelques registers styles la question est vite réglée c'est qu'en fait aujourd'hui vous allez être Gutenberg vous permet avec un outil natif en fait de faire du contenu qui est très bien mis en page et de faire du contenu qui techniquement en termes de balises et performant pour les CEO c'est-à-dire qu'aujourd'hui vous pourriez très bien vous dire que en tout cas c'est ce que je fais avec mes clients je leur donne un process de support pour définir un process d'édition qui va être dans un premier temps le process il va pas être visuel du tout il va être fonctionnel en mode H1, paragraph, H2 etc je regarde pas en fait la tête que ça a et dans un deuxième temps quand j'ai besoin j'applique des styles spécifiques pour personnaliser ça c'est pas encore natif dans WordPress nous on l'avait mis du temps où j'avais l'agence on avait intégré ça très rapidement mais vous pouvez appliquer un style de paragraph un H2 ce qui vous permet d'arriver à un objectif graphique l'objectif graphique que vous voulez tout en gardant en tâche de fond la sécurité que le markup de la page va être nickel et souvent je me sers de cet exemple-là la modularité va au-delà des blocs il y a le bloc au sens le bloc qu'on insère au sens de sa sémantique et en fait il y a comment dire il y a le vêtement qu'on va lui donner basé sur le vêtement original d'un autre bloc et quand on commence à capter des mécaniques comme ça on se rend compte que oui quand on va industrialiser cette taille de typos ça suffit largement parce qu'en fait à partir du moment où on peut interchanger les vêtements des blocs sans interchanger leur nature c'est... on fait tout en fait une question qui est en préparation ici oui ma question c'est plus générale c'est pas par rapport à Gutenberg quand on est dans un cas de figure où on veut faire un redesign de notre website ou on veut juste améliorer notre website parce qu'on le trouve vieilleux pas joli, est-ce que vous seriez dans une démarche de remettre tout à plat et de les refaire tout entier ou dans quelle mesure c'est peut-être plus conseillable ou moins d'introduire des petites choses des petites modules des petits redesigns petit à petit ou s'il peut avoir une transition c'est ça que je trouve difficile dans le travail quotidien dans quelle mesure on implemente des nouvelles choses ou des fois on dit on atteigne et on fait un super projet mais on ne le fait jamais donc c'est par rapport à ton expertise si j'avais à faire Aska dans un premier temps j'irais on pourrait se dire qu'on refait tout mais ça serait peut-être une erreur de tout refaire dans le sens où quand on fait la refonte d'un site on regarde quel contenu perform quel contenu soit un petit peu untouchable et quel contenu est-ce qu'on peut re-challenger en fait ça déjà c'est la première chose mais du coup c'est un mélange entre un travail de SEO et un travail de stratégie éditoriale donc déjà il y a des choses comme ça et ensuite si j'avais à faire la traduction en tout cas la refonte d'un site je dirais que Gutenberg ou pas Gutenberg ça va dépendre notamment de la nature du site donc aujourd'hui il n'est pas implémenté dans où commerce par exemple donc si demain c'est un city commerce il va falloir faire cohabiter un où commerce qui est sur l'éditeur l'ancien éditeur et des pages de contenu et un blog qui seront sur le nouvel éditeur on peut intégrer Gutenberg à où commerce sauf que c'est une intégration qui se fait à la main c'est pas une intégration officielle ça veut dire que derrière en maintenance il y a une intégration qui est lourde donc la première question quelle est la vocation principale du site si la vocation principale du site c'est de vendre où commerce intègre pas Gutenberg donc forcément il y aura une transition si la vocation principale du site c'est de délivrer du contenu on est entièrement sur du contenu donc en fait on peut commencer à penser la transition le deuxième niveau qui me ferait aller vers une transition 100% Gutenberg ça serait de voir d'où est-ce qu'on part en fait si par exemple on part d'un site existant avec 300 pages sur un builder très vieux avec une dette technique énorme ça veut dire qu'on a 300 pages à passer sous Gutenberg et potentiellement on a 300 pages à vérifier ça c'est un petit peu compliqué donc en questionnement projet ce que j'avais mis la première question ça serait d'où on part ou est-ce qu'on veut aller et pour faire ça on a quoi en fait il y a combien de personnes en fait pour travailler sur ce projet 2 personnes pour 300 contenus on va faire une transition à l'inverse 15 personnes pour 300 contenus on va faire une roadmap et on va le faire ça dépend vraiment des composantes mais quand on peut je pense que ça reste une bonne idée d'entamer la démarche j'ai travaillé sur quelques projets où il y avait de la transition elle est quand même ça peut quand même être assez compliqué d'avoir des différents systèmes qui cohabitent là en plus il y avait un morceau en WordPress Headless, un autre morceau c'était n'importe quoi donc c'était assez complexe mais sur des sites vitrines classiques transition ça passe très bien je voulais vraiment le recevoir celui-là aujourd'hui je te le relance j'ai trouvé une question que j'étais jamais posé sur ça et c'est à propos du mobile first déjà c'est pour savoir si dans les derniers mois t'as déjà eu l'occasion de bâtir des projets qui étaient basés sur du mobile first pour des bonnes raisons bien sûr voilà et si Guttungberg et Afforsiori introduisait des façons de concevoir différentes ou de penser le projet de façon différente pour toi, c'était relativement naturel est-ce qu'il y a des pièges etc pour moi le mobile first on peut l'industrialiser à partir du moment où quand je mettais les slides sur les tips d'industrialisation en fait c'est là où on peut commencer à industrialiser le mobile first pour moi je vois différentes choses mobile first au sens de la conception technique ou mobile first qui signifie en vrai sur mobile ça rend nickel 80% du temps mobile first signifie sur mobile ça doit rendre nickel parce qu'en réalité il y a peu de gens qui regardent si c'est vraiment développé en mobile first pour faire ça on peut l'anticiper et le faire quand on industrialise c'est à dire que quand je disais qu'en fait on prévoit 8 tailles de typo en fait on prévoit 8 tailles de typo mais on prévoit déjà les dégradations 1024 700 et les dégradations mobiles en fait que ce soit du pourcentage ou avec des avec des des machineries sas ou des choses comme ça donc pour moi à partir du moment où on industrialise quelque chose cette chose doit être industrialisée et prête pour le mobile les espacements c'est pareil en espacements xxl qui fait 200 pixels en fait on va le penser en pensant directement sa dégradation mobile et ça te permet d'une certaine mesure d'avoir une première couche d'industrialisation et de mobile first optime après il y a toujours du sur mesure du custom là où je vois un petit peu la limite du full city things c'est quand tu mets en page des éléments complexes par exemple des footers complexes et qui sont mis en page en desktop en fait la dégradation en mobile peut amener à faire comment dire de l'intégration très spécifique ou sur certains aideurs qui peuvent être compliqués, sur certaines navigations qui peuvent être compliquées il n'y a pas de question brûlante on va peut-être s'arrêter là pour arriver à tenir l'horaire cet après-midi merci beaucoup Geoffroy