Suggestions pour une interface utilisateur tactile utilisée pour réserver des sièges dans un bus

Question

J'essaie de concevoir la disposition d'une application de réservation de billets de bus. L'utilisateur est autorisé à choisir les sièges qu'il souhaite réserver. Ci-dessous, la disposition qui nous est fournie.

Je cherche de l'inspiration et des suggestions sur la façon de les reproduire sur les applications Android/iOS en termes de manière innovante et simple pour permettre aux utilisateurs de choisir les sièges qu'ils souhaitent réserver.

Answer 1

La sélection des sièges sur les appareils mobiles doit remplir plusieurs conditions:

• Les principales caractéristiques physiques du véhicule, telles que les entrées/sorties et les toilettes (le cas échéant) doivent être clairement indiquées.
• Toutes les zones actives doivent être suffisamment grandes pour être "pressées" facilement.
• Si le contenu ne convient pas à l'écran confortablement, il doit y avoir un indicateur que plus est disponible dans une certaine direction.
• Le processus de sélection doit être également utilisable en orientation portrait et paysage.

Par conséquent, voici ce que vous devez faire:

• Dessinez un contour de base d'un bus autour des sièges avec une représentation proportionnelle de l'espace (les icônes des sièges peuvent se toucher mais l'espace total doit être égal à l'espace d'un siège plus l'espace pour les jambes).
• Augmentez la taille de chaque icône de siège pour pouvoir appuyer dessus sans activer accidentellement une icône voisine.
• Retirez le siège conducteur de la disposition et de la légende à moins qu'il ne joue un rôle important dans les processus d'embarquement/voyage.
• Augmentez le contraste entre l'arrière-plan et les éléments, par ex. pas de texte bleu foncé sur fond noir.
• Supprimez les numéros des sièges indisponibles pour éviter toute confusion ou ajoutez une icône de forme humaine (voir l'exemple de United Airlines).
• S'il n'y a pas d'espace sur l'écran pour la légende, ajoutez un bouton aux contrôles inférieurs où vous devriez avoir Back et Book the ticket qui fait basculer la légende. Note: ce n'est pas une meilleure pratique mais un écran limité oblige.
• Si tous les sièges ne tiennent pas dans un seul écran, appliquez un dégradé de dégradé au bord où davantage de sièges sont disponibles pour le défilement.
• Assurez-vous que la disposition du paysage est utilisable.

Exemples:

Tableau de sélection des sièges United Airlines. Remarquez l'emplacement de l'aile, les proportions réelles et l'icône du siège occupé.

Maquettes de sélection de siège potentielles (portrait et paysage respectivement et non à l'échelle):

Maquette pour la possibilité de défilement horizontal:

Answer 2

Pensez à ce qui influence le processus de décision d'un passager lors de la réservation d'un siège. Quels facteurs influencent leur choix?

• Siège côté fenêtre
• Siège de l'île
• Sortie d'urgence
• Espace pour fauteuil roulant
• Proximité des toilettes
• Proximité des partenaires de voyage
• Etc ...

Personnellement, à moins que l'un de ces facteurs ne soit pertinent, peu m'importe où je m'assois - donc avoir le siège choisi pour moi offrirait une meilleure expérience.

Je suggère de penser latéralement. Vous n'avez pas besoin de vous en tenir à une présentation graphique pour permettre à vos utilisateurs d'atteindre leurs objectifs. Le fait de s'écarter de ce format traditionnel pourrait même offrir des améliorations.

Answer 3

Voici ma suggestion:

• Montrez seulement la moitié du nombre de sièges que le bus peut accueillir. De cette façon, l'utilisateur aura un plus grand bouton "siège" sur lequel cliquer. Les utilisateurs peuvent faire défiler vers le haut/bas pour afficher les sièges.
• Affichez la légende sur l'écran des sièges; cependant, il doit toujours être affiché en haut/en bas de l'écran.
• Fournissez quelques indicateurs où se trouvent les caractéristiques du bus. c.-à-d. portes, situation d'urgence, roues, etc.
• Fournir une représentation à l'échelle (réaliste) de ce à quoi les clients peuvent s'attendre en termes de taille. (La zone de l'allée semble avoir une largeur de 3 sièges sur votre photo)
• Utilisez les couleurs appropriées (en fonction de la démographie de votre client, de la culture du public) pour montrer les différents états de réservation des sièges (dans mon contexte culturel, le non disponible doit être rouge, etc.).
• Vous devrez probablement fournir plus d'informations telles que le numéro de service de bus, les itinéraires, etc. pour fournir le contexte de ce que l'utilisateur réserve.
• Et le plus important de tous, vous devriez avoir un bouton "réserver" pour permettre la réservation.

Answer 4

Si vous en êtes encore à la phase de recherche, pensez à inclure dans votre enquête sur la convention Web http://seatguru.com par Tripdvisor.

Les utilisateurs peuvent rechercher un vol> lorsque le vol apparaît dans les résultats, l'avion est présenté dans une vue illustrée de haut niveau> les utilisateurs puis survolent (peu pratique pour l'iPad) les sièges pour obtenir des informations spécifiques sur ce siège particulier. Les informations comprennent la proximité des toilettes, un écran de télévision dans un appuie-tête, le type de classe et d'autres informations utiles. Il y a aussi une clé de commodités en vol pratique avec des icônes cliquables fournissant des détails connexes.

Certaines fonctionnalités de Seatgurus pourraient bien se traduire dans votre application.