 Bonjour, et bienvenue sur cette conférence qui s'appelle « Au-delà du tas de boutons » par Hayley Wagner. Cette traduction sera faite par DB0, HNMS et Corfury. Si vous voulez nous faire des retours sur la traduction, vous pouvez le faire sur Twitter ou hashtag c3t ou atc3lingo. Quelques petites annonces avant qu'on commence la présentation. Merci de ne pas voler les brosses des toilettes. On en a besoin, ce serait sympa. Et merci de ne pas fumer dans les tentes, que ce soit à la vôtre ou les tentes publiques. Et donc, on est juste à l'heure pour commencer cette transition. Je vais donc garder cette introduction la plus court possible. Je suis très heureux de pouvoir vous présenter Molly Wilson et Hayley Wagner, qui vont vous parler « Au-delà du tas de boutons » redesignent l'expérience utilisateur de l'extension NoScript. Je trouve que c'est toujours très intéressant de voir comment des outils de sécurité peuvent évoluer en matière d'utilisabilité et d'expérience utilisateur. Et je suis très heureux de voir qu'il y a du progrès dans ce domaine et je suis très envie de voir ce qu'Hayley et Molly vont nous dire là-dessus. Tonnerre d'applaudissement s'il vous plaît. Bonjour. Merci beaucoup d'être venu. On est vraiment très heureuses de pouvoir présenter ce qu'on appelle « Au-delà du tas de boutons » à une étude de cas en design. Je vais vous parler de comment est-ce qu'on a revu l'interface de NoScript, qui est une extension pour bloquer du JavaScript dans les navigateurs. Nous n'avons pas parlé que de ça. On veut utiliser cette étude de cas pour montrer des processus, des outils qui veulent être utiles à beaucoup d'outils open source, en particulier des projets très complexes à destination d'utilisateurs avancés. Bonjour, je suis Molly et je suis Hayley. Voici notre collègue Lorraine, qui n'a pas pu venir avec nous. Elle est à Toronto. Bonjour Lorraine. La première question qu'on s'est posée quand on a voulu refaire l'interface de NoScript, c'était ce logo. C'est un logo qui est assez connu. C'est vraiment une icône qui est là depuis longtemps. Mesdames et messieurs, voici le nouveau logo NoScript. Pas mal. Le même S, une nouvelle expression faciale. Voici l'ancienne interface utilisateur. Beaucoup de textes en tout petit. Ça avait un air assez vieux. Ce n'était pas très constant. Voici la nouvelle interface au niveau de gris, une interface consistante, des coins arrondis. On peut dire que c'est plutôt propre et que c'est plutôt moderne. On est plutôt content avec ça. Mais ça, c'est la partie la moins importante. Quand on parle de design, le fait que ça a l'air joli, ce n'est pas ce qui est important. Ce n'est pas ça dont on parle. C'est juste un petit peu la cerise sur le gâteau. Ça, c'est ce qu'on fait après qu'on ait fait toutes les étapes importantes dont on va parler maintenant. On ne va pas parler des changements de l'interface. On va parler plutôt des méthodes en profondeur qu'on a utilisées pour réfléchir à ce problème avant de pouvoir s'embarquer sur la question de à quoi ça va vraiment ressembler. Dans cette présentation, on va vous présenter des outils et des méthodes que vous pouvez aussi utiliser pour le design de vos projets open source. Avant qu'on fasse ça, quelques mots sur pourquoi est-ce qu'on fait ça ? La réponse, c'est que nos scripts, c'est vraiment bien. C'est vraiment cool. Ça fait pas mal de temps que ça existe. La naissance du projet, c'était en mai 2005. C'est l'une des plus vieilles extensions de navigateur. Il a à peu près 1,5 million d'utilisateurs sur Firefox, plus de 50 000 utilisateurs sur Chrome, et plein de retours d'utilisateurs sur Tor. La dernière fois que j'ai regardé, c'était à peu près 2,5 millions. Tous les utilisateurs de Tor l'utilisent. C'est pas utilisé que par les gens qui sont activistes, qui font de la recherche. C'est aussi utilisé par les gouvernements et d'autres organisations. Beaucoup de gens à qui on a parlé, quand on essayait de faire des tests, travaillent pour le gouvernement. Alors, ce qui se passe aussi... Alors, ce qui se passe aussi... Ce qui se passe aussi, c'est que nos scripts ont aussi beaucoup contribué sur beaucoup d'extensions d'inligateurs qui utilisent... qui utilisent les leçons qu'on a apprises, comme par exemple HTTP Everywhere. On a une protection contre les attaques XSS sur le client. Donc, ça a aidé les autres aussi. Douglas Crawford a recommandé aux gens d'utiliser nos scripts. Donc, c'est vraiment cool parce que c'est plus que les gens qui détestent JavaScript, qui l'utilisent, c'est aussi les gens qui aiment JavaScript, qui se sont mis à l'utiliser également. Les challenges que nous, on a eu sur nos scripts, ça n'a jamais été des challenges que pour nous. On sait que c'est des challenges que d'autres projets open source ont. Au final, nos scripts, ça a été développé par un seul développeur et au final, il y a eu plein d'autres utilisateurs qui se sont mis à l'utiliser, à en parler, à faire des retours. Ça a été commencé par quelqu'un qui l'a commencé pour lui-même en fait. Et pour ça que cette personne a dit, moi je l'ai fait pour moi-même, c'est pour moi que je ferai les fonctionnalités. Mais en même temps, cette personne a dit qu'il y a beaucoup de gens qui ne l'utilisent et qu'ils voulaient que les autres gens l'utilisent. Donc le problème, c'est que si ta priorité c'est toi-même, comment est-ce que tu peux faire en sorte que ça marche pour tout le monde vu que tout le monde n'a pas les mêmes priorités, tout le monde n'est pas forcément un développeur. Donc ce qui s'est passé, c'est qu'il y a eu beaucoup de retours et de demandes de fonctionnalités qui sont arrivées. Il n'y avait pas vraiment de structure autour de ses retours. Et il a fallu s'adapter très rapidement à cette quantité de retours qui a été reçue d'un coup. Ça a évolué en un espèce de projet géant qui a beaucoup d'aspects différents et beaucoup de fonctionnalités qui se connectent pas forcément entre elles. Donc c'est un peu compliqué. Donc qu'est-ce que c'est au final la conclusion de tout ça ? Pour moi, qui suis en des États-Unis, on pense à une espèce de maison qui ressemble à ça. Et puis au final, on se dit, je veux cette fonctionnalité, cette fonctionnalité. Puis au final, ton projet est fini par ressembler à une espèce de grande maison géante avec plein de petites choses. Mais au final, quand on regarde le tout, c'est pas très joli et c'est pas très facile à utiliser. Donc il y a le Mac mention design qui est connu pour illustrer ce concept-là. Donc on voit ici qu'il y a plein de petites pièces, plein de trucs. On a de la place encore. On peut rajouter une petite maison à côté, mais c'est pas très joli. Enfin, si vous êtes architecte, vous connaissez sûrement ce que c'était. C'est très connu. C'est vraiment connu pour être le cauchemar de l'architecture. Mais il faut bien réaliser qu'il n'y a pas de situation à laquelle il n'y a pas de design. Dès qu'il y a un résultat, il y a eu du design derrière, même si ce n'est pas forcément un très beau résultat. Et donc ce qu'on veut présenter ici, c'est des méthodologies, des méthodes pour arriver à un design qui soit élégant et qui produce les résultats attendus à la fin. Donc voilà un diagramme qui représente notre façon de penser. D'abord, on commence par faire une phase de recherche. On parle aux utilisateurs, à la communauté, aux gens intéressés. On leur demande qu'est-ce que vous voulez, de quoi vous avez besoin. Ensuite, on prend ses retours et on en fait une synthèse où on prend tous des retours qu'on a eus. Et on essaye de distiller ça pour savoir quels sont les problèmes essentiels qu'on essaie de résoudre et de quoi on a besoin et de quoi on n'a pas besoin histoire de se concentrer sur l'essentiel. Ensuite, on peut prototype. Et ça, ça permet de travailler rapidement, de faire des prototypes qui veulent être un petit peu rapides et même pas forcément très bien. Mais ensuite, ça nous permet de tester, à partir de ces prototypes, et d'avoir des retours sur ce qui marche et ce qui ne marche pas. Donc ça, ça permet d'avancer rapidement sans dépenser énormément de temps et de ressources sur le design. Et ça permet d'avoir un produit qui est centré sur les besoins d'utilisateurs et la communauté. On se focalise sur l'utilisateur d'abord en leur parlant de l'LD Bumentature Search en analysant ce qu'ils ont dit dans la phase de synthèse et en faisant des prototypes pour eux et en faisant des tests sur ces mêmes utilisateurs. Et ça, ça nous permet de construire un produit qui s'adresse aux utilisateurs, qui s'adresse aux gens qui utilisent les choses. Pourquoi est-ce qu'on fait ça ? Parce qu'on va savoir ceux dont les gens ont besoin, ceux qu'ils veulent et ceux qu'ils peuvent réellement utiliser. Donc par exemple, dans notre phase de recherche, dans les interviews, dans les entretiens, on a demandé à deux utilisateurs novices et quatre utilisateurs avancés. Et on a eu des retours de qualité. Par exemple, un utilisateur novice a dit si je n'avais pas trouvé la bonne chose à essayer avant le deuxième essai, j'aurais juste éteint cette extension. Alors qu'un utilisateur avancé a dit pour moi, nos scripts, c'est la dernière défense qu'il y a dans mon navigateur et donc je lui ai fait confiance en matière de fonctionnalité. Je pense que je veux avoir du principe que ça marche tout le temps pour me sauver la peau. Et donc en faisant ça, plutôt qu'en faisant un espèce de sondage, quelque chose qu'on ne veut pas faire et qu'on ne fera jamais, ça nous permet d'avoir des retours vraiment riches qui viennent directement de personnes en particulier. Donc comment est-ce qu'on analyse ça ? On a pris toutes ces citations que les gens nous ont données qui comprenaient vraiment des données intéressantes et on les a écrites sur des post-it, on a mis ça sur un mur et on a groupé ça par thème. Donc les thèmes, c'est des choses qu'on a pu nous extravenonner et ça, ça nous a donné des idées et on a pu tester ça avec, tester différentes façons de faire évoluer. On a pu tester ça avec 4 personnes en tout et on a récolté du feedback et donc ça se nous a amenés à notre processus. Donc ça, c'est comme ça qu'on a pu avancer et plutôt que d'avoir des citateurs qui nous aient non, ça c'est trop compliqué, ça c'est pour les citateurs avancés, on a pu obtenir quelque chose qui marche mieux. Donc on va d'abord vous parler de comment est-ce qu'on a cadré cet outil. Que fait cet outil et pourquoi, pour qui est-ce qu'il le fait ? D'abord, il a fallu qu'on comprenne quel genre de bloqueur de contenu existe. Dans le paysage des extensions qui bloquent du contenu dans les navigateurs, il y a pas mal de choses. Donc c'est plutôt une bonne chose, ça devrait être le cas. Il y a 10 ans, c'était pas le cas comme ça. Donc on a par exemple des choses qui, des bloqueurs de pume, leur but est de livrer des experts en utilisateur qui soient plus propres, plus simplifiés dans lesquels il n'y a pas de pume. On a tout ce qui est en lien avec la vie privée, le but est donc de réduire les trackers qui s'intéressent à votre historique de navigation et vos habitudes. On a la sécurité, dont le but est de réduire les malware et les logiciels malicieux. Et on a tout ce qui essaye de réduire le bruit ou réduire les choses qu'on n'a pas envie d'avoir dans les pages, par exemple pour rendre les pages plus rapides, éviter de charger des scripts pas nécessaires, etc. Par exemple, une extension comme privacy badger, c'est dans un espace très différent de nos scripts. Nos scripts sont un peu tout seuls de sécurité et de comment rendre la navigation plus efficace et plus rapide. Et quand on a fait cette distinction, ça nous a permis de voir que les gens pouvaient avoir des intérêts très divers et on a simulé ça par trois personnales différentes. Alors pourquoi est-ce qu'on a baptisé des gens réels ? Déjà parce qu'on voulait que ça soit confidentiel, qu'on obtenait des gens. Parce que les gens pouvaient par exemple travailler dans des endroits où ils ne voulaient pas divulguer leur identité ou ils avaient d'informations peut-être un peu sensibles. Et aussi ça nous permettait d'avoir des idées un peu plus abstraites des genres de gens qui sont attirés par nos scripts. Commence avec Rose, la super utilisatrice, quelqu'un qui utilise nos scripts parce qu'elle se sent en sécurité en ligne et ne pas utiliser nos scripts lui donne l'impression d'être exposé en ligne. Et recommande nos scripts avec une sélectivité quand elles pensent que les gens sont capables de le contrôler parce que d'autres pensent que c'est trop compliqué. Émile, le champion de la vie privée il parle à tout le monde de nos scripts mais il ne l'utilise pas tout le temps lui-même il ne l'utilise pas si les pages web sont cassées et il serait vraiment content si nos scripts seraient plus simples à utiliser parce que lui il en parle à tout le monde autour de lui et il sait que c'est le meilleur programme. Chris le curieux il est généralement paranoïde il ne fait pas confiance à l'industrie de technologie il n'aime pas être traqué en ligne il n'aime pas les pubs par contre il a essayé nos scripts une fois il n'a pas compris quand ça fonctionne il a désinstallé il aimerait vraiment que nos scripts décident pour lui quelles scripts sont sur lesquels ne le sont pas et qu'il soit bloqué automatiquement donc qu'est-ce qu'on va mettre en priorité dans notre développement nos scripts ne va jamais vous fournir une liste de scripts à bloquer nos scripts ne va jamais mettre des données sur les utilisateurs et ne va jamais utiliser de l'apprentissage par machine sur des données agrégées nos scripts vont toujours être indépendants donc pour qui est-ce que nos scripts est construit ? nos scripts est fait pour Rose la super utilisatrice on a pris ses décisions relativement tôt qu'est-ce que fait nos scripts véritablement ça ne vous met pas vraiment en sécurité si vous ne savez pas comment l'utiliser est-ce que nos scripts mais tout le monde en sécurité non pas vraiment si vous ne savez pas comment l'utiliser est-ce que ça rend la navigation plus simple non pas vraiment finalement ça donne aux utilisateurs informés les super utilisateurs informés à la possibilité de faire des choix informés nos scripts est un un outil pour créer de la friction mais c'est un outil pour créer de la friction pas pour l'enlever qu'on peut juste mettre en place et l'oublier c'est un outil qui est strict par défaut et avec lequel il faut faire des choix et réfléchir à qui on fait confiance et pourquoi et on n'entend pas le micro switch mics should we switch mics use we have another microphone already I think it's number 2 yes wonderful thank you so much merci d'avoir réglé le micro alors maintenant qu'on sait pour qui nos scripts a été fait notre prochaine étape va être se poser la question qu'est-ce que rose qu'est-ce que rose a besoin vraiment si rose c'est un super utilisateur alors elle doit savoir absolument tout elle doit être complètement transparent elle doit être super customisable tout doit être changeable oui parce que c'est un super utilisateur donc elle sait tout faire alors c'est vrai mais bon c'est pas une excuse c'est ce que Susan Farrell notre ami nous a dit c'est le tas de boutons quand moi j'essaye de configurer quelque chose j'ai pas envie d'avoir tout un tas de boutons c'est vrai que c'est pour ça qu'on voudrait prendre l'idée de la customisation la conclusion la plus logique qu'on a quand on y pense c'est juste bah on va donner toutes les options donc plutôt que de faire ça on va se penser à toutes les options qu'on a et savoir qu'est-ce que le super utilisateur ce dont il a besoin et pourquoi est-ce qu'il veut utiliser ça donc regardez ici ça c'est les mots en rouge ce sont c'est ce qui est important c'est donc quand on visite un site internet ça va charger un script ça va charger les scripts de différentes sources et ces sources peuvent appartenir à des différentes personnes on peut accepter ou refuser que les scripts soient chargés il faut savoir comment est-ce qu'ils peuvent être bloqués et pourquoi on a besoin de savoir beaucoup de choses sur les scripts pour pouvoir faire ça donc ça ce sont les éléments qu'on veut savoir et les verbes à ajouter par le jeu alors on va dire qu'on va visiter le journal New York Times donc ça c'est la liste des scripts qui sont chargés quand on visite le New York Times on peut voir qu'il y a NewYorkTimes.com c'est pas trop mais on a l'impression que le URL fait partie de New York Times et que ça leur appartient parce que le URL est similaire NewYorkTimes et ça appartient à New York Times mais ensuite on voit qu'il y a plein de trucs qui viennent de Google.com pas la même URL mais on dirait que c'est la même chose doubleclick.net ça appartient aussi à Google mais voilà ça fait partie de Google et puis on voit les types de scripts donc on voit ici que ça va récupérer du contenu mais là par contre Google on se dit ça doit sûrement être du tracking et le dernier je pense que c'est des publicités et le dernier c'est du habit testing donc on le sait pas forcément mais si on regarde un interface on le saura on va savoir les données qu'on doit savoir avant de commencer à y penser donc mais après c'est plus compliqué ça parce que chaque script c'est pas juste une chose donc par exemple on peut voir ici qu'il y en a qui vont charger des polices de texte des vidéos, plein de petites choses qu'on peut charger dans son navigateur et pas tous les navigateurs vont accepter ces choses-là donc par exemple on peut dire je suis ok pour charger ce qu'il y a sur news ce qu'il y a sur newyorktimes.com etc donc on va dire qu'il y a n scripts sur un site donc ça c'est 8 n options de scripts qu'on peut faire mais ensuite si on pense aux combinaisons de ce qu'on peut faire, c'est-à-dire bloquer ne pas bloquer le contenu, chaque site etc et bien au final on se retrouve un nombre de combinaisons de 2 puissances 8 n ce qui est énorme et là je vais faire un exemple avec 8 et en fait il y en a 28 de scripts donc c'est vraiment énorme juste en allant sur un seul site donc c'est pas vraiment ça qu'on veut avoir devant nous, c'est beaucoup trop d'options alors évidemment il y a beaucoup d'options qui sont plus faciles à gérer que d'autres par exemple on peut dire ça je veux tout supprimer sur google.com alors je peux dire je veux supprimer tout ce qui est inclus dans la page ou alors je peux dire je veux bloquer tout ce qui est affilié ou alors je veux bloquer tout parce que je ne fais pas confiance à New York Times du tout mais le truc c'est que c'est pas si clair que ça qu'est-ce qu'on peut grouper en catégorie pour simplifier au final et au final j'ai dit bloquer et autoriser mais c'est beaucoup plus compliqué que ça, on peut aussi bloquer par endroit, par exemple je bloque pour la fenêtre ou pour la table est-ce qu'on veut bloquer pour cette session est-ce qu'on veut bloquer pour les 5 prochaines minutes ou pour toujours ou il y a beaucoup d'autres choses comme par exemple est-ce que je veux bloquer sur mon ordinateur de travail ou est-ce que je veux bloquer que sur quel site je veux le faire je veux par exemple que uniquement ces sites là soient bloqués mais pas d'autres et sur les autres sites ils chargent ces scripts-là ça aussi c'est une possibilité donc au final on va juste regarder du contenu sur un site et puis au final on joue un espèce de jeu de set qui a un jeu en maths assez connu donc on se retrouve avec plein de dimensions de choses et puis au final nous ce qu'on veut c'est juste voir un site alors même si c'est des super utilisateurs c'est pas cool de leur demander de faire tout ça donc ce qu'on s'est dit c'était plutôt que de penser toutes les options possibles donc on s'est dit on va penser plutôt à des scénarios alors on va penser à un scénario je veux utiliser nos scripts qu'est-ce qu'il se passe donc on a fait 5 scénarios différents alors le premier ça va être je parcours internet normalement un site normalement le suivant c'est scénario c'est on veut faire ça très très vite donc tout doit marcher on s'en fiche du script il faut que ça marche comme par exemple quand tu vas payer quelque chose en ligne le parcours et internet de manière sale c'est à dire quand on va regarder un site de streaming comme youtube ou ce genre de choses ou vraiment ça va être plein de choses qui vont se passer ou alors le dernier scénario ça va être aller sur des réseaux sociaux par exemple quand on va sur facebook ou d'autres choses donc on veut le contenu de facebook mais pas forcément d'autres sites ensuite le dernier scénario ça va être juste visualiser le contenu donc c'est quelque chose qu'on a appris grâce au recherche du site donc on a voulu voir qu'est-ce que le site a refait et combien de scripts ils avaient quand ils allaient voir un site et au final on s'est rendu compte que pour les utilisateurs c'était super important pour eux de voir ce qui était visible en plus de pouvoir bloquer c'est vraiment juste de lister ce qu'il y a donc maintenant on peut penser à une suite de tâches donc quand on va sur un site est-ce que le site marche ou non ? oui c'est super non ça marche pas alors il va falloir que j'allume que j'autorise certains scripts parce que sinon ça marche pas il faut que je recharge la page une fois que j'en ai autorisé un ça marche ça marche pas bon bah voilà le truc c'est qu'on veut que les gens continuent à faire ça jusqu'à ce que ça marche mais là en réalité il y a plein de gens qui disent bon bah tant pis je veux dire ok j'autorise ce site et je laisse tout charger ou donc ils vont tout autoriser ou alors il y a certains utilisateurs qui vont dire bon de toute façon ce site n'était pas si important que ça je vais juste partir et au final dans ces 2 cas de scénarios bah c'est pas vraiment ce qu'on voulait parce qu'on voulait on veut que les gens utilisent nos scripts de la bonne façon et en fait on s'est rendu compte qu'il y avait un autre scénario qui se passait en regardant ce que l'utilisation faisait c'est que les gens disaient je vais aussi autoriser les scripts affailliers parce que on s'est dit bah c'est peut-être ça le problème et dans ce cas-là on se rend compte qu'au final personne n'aime nos scripts parce que c'est frustrant et on se dit quand ça marche, quand les trucs marchent on dit une script c'est super mais quand ça marche pas on se dit nos scripts c'est vraiment chiant il n'y a rien qui marche et en fait ça va toujours être comme ça les gens sont toujours énervés quand on a nos scripts c'est toujours merci nos scripts pour m'aider donc là on essaie de réfléchir comment est-ce qu'on peut designer l'experience situateur pour ne pas que ce soit ça donc on a essayé donc si on regarde à l'ancienne interface il y a la liste des scripts et les options sur la gauche et en haut à droite on voit des options globales et en fait elles sont pas très grosses parce qu'on n'est pas fan d'utiliser ces options là pour faire que tu saches que tu fais donc ce qu'on a fait c'est la nouvelle interface situateur donc il y a pas mal de choses qu'on a rajouté alors d'abord on veut voir on comprend que les options faciles et sales c'est utilisé donc on a décidé de les accepter et les rajouter donc on a décidé de faire un bouton pour dire j'autorise les scripts affiliés ensuite on a la configuration de chaque script et on les voit bien on peut aussi configurer le scope quelque chose qu'on voulait faire rendre plus visible sur la nouvelle interface on a une nouvelle fonctionnalité qui est les configurations par site donc on peut sauvegarder la configuration par site directement donc si vous voulez le faire sur facebook uniquement et bien vous pouvez le faire maintenant donc par exemple les sites qu'on visite régulièrement comme par exemple facebook on peut le faire on a aussi voulu regarder le bouton panique parce que on s'est dit que les gens ils sont vraiment trop frustrés ils veulent juste tout arrêter on a implémenté le bouton panique comme ça vous pouvez tout désactiver d'un coup et c'est là pour donc ça c'est le corps de ce qu'on a voulu faire on a pensé à ce que c'était les options et qu'est-ce que les gens voulaient vraiment et donc ensuite on a regardé l'interface en elle-même et la toute la confusion qui pouvait venir de l'aspect visuel de cette interface et donc c'est un problème ça très commun quasiment beaucoup de logiciels à ce genre de problème il y a du jargon il y a des mots qui sont utilisés de façon inconsistante c'est le problème qu'on a par exemple dans ce design classique de chez Apple il y a une bombe pour dire désolé ça marche pas bam une bombe c'est quoi le message là-dedans c'est pas clair et ça c'est des choses qu'on voit dans beaucoup de projets et nos scripts n'est pas une exception ici et ce que je veux ici c'est montrer quelques exemples spécifiques de choses qu'on a vues dans l'interface, dans le langage de l'interface de nos scripts la première chose c'est les couleurs voilà une question de design est-ce que bloquer un script ça devrait être en vert oui c'est bien il faut le faire ou est-ce que ça devrait être en rouge non il faut pas faire ça arrête de faire ça et si on regarde avec les couleurs intuitives si on revient ça devrait être go vas-y c'est vert donc autoriser le script ça devrait être vert et stop ça devrait être en rouge, bloquer ça devrait être en rouge donc go stop autoriser bloquer mais si on pense en matière de script les bons scripts on veut les autoriser les mauvais scripts on veut les bloquer donc ça veut dire que bloquer devrait être rouge peut-être mais d'un autre côté nos scripts veulent vraiment recommander des bonnes pratiques et en ce manière sécurité ce serait de tout bloquer alors que la mauvaise pratique ce serait d'autoriser tout et donc maintenant on est dans la situation où bloquer ce serait rouge pour certaines personnes et vert pour d'autres personnes et ça c'est pas c'est pas bien d'avoir ce genre de problèmes quand ils essayent de utiliser des couleurs parce que les couleurs vont juste rajouter de la confusion parce que ce que vous pensez qu'une couleur veut dire d'autres personnes vont penser l'inverse donc ça c'est une situation où on s'est dit on veut pas avoir cette dichotomie rouge-verde ça va juste créer de la confusion et on n'arrivera jamais à faire quelque chose qui indiquera les choses à tout le monde alors je précise quand même la couleur devrait pas être la seule chose dans votre design qui communique un concept ça devrait être juste un élément en plus et il faut utiliser d'autres éléments de langage qui vont communiquer la même chose une autre chose qu'on a vu c'est dans le langage il y avait des choses qui rajoutaient de la confusion double négatif dans les phrases en anglais c'est quelque chose qui peut apporter beaucoup de confusion par exemple désactiver les restrictions de manière globale alors quand on lit quelque chose comme ça ça veut dire qu'avant il y avait des restrictions qui étaient déjà quelque chose une négation et ensuite on va désactiver ces restrictions donc ça veut dire que maintenant on va désactiver quelque chose négatif il faut réfléchir un petit peu quand on lit parfois parfois il y a aussi des choses on va prendre des concepts techniques et des concepts sociaux et on va un peu les mélanger par exemple on parlait jusque là de bloquer et d'autoriser mais dans l'interface de nos scripts à la place on utilise la notion de script en qui on fait confiance ou en qui on ne fait pas confiance donc au niveau technique il y avait la notion de bloquer un script mais au niveau social il y a la notion de confiance qui est plus importante et donc si j'autorise un script est-ce que ça veut dire que je lui fais vraiment confiance peut-être ou peut-être pas j'ai juste besoin de l'autoriser maintenant le temps de faire un paiement mais je lui fais pas réellement confiance et j'ai pas envie de me sentir coupable de l'autoriser parce que c'est pas vraiment une relation de confiance que je crée avec ce site c'est juste un besoin donc ça c'est quelque chose dont il faut tenir compte quand on soit une interface en particulier pour des utilisateurs avancés parce que les côtés sociaux et les côtés techniques peuvent être d'autant plus mélangés quelque chose d'important aussi c'est le ton qu'on utilise dans la communication ça c'est quelque chose qu'on a beaucoup vu par exemple on va utiliser le mot dangereux pour parler de quelque chose par exemple voici un filet de novice qui venait d'installer nos scripts et qui disait il y a 5 minutes j'utilisais pas cette extension et maintenant il y a ce bouton et dessus il écrit que c'est dangereux moi je me sens en danger quand je vois ça et c'est vrai des fois on veut apporter une notion éducative on veut se comporter comme des parents pour nos utilisateurs mais des fois il faut aussi être réalisateur de faire leur propre choix donc à la place qu'on a fait c'est qu'on a changé le ton visuel on a changé les visuels pour dire nos scripts à nos scripts de vue mais vous avez l'option de le faire et on a fait ça de façon qui est un petit peu plus ludique un peu plus sympa plutôt que de dire attention ça c'est vraiment très dangereux tu t'aventures en terrain inconnue et risqué à la place on dit juste ok bon courage tu te débrouilles et donc je pense que ça c'est a conclu ma partie sur le langage visuel si vous voulez faire des choses semblables pour des projets sur lesquels vous travaillez indépendant de la logique et de la complexité de ces projets on veut bien vous fournir des outils pour que vous aussi pouvez passer par un procès de design et créer un outil dans lequel vous avez mis beaucoup de travail pour que la communauté puisse travailler avec et qu'il y a besoin de sens dans tout ça donc on a créé des templates pour tout ça on va les mettre en ligne gratuitement voici un template de personne qui est axé sur la protection des activistes des droits humains aussi des outils de technologie et ce que fait une personne ça dépend de l'outil que vous êtes en train de créer donc ça dépend un peu du cas une autre chose c'est un générateur de proposition de valeur c'est un peu technologique mais en gros vous pouvez voir ce que vous pouvez définir pour qui c'est fait et ce que c'est censé faire ça peut vous aider à prioriser et à traiter le feedback que vous êtes en train de recevoir et encore plus mais on va pas utiliser notre temps ici pour vous montrer tout ça mais venez nous parler si vous voulez en savoir plus et on a pas mal qui s'explique par eux-mêmes donc là allez sur le site il faut se souvenir il n'y a pas de design tous les choix que vous faites sont des choix de design donc faites un des choix éduqués avec une certaine méthode vous aussi être transparent sur les coûts on aime bien le processus centré sur l'utilisateur parce que ça peut être à bon marché vous n'avez pas besoin d'une grande agence pour faire tout ça mais ça c'était pas facile ça nous a pris du temps à peu près un mois de plein temps pour deux personnes Aline et Lorraine Lorraine est un fait du design visuel donc tous les icônes que vous avez vus c'est Lorraine qui l'a fait Aline n'est pas pas de design mais elle a travaillé dessus quand même les coûts additionnels donc bien sûr les outils sketch on a créé des icônes en vecteur Whimsical c'est pour collaborer en ligne, Notion Whimsical c'était aussi pour collectionner toutes les petites post-titres ce serait super de créer un outil comme Whimsical mais en open source on aurait adoré avoir ça Notion c'était pour la collaboration interne G-Tip pour des tests avec des utilisateurs externes et pas mal de post-titres et bien sûr une compensation pour au moins 10 personnes pas mal de gens nous ont donné du travail mais en quelque sorte il fallait aussi qu'on compense les utilisateurs qui nous ont aidés et ce travail n'aurait pas été possible sans l'aide du Open Technology Fund et on a surtout besoin de remercier Giorgio qui nous a laissé jouer avec nos scripts c'est vraiment dur quand vous travaillez sur quelque chose qu'il y a 14 ans maintenant c'est votre bébé et là il y a des personnes qui arrivent pour travailler dessus pendant un mois et demi et vraiment merci de nous avoir laissé jouer dessus, cette présentation est dédiée à Giorgio, merci beaucoup et là on arrive à la fin on sera ici pour la semaine si vous avez des questions sur le design ou notre travail en général juste venez nous voir et on serait content de vous aider sur le design peu importe ce que ça signifie pour votre projet à vous, merci merci Molly et Eileen on a quelques minutes restantes pour les questions si vous en avez une question pour l'une ou l'autre ou les deux allez-y au micro et posez votre question donc on va commencer avec la première personne pour la présentation je me demandais juste beaucoup de gens leur première fois avec NoScript on aurait besoin un peu d'un tour de l'outil donc qu'est-ce que vous avez fait pour ça, est-ce que vous avez changé les personnages et tout ça pour que la configuration par défaut corresponde pour les autres alors pour les utilisateurs qui ont découvert NoScript en utilisant Thor et le Thor Browser peut-être qu'on veut à reformuler la question est-ce que la question est en tenue ? oui c'est bon oui l'utilisation du Thor Browser qui vient de base avec NoScript effectivement ça amenait beaucoup de gens à utiliser NoScript qui ne s'y attendaient pas forcément des utilisateurs involontaires de NoScript et ils sont retrouvés avec notre processus de recherche en parlant à des gens de l'équipe de design du Thor Browser merci beaucoup à eux, c'est des gens vraiment géniaux et donc on leur a parlé et on a parlé des problèmes que eux rencontraient il y a un projet entier d'intégration de NoScript dans le Thor Browser et donc ici on n'a pas voulu parler de ça et ce que eux font c'est généralement qu'ils ne veulent pas montrer NoScript dans l'interface d'utilisateur et ils ont décidé de passer ça carrément en arrière-plan et de laisser des gens ne pas avoir à se confronter à ça alors peut-être que maintenant qu'on a amélioré l'interface d'utilisateur les choses vont être différentes c'est possible de changer la direction du projet mais en général c'est très important de comprendre quels autres outils existent dans l'environnement d'utilisateur dans l'environnement de vos utilisateurs et si vous voyez qu'il y a beaucoup d'utilisateurs qui utilisent Chrome avec votre outil il faut prendre ça en compte comment est-ce que ça interagit votre extension interagée avec Chrome et avec d'autres extensions Chrome c'est pas possible de designer quelque chose en isolation je fais une question alors c'est plutôt une question technique dans l'interface d'utilisateur j'ai vu qu'il y avait un bouton pour les scripts affiliés donc comment ça marche avec les autres listes par exemple sur New York Times on voit que c'était pas forcément connecté au New York Times et pourtant ça faisait part New York Times comment vous faites pour ça alors oui très bonne question effectivement donc ce qu'on va faire c'est que par défaut ce qu'ils me considèrent comme affiliés c'est ceux qui sont à première partie donc ceux qui sont sur le même domaine pour les sites affiliés qui sont sur d'autres domaines on n'a pas de moyen de faire ça on va peut-être fournir une façon de faire ça en arrière-plan comme par exemple on va avoir une liste des 10 sites les plus visités et fournir cette liste-là histoire que les utilisateurs n'aient pas à apprendre que tel domaine est lié à tel ou domaine pour domaine très populaire une autre chose qu'on peut faire aussi ce serait permettre aux gens d'emporter et exporter leurs settings c'est déjà possible en fait de faire ça et du coup ce serait possible de travailler, de construire là-dessus de travailler à notre domaine on pourrait partager ça et d'autres gens pourraient utiliser cette liste de domaines affiliés mais comme on l'a dit au début ne scriptez pas un outil qui se veut être très intelligent et là pour vous donner du choix et pour pouvoir le faire de façon fiable je voulais savoir si vraiment c'était la question sur les sous-domains en fait comment ça marche pour les sous-domains alors je crois qu'il y a deux questions la première question est sur les paramètres spécifiques à un site et paramètres enfin le fait d'autoriser des sites affiliés quand on tourise des sites affiliés on dit je parle d'un profil de site que je veux autoriser ou non pardon quand je fais des paramètres par site je dis quand je vis de ce site je veux autoriser ces scripts là et sinon les sous-domains effectivement font partie des scripts affiliés à un domaine une autre question vous l'aviez sur la liste de projets apparentés je pense que ça va dans la même niche que nos scripts il parle de matrix est-ce que est-ce que c'est le même groupe d'utilisateurs est-ce que matrix je vois aussi cette pile de boutons est-ce que vous avez vu comment est-ce que vous pourrez intégrer ceci dans nos scripts alors oui alors le film The Matrix m'a fait beaucoup penser à ça d'ailleurs c'est un problème très intéressant et l'extension matrix et nos scripts sont you matrix pardon you matrix est très similaire à nos scripts sur bien des aspects et ça m'a amené à penser à ça et moi personnellement ce que ce que je retiens alors notre but n'était pas de devaluer you matrix c'était que you matrix essayait d'apporter le plus de valeur à beaucoup d'utilisateurs et pas juste aux utilisateurs avancés j'étais pas très spécifique pardon je voulais dire la nouvelle fonctionnalité que vous avez rajouté pour les sites les paramètres par site en fait je voulais parler de ça qu'est-ce que ça veut dire au niveau des URL au niveau des domaines quelle domaine marche sur cette configuration-là c'est juste tout le domaine ou est-ce que c'est les sous-domains également alors Actual je crois que c'est le chemin complet de l'URL donc par exemple si vous avez un sous-domain je crois que les paramètres par site ne s'appliquent pas donc c'est par sous-domain mais ça c'est quelque chose qu'on peut peut-être changer et c'est une option par défaut qui peut être ajustée par la suite la décision qui reste encore à prendre là-dessus et d'ailleurs une petite anecdote là-dessus l'intégralité de cette fonctionnalité a été supportée par le code depuis très longtemps la raison principale pour laquelle c'était pas accessible c'est que Giorgio n'avait pas trouvé de moyen de rendre ça accessible dans l'interface utilisateur donc c'est pas du nouveau code qu'il a dû écrire pour ça c'était vraiment à l'interface de rendre ça accessible une autre question alors vous avez parlé des couleurs et je me demandais alors oui bien sûr il y a les gens qui ont des soucis pour voir les différentes couleurs et il y a pas mal de gens pour qui les couleurs c'est super important en fait et ça les aide beaucoup je me demandais qu'est-ce que vous avez utilisé pour vos règles quand vous prenez des décisions en rapport avec les couleurs par exemple si vous décidez d'utiliser des couleurs alors il faut que j'utilise tel outil alors l'important pour nous c'est de pas utiliser les couleurs pour montrer des formations pas nécessaires on peut utiliser d'autres systèmes comme par exemple la position les icônes, les mots il faut s'assurer que les couleurs ne soient pas la seule façon de donner une information par exemple un cercle rouge et un cercle vert parce que par exemple dans la virèle on sait que la lumière tout en haut en haut c'est rouge, en bas c'est vert les utilisateurs ne savent pas forcément ça dans votre interface ils savent pas forcément si rouge c'est ok ou annulé lequel est oui, lequel est non donc vous pouvez utiliser des couleurs par exemple en général le vert c'est oui, le rouge c'est non mais dans le cas de nos scripts ça marchait pas parce qu'on savait pas si vert voulait dire bloquer ou faire confiance il y avait toute cette sémantique qui était pas bien définie et du coup on a fait le choix à cette paire rouge vert dans notre cas parce que c'était en migue mais il faut vous sentir libre de l'utiliser si ça a du sens pour vous c'est pas quelque chose à bannir tout le temps mais utiliser aussi des mots ou des icônes en complément donc merci beaucoup Eileen et Molly pour cette progression passionnante et je suis sûr que beaucoup de gens vont réessayer nos scripts maintenant merci beaucoup