UX : Amélioration du comportement de défilement dans les sous-formulaires

Les formulaires utilisateur ont pour but de faciliter la tâche des utilisateurs. Mais que se passe-t-il lorsque le défilement devient une bataille entre les sous-formulaires et leur contenu ? Vous en avez probablement déjà fait l’expérience : vous essayez de faire défiler une zone de liste dans un sous-formulaire, mais c’est le sous-formulaire tout entier qui se déplace. Ou, pire encore, vous essayez de faire défiler le sous-formulaire lui-même, mais la zone de liste s’obstine à rester en place !

Ce problème a été amélioré avec 4D 20 R6, ce qui rend l’action plus naturelle.

Qu’est-ce qui doit défiler ? Le sous-formulaire ou son contenu ?

Initialement (disons « il y a longtemps »), l’utilisation d’une molette ou d’un trackpad ne faisait défiler que le sous-formulaire lui-même, et non les objets contenus dans le sous-formulaire lui-même. Ensuite, c’était l’inverse ! Les objets inclus défilaient, mais pas nécessairement le sous-formulaire lui-même. À moins, bien sûr, d’utiliser les barres de défilement, mais celles-ci sont souvent cachées. Bref, ce n’était pas toujours facile pour l’utilisateur !

Un GIF peut vous aider à comprendre l’objectif.

Voici ce que l’on peut faire maintenant en utilisant la molette de la souris (ou un trackpad) !

Le meilleur des deux mondes

Désormais, si un sous-formulaire contient des objets déroulables, c’est ce dernier qui défilera en premier, à condition que ces objets soient survolés lorsque la molette ou le trackpad est activé. Certains objets peuvent être défilables ou non, en fonction de leur contenu. Une liste vide, une petite image ou une zone de liste dont le contenu est entièrement affiché ne défilera jamais.

Le résultat est naturel dans tous les cas : si un objet à l’intérieur d’un sous-format peut défiler, il le fera ! Dans le cas contraire (s’il est vide ou a déjà été entièrement défilé), le sous-format « parent » défilera… jusqu’à ce qu’un nouvel objet défilant soit rencontré dans le sous-format. Etc. jusqu’au bas du sous-formulaire.

Bien entendu, cela fonctionne dans toutes les directions, de haut en bas, de bas en haut, de gauche à droite ou de droite à gauche.

Conclusion

Ce changement apparemment minime fait une grande différence en termes d’expérience utilisateur. Les utilisateurs peuvent naviguer en toute confiance dans les formulaires, en sachant précisément ce qui défilera en fonction de l’endroit où ils survolent le formulaire. Cela vous permet, en tant que développeur, de concevoir des interfaces plus conviviales et plus intuitives.