L’article The age of snarky UI explore l’usage de messages condescendants ou ironiques dans les interfaces utilisateur, illustré par des exemples concrets comme les alertes d’un véhicule électrique ou les notifications d’applications. L’auteure critique ces pratiques, qui, bien qu’elles visent à humaniser l’expérience, peuvent nuire à la clarté et agacer l’utilisateur en obscurcissant les instructions ou en sous-entendant un jugement.
Elle aborde des cas emblématiques comme le confirmshaming (messages culpabilisants pour inciter à l’action) ou les rappels de suivi perçus comme des reproches, soulignant leur effet contre-productif. L’article souligne que ce ton, souvent adopté pour se démarquer, risque de frustrer l’utilisateur plutôt que de l’engager, surtout lorsque la compréhension de l’interface ou la résolution d’un problème devient moins intuitive.
Le principe d’animation squash and stretch (écrasement et étirement), issu des 12 principes de base de Disney, consiste à déformer un objet en mouvement pour lui donner une apparence plus dynamique et réaliste. L’auteur illustre ce concept avec une balle qui s’aplatit à l’impact et s’allonge lors du rebond, tout en soulignant l’importance de modérer l’effet pour éviter un rendu exagéré.
L’application concrète sur le web concerne souvent des icônes SVG, comme des flèches qui s’étirent et s’amincissent au survol. Cette technique, subtile mais efficace, améliore l’interactivité perçue. L’article propose un tutoriel pour implémenter ce effet, en partant d’un code SVG simple et en utilisant des bibliothèques JavaScript pour faciliter l’animation.
Améliorer l'expérience utilisateur (UX) dans les vieux systèmes (legacy), souvent lents et obsolètes, représente un défi majeur pour les organisations. Ces systèmes, bien que critiques pour les opérations quotidiennes, sont coûteux à maintenir et peu documentés, avec des processus fragmentés et des choix de design incohérents. Leur coexistence avec des produits modernes crée des interfaces hybrides, où des éléments performants côtoient des fonctionnalités lentes et peu intuitives, impactant globalement l'UX.
L'article souligne que même une petite faille dans un flux utilisateur complexe peut discréditer l'ensemble d'une application, malgré les efforts déployés ailleurs. Les systèmes hérités, souvent personnalisés et sans tests d'utilisabilité rigoureux, absorbent une part importante des ressources (40 à 60 % du temps en maintenance). Leur modernisation nécessite une approche progressive, en s'appuyant sur les connaissances existantes pour éviter de reproduire les erreurs du passé.
Le guide propose une approche pratique des principes de design en les présentant comme des repères concrets pour améliorer la prise de décision et la cohérence des interfaces, plutôt que comme des règles abstraites, avec des références rapides, exemples et méthodes applicables au quotidien. Il insiste notamment sur leur rôle de langage commun au sein des équipes et sur leur utilité pour résoudre des problèmes récurrents de conception, en facilitant l’accès à des bonnes pratiques éprouvées et directement exploitables dans les projets UX/UI
Ce billet de blog explique le concept d'Impedance Mismatch, un problème courant dans les systèmes informatiques où la modélisation legacy entrave l'expérience omnicanale et les API. L'auteur illustre ce problème à travers l'exemple de Martin, un utilisateur bloqué dans une application mobile car un champ obligatoire (l'année de construction) manque. Le système legacy refuse d'enregistrer le contrat sans cette information, créant une rupture dans le parcours utilisateur. La solution proposée est architecturale : la réification du processus, qui consiste à adapter le modèle de données aux besoins spécifiques de chaque contexte d'utilisation, plutôt que d'exposer un modèle canonique universel. L'article souligne l'importance de prendre en compte l'usage et le contexte dans la modélisation moderne, comme le préconise le Domain-Driven Design (DDD), pour éviter les couplages forts et la complexité inutile.
Carrie Webster explore l'impact de l'IA sur le workflow des designers UX. Bien que l'IA puisse générer rapidement des wireframes, prototypes et même des design systems, l'auteure souligne que le rôle du designer UX va au-delà de la création d'interfaces. Elle met en avant la capacité des designers à naviguer dans l'ambiguïté, à défendre les intérêts humains dans des systèmes optimisés pour l'efficacité, et à résoudre des problèmes humains par une conception réfléchie. L'IA ne remplace pas ces compétences, mais les amplifie, permettant aux designers de passer de la création d'outputs à la direction d'intentions, un changement qui, selon elle, est excitant et enrichissant pour le domaine du UX.
L’article explique comment ajouter une fonctionnalité de zoom de texte dans gVim, qui n’en dispose pas nativement, en définissant la police guifont et en créant dans le fichier .gvimrc une variable g:font_size et des fonctions VimScript ZoomFont(amount) et ResetFont() pour modifier cette taille, puis en les associant à des touches (F7 pour augmenter, F8 pour diminuer et F10 pour réinitialiser) afin de pouvoir ajuster rapidement la taille des caractères dans l’éditeur graphique.
Cet article de Smashing Magazine compare les composants d'interface utilisateur Combobox, Multiselect, Listbox et Dual Listbox, expliquant leurs différences et leurs usages. Il détaille que le choix dépend du nombre d'options et de leur visibilité, avec des recommandations pour éviter de cacher les options fréquemment utilisées. Un guide pratique pour choisir le bon composant en fonction des besoins des utilisateurs.
Ce billet explique comment améliorer l'interface utilisateur d'EasyAdmin en ajoutant une fonctionnalité d'édition inline pour divers types de champs (texte, enums, dates, associations) sans recharger la page. L'auteur utilise Symfony UX Turbo et Stimulus pour créer une expérience utilisateur plus fluide, similaire à un tableur. Le processus implique la création d'un contrôleur JavaScript pour gérer l'édition, la validation et l'annulation, ainsi qu'une action et un service PHP pour traiter les requêtes HTTP. L'architecture est détaillée et le code est fourni pour implémenter cette fonctionnalité.
Cet article de SitePoint propose 10 conseils pour une évaluation efficace de l'expérience utilisateur (UX). Parmi ces conseils, on retrouve l'importance d'afficher l'état du système, d'organiser clairement l'information, de donner aux utilisateurs un contrôle total, de réaliser des tests d'utilisabilité, de concevoir une interface esthétique et minimaliste, d'utiliser le langage de l'utilisateur, de fournir une aide pour l'accessibilité, d'identifier et corriger les problèmes courants de UX, d'améliorer continuellement le produit et de réaliser des tests A/B. Ces pratiques visent à améliorer la satisfaction et la fidélité des utilisateurs en rendant les produits plus intuitifs et conviviaux.
L'article de Victor Yocco sur Smashing Magazine explore l'émergence de l'IA agentique et son impact sur le design centré sur l'utilisateur. Contrairement à l'automatisation robotique (RPA) qui suit des scripts rigides, l'IA agentique imite le raisonnement humain, planifiant et exécutant des tâches de manière autonome pour atteindre des objectifs. Par exemple, elle peut gérer des conflits de réunion en proposant et confirmant de nouveaux créneaux, ou personnaliser des emails de recrutement. Cette évolution nécessite une nouvelle approche de la recherche UX, axée sur la confiance, le consentement et la responsabilité, pour concevoir des systèmes d'IA agentique responsables et efficaces.
Le FOUC (Flash of Unstyled Content) n'est pas un simple bug graphique mais une faille d'architecture frontend qui impacte l'expérience utilisateur et le référencement. Ce phénomène se manifeste par un clignotement de contenu non stylisé avant l'affichage final, ce qui peut être particulièrement problématique avec les thèmes sombres. Pour l'éviter, il est crucial de maîtriser le Critical Rendering Path en injectant un script synchrone dans le <head> pour appliquer immédiatement le thème approprié, garantissant ainsi un premier affichage correct sans flash.
Nic Chan raconte son expérience avec un client qui, inspiré par des sites de grandes entreprises SaaS, a voulu adopter une "fuck off contact page" — une page de contact conçue pour décourager les utilisateurs de les contacter, en privilégiant des options comme la consultation d’une FAQ ou la redirection vers l’équipe commerciale plutôt qu’un formulaire direct. Ce type de page, efficace pour les géants du SaaS cherchant à réduire les coûts de support, est totalement inadapté pour une agence de services qui a tout intérêt à faciliter le contact pour générer des leads. Malgré les réserves de l’autrice, le client a maintenu ce choix, illustrant l’importance de bien cadrer le processus de design et d’éduquer les clients sur l’objectif réel de chaque page. Une réflexion sur l’équilibre entre esthétique, expérience utilisateur et objectifs business, avec un rappel : une page de contact doit avant tout servir à… être contacté.
L'article soulève une énigme intrigante : les applications web monopage (SPA) ne semblent pas offrir de sessions utilisateur prolongées, malgré leur complexité accrue. Selon des données indépendantes, les utilisateurs effectuent en moyenne seulement une navigation "soft" pour chaque chargement de page "hard". Cela remet en question l'efficacité des SPAs, dont la promesse est de réduire la latence des interactions ultérieures. Si ces données sont exactes, l'adoption des SPAs pourrait sembler irrationnelle hors de cas d'usage spécifiques. Russell appelle la communauté à investiguer cette question cruciale pour l'avenir de la performance web.
Conor McCarthy, ingénieur en support client chez DebugBear, partage cinq enseignements clés tirés de 100 revues de vitesse de site réalisées en 2025. Il souligne la valeur de Lighthouse, souvent utilisé comme référence, mais recommande de privilégier les données CrUX et de surveillance des utilisateurs réels pour les grandes équipes. Il note également que les seuils de Total Blocking Time (TBT) sont élevés, avec la plupart des pages dépassant 1 seconde, mais que cela n'impacte pas nécessairement l'expérience utilisateur réelle, comme le montre les données CrUX.
Andrea Verlicchi, expert en performance web, aborde dans cet article l’optimisation du Cumulative Layout Shift (CLS) pour les pages utilisant le défilement infini ou le bouton « Charger plus ». Il identifie deux causes majeures de CLS : les bannières promotionnelles retardées et le chargement dynamique de contenu (typique des sites e-commerce), qui déplace le pied de page hors de la vue et dégrade l’expérience utilisateur.
Pour le défilement infini, la solution consiste à insérer des squelettes (placeholders) dès le début de la requête, réservant ainsi l’espace nécessaire avant l’affichage du contenu réel, évitant tout saut de mise en page. Pour le bouton « Charger plus », bien qu’un délai de 500 ms après le clic soit toléré, il recommande aussi d’utiliser des squelettes pour garantir une stabilité visuelle, quel que soit le temps de réponse du réseau.
La règle d’or ? Ne jamais déplacer le contenu visible pendant le défilement et toujours réserver l’espace à l’avance, sauf après une interaction utilisateur explicite (clic), en respectant la fenêtre de 500 ms. Une approche simple mais efficace pour améliorer les Core Web Vitals et l’expérience utilisateur. 🎄✨
L'article explore l'importance souvent sous-estimée du titre de page (
L'article explore les problèmes de superposition des éléments en CSS et les solutions modernes comme les popovers et les dialogs. Il explique comment les contextes de superposition (stacking contexts) peuvent compliquer l'utilisation de z-index et comment les éléments comme les popovers et les dialogs peuvent accéder à la "top layer" pour résoudre ces problèmes. Cependant, l'article met en lumière un conflit potentiel entre les popovers et les dialogs, notamment en matière d'accessibilité, où un utilisateur au clavier peut rencontrer des difficultés pour interagir avec un popover (comme une notification toast) lorsqu'un dialog est ouvert. L'auteur illustre ce problème avec un exemple concret et un CodePen démonstratif.
L'article explore comment concevoir des produits numériques adaptés aux situations de stress et d'urgence. Vitaly Friedman y partage des conseils pratiques pour créer des interfaces qui aident les utilisateurs à naviguer dans des contextes complexes, tout en minimisant leur charge cognitive. Il souligne l'importance de comprendre l'environnement réel des utilisateurs, les effets du stress sur l'interaction avec les produits et propose des stratégies pour améliorer l'expérience utilisateur dans des moments critiques.
L'article explore les éléments clés pour concevoir une interface intuitive. Il souligne que la clarté ne se résume pas à un modèle prédéfini, mais résulte d'un travail systématique prenant en compte les objectifs business, le produit et la pensée des utilisateurs. Une interface intuitive doit être prévisible, mais aussi visuellement de qualité, cohérente et alignée avec les attentes des utilisateurs. Une mauvaise conception visuelle peut rendre même les structures les plus simples confuses. L'article met en avant l'importance de comprendre l'expérience utilisateur à travers le prisme de l'utilisateur, et non du designer.