Voici le résultat de quelques recherches et réflexions sur la question du texte justifié, car beaucoup de ressources en ligne à ce sujet sont très datées. En résumé : oui il faut continuer à ferrer à gauche le texte de labeur mais la question mérite d’être posée et mieux étudiée, surtout avec le support de la césure automatique sur les navigateurs. Retours et critiques bienvenus.
Il y a très peu d’études empiriques spécifiques sur ce sujet. J’ai trouvé deux papiers de Ling & Van Schaik, vieux mais intéressants (résumés ici). Ils confirment que le texte aligné à gauche est plus lisible. Plus précisément :
Je n’ai rien trouvé de sérieux sur la dyslexie, alors que c’est le coeur du sujet (il y a peut-être d’autres dys concernées mais je vais me concentrer sur la dyslexie pour pas parler dans le flou). Même les articles en apparence bien documentés reprennent des recommandations tirées d’autres articles pas plus étayés, si bien qu’on tourne vite en rond : les designers invoquent des universitaires qui invoquent des guides institutionnels qui invoquent des designers.
Si j’ai loupé des ressources intéressantes, dites-le moi.
Bref les choix typographiques ont un gros effet sur la capacité de lecture des dyslexiques, mais on nage à vue : entre la taille des caractères, la longueur des lignes, l’interlignage et l’alignement, qu’est-ce qui gêne le plus ?
Plus encore, il faudrait décorréler la question de la justification dans l’absolu de celle de son implémentation, qui est très mauvaise historiquement sur le web. Il n’y a pas d’études comparant la lisibilité d’un texte ferré à gauche à celle d’un texte correctement justifié. Au hasard en se basant sur une page imprimée et composée manuellement par un pro sous Indesign.
À ma connaissance, il y a deux arguments contre la justification : l’irrégularité des espaces et la difficulté à distinguer les lignes entre elles.
Ça fait varier la taille des espaces et donc perturbe les trajectoires oculaires. Celles-ci sont déjà rendues erratiques par la dyslexie, c’est justement un des gros symptomes. Voir cet article passionnant.
Voici deux graphiques (source) assez parlants comparant les trajectoires d’une personne non-dyslexique (à gauche) et dyslexique (à droite). Les lignes horizontales représentent une fixation sur un point, les lignes verticales représentent des mouvements en avant ou arrière dans le texte. Le graphique du bas est beaucoup plus irrégulier, avec des retours en arrière plus fréquents.
Mentionnons aussi que la justification peut créer des lézardes/rivières (enchainement vertical de larges espaces), mais c’est surtout notable avec un colonnage réduit.
Mais ces problèmes de mise en page sont largement réduits en coupant les mots. Cette fonctionnalité de césure est maintenant supportée en français par tous les navigateurs modernes et sur tous les OS.
On est d’accord que ce n’est pas parfait :
les espaces restent un peu irrégulières, les algorithmes « H&J » (hyphenation & justification) des navigateurs restant plus basiques que ceux des deux stars du domaine (InDesign et Latex).
La césure elle même est problématique. Elle complexifie la lecture et peut être gênante dans des contextes de basse vision (source).
Il est probable que les évolutions techniques réduisent le premier problème :
Second argument contre la justification : l’aspect « dentelé » des fins de ligne permet au lecteur de se repérer. Chaque petite différence de longueur constitue autant d’indices visuels pour enchainer les lignes sans se tromper ou hésiter.
Intuitivement ça me parait un bon argument. Cette fois-ci, ce n’est pas un problème d’implémentation ou de compromis, c’est inhérent à l’effet visuel.
J’aimerais juste avoir plus de détails : ce n’est pas un argument cité souvent, à quel point est-il avéré et compris ? Encore une fois, on nage à vue.
On continue à aligner le texte par défaut – et on continuera, tant qu’il n’y aura pas de grosse évolution technique et qu’il n’y aura pas de preuve béton que la justification ne crée aucun problème.
Cela n’empêche pas de proposer aux lecteurs une option pour changer de style et activer la justification.
Cela n’empêche pas non plus de continuer à expérimenter. Les limites du web et des livres électroniques en matière de typographie par rapport à l’édition ne sont pas inéluctables.
Note sur le RGAA : il y a juste le critère (1.4.8) (AAA, non obligatoire donc) qui oblige à avoir le texte à gauche par défaut ou via option.
Une marotte des philosophes et autres théoriciens, c’est d’inventer un langage parfait et universel. Puisqu’il est doit être parfait, ce language s’abstrait souvent des écritures courantes et invente son propre système graphique.
Il y a le LoCos inventé par Yukio Ota, l’Isotype de Neurath, la sémantographie de Bliss… J’avais fait un petit fil à ce sujet.
Il y a aussi des langages pas universels et dédiés au mouvement. L’idée est beaucoup utilisée pour la danse. Dès le 17e siècle, on trouve des premiers systèmes basiques.
Au 18e siècle, la danse baroque d’inspiration française est une part importante de la vie sociale dans les cours européennes et plusieurs systèmes de notation apparaissent et deviennent populaires. Ils se font concurrence et cela va jusqu’au procès. Les plus connus sont ceux de Feuillet en France puis Tomlinson en Angleterre. Il semble que ces systèmes n’nont pas qu’un simple rôle de transcription. Etant donné leur popularité, ils influencent aussi les tendances. Leurs limites (notamment pour encoder autre chose que le mouvement des pieds) deviennent la limite des mouvements dansés.
Pour aller plus, vous pouvez lire cette page Wikipedia et cet article. Tufte y consacre aussi une page dans son célèbtre Envisioning Information (PDF, p. 27).
Au 20e siècle apparaissent des systèmes beaucoup plus complets. Il semble que les principaux soient la cinétographie de Laban et la choréologie de Benesh.
Au début du 20e, l’idée de codifier le mouvement est appliquée à un tout autre domaine : l’organisation scientifique du travail. Les époux Gilbreth créent un les therbligs, une liste de 18 symboles pour décrire toutes les actions effectués par un ouvrier. L’idée n’est pas d’encoder toute la subtilité des mouvements mais plutôt de normaliser et synthétiser les opérations élémentaires que doit réaliser un ouvrier sur son environnement, dans une optique d’amélioration de la productivité. Un pur produit du taylorisme.
Fidèle à l’esprit scientifique de l’époque, les Gilbreth ont une approche empirique, notamment en enregistrant les mouvements de travailleurs. Ils baptisent « chrono-cyclographes » ces photos à exposition longue où des petites lampes sont attachés aux membres.
Notons que l’influence des méthodes des Gilbreth se fait encore sentir aujourd’hui en facteur humain et en ergonomie, notamment dans l’usage de diagramme pour l’analyse de l’activité.
On trouve quelques travaux récents, notamment pour faciliter la conception d’interfaces de reconnaissance gestuelle.
EDIT : Ma technique utilisée ici est maintenant impossible (ou prohibitive) depuis l’énorme serrage de vis sur les API de Twitter par leur nouveau PDG (son nom m’échappe…).
EDIT 2 : J’ai développé cet outil pour republier des fils sur Mastodon à partir d’une archive. Ça a quelques limites par rapport à l’ancienne technique, mais aussi l’énorme avantage que les fils peuvent maintenant vivre sur une nouvelle plateforme.
Pour archiver des fils de votre compte, l’export fourni par Twitter ne suffit pas. Chaque tweet est isolé, sans les messages auquel il répond. Plus fondamentalement, la notion de « thread » n’existe pas dans l’API.
Il faut se tourner vers des outils externes.
Pour exporter un fil récent, on peut utiliser cet outil en ligne, très simple puisqu’il suffit d’entrer l’URL d’un tweet. Mais ne marche pas avec de vieux messages.
Avec un export officiel, on peut utiliser cet outil un peu compliqué ou celui-ci, plus simple. Tous deux créent un mini-site web avec l’intégralité des tweets, issus de fils ou non.
Il y a aussi cette expérimentation en ligne qui simule un navigateur scrollant Twitter pour générer un PDF, à des fins de notarisation et de preuve d’authenticité.
Et à ma connaissance, c’est tout. A cause des limites de l’API, il n’existe pas d’outils respectant les critères suivant :
Du coup j’ai codé un truc. Bon c’est moins complet que les autres et ça respecte pas le troisième critère (impossible avec l’API), mais en gros vous lui donnez un token d’accès à l’API et une liste de threads (un titre et l’ID d’un tweet de départ) et ça recrache un fichier JSON avec en gros :
Le script est pensé pour tourner régulièrement et alimenter mon blog. Si aucun nouveau tweet n’est détecté, il s’arrête et réutilise les anciennes données en cache.
Par ailleurs, mon blog génère automatiquement une page listant tous les fils et une page pour chacun d’entre eux.
La disparition de Flash entraine de gros risques de perdre tout un pan de l’histoire du web. Des initiatives se sont créées, comme cette archive de jeux vidéo. Il y a aussi ce projet d’émulation.
Il y a quelques temps, j’ai utilisé cette bibliothèque pour héberger et rendre accessible quelques classiques de l’animation en ligne qui ont bercé ma (post-) adolescence.
Entretemps, le projet a publié des extensions pour les principaux navigateurs. Si vous l’installez et arrivez à trouver une animation Flash basique et encore en ligne, vous devriez pouvoir ouvrir cette animation directement dans votre navigateur.
Vous voulez savoir si vos utilisateurs ont des petits ou des gros smartphones ? Des laptops ou des écrans externes ? La taille de la fenêtre de leur navigateur, indépendamment de l’écran ?
Utilisez ce carnet Observable que j’ai concocté.
Everything Everywhere All At Once est un film extraordinaire. Et comme j’ai une légère fascination pour les séries visuelles (exemples ici ou là), voici une mosaïque interdimensionnelle de toutes les Evelyn, l’héroïne jouée par Michelle Yeoh.
Et c’est tout.
Un retour sur mon expérience d’écrire un gros support de cours avec Reveal.js/Asciidoc et dans un éditeur de texte. Ainsi que sur le petit kit de démarrage que j’en ai tiré.
Récemment, j’ai donné un cours d’introduction au design UX. La question des diapos s’est tout de suite posée : rédiger et mettre en forme des dizaines de slides, importer texte et images de précédents supports… Même avec un template, c’est fastidieux. Et justement, je n’en avais pas sous la main.
J’ai donc pensé à Reveal.js, une bibliothèque permettant de générer des slides en HTML. Vous voyez la grande bannière sur leur page d’accueil ? Elle est interactive, c’est un exemple de slides.
L’intérêt de Reveal.js ?
Problème : la rédaction reste très verbeuse. On doit écrire dans le fichier HTML directement et même en tirant parti du support de Markdown on se retrouve vite avec ce genre de charabia [1] :
<section data-markdown>
<script type="text/template"></script>
</section>
<section data-markdown>
<script type="text/template"></script>
</section>
Arrive Asciidoc. C’est un format un peu plus ancien que Markdown, et aussi un peu plus riche (donc complexe). Une extension permet de générer une présentation complète à partir d’un fichier. L’avantage est d’écrire dans un éditeur de texte, sans se soucier de mise en forme ni de détails techniques. Dans VS Code ça donne quelque chose ça :
Chaque titre est un slide. La hiérarchie de titres, signifiée par le nombre de =
, permet de générer la table des matières à gauche et aussi de créer les rubriques « verticales » mentionnées plus haut. Globalement, c’est assez génial pour réfléchir à l’enchainement des idées et déplacer rapidement du contenu d’un endroit à l’autre.
Pour autant, après avoir écrit 375 diapos avec, est-ce que je recommande le machin ? Ca dépend pour qui. Si vous trouvez déjà Markdown compliqué ou que vous n’aimez pas bricoler avec plusieurs outils interconnectés, fuyez. Ou bien utiliser l’éditeur graphique vendu par le créateur de reveal.js.
Mais si vous êtes plus éditeur de texte que Powerpoint, plus texte qu’image, que l’idée d’ajuster le placement de dizaines de blocs vous hérisse et que vous aimez les slides minimalistes, testez donc.
Réinsistons sur les avantages de la portabilité :
Mais il faut aussi détailler certains inconvénients :
image::nomDeFichier[]
, sans se tromper de nom. Alors qu’avec Powerpoint/Keynote/Slides je copie l’image dans le presse-papier et la colle dans le slide, sans jamais gérer de fichier. Mais un peu d’outillage améliore la situation.On peut écrire le markdown dans un fichier à part, mais il faut un fichier par slide, c’est impraticable. ↩︎
Quand un post comprend une jolie image, je la spécifie comme « mise en avant » et elle se retrouve en vignette dans la page de liste. Que faire quand il n’y a pas d’image ? Laisser un vide ou avoir une image par défaut, toujours la même, ne serait pas très élégant. Pour obtenir des images variées mais avec une unité de style, la génération procédurale est l’approche parfaite. Elle permet de générer des formes en alliant une trame de base et des paramètres aléatoires. On va l’appliquer à une technique bien connue en histoire de l’art : le pavage d’un espace en le remplissant avec des carreaux de base.
Ici on utilise des motifs dits de Truchet, du nom du savant éponyme : Sébastien Truchet, ingénieur hydraulique, mathématicien, typographe… Rien que ça. Il est notamment à l’origine des eaux de Versaille, du premier point typographique et de Times News Roman, au moins partiellement et indirectement.
Revenons à notre pavage. Chez Truchet, il y avait quatre carreaux de base :
Comme on le voit, c’est une variation toute bête autour d’un simple triangle. Mais avec ça, il obtenait déjà des formes variées, en les regroupant en bandes, en losange, ou en alternant noirs et blancs.
Je reprends une idée de Cyril Harvey Smith : uniquement deux carrés, comprenant des quarts de cercle.
Si on ajoute de manière concentriques plusieurs arcs de cercle et des dégradés de couleur, c’est encore plus joli.
La trouvaille pour apporter du rythme, c’est l’absence de rupture : que quelque soit l’orientation des blocs, chaque arc est connecté à un arc voisin. Le tout forme un motif de labyrinthe, alors que le placement des blocs est purement aléatoire. La seule chose qui ne l’est pas, c’est la couleur de fond qu’on devine au centre des cercles.
Essayez vous-même : cliquez sur un carreau pour le faire pivoter et voir que ça ne rompt pas l’enchainement.
Voici d’autres résultats très différents, obtenus uniquement en jouant sur quelques paramètres. Pour essayer vous-même, aller voir cet outil interactif. (À qui j’ai beaucoup emprunté, techniquement et visuellement). L’auteur ajoute en plus des paramètres pour délier chaque arc concentrique et ainsi créer un effet de « tressage » plus ou moins échevelé, suivant à quel point on pousse les paramètres twist et scramble.
Sur l’histoire des ornementations, voir cet article et cette galerie sur le livre La Grammaire de l’ornement, cette page sur le pavage et celle-ci sur les carreaux.
Pour une analyse psychologique de notre goût pour les motifs, voir le livre The sense of order : a study in the psychology of decorative art (accessible en ligne), par le grand historien de l’art Ernst Gombrich. Résumé grossier (j’en suis seulement à l’intro) : on aime un certain compromis entre ordre et chaos, car on est cognitivement câblé pour chercher des structures dans le monde changeant qui nous entoure.
Sur les affinités naturelles entre informatique, génération procédurale et motifs, voir le livre collectif 10 PRINT CHR$(205.5+RND(1)); : GOTO 10 (accessible en ligne). Oui c’est le titre. C’est une ligne de Basic générant un labyrinthe étonnamment semblable au motif originel de Smith plus haut.
Étant donné l’expressivité de ce genre de pavage, vous ne serez pas étonné d’apprendre que c’est un domaine d’exploration en mathématiques. Des pavés plus complexes sont même utilisés comme modèles de calcul. Après tout, l’informatique exotique est un genre en soi.
Au-delà du carré de base et du visuel du triangle, on peut utiliser bien des formes. Voici le travail d’un chercheur qui fait même des motifs en 3D. Voici aussi des exemples avec plus de degrés de symétrie, avec des motifs enchassés…. Et pourtant, il y a quelque chose de spécial avec le triangle : c’est le plus simple des polygones et pourtant il peut tout représenter. En image de synthèse, c’est une brique de base pour tout modéliser, au point que les polygones plus complets sont souvent convertis en triangles.
Quand on lit l’article où Smith introduit la variante que j’utilise, on s’aperçoit qu’il en parle à peine, négligement et toute à la fin. C’est ironique, vu la popularité de cette variante. L’article est plus général, c’est une méditation sur la notion de structure visuelle : comment elle nait de la composition de formes de simples, d’alternance de fond/figure, de changements de densité. Comment l’exploration visuelle de ces structures est intrinsèquement temporelle de. Le texte est dense, parfois incompréhensible et quasi-mystique. Extraits :
All tilings combine aspects of lines-of-progress and cyclical closures, but they differ in their relative emphasis on internal or boundary balance: pattern depends less upon the fit of any definable polygons with their immediate neighbors than upon the whole hierarchy of directions. The eye enjoys the alternating perception of boundaries that enclose or exclude or are themselves regions of which the inner structure is remembered and does not need further analysis.
[…]
The structure of matter devolves ultimately into the intimate coexistence of something like corpuscles of nothing and atoms of something, segregating through the accidents of history to yield regions differing in density intimately interwoven on different scales. The existence of the world as well as human perception and analysis of any part of it is a matter of the angular scale of resolution and of the time necessary for making comparison between the different parts. Both the stability of material structures and human perception of them involve the tracing of directions and terminations, the formation and the finding of closed boundaries surrounding regions of substructure, that may be similar or different in the density or shape and orientation of the parts. Without such variations and without time to compare remembrances of them, nothing can be experienced.
Ce blog est statique : les pages sont crées à l’avance par un serveur Node qui tourne juste le temps de la génération, pas quand vous visitez le site. Lors de cette phase de compilation, les motifs de Truchet sont générées. Ceux de la section « Chez Bibi », eux, sont créés à la volée par votre navigateur. D’ailleurs ce ne sont pas des fichiers d’image mais des éléments <canvas>
.
Dans les deux cas, le cœur du code est le même : truchet_core.ts. C’est tout l’intérêt d’utiliser Javascript pour le front et le back. D’ailleurs, pour pouvoir dessiner des pixels sur un <canvas>
, il faut l’API Canvas. De base, Node ne sait pas ce que c’est : c’est une technologie de navigateur dont il n’a pas besoin. De même, il ne sait pas ce qu’est un élément <img>
ou un click de souris. Pas grave, Canvas a été ré-implémenté pour Node.
Zotero est un logiciel de gestion documentaire, plutôt pensé pour le monde académique mais qui peut s’adapter à pas mal de types de documents et d’usages.
J’essaye d’y enregistrer et classer des papiers et articles de blog sur des sujets qui m’intéressent.
Zotero a une interface en ligne et si un profil est public, tout le monde peut consulter les listes établies par ce profil. Mais comment faire si je veux intégrer à un post que j’écris une liste spécifique (par exemple une combinaison de catégories et de tags), en appui d’un propos quelconque ? Il y a quelques plugins, notamment pour Wordpress, mais je suis sous Eleventy.
C’est là qu’intervient l’API de Zotero et ce client en Javascript qui facilite le dialogue avec celle-ci.
J’ai écrit un script, à invoquer simplement dans le corps d’un post avec un « shortcode » (un raccourci qui exécute un script), de la sorte :
{% zotero "collection", "tag 1", "tag 2", "tag n" %}
… Et hop il me génère une liste d’articles avec le titre, l’URL source, le résumé et si disponible un PDF de l’article complet. Un exemple ici.
Potentiellement on pourrait remonter pas mal d’autres attributs, les formater comme dans une bibliographie universitaire… mais dieu merci je ne suis qu’un humble blogueur indépendant. :p
Si ça peut vous inspirer, le code est ici.
markdownTemplateEngine: njk
dans la config globale Eleventy.Une compilation d’articles, principalement académiques, sur le sujet du consentement dans le cadre du RGPD et du respect de la vie privée.
L’image de couverture est une vraie bande dessinée.
Panorama foutraque de ce que l’on appelle parfois la physicalisation de données : visualiser des données par un support physique non-numérique.
On n’a pas attendu l’informatique pour représenter des données. Les premières traces de l’écriture c’est un peu ça : un jeton pour une vache, un deuxième pour une seconde vache. Les systèmes graphiques plus aboutis étaient utilisées avec des buts similaires, puisqu’on retrouve beaucoup d’inscription parlant de taille de troupeaux, d’aire de parcelles ou de volumes de récoltes. Parfois en utilisant à plein la spatialité de la surface, comme en témoignent ces deux tablettes babyloniennes : un problème de géométrie et le plan d’un grand bâtiment.
Ces exemples sont impresionnants parce qu’anciens, mais vous allez dire qu’ils restent assez classiques. Voici un autre spécimen qu’on cite souvent : les cartes utilisées par les marins des îles Marshall, dans l’océan Pacifique. Les îles y sont représentées notamment par des coquillages (en blanc) et les trajectoires aidées par la houle par les tiges. Chaque carte était idiosyncrasique dans la manière dont il fallait l’interpréter et surtout utilisée par son créateur.
Citons aussi les cartes tactiles des Inuits, sculptées dans du bois. Celle de gauche est une carte côtière et celle de droite représente une succession d’îles. Elle étaient apparemment plus utilisées comme support de récit qu’aide à la navigation.
Il y a plein de manières compréhensibles et mémorables d’encoder des informations dans des objets. Voici une longue compilation de ces « visualisations physiques de données », avec aussi pas mal d’expérimentations récentes. Sans rentrer dans un débat théorique ou une quête de définition, l’idée est en gros de ne pas utiliser l’écriture, ou de manière plus secondaire et auxiliaire.
Si on saute aux XIX et XXe siècles, la création de modèles en relief est un cas d’utilisation relativement fréquent. En 1874, Maxwell illustra avec un modèle en plâtre les liens entre l’évolution de trois variable : volume, entropie et énergie.
Datant de 1913, cette carte montre le nombre de passagers transportés par le métro de Frankfort. La quantité était représenté par le nombre de lamelles de bois collées et empilées.
Datant des années 50, cette courbe montre l’évolution de la consommation d’électricité en Grande-Bretagne, suivant les heures de la journée, entre 1951 et 1954. Chaque jour est représenté par une feuille de carton et des poignées permettaient d’élargir le dispositif pour ajouter des feuilles.
Au début du XXe, le volume de données produites explose. Comment les récupérer, les manipuler et les visualiser facilement ?
Par exemple, comment présenter un enchainement de graphiques à un auditoire, quand on n’a même pas de rétroprojecteur ? C’est pas compliqué : créer une véritable bibliothèque de diapositives sous la forme de grands panneaux de bois imprimés et montés sur rail. J’en ai déjà parlé ici.
Autre exemple : ce système de fiches décrit dans un traité de 1914 (!) : Graphic methods for presenting facts. L’idée était d’utiliser plusieurs fiches représentant des graphiques et les mettre bout à bout horizontalement ou verticalement, pour comparer ou enchainer plusieurs années. Parler de « dashboard interactif », comme le fait l’article en lien, est sans doute exagéré, mais pour l’époque l’idée apportait sans doute un grand confort. Avoir des masses de données bien organisées, prêtes à l’emploi et lisibles facilite grandement l’analyse et la discussion, c’est un premier degré d’interactivité entre l’utilisateur et le système.
D’autant que le système était pensé de bout en bout. Il y avait des « méta-fiches » pour indexer le contenu et le retrouver facilement, la partie gauche était laissée vide si l’utilisateur voulait ajouter une annotation et chaque fiche avait un bleu (blueprint) pour la dupliquer et la partager facilement.
Finissons par un exercice sous contraintes intéressant : des « photoviz » qui utilisent des objets triviaux pour figurer des quantités et liés au thème de la donnée représentée. Garanti sans triche ni redimensionnement.
https://twitter.com/JulesGrandin/status/1163371189487722496
https://twitter.com/JulesGrandin/status/1164093612172427264
Pour recueillir une info personnelle auprès d’un particulier, il faut une raison. Vous pouvez le faire parce que vous avez son accord, parce que la loi vous y oblige, parce qu’elle est nécessaire pour lui fournir un service (pour lui livrer un produit vous avez besoin de son adresse)… Ces raisons sont au nombre de six, ce sont des bases légales, bien expliquées ici par la CNIL.
Il y a une base légale un peu particulière, c’est l’intérêt légitime.https://www.cnil.fr/fr/les-bases-legales)
En gros, si une entreprise a un objectif commercial dont elle peut justifier le caractère précis et licite, que pour accomplir cet objectif elle a besoin d’une information, que ce besoin est proportionné et nécessaire (c’est-à-dire qu’elle ne peut pas faire autrement), alors elle peut recueillir cette information sans demander le consentement de l’utilisateur.
Détails ici, encore chez la CNIL
C’est un raisonnement utilisé dans les politiques de confidentialité d’un nombre important et, dirait-on, croissant de sites web. Je ne sais pas si les juristes attendaient d’y voir plus plus clair, mais j’ai l’impression que c’était un recours beaucoup moins fréquent juste après la mise en place du RGPD.
Par exemple chez Nestle Belgique, c’est une base légale invoquée dans chacune des lignes du tableau. La dernière colonne apporte quelques détails : « gagner en efficacité », déterminer les types de consommateurs pour les nouveaux produits et services", etc. Ce sont des choses banales et je ne vois pas ce qui justifie une base légale exceptionnelle.
Première complication : il faut croiser cette base légale avec le principe d’opposition : le visiteur peut quand même s’opposer à cette récolte. Certains sites incluent même une case à cocher pour ça, sélectionnée par défaut. C’est tordu : l’intérêt légitime devient dans une espèce de consentement dédoublé, mais en opt-out et plus ou moins planqué. Dans les deux exemples ci-dessous, il est demandé pour chaque info si on consent au recueil ET si on s’y oppose. Bref, deux fois la même question, sous un angle techniquement différent.
C’est une conception totalement scolaire du droit où on imbrique chaque pièce sans souci de la logique d’ensemble, pour aboutir à une usine à gaz. On pourrait presque croire que c’est une forme de grève du zèle pour rendre ce genre de popin encore plus imbuvable.
Ces techniques peuvent passer du byzantin au total dark pattern . Par exemple chez Bloomberg vous avez deux choix si vous voulez refuser certains partages de données :
Vue 2: Cliquer sur le bouton « manage cookies », arriver sur une liste et tout refuser.
Vue 1 : Cliquer sur le minuscule lien « right to object » dans le dernier paragraphe et arriver sur une liste d’infos quasi-identiques, cette fois cochées par défaut.
Donc on peut tout refuser, au titre du consentement, sans savoir si ça décoche les cases pour l’intérêt légitime, planquées derrière le lien. On suppose que non. D’ailleurs, la vue 1 a un bouton retour mais pas la vue 2 : si on a refusé certaines choses on ne peut pas aller voir la vue 1 pour voir si son choix a été respecté.
On ne contourne pas le RGPD si facilement. Tout bêtement :
Les bases légales ne peuvent être cumulées pour une même finalité. Un même traitement de données peut poursuivre plusieurs finalités, c’est-à-dire plusieurs objectifs, et une base légale devra alors être définie pour chacune d’elles.
source
Une même donnée peut servir à plusieurs objectifs, mais chaque objectif doit être justifié légalement de manière distincte et spécifique. Donc tous les exemples de finasserie montrés sont de toute façon illicites. Notez que la confusion entretenue entre consentement et intérêt légitime fut un des motifs retenus par le conseil d’état pour coller 50M€ d’amende à Google.
Ce blog existe depuis fiou, 2012. Les sources sont même sur Github. Documentation et réflexions à venir.
Lors de deux moments importants pour l’histoire de l’informatique, on trouve une personne assise à une machine et utilisant autant ses pieds que ses mains.
Première date de publication : Avril 2018
D’abord, le métier Jacquard nécessitait l’emploi d’une pédale, comme d’autres métiers à tisser avant lui. Cette invention inspirera le proto-ordinateur de Babbage et Lovelace. Ensuite, Engelbart est connu pour être le premier, dès 1968, à proposer un système cohérent comprenant interface graphique, souris et collaboration à distance. Ce qui est moins connu, c’est que pour lui le succès de la souris fut presque accidentel. Lui croyait plus dans le potentiel du clavier à accords et avant ça avait expérimenté avec des dispositifs où la position du pointeur était transmise par un casque, ou encore par la position… du pied et du genou !
Ensuite, le pied se retrouve un peu partout. Si vous ne me croyez pas, je vous conseille la lecture de cette somme sur le sujet (trente pages, une véritable somme podologique !). Il identifie notamment une gamme de gestes, utilisés principalement dans des expériences artistiques ou académiques. De manière plus populaire, on retrouve les tapis des jeux de danse, les pédaliers des jeux de course, mais aussi différents plateaux d’équilibre, initiés dès 1982 par le Joyboard d’Amiga (en photo plus haut).
Quoi d’autre ? On peut parler de l’industrie, où les risques d’activation intempestive (analysés ici) exigent des pédales avec des clapets et autres garde-fous.
Les utilisateurs avec des problèmes de posture ou de motricité peuvent utiliser toute sorte de « souris à pied », comme cette fascinante Souris-Sandale.
La première machine à écrire à être largement utilisée comprenait une pédale pour la touche Entrée. Toujours dans l’édition de texte, la VIM Clutch constitue un exemple intéressant de convergence entre matériel et logiciel. L’éditeur de texte VIM fonctionne par modes : un mode normal, un pour l’insertion, un pour la sélection de texte, etc. Ça parait bizarre mais c’est beaucoup plus sensé que ça n’en a l’air. Un maitre-nerd a donc bricolé une pédale qui permet, tant qu’on la maintient, de rester dans le mode le plus courant. Ça rappelle un peu les pédaliers de piano et c’est assez logique d’avoir une touche dédiée et accessible à part pour une action aussi fondamentale.
Citons aussi les chaussures intelligentes, avec uniquement des senseurs, ou carrément avec des actuateurs modifiant le niveau d’amorti.
Le meilleur pour la fin : par deux fois, des petits malins ont essayé de tricher au casino en portant un ordinateur qui communiquait des informations à un complice (source 1, source 2). Comment le tricheur faisait-il pour saisir ces informations ? En tapant du pied. Un bel exemple d’habitronique, dès 1960 et à nos pieds.
« Habitronique », parfaitement.
Incorporer un calculateur à une chaussure peut aussi être glorieusement vain. Admirez cette paire de sneakers ornée d’une carte graphique. Pourquoi une carte à 700 boules sur une chaussures ? Est-ce qu’elle a une vraie fonction ? Mystère. Les coopérations entre constructeurs informatiques et marques de mode, c’est toujours quelque chose.
Sinon, via ce tweet de Maxime Quijoux, je découvre que la retranscription de paroles enregistrées, activité chronophage s’il en est, est parfois musclée par le recours à un pédalier spécifique. J’ai d’abord cru que c’était un accessoire de guitariste (Olympus est une marque qui fait dans la musique) mais non, c’est bien un outil dédié.
Voici un exemple d’une autre marque :
Que ce soit pour la retranscription ou pour un autre but, écouter attentivement et de manière répétée de longues paroles est une activité assez étrange, tour à tour hypnotique et agressive, surtout avec un appareil très tactile comme un pédalier ou une roulette de montage accentue certainement l’effet. On est enveloppé et immergé dans la voix des locuteurs, alors qu’on la contrôle et l’interrompe sans cesse, au point de la disloquer et de lui faire perdre son flot.
Via cette fascinante émission, je découvre aussi le pédalie des stations de chirurgie assistée par ordinateur.
Soyez patient pour le premier chargement, car l’hébergeur (Heroku version gratuite) éteint le serveur après 30 min d’inactivité.
Une mosaïque des livres, jeux, films… que je « pratique », filtrables par année et catégorie. Un variateur permet de changer la taille des vignettes, pour avoir une vue panoramique ou au contraire très détaillée.
Dématérialisation oblige, ma bibliothèque ou ce qui traine sur ma table basse (d’où le nom du bidule) ne sont plus guère représentatifs de mes pratiques culturelles. Je cherchais un joli palliatif.
Les données viennent de mon profil Sens Critique et sont mises à jour nuitamment. Malgré tous ses défauts, je ne connais pas d’autre site permettant de consigner des œuvres de médias variés et potentiellement françaises.
Et soyons francs, c’était l’occasion de bidouiller. Quelques remarques :
J’ai essayé d’avoir une grille avec le minimum de valeurs prédéfinies. Les gouttières, la taille des images et le nombre de colonnes dépendent de la taille de la fenêtre et de la valeur du zoom. C’est sans doute overkill et donne un CSS plein de valeurs magiques, m’enfin.
Détails :
object:cover-fit
, sauf pour celles en paysage où on ajoute un effet de « letterbox » floutée. (J’ai d’ailleurs découvert que pas mal de jeux vidéo indés récents reviennent récemment au format paysage)transform-origin
de celles positionnées en bordure de fenêtre.En tant qu’autodidacte habitué aux langages dynamiques et interprétés,iu j’ai trouvé ça génial. On résume Typescript à un surcroit de lourdeur très acceptable vu le gain de sûreté, pourtant j’ai trouvé son usage souvent plus fluide que Javascript, pas moins.
Un langage de programmation permet un dialogue avec la machine, c’est… un langage. La boucle d’interaction peut être très courte (comme avec une ligne de commande) ou très longue (insérer des cartes perforées et attendre la nuit pour voir le résultat). Avec Typescript, l’ordinateur est plus bavard, me parle en direct et m’a beaucoup facilité la prise en main de grosses bibliothèques.
Les joies du scraping : il y a une info importante que, dans un contexte, on ne peut pas récupérer sur Sens Critique sans authentification. Du coup j’utilise Puppeteer, qui lance et contrôle automatiquement un navigateur entier. Bonjour, artillerie lourde et sur-ingénierie. En prod cette dépendance prend à elle les 2/3 du stockage.
C’est fascinant de lancer Puppeteer en mode graphique et de l’observer ouvrir une fenêtre, scroller et cliquer tout seul.
Un content delivery newtork, ai-je appris, n’est pas juste un serveur dédié et optimisé pour les images et vidéos. Les CDN modernes fournissent plein de services liés, parfois accessible simplement en ajoutant un paramètre à l’URL : génération à la demande de variantes d’une image (dimensions, format de fichier…), analyse intelligente (OCR, crop en se concentrant sur le contenu « intéressant », détection des visages…), et cetera.
Je vous passe plein de péripéties et de nouveautés (Heroku, Postgres…). J’ai fait des mauvais choix techniques, pas anticipé plein de trucs, dû changé d’orientation… Bref un vrai projet. (ノ°Д°)ノ︵ ┻━┻
Pour paraphraser Musset :
J’ai souffert souvent, je me suis trompé quelquefois, mais j’ai codé.
J’ai fait un minuteur, il est joli, il est cool.
Quoi qu’est-ce que c’est ?
C’est un minuteur. il décompte le temps. Enfin, pas tout le temps. Il compte le temps pendant un certain temps, que justement vous définissez, c’est le but. Il ne décompte pas le temps jusqu’à la fin des temps. Enfin, vous pouvez essayer de le régler à une valeur très très haute et attendre très très longtemps jusqu’à la mort thermique de l’univers, mais vous risquez d’attendre pour rien, ou de vous tromper dans votre estimation et de rater la fin à deux minutes près. Ce serait ballot.
Mais il est parfait pour minuter du collage de post-it.
Pourquoi ?
Détails techniques
App en Vue.js, avec vue-cli et le module cli-plugin-pwa qui se charge d’une bonne partie de la transformation en PWA.
Si vous voulez rire, le code est ici.
PWA : progressive web application. Un ensemble de technologies permettant d’enrichir une page web de fonctions réservées traditionnellement à des applications natives et locales. Notifications, fonctions hors-ligne, accès aux périphériques, etc,
Larry Tesler, décédé récemment, est associé à l’invention du copier-coller. De même qu’Engelbart a inventé bien plus que la souris, son influence est vaste : les premières interfaces graphique chez Xerox Parc et Apple, SmallTalk, le PDA Newton… Vice a fait un bon portrait de son parcours.
Comme avec Engelbart, ce qui est intéressant au-delà du catalogue de ses accomplissements, c’est de comprendre la vision qui les a motivé. En plus et comme souvent, Tesler est moins un inventeur solitaire que le synthétiseur d’une effervescence collective. Dans l’article je m’efforce de citer ses inspirations.
Mais commençons pas du concret.
Les actions de couper, copier et coller font partie de ces idées omniprésentes qui ont pourtant été créées un jour. Les barres de défilement, l’auto-complétion… j’ai continué ici une liste d’inventions commencée par Dan Saffer.
Tesler a inventé en fait plusieurs choses.
A l’époque, la crurseur était placé sous le caractère (ou derrière, en couleur inversée), ce qui introduisait de l’ambiguïté : si j’insère une lettre, va-t-elle être placée avant ou après le caractère sélectionné ?
NLS, le système d’Engelbart était plus avancé et utilisait une souris comme pointeur, mais n’avait pas de curseur permanent. La souris servait littéralement de pointeur, pour indiquer par exemple le début et à la fin d’une sélection de texte.
Larry Tesler (avec Peter Deutsch) inventa alors le curseur placé entre les caractères que l’on connait aujourd’hui.
Se débarrasser des modes était le grand combat de Tesler. Qu’est-ce qu’un mode ? C’est un état global du système que l’utilisateur enclenche et qui permet ou interdit d’autres actions. Par exemple appuyer sur la touche VERR MAJ permet de taper des lettres capitales mais interdit les minuscules. Appuyer sur MAJ serait un quasi-mode (selon la terminologie de Jef Raskin) qui oblige à maintenir la touche pour rester actif.
Les éditeurs de texte étaient massivement modaux, c’est-à-dire qu’il y avait un mode pour naviguer, un pour insérer, un pour supprimer… La présence de modes complexifie les interactions (dans quel mode suis-je ? Comment en sortir ?) mais élargit la palette d’actions. Par exemple en mode Naviguer, chaque touche du clavier peut être un raccourci, ce qui permet des actions fines du genre « avancer de trois paragraphes ». L’éditeur Vim, encore populaire aujourd’hui, fonctionne essentiellement ainsi.
C’est aussi l’héritage d’une époque où les éditeurs de texte étaient conçus pour un télétype (c’est-à-dire concrètement une imprimante), pas pour un écran. On désignait une ligne, on faisait une modification et on imprimait le résultat en croisant les doigts pour ne avoir fait d’erreur. Dans un contexte aussi peu interactif, des modes étaient nécessaires.
Même NLS, le système d’Engelbart avec clavier et souris n’était pas plus simple. Voici la procédure pour déplacer du texte :
Inspiré par Pentti Kanerva, Tesler abolit ces modes en inversant le modèle d’interaction : au lieu de désigner d’abord l’action (effacer) puis son objet (tel groupe de mot), on sélectionnait du texte puis on agissait dessus. Le clavier ne servait plus qu’à une chose, taper du texte. Les commandes ont d’abord été attribuées à des touches spéciales puis au menu déroulant « éditer », inventé juste après.
La complexité a été ainsi déplacée des modes au presse-papier : celui-ci stocke de l’information sans l’afficher à l’utilisateur, ce qui occasionne parfois des surprises. Mais globalement, copier et coller étant souvent concomitants, on a beaucoup gagné au change.
La dernière pièce du puzzle a été de rassembler le déplacement et la duplication. Suivant l’action précédente, coller peut couper ou bien copier. Cela n’allait pas de soit : encore aujourd’hui Mac OS permet de copier un fichier mais pas de le couper, car le déplacement est vu comme une action bien distincte. On a finalement trois actions réunies par une même métaphore, celle du papier.
Quelle approche a suivi Tesler pour faire tout ça ?
Malgré ses fortes convictions (qui allaient jusqu’à avoir une plaque d’immatriculation anti-modale), Tesler n’a jamais succombé à l’illusion de connaitre les utilisateurs et a donc très tôt mené des tests.
My observations of secretaries learning to use the text editors of that era soon convinced me that my beloved computers were, in fact, unfriendly monsters, and that their sharpest fangs were the ever-present modes. The most common question asked by new users, at least as often as « How do I do this?, » was « How do I get out of this mode? »
Before doing it he decided that he wanted to observe a user, and used a technique similar to his“guided fantasy.” He describes working with a secretary who had just started at PARC and was not yet influenced by the programs that were being used:I sat her down in front of a screen, and did what’s now called a“blank screen experiment.”
“Imagine that there is a page on the screen, and all you’ve got is this device that you can use to move a cursor around, and you can type,” I said. “You’ve got to make some changes to this document. How would you do it?”I gave her a paper document with lots of markups on it for reference, and asked her to imagine that is was on the screen. She just designed it right there!“I would point there, and then I would hit a delete key,” she said.To insert, she would point first and then start typing. She’d never been contaminated by any computer programs before, so I wrote all this down, and I thought, “That sounds like a pretty good way to do it!”
p. 62, Bill Moggridge, Designing interactions. MIT press, 2007. Tout le chapitre est disponible ici
Ce qui m’impressionne, c’est sa capacité très tôt dans sa carrière à argumenter et théoriser ses choix. Dès 1981, son disours contre les modes est solide et construit. En 2010 il réalise ce schéma pour montrer qu’il faut moins d’étapes pour corriger une erreur avec une interface amodale. Voir ces enjeux nécessitait de s’abstraire du fonctionnel et de modéliser des interactions. Cela va plus loin que compter le nombre de clics et relève de la sémantique : les opérations de l’utilisateur sont composées de verbes et de noms, l’ordre nom-verbe est-il supérieur à l’ordre inverse, pourtant plus proche de l’anglais ? Les tests lui ont montré que oui.
A Personal History of Modeless Text Editing
L’opposition de Tesler à Engelbart fut parfois frontale et révèle une différence fondamentale dans leurs visions. Pour schématiser, le premier visait le grand public et le second des experts.
Engelbart développait un système ambitieux et complet pour inventer de nouvelles manières de travailler collaborativement et même de raisonner. Plusieurs ordinateurs étaient connectés entre eux et équipés d’un clavier, d’une souris à trois boutons et d’un clavier-accord. Ce dernier, à gauche sur la photo, résume bien la complexité de l’ensemble, puisque chaque combinaison de touches exécutait une action différente.
Douglas Engelbart démontrant son système
Il se préoccupait plus d’utilité que d’utilisabilité. Mettre des mois à apprendre à maitriser le système n’était pas vraiment un problème si ça valait le coup. A la fin l’utilisateur pouvait manipuler de grandes quantités d’informations, raisonner sur des problèmes complexes ou résoudre des défis scientifiques. Engelbart avait cette vision de l’ordinateur comme nouveau medium cognitif capable « d’accroitre notre intellect ».
Le problème est qu’il voulait créer un instrument merveilleux comme le violon alors que pas grand monde ne prendra le temps d’apprendre à jouer du violon, pour reprendre une formule d’Alan Kay cité par Bardini, p. 215)
Tesler, à l’inverse, voulait créer des logiciels simples à comprendre par le plus grand nombre :
[Avec un collègue] ils rédigèrent une note interne à Xerox décrivant ce qu’ils appelèrent IT, pour « Intuitive Typewriter » [machine à écrire intuitive]. Ils décidèrent que la facilité d’utilisation était importante, en réalisant que ce serait un « désaccord majeur avec Engelbart ».
p. 157, Bardini, Thierry (2000). Bootstrapping: Douglas Engelbart, Coevolution, and the Origins of Personal Computing. Stanford University Press.
Pour Engelbart, un nouveau medium appelait de nouvelles conventions, tant pis si cela rompait avec les habitudes. Pour Tesler c’était l’inverse :
Il fallait adapter l’interface à la manière dont les gens travaillent et pas utiliser l’interface pour les forcer à apprendre à travailler mieux et différemment.
Idem
Dès le début des années 70 est donc née cette opposition entre deux philosophies. Elle reste prégnante dans la conception de logiciels : élitisme ou démocratisation, puissance ou facilité, respect des habitudes ou nouveauté. Présentée ainsi, l’opposition tend à la caricature et il y a sans doute de la place pour tous les types de logiciel. D’aucuns ont cependant argué qu’une vision a écrasé l’autre et a tué dans l’œuf tout un champ d’outils exigeants et avancés.
Quoiqu’il en soit, voici quelques personnes qui chacun à leur manière tentent de combler ce fossé et de faire avancer le medium.
Computer History Museum, Oral History of Lawrence G. “Larry” Tesler
Une démonstration par Tesler de son éditeur de texte phare
J’évoque dans cet article les éditeurs de texte des années 70. Il s’avère que l’un d’entre eux fut longtemps l’éditeur par défaut d’Unix et fut durement critiqué dans un article de Don Norman : The truth about Unix: The user interface is horrid (PDF).
L’article date de 1981 et fut apparemment très populaire. C’est le premier d’un longue série de textes qu’il consacre à l’informatique.
Le Chant du loup suit l’épopée de l’équipage d’un sous-marin et de son “oreille d’or”, un analyste acoustique. Ce film est une mine d’or sur l’esprit humain et ses interactions avec la machine. Voici pêle-mêle ce que j’ai trouvé intéressant.
On y trouve beaucoup d’exemples des approches appelées facteur humain, c’est-à-dire en gros de la manière dont humains, technique et organisations sont intriqués dans des gros machins impénétrables appelés systèmes socio-techniques complexes.
C’est aussi une parfaite illustration de la cognition incarnée[1], une nébuleuse de programmes de recherche qui postule, pour schématiser :
Le Chant du loup m’a fait notamment penser aux travaux d’Edwin Hutchins. Ce chercheur a passé du temps sur des ponts de frégates et dans des cockpits d’avion pour étudier leur organisation. Son livre Cognition in the wild s’ouvre sur une longue description d’un navire ayant échappé de justesse à une grave collision.
Il explique que l’intelligence doit être vue comme un phénomène intrinsèquement collectif, surtout dans ces cas d’équipages travaillant dans un environnement codifié et soudés autour d’un objectif commun. Les informations circulent à toute vitesse, chacun a un rôle précis pour analyser une information ou effectuer une action, si bien que l’équipe fonctionne presque comme une seule entité. Ou disons au moins qu’il y a un continuum entre individu et collectif.
Dans un environnement aussi avancé et précaire qu’un sous-marin, l’usage de l’écrit peut étonner, alors qu’il est partout.
Il y a d’abord la table de navigation, utilisée avec feutre effaçable, rapporteur et compas. Le navigateur y calcule des modifications de trajectoire pour les proposer au commandant, qui peut voir le résultat directement. Quelques exemples, tirés du Chant du loup et d’autres films.
Ce genre de réflexion effectuée directement sur papier a été qualifiée « d’action épistémique » (PDF) par Kirsch et Maglio, qui ont étudié le comportement de joueurs face à Tetris. Ces actions n’ont pas d’autre but que d’aider à la résolution de problème, par exemple pour vérifier si une pièce va s’adapter aux autres il est plus simple de la pivote à l’écran que dans sa tête.
Des zoids tout à fait mignons dessinés à la main en 1994
Admirez aussi le tableau lumineux, les feuillets suspendus et le rouleau de scotch pré-dévidé.
Cet usage du papier est aussi documenté dans les cockpits d’avion, voir ce papier (PDF) écrit par Nomura, Hutchins (encore lui) et Holder.
Dans À la poursuite d’Octobre rouge, on voit ce qui ressemble fort à un rouleau de papier-toilette à droite de l’écran. Pourquoi ?
Réponse : un analyste utilise un sonar passif, c’est-à-dire pas un sonar classique qui émet des sons pour détecter leur réverbération sur l’environnement. Il écoute, tout simplement. Et il regarde : le spectre sonore ci-dessous représente le temps en ordonnées et la direction en abscisses (parfois il s’agit de la fréquence). A l’époque, pour suivre une trace sonore il devait le faire à la main. Ou plutôt au feutre. D’où le rouleau qui permettait d’essuyer ces marques. Ma source.
La tâche principale d’une oreille d’or : moins écouter que classer. Comparer à une base de données de signaux connus. Ce bruit est-il biologique ? Marin, sous-marin ? Ami, ennemi ? Si le bruit ne rentre pas dans une case, il est bien embêté. Dans le film : c’est trop silencieux pour venir d’un bateau mais en même temps aucun sous-marin en activité n’a d’hélices à quatre pales. Il faut forcément une réponse, tu as littéralement cinq personnes sur le dos qui doivent décider d’une trajectoire.
L’oreille d’or a le trackball dans une main, le casque sur une seule oreille pendant les phases de veille et sur les deux pendant les phases d’analyse intense. Une seule oreille car il doit rester attentif à ce qu’il se passe sur le pont. Parole de spécialiste :
Pour la veille, on n’utilise effectivement qu’une seule oreille. En effet, un veilleur sonar ne doit pas être devant son écran pour uniquement tourner la boule de son curseur audio: il doit savoir ce qui se passe dans le CO, pourquoi on change de route par rapport à une force, savoir ce qu’on cherche en priorité, le secteur de la menace. Il n’y a pas vraiment d’oreille préférée: le veilleur sonar de coque écoutera plutôt avec l’oreille gauche, car la table traçante (là où sont prises les décisions par le pacha ou le chef de quart) est à sa droite, alors que le veilleur ALR, qui est de l’autre côté, laissera plutôt son oreille gauche libre. Après, par exemple pendant un transit, c’est à dire lorsqu’il n’y a pas vraiment d’activités, on choisit l’oreille suivant le confort. Ensuite, on mettra les deux écouteurs quand on veut se concentrer sur un contact qui nous pose par exemple des soucis de classif ou de comptage.
Voici quelques interfaces montrées dans le film (probablement non-contractuelles). Mais c’est la partie émergée de l’iceberg. D’une certaine manière dans un sous-marin tout est interface entre l’être humain et des fonctions critiques. Tout est pensé pour aider les sous-mariniers à écouter et exécuter des ordres, à marcher, se tenir, ou respirer. Par exemple quand l’atmosphère est compromise, ils peuvent se brancher à intervalle régulier à des arrivées d’air.
Dans cet écosystème entièrement artificiel, tout a été conçu. L’équipage aussi : comment s’organiser, qui doit faire quoi à quel moment, le language codifié, tout a été réfléchi. Plutôt que l’histoire d’un humain réduit à un rouage dans la machine, le film nous montre un monde où l’opposition entre humain et système n’a pas de sens.
Un jeu vidéo de cartographie sous-marine
Le canal Youtube d’un spécialiste, avec cette playlist sur d’analyse accoustique
5
Un reportage de Libération : Vingt-quatre heures dans un sous-marin
Photo : Olivier Monge pour Libération, à bord du sous marin nucléaire Casabianca à quai à Toulon. Toulon, le 9 aout 2018
J’utilise le terme le plus large mais comme le montre la section « Voir aussi » de Wikipedia, il y a d’autres approches, globalement convergentes : cognition étendue, située, distribuée, énactivisme, phénoménologie, externalisme, psychologie écologique, etc. ↩︎
Beaucoup de plugins Sketch pour l’import de contenu (Craft, Data Populator…) sont pensés pour des sources de données non modifiables (banque d’images, noms de pays…), ou pour des données complexes à synchroniser avec des maquettes graphiques abouties. Suivant les plugins, ça implique de renommer des calques, d’avoir un fichier de données en TXT voire en JSON… bref des procédures un peu lourdes.
Mon cas d’usage est beaucoup plus simple : le plus souvent, je veux rapidement copier-coller une liste de textes depuis un tableau ou un mail, les coller dans une suite de calques. Et c’est tout.
Qu’à cela ne tienne, j’ai créé un plugin pour Sketch.
Comment l’utiliser ?
Copiez une liste de texte, sélectionnez des calques ou des symboles, utilisez le menu « data » de Sketch et paf, chaque ligne de texte est collée dans un élément. Si le symbole comporte plusieurs surcharges (overrides), le plugin utilisera la première.
Même pour des cas plus complexes (par exemple peupler un tableau), je trouve plus simple de répéter cette méthode autant de fois qu’il y a de colonnes que, mettons, de s’embêter avec du JSON.
Comme d’habitude, rapports de bug et retours sont les bienvenus.
Sur la psychologie des joueurs et les travaux de Nick Yee et Quantic Foundry.
Lien vers un résumé de ces travaux
Une vidéo d’une présentation à la GDC 2019
Le modèle de Bartle est une typologie des joueurs très populaires. Datant de 1996 et tiré de données sur des participants à des MMORPG, il est très limité et se retrouve remplacé par des théories plus fines.
Ses problèmes sont multiples :
Il est binaire : on est soit social soit un explorateur, on ne peut pas être les deux ou entre les deux. On a le même problème quand on prend l’échelle qui va de l’introversion à l’extraversion pour des catégories hermétiques. Comme dit Yee, « on invente des mots comme ambivertis pour décrire des personnes entre ces deux extrêmes, alors que signifie simplement être dans la moyenne ».
Il est fondé sur seulement deux axes : joueur–monde et agir–interagir.
Il crée des points aveugles en mettant sur le même axe des traits qui ne sont pas forcément des opposés. Cela empêche d’imaginer certains types de joueurs. Par exemple, quel est le contraire d’une personne sociable ? Elle pourrait avoir des traits spécifiques n’ayant rien à voir avec ceux d’un explorateur.
Plus généralement, ces typologies sont souvent normatives et contribuent à renforcer l’opposition stéréotypée et dédaigneuse entre joueurs hardcore et casual. Avoir un faible score en extraversion signifie qu’on est intraverti, pas qu’on est sans personnalité.
De même, être tout en bas de l’échelle de la stratégie ne signifie pas qu’on n’a pas de préférence en matière de prise de décision, mais des préférences différentes, par exemple préférer les décisions rapides en réaction à l’environnement immédiat. Un score faible n’est pas une absence de motivation mais une motivation différente et spécifique.
Nick Yee et son cabinet d’analyse proposent un modèle alternatif tiré d’enquêtes massives. A partir de 400 000 d’entretiens, il fait émerger douze d’attributs.
Les douze motivations :
Il s’agit de clusters statistiques qu’on peut plus ou moins agréger suivant la finesse souhaitée. Ils peuvent être couplés : compétition et communauté sont rattachés à un critère « social ». On peut même plus aller loin et identifier trois tendances : action-sociabilité, maitrise-réussite, immersion-créativité. Mais ce sont des familles d’affinités très larges, rien de plus.
Des noms de jeux vidéo sont cités mais il s’agit uniquement d’exemples. Les attributs décrivent les joueurs, pas les jeux. On peut s’approprier une œuvre de plein de façons, par exemple en pratiquant un jeu de stratégie de manière bourrine.
Un score élevé signifie une préférence pour jongler entre planification à long terme et micro-décisions, un goût pour analyse des informations complexes. Un score, on l’a dit, suggère des boucles de gameplay plus courtes et aimer réagir à l’environnement.
Design désigne ici « seulement » la capacité à personnaliser l’apparence du jeu (avatar, maisons, etc.).
En dessous de 30ans, les joueurs masculins sont plus communautaires. Trait de personnalité intrinsèquement masculin ou culture gamer toxique qui exclut les femmes et fait donc baisser ce score chez elles ?
L’opposé d’un joueur compétitif n’est pas quelqu’un qui aime jouer tout seul mais plutôt qui aime jouer collaborativement ou dans l’émulation.
Attention aux oppositions trompeuses entre jeunes et vieux : certaines courbes ne sont pas monotones, si bien qu’un joueur de 60 peut être plus proche d’un joueur de 15 que de 40 ans.
Motivation différente de l’envie de complétion. Impression de progrès continu, sans besoin de but final.
Pas une opposition entre construction et destruction mais plutôt entre serein et chaotique.
Meilleur prédicteur de l’achat d’appareils de réalité virtuelle : pas l’imagination mais l’excitation et la destruction. Mais l’imaginaire est un bon prédicteur de la satisfaction après achat.
Cela évoque les aspects temporels de l’UX, aussi analysés dans cette conférence sur la nostalgie et l’engagement à long terme chez les joueurs
Pas juste exploration géographique mais découverte des limites du jeu (des règles, du monde)
Ce graphique montre à la fois la variabilité entre cultures et l’importance d’avoir une baseline : comparé à la Chine, les USA paraissent dans la moyenne en tout.
Les motivations présentées ici ont été dégagées spécialement pour le domaine des jeux, pourtant elles ont un coté générique et pourraient presque s’appliquer à n’importe quelle activité sociale encadrée par des règles. En 1971, Roger Caillois proposait un modèle différent, sans doute moins rigoureux scientifiquement, mais avec des intuitions qui capturent bien l’expérience du jeu (pas forcément vidéo). Il s’agissait de quatre motivations classées en couples d’opposés :
Le plaisir spécifique lié au hasard, aux sensations fortes, aux illusions… tout cela se retrouve de manière cumulée dans le jeu vidéo. On peut lister des dizaines d’attributs psychologiques, mais cela capture vraiment-il l’expérience du joueur, ce que ça fait de jouer ? C’est ce que tente de faire Mathieu Triclot en appelant à la création de play studies :
« À côté des game studies qui s’occupent des paramètres formels des systèmes de jeu, dans une sorte de double en miroir de l’activité professionnelle de game design, il nous faut inventer des play studies, tournées vers la fabrique des expériences, les positions de sujets avec lesquelles jouent les jeux. »
Philosophie des jeux vidéo, disponible intégralement ici ou à La Découverte
Les motivations de Quantic Foundry font penser aux cartes UX développées par Carine Lallemand, Vincent Koenig et Guillaume Gronier. Elles sont tirées d’un cadre théorique différent (théorie des besoins, théorie de l’auto-détermination…). La liste est ici :
Relatedness
Compétence
Autonomie
Sécurité
Plaisir
Sens
Popularité