UX e-commerce & cible senior : gare aux idées reçues

Mathilde Abgrall
Antadis
Published in
12 min readDec 19, 2022

Lorsqu’on évoque le sujet de l’UX pour les séniors, il est fréquent d’avoir des exemples ou des anecdotes radicalement opposées : du beau-père au clic “prudent”, qui appelle avant de refermer le moindre onglet sur “gougueul”, à la mamie ultra connectée réservant ses voyages en toute autonomie, les grands écarts en termes de maîtrise du numérique sont énormes. Les seniors représentent une cible tellement large que dans le cadre de la conception UX, les considérer comme un persona unique équivaudrait à placer enfants, ados et jeunes adultes dans le même moule.

Alors, quelles généralités peut-on faire lorsque l’on parle des séniors en UX ? Qui considère-t-on comme sénior ? Sont-ils utilisateurs de nos produits, acheteurs ou les deux ? Comment faire pour ne pas mettre tous les séniors dans le même panier, au risque d’en faire des paniers … abandonnés ?

1) Commençons par définir la notion de sénior

Le consensus est de classer les personnes de plus de 60 ans dans la case des séniors, ce qui représente une sacrée proportion de la population. Dans les plus de 60 ans, nous allons commencer par nous intéresser aux deux segments d’âge de vie qui subdivisent les seniors en deux catégories : le segment “retraite” et le segment “vieillesse”.

Le segment “retraite” et le segment “jeunesse” ont pour point commun la notion de liberté. Le segment “vieillesse” et le segment “enfance” ont pour point commun la notion de dépendance. Les deux autres segments (la nidification et la maturité) ont pour point commun la notion d’activité maximale.

Les codes couleur indiquent cette symétrie de notions communes*:

*Source Didier Mazier

Or, la notion de liberté et la notion de dépendance sont presque antinomiques. Dès lors, si l’on veut s’adresser autant aux retraités qu’aux “plus âgés”, on comprend que l’on ne peut pas envisager son design sous un seul angle.

Complétons cette segmentation “retraite / vieillesse” par des éclaircissements sur la différence entre l’effet d’âge et l’effet de génération, sur une définition de l’illectronisme et concluons sur la notion très relative de l’âge.

Appartenir à une génération, c’est appartenir à un groupe de personnes ayant été jeunes au même moment, appartenant donc au même groupe d’âge, mais surtout ayant été élevés dans des modes de pensée et d’action communs, liés à l’époque dans laquelle est née puis a vécu ladite génération : on parle alors d’effet de génération.

L’effet d’âge décrit quant à lui les conséquences physiques liées au vieillissement, comme la baisse de la vue, de l’audition, de la mobilité.

Quand on parcourt la littérature traitant du sujet de l’UX pour les Séniors, c’est très souvent l’effet d’âge qui est pris en considération, occultant ainsi l’appartenance générationnelle et les biais cognitifs qui en découlent, alors que ceux-ci sont extrêmement intéressants à connaître dans le cadre de son design d’interface, tout particulièrement en e-commerce.

Mais avant de rentrer, dans le chapitre suivant, dans ces détails de conception, il est également nécessaire de parler de l’illectronisme. “L’illectronisme, selon l’Insee, désigne le fait de ne pas posséder les compétences numériques basiques (envoyer des courriers électroniques, consulter ses comptes en ligne, utiliser des logiciels, etc.) ou de ne pas se servir d’internet (incapacité ou impossibilité matérielle). 67,2%* des plus de 75 ans en souffrent.” *en 2019.

*Source : https://observatoire-des-seniors.com/67-des-75-souffrent-dillectronisme/

En France, l’illectronisme des 75+ baisse chaque année, et c’est logique : plus les générations avancent en âge, plus elles sont susceptibles d’avoir été confrontées à l’informatique / à internet au cours de leur carrière. À ce jour, c’est la “génération silencieuse” qui est concernée (5 millions de françaises et français, soit 8% de la population).

Concluons ce chapitre en insistant enfin sur la relativité de l’âge : à 15 ans on trouve que 20 ans c’est vieux, à 20 ans on se trouve super jeune et on trouve ses parents hyper vieux. Même à 65 ans, on ne se sent pas vieux. On n’a pas envie d’être considéré comme vieux. On ne veut donc pas sentir trop présents les codes de design destinés à ceux que l’on considère comme “les vrais vieux”.

2) Déterminer pour qui on design, qui est notre utilisateur

En e-commerce, lorsque l’on parle des seniors, il faut se demander si l’acheteur de nos produits est forcément l’utilisateur final de nos produits. En répondant à cette question, on saura alors si l’on doit concevoir notre interface de site e-commerce pour nos jeunes retraités dynamiques, et/ou pour les plus âgés du segment vieillesse, ou pour d’autres générations ou d’autres tranches d’âge. Cette réponse déterminera si le design doit opter pour une approche intra-générationnelle ou transgénérationnelle.

En effet, sur certains sites, les produits et leur achat sont réalisés par la même personne. Sur d’autres sites, les produits sont achetés par une population, à destination d’une autre population. (Ma mère, jeune retraitée de 65 ans, peut acheter en ligne des protections pour l’incontinence de sa propre mère, 95 ans. Sa propre mère n’ayant jamais utilisé un pc de sa vie.) Sur d’autres sites, ma mère va acheter un produit pour elle-même. Attention donc aux raccourcis trop simples : un produit que l’on destine naturellement à une cible âgée (prothèse audio, lit médicalisé…), n’est pas forcément acheté par l’utilisateur final. Ce sont souvent des achats réalisés par la famille du sénior, et donc, des utilisateurs appartenant à une autre tranche d’âge mais également potentiellement à une autre génération.

Comprendre les baby boomers et la silver economy

Nés entre 1945 et 1965, nombre d’entre eux ont moins de 60 ans et sont donc encore actifs ou en passe de prendre leur retraite et ne se considèrent pas vraiment comme âgés. Ils représentent 15 millions de français, soit 20% de la population !

Ils ont grandi avec les 30 glorieuses et ont acquis un niveau de vie relativement bon. Les boomers ont été témoins de l’évolution technologique tout au long de leur vie, dont la qualité n’a cessé d’augmenter. Le jeu de la consommation a globalement bien fonctionné pour eux. Ils ont connu le plein emploi, les supermarchés, ont vécu à fond et désirent continuer de vivre tout autant, même à la retraite. Cette génération est bien plus connectée qu’on ne le croit. Plus ils vieilliront, plus l’illectronisme disparaîtra, car les générations “silencieuses” totalement déconnectées feront place aux générations connectées. Ayant fini de rembourser leurs prêts (maison, voiture…), ils ont un pouvoir d’achat considérable et dépensent 400 milliards de plus par an que leurs autres générations. On comprendra l’intérêt business de soigner la relation avec cette clientèle :)

3) Que faut-il soigner lorsqu’on propose un site e-commerce à la cible des baby-boomers ?

Spécificité n°1 : le choix est un must absolu

Une des spécificités de cette génération est l’importance qu’elle donne à la notion de liberté de choix. Cette particularité vient du fait qu’ils ont vu leurs parents (de la génération silencieuse) manquer de beaucoup de choses, se priver et subir une existence et une vieillesse pleines de contraintes liées à l’époque dans laquelle ils ont vécu. Ainsi pour de nombreux aspects de leur vie, les boomers veulent pouvoir choisir librement. C’est pourquoi votre catalogue produit ne doit pas être trop restreint (avec trop peu de modèles pour un type de produits donné, ou dans une gamme de prix trop resserrée, ou contenant trop peu de marques différentes etc…) .

En design, les listings produits devront plutôt ressembler à un magasin de grande distribution plutôt qu’à une boutique de prêt-à-porter haut de gamme. Travaillez avec soin la sensation de choix, par le nombre de produits affichés par page, et le design de ces derniers en faisant prendre aux listings “la pleine largeur d’écran” par exemple.

Citons Amazon qui a bien compris cette important du choix…

N’ayez pas trop peur d’avoir l’impression de leur faire perdre leur temps : cette génération ne réagit pas comme cela. Ils vont préférer lire vos contenus, scroller dans les listings et décortiquer chaque fiche produit plutôt que de passer par un parcours d’aide au choix express en X étapes : sur tous les aspects de leur vie, les boomers veulent pouvoir choisir, et consacreront le temps nécessaire pour rester maîtres de leurs propres décisions.

Spécificité n°2 : Produits de bien-être, amélioration du confort de vie pour rester au top de leur forme

Les boomers sont prêts à dépenser de l’argent pour des choses qui vont améliorer leur qualité de vie et préserver leur bien-être le plus longtemps possible, de manière à ne pas vieillir trop brutalement (et donc ne pas suivre la même courbe de vieillissement “imposé” que leurs parents). Les produits technologiques (produits de domotique comme la régulation du chauffage, produits de bien-être comme les fauteuils de stimulation circulatoire …) seront perçus comme des alliés pour préserver leur mobilité le plus longtemps qu’ils puissent, repoussant le plus tard possible la diminution des capacités physiques et cognitives liées au véritable effet d’âge / vieillissement. Mais alors, attention à leur design. Ces produits doivent avoir un look and feel moderne : ils ne doivent pas leur renvoyer à la figure leur vieillissement.

Pour aller plus loin sur ce sujet : (un peu hors scope de la notion d’UX e-commerce, mais intéressant quand même)

“Why do we abandon great design when it is for ’the elderly’? | Jeremy Myerson | TEDxWhitehall” https://www.youtube.com/watch?v=FbAdRpUoOpA

et “Design for the Elderly” NNgroup https://www.youtube.com/watch?v=uP6IbeggAeo&t=144s

Spécificité n°3 : informations produit : du volume et des notations

Plus vous décrirez les bénéfices et les avantages techniques de vos produits, plus ils apprécieront votre site. Contrairement à d’autres générations, pour lesquelles la rapidité d’accès à une information synthétique et structurée est essentielle, les boomers préfèreront des descriptions assez longues et des bullet point bien argumentés : des fiches produit que l’on pourrait qualifier de “à l’ancienne”. Ces arguments produit auront du poids s’ ils sont confirmés/ appuyés par des avis utilisateurs en bon nombre et suffisamment mis en avant.

Les fiches produit sur https://www.bastideleconfortmedical.com présentent une forte densité informationnelle. Pour les boomers c’est ok du point de vue UX, alors que cela pourrait paraître indigeste pour d’autres générations.

Spécificité n°4 : l’appropriation technologique

Les boomers n’ont pas peur d’adopter la technologie, surtout si cette technologie est synonyme d’une forme d’indépendance. L’a priori qui voudrait que baby-boomers et technologie soient incompatibles a conduit à beaucoup d’erreurs en termes de conception des interactions. Ainsi, en voulant simplifier à l’extrême, l’infantilisation de l’utilisateur peut devenir vexante et contre-productive.

Cette génération est en effet la première à avoir dû adopter ce qui pour nous est quotidien et évident. Le lave linge a remplacé la lessiveuse, la télé en noir et blanc est devenue plate avec des couleurs. À chaque fois, les baby-boomers ont accueilli ces innovations technologiques et s’y sont adaptés. Aujourd’hui, ils sont prêts pour la domotique, dont d’ailleurs les ventes sont en plein essor sur cette cible.

Charge à nous, concepteurs d’interfaces connectées, de veiller à respecter scrupuleusement les fondamentaux du design lorsque nous savons que cette cible fait partie de nos utilisateurs. Mais alors, de quoi parle-on précisément lorsqu’on évoque les aspects de design fondamentaux à respecter ? Quelle est la check-list ?

Designer pour les seniors amène tout de même, logiquement, à porter une attention particulière aux fondamentaux de design : simplicité, clarté, lisibilité (valables au passage, quelque soit la cible concernée par notre design…) sans pour autant tomber dans l’infantilisation. La baisse de la vue et de la mobilité liées à l’effet d’âge doivent être prises en compte: textes suffisamment grands, respect des contrastes, respect des espaces, affordance des éléments cliquables.

Outre ces points évidents, il est aussi intéressant de rappeler les fondamentaux de design d’interface à respecter.

4) Faisons donc un petit rappel des “vrais” fondamentaux (théorie de Gestalt, loi de Fitts) et des principes de perception du cerveau humain lorsqu’on parle de design d’interface.

L’information, en effet, se structure de façon à rendre sa lecture logique. Commençons par les 4 lois essentielles de la théorie de Gestalt : similarité, proximité, continuité, clôture.

Selon la loi de proximité: les éléments les plus proches vont être perçus comme appartenant à un même groupe, et non plus comme des entités individuelles.

On soignera donc particulièrement ses espaces (margins et paddings) à l’intérieur et autour des objets (série de blocs produits crosselling par exemple) de manière à bien signifier l’appartenance des éléments à un groupe.

Exemple de mauvaise gestion de la proximité : on ne comprend pas l’appartenance des photos à leurs titres de blocs produits.
Les grandes marges blanches autour de cette construction graphique permettent de “grouper” les informations inspirationnelles https://www.habitat.fr/. Cet exemple illustre également une bonne gestion de la loi de similarité grâce aux tonalités des deux visuels qui se répondent.

Selon la loi de similarité : les éléments ayant le plus de similarités graphiques vont induire un sens identique, des fonctions similaires ou une importance commune.

Deux éléments similaires graphiquement possèdent un sens ou un objectif commun. on cherchera donc à créer des similitudes de traitement graphique (forme, couleur, orientation) : ainsi, les boutons d’action principaux auront toujours le même traitement au fil des pages du site et idéalement le même positionnement (donc pas un coup à droite, un coup centré ou un coup à gauche… — exemple un peu bateau désolée…) lorsque la loi de proximité ne peut pas s’appliquer.

Source Baymard exemple de mauvais positionnement de bouton (pas de similarité) : dans l’écran de gauche, le bouton principal se situe “sous la colonne de gauche”, dans l’écran de droite, il se situe “dans la colonne de droite”.

Selon la loi de continuité : plus la proximité des éléments visuels est importante, plus nous les voyons dans la continuité comme s’ils ne formaient plus qu’une partie unique.

Des points rapprochés tendent à représenter des formes lorsqu’ils sont perçus. L’œil humain va suivre des lignes, des courbes et ainsi créer des relations entre des éléments de design.

Même si les visuels n’ont pas tous le même ratio, leur proximité et leur direction commune créent une relation entre les éléments.

Selon la loi de clôture, une forme fermée est plus facilement identifiée comme une figure qu’une forme ouverte.

Alors mes chers lecteurs, qui rouvre le débat sur les tabs des fiches produit ? non, plus sérieusement, en design d’interface, cette loi est particulièrement utile en design pour délimiter un groupe d’éléments : grâce à une légère alternance de fonds par exemple.

Une bien belle loi de clôture qui délimite et isole les “produits tendance” du reste du listing produit, sur bleu-libellule.com

Maintenant que nous avons la théorie de la Gestalt et ses principes en tête, ajoutons la loi de Fitts :

“La loi de Fitts prédit le temps requis pour aller rapidement d’une position de départ à une zone finale de destination, en fonction de la distance de la cible et de la taille de la cible.”

Dans la loi de Fitts, finalement, on parle de hiérarchie. C’est dans l’esprit de cette loi que nous allons positionner les éléments de manière plus ou moins centrale ou plus ou moins excentrée, et designer nos actions de manière plus ou moins “prégnante”.

Pour comprendre la “vraie formule” => wikipédia

Complétons par la notion d’affordance des éléments :

le bouton a un style de bouton : sa forme, sa couleur se repèrent au premier coup d’œil contrairement au premier exemple

Un bouton “rond et plein” pour l’action principale.

… et terminons par la loi de Hick

Cette loi déclare que le temps requis pour prendre une décision est fonction du nombre d’alternatives possibles.

T = b log2(n + 1)

Je vais l’illustrer dans le monde réel par le rond point de l’étoile versus un rond point de quartier. Le nombre d’alternatives possible dans le rond-point de l’étoile est infini : sortir à la 2eme, se prendre une voiture qui arrive par la gauche ou une trottinette par la droite… une infinité d’alternatives pouvant générer une “paralysie du choix” qui ne peuvent pas arriver sur son rond-point de quartier (juste éviter d’écraser le chat du voisin).

En design, cela signifie, par exemple, de garder le contrôle du nombre de fonctionnalités disponibles sur un gabarit donné.

Exemple de loi de Hick : plutôt que d’afficher une infinité de modes de livraison/retrait différents directement à l’écran, au risque de submerger son utilisateur dans une paralysie de choix, on les subdivise par typologie (points relai, domicile ou boutique !)

Pour conclure : on l’aura compris, le respect de ces règles fondamentales d’UX design est particulièrement déterminant dans les refontes de projets e-commerce destinés aux séniors, s’en éloigner représente un vrai risque pour la conversion. Le challenge, dans le cadre de ces projets, est d’apporter ces bonnes pratiques progressivement (lorsqu’elles ne sont pas encore en place), pour déstabiliser le moins possible les usages en place, et travailler dans une logique d’implémentation / amélioration continue en priorisant les quickwins UX les plus Roistes.

--

--

Mathilde Abgrall
Antadis
Editor for

Agence Antadis - Directrice de création et associée. Comme mes collègues, je dis parfois des trucs idiots et parfois pas !