web-dev-qa-db-fra.com

Comment afficher les curseurs de plage sur mobile

Ceci est ma première question UX et je suis un noob à UX et ce forum alors s'il vous plaît faites le moi savoir si vous avez besoin de plus de détails ...

Je conçois un bon de commande réactif, qui a un curseur de gamme pour choisir rapidement la recherche d'une gamme de prix. Cela change dynamiquement le prix dans la page et est assez amusant à jouer avec pour l'utilisateur. Cependant, les curseurs ne semblent pas très bien fonctionner dans un scénario mobile, pour le toucher et le glisser.

Existe-t-il un bon moyen de montrer un curseur de gamme amusant à utiliser sur mobile, que je ne connais pas? Il doit être construit en HTML/JS et utilisable dans un navigateur. Je cherche quelque chose de différent et d'amusant à utiliser, au lieu des listes déroulantes par défaut habituelles, etc. Suis-je juste en train de rêver - ou y a-t-il quelque chose là-bas?

C'est mon curseur que je veux rendre réactif:

enter image description here

3
Karlgoldstraw

Un curseur de cercle pourrait donner un attrait visuel plus élevé et axé sur l'intérêt. Voici un exemple élaboré de maniacdev.com En outre, voici un autre exemple plus simple sur CodePen Mis à part un cercle, je ne peux pas vraiment penser à d'autres options, car un curseur de plage sera un curseur de plage, un point qui parcourt sa base pour représenter une augmentation ou une diminution de la plage. Bien que le style d'un curseur de plage puisse avoir un impact important et de nombreux exemples peuvent être trouvés ici , bonne chance.

http://maniacdev.com/

3

Jetez un œil au widget de plage de dates dans la recherche de Thunderbird:

A screenshot of Thunderbird's global search.

Le widget affiche d'abord un histogramme de l'emplacement des résultats de la recherche dans la dimension donnée. Il vous donne ensuite des sous-plages sur lesquelles cliquer, afin que vous puissiez zoomer et dézoomer. L'avantage de prendre en compte les résultats de la recherche est que vous pouvez proposer des plages calculées dynamiquement qui donnent des quantités à peu près égales de résultats.

L'inconvénient, bien sûr, est que les utilisateurs ont moins de liberté pour choisir leur gamme.

Son application dépend des détails de votre application, mais c'est au moins une alternative.

À titre d'heuristique, je dirais que les curseurs sont bons lorsque les utilisateurs savent exactement quelle est leur gamme préférée (par exemple, ils savent quel est leur prix maximum s'ils recherchent un réfrigérateur) et ce type de widget est bon si les utilisateurs ont besoin de plus d'informations pour prendre cette décision (c'est-à-dire qu'ils n'ont aucune idée de ce qu'est une consommation électrique normale et qu'ils ont besoin de voir l'histogramme pour comprendre combien de kWh consomme un réfrigérateur à économie d'énergie).

0
Peter