Sélection des plages horaires
Je suis à la recherche de la manière la plus conviviale d'offrir une sélection de créneaux horaires pour prendre rendez-vous dans le calendrier/l'agenda d'une entreprise.
Peu importe vraiment sur le plan de l'interface, mais parce qu'il crée des limitations mineures: il sera intégré dans un formulaire Web qui, idéalement, est à la fois utilisable par les ordinateurs de bureau et les appareils mobiles (il doit s'appuyer sur JavaScript).
Bien sûr, il pourrait présenter un sélecteur de date (vue mensuelle) et pour chaque date sélectionnée, il pourrait charger les plages horaires disponibles, mais cela empêcherait d'avoir un aperçu visuel de plusieurs jours.
Je pense que les objectifs sont importants (certains sont évidents):
- Le moins de clics possible pour arriver au résultat.
- Gardez une vue d'ensemble (plusieurs jours visibles en même temps).
- Le composant doit être aussi compact que possible. Cela signifie que de grandes quantités de boutons rendraient l'intégration dans un formulaire encombrée.
- La sélection de plusieurs emplacements adjacents devrait être possible (même s'étalant sur plusieurs jours, et donc plusieurs semaines).
Ce que j'ai jusqu'à présent, c'est cette maquette:
Mais cette solution est loin d'être idéale en raison de ces limitations:
- Je suis presque sûr que cela aurait l'air agréable sur mobile (étant donné que vous pouvez faire défiler avec le toucher), mais sur le bureau, il faudrait (à mon humble avis) des boutons gauche-droite pour faire défiler horizontalement au cours des semaines. Ils tomberaient également en dehors du design, ce qui le rendrait moins compact.
- Lorsqu'il y a un grand nombre d'options disponibles sur une journée (très courant), cela nécessiterait un défilement vertical dans le composant. Avec la remarque précédente, cela créerait un défilement dans les deux sens, ce qui me semble trop.
- Cela peut créer l'impression initiale que les fentes sur la même ligne horizontale commencent en même temps, ce qui n'est pas le cas. L'ajout d'espace entre les emplacements, par rapport au temps intermédiaire, créerait encore plus de défilement.
Je suis donc loin d'être sûr que la maquette va dans le bon sens. Toute aide sera la bienvenue. Que ce soit basé sur la maquette ou une approche complètement différente.
Hmmm. Si je comprends votre question, vous voulez que la solution soit aussi flexible que possible - pour pouvoir sélectionner plusieurs jours consécutifs aussi facilement que quelques heures (ou même quelques minutes). En termes généraux, je pense:
- Zoomez et effectuez un panoramique pour obtenir la large période (par exemple, effectuez un zoom arrière pour obtenir des années, effectuez un panoramique pour sélectionner 2015, effectuez un zoom avant pour sélectionner la première semaine de janvier (facile avec le mobile, légèrement plus encombrant mais toujours réalisable avec la souris)
- Sélectionnez le délai général (par exemple, les quelques heures nécessaires) et entrez les détails du rendez-vous. À ce stade, un affinement supplémentaire du délai peut être effectué
Le principe général est de laisser l'utilisateur être aussi précis qu'il le souhaite - un peu comme une conversation où je pourrais dire "je vous verrai mardi prochain" et nous le réduisons ensuite à 2h15 au café.
Application Web intéressante. Quelque chose que vous voudrez peut-être examiner est Full Calander d'Adam Shaw plugin jQuery. Je l'utilise depuis un moment et il est assez extensible. Loin de ce que les développeurs de mon entreprise ont vu et utilisé, ils sont assez impressionnants. Il a une extension pour Google Calendar et nous l'avons également connecté aux serveurs Microsoft Exchange en tant que POC.
Pour les utilisateurs de bureau, l'interface est très intuitive. Tout comme les interfaces Microsoft Office et Google Calander. Pour les utilisateurs mobiles, malheureusement, la prise en charge par glisser-déplacer n'existe pas. Le plugin a une API complète qui vous permet de construire au-dessus du plugin. Ce n'est pas une solution unique, mais elle donne définitivement une bonne base.