En Responsive Design, comment déclenchez-vous les info-bulles? la souris n'est plus là
Un petit avertissement, ne recherchant pas d'alternative aux info-bulles pour mobile comme dans un autre modèle d'interface utilisateur, je cherche une interaction différente qui pourrait déclencher l'infobulle, j'espère que cela le clarifie.
La question
Il existe de nombreux modèles d'interface utilisateur qui dépendent de l'événement/sélecteur de survol, certains modèles sont informatifs, certains sont interactifs.
Avec les téléphones portables/tablettes, l'effet de survol est inexistant - jusqu'à présent au moins ???? - Existe-t-il des techniques/tactiques qui peuvent être utilisées pour résoudre ou contourner ce problème?
Les info-bulles en sont un bon exemple:
Source de l'image: https://uxplanet.org/tooltips-in-ui-design-f63e117aa3d1
Avant de répondre
Bien que vous puissiez, veuillez éviter les réponses de type mobile-first, autant que nous aimons nous en tenir à la bible du design, nous savons qu'en réalité, il existe de nombreux cas qui ne peuvent tout simplement pas devenir mobiles-first, pourrait être que ce n'est pas une priorité ou simplement d'ajouter l'aspect mobile à une conception Web existante.
C'est l'une des principales raisons pour lesquelles les info-bulles ne sont pas une bonne solution la plupart du temps.
Mon argument courant est que l'on ne devrait jamais avoir à utiliser des info-bulles. Soit les informations sont suffisamment importantes pour s'afficher directement à l'écran, soit elles ne sont pas importantes, ce qui signifie que vous n'avez même pas besoin de les masquer dans une info-bulle.
Vous pourriez utiliser certaines des interactions les plus excentriques telles que le long tap-and-hold, mais cela ne fait que cacher des informations dans une autre couche d'UX dont l'utilisateur n'a probablement pas réellement besoin.
Android et iOS ont tous deux des gestionnaires de pression longue, qui peuvent être utilisés pour simuler l'effet de survol des info-bulles. La section mobile de Material Guidelines donne un exemple d'utilisation.
Je pense qu'il s'agit vraiment de la découverte-capacité des interfaces utilisateur. Les info-bulles sont souvent utilisées pour annoter une interface utilisateur afin que les utilisateurs puissent apprendre ce que font toutes les fonctions, sans encombrer l'interface utilisateur avec des explications.
Le même effet peut être obtenu par une utilisation cohérente de conventions telles que les noms de fonction et les icônes standard (dans l'exemple, l'icône Twitter n'a pas besoin d'annotation, si un utilisateur ne sait pas ce qu'est Twitter, il n'aura pas de Compte Twitter).