IFT2905
Interface personne/machine
(deuxième partie) TP3
présenté à M. Sébastien Roy
Nicola Grenon GREN30077303 grenonni par Patrick Paul PAUP30038301 paulpatr
Vendredi 6 avril 2007
Analyse usager:
Types:
Commis caissier. Dans le cadre de ce projet, il n'y aura qu'un seul type d'utilisateur dont nous devrons tenir compte, à savoir la personne chargée de la vente des produits au comptoir du café étudiant math-info.
Statistiques générales:
Qui? Étudiants au baccalauréat en informatique ou en mathématique.
Âge? Peu variable, jeunes adultes.
Limitations? Possibilité, mais pas à tenir en compte pour le moment.
Capacités informatiques? 60% peu à moyen. (gens de mathématiques) 40% très grandes. (gens d'informatique)
Expérience? Présumer nulle.
Environnement? Brouhaha, déboulant.
Interview simulée:
- Usagers sans expérience (présumer nulle).
- Apprentissage doit être instantané (100% intuitif).
- Aucune fonction administrative.
- Connaissance moyenne des produits (pas au départ) - Pas de connaissance préalable des prix.
- Il y aura de nombreux utilisateurs du même type, mais il n'y aura pas d'accès personnalisés - Les utilisateurs sont bénévoles.
- Les utilisateurs ne se servent de l'interface qu'environ une heure par semaine.
- En ce moment, les utilisateurs font un usage très relâché de cet outil.
- Les utilisateurs comprennent tous le français (écrit).
Analyse:
Il faut donc prévoir une interface facile à apprendre, sans mémorisation nécessaire, capable de résister aux erreurs de manipulation mais préférablement basée sur la prévention des erreurs. Il faut éviter tout ce qui peut rendre désagréable son utilisation pour un utilisateur qui n'est pas rémunéré, ne pas présumer d'aucune habileté en ce qui a trait au commerce au détail ni avec l'utilisation d'une caisse enregistreuse et en rendre l'usage rapide pour satisfaire à la demande en heure d'affluence.
Analyse des besoins:
Interview simulée:
- Empêcher le contournement des commandes prévues
- Forcer l'inscription des items avant de permettre l'ouverture de la caisse - Pas de mesures de sécurité particulières (code d'accès, etc.)
- Donne les prix, affiche le total, calcule la monnaie - Rapidité importante (peu de niveaux de menu, etc.)
- Une centaine de produits différents (seulement quelques catégories) - Fonctionnera sur un ordinateur standard équipé d'un tiroir caisse - Noter l'heure des transactions
- Permettre d'annuler une commande
- Offrir un no-sale, mais le rendre peu intéressant (Confirmation?) - Afficher l'heure
- Nécessité d'un système de communication (1) vers les responsables et (2) vers les bénévoles.
Celui vers les bénévoles doit être visible/accessible en tout temps.
- Utiliser principalement le clavier, mais prévoir un éventuel écran tactile (simulé par la souris en attendant)
Observations:
- Deux bénévoles (et plus) en même temps qui se croisent souvent et qui doivent pouvoir compléter les transactions en cours.
- Le classement actuel des données est peu visible.
- Environ 10 secondes en ce moment pour une transaction (calcul mental et ouverture du tiroir) en heure d'affluence.
- L'affichage actuel est monochrome et peu attractif.
- Il n'y a en ce moment aucune référence visuelle (logos ou images) et ce serait souhaitable pour rendre l'usage plus convivial.
Tâches:
Quoi? Facturer un client Lire les messages Entrer un message
Où? sur le bout d'un comptoir de service, au café étudiant math-info.
Occurrence? de 20 à 100/heure 1 fois par heure rarement Contrainte de temps? de 15 à 30 secondes ~30 secondes 45 secondes Apprentissage? minimal (idéalement nul) très petit petit
Possibilités d'erreurs? Corriger les entrées
Survivre à mauvais bouton...
Ne pas tout perdre si erreur!
processus très simple éviter d'effacer les messages des autres par erreur
Sous tâches Ajouter des items (nombre?) Entrer un tendu d'argent Rendre la monnaie
- Offrir une interface de
saisie, puis confirmer l'ajout / modification.
Prérequis (Produit disponible sous- entendu)
Une page de message soit configurée par un responsable.
aucun
Analyse:
L'interface aura donc une tâche principale à effectuer (affichage et calcul du paiement des articles), avec peut-être quelques détails (heure/date) et une paire de tâches secondaires de moindre importance.
Celles-ci seront beaucoup moins fréquentes, mais auront la particularité de devoir rester disponibles et surtout (pour l'affichage des messages aux usagers réguliers) visibles en tout temps, par exemple en utilisant un espace de l'interface principale pour tout afficher ou afficher un rappel (...). Le système doit permettre un travail rapide et un affichage efficace (un coup d'œil doit suffire pour reconnaître l'information). La sécurité du système ne sera qu'au niveau de l'accès sans bonne raison à l'ouverture du tiroir caisse. L'interface doit pouvoir s'adapter aussi bien à l'usage du clavier, d'une souris ou d'un écran tactile. L'état du système doit être extrêmement clair afin de permettre un changement, au vol, d'utilisateur (même au milieu d'une commande!).
Prototype:
Le fonctionnement de base de l'interface est très simple. La plupart du temps, l'écran ressemblera à ceci:
Les parties de l'écran se présentent comme suit:
• En haut et en bas, deux sections de contrôles.
o Au centre de celle du haut, défile le message que les responsables veulent porter à l'Attention des bénévoles.
o Au bas, à droite, il y a la date et l'heure.
• Au centre, à gauche, la liste des catégories.
• Au centre, au milieu, la liste des items de la catégorie sélectionnée.
• À droite, le compte-rendu des opérations jusqu'à présent ainsi que le total de celles-ci.
Voici un bref aperçu des commandes possibles à partir d'ici, il est à noter que chaque bouton de l'interface a une correspondance clavier afin de pouvoir utiliser aussi bien la souris, un touchscreen ou le clavier. Le vert pâle sous-entend une suggestion d'action.
1- Le bouton «ESC Annulation» permet d'annuler complètement la liste des opérations en attente de paiement.
2- Le bouton « Précédent» permet d'annuler la nouvelle entrée en cours, ou si elle est vide, l'item précédent calculé, et ce jusqu'à enlever tous les éléments un par un.
3- Le bouton «TAB Tiroir» permet de demander l'ouverture du tiroir sans faire de vente, mais seulement après en avoir confirmé la demande.
4- Lorsque la case pour laisser un message est active et qu'on appuie sur le OK à son côté (ou Entrée), le message est envoyé et on l'indique quelques instants.
5- Lorsqu'on clique sur le message défilant au haut de l'écran, le message d'information est affiché au complet dans son mode exclusif. Au retour de cette fenêtre secondaire exclusive, le défilement sera arrêté jusqu'à la prochaine heure et demi (xx:30), soit pour le prochain quart de travail.
6- Sauf dans le cas (4), dès qu'on appui sur une lettre du clavier (ou le bouton correspondant), une catégorie est sélectionnée et les items de cette catégorie sont listés.
a. Par la suite, dès que le premier chiffre du code à deux chiffres du produit est entré, la sous- catégorie est soulignée en jaune clair.
b. Quand le second chiffre est entré (ou qu'un des boutons représentant un item est sélectionné) la section de choix retourne à son état initial (catégories entourées de vert) et la facture virtuelle est mise à jour.
7- Quand des chiffres sont entrés au clavier sans qu'une catégorie ait été choisie, on capture ceux-ci dans la case
du montant tendu. Le OK à côté ou la touche Entrée forceront une évaluation de la monnaie à rendre, fera ouvrir le tiroir et réinitialisera la facture virtuelle. (Rouge si pas suffisant, pas d'ouverture du tiroir et pas de réinitialisation de la facture virtuelle.)
Fonctionnalités:
• L'interface permet un usage intuitif pour un usager n'ayant jamais utilisé un logiciel semblable puisqu'en tout temps, tout ce qui est à savoir se trouve à l'écran.
• L'interface permet l'utilisation de trois différents périphériques d'entrée de données. La souris, le clavier et le touchscreen. Il faut toutefois noter que pour la souris et le touchscreen, il faudrait prévoir soit un clavier numérique, soit ajouter à l'interface un petit clavier tel que celui-ci en haut ou en bas de la facture virtuelle. (Inutile dans le cadre de ce travail)
• L'interface permet d'aisément apprendre, pour ceux qui le veulent, des codes
d'accès rapides pour les produits, ainsi, rapidement, pour les produits les plus communs, il deviendra naturel d'utiliser le code correspondant.
• La section de droite, en blanc, que nous appelons la facture virtuelle permet d'aisément voir l'état de l'addition tout en offrant une référence métaphorique rassurante à l'usager qui pourrait être intimidé à première vue.
• La banderole du haut de l'écran attire l'attention de l'usager, mais il peut aisément se débarrasser de la distraction en prenant le temps de lire l'information au complet.
• La date affichée en tout temps permet de garder une référence toujours proche pour vérifier les dates de péremption des produits et l'heure, quant à elle, est toujours utile afin de permettre de savoir quand la relève viendra (...).
• La caisse permet en tout temps de répondre à des questions sur les prix des aliments sans les facturer ou sans devoir changer de mode.
• L'affichage permet un double classement, par catégories principales et par sous-section (première décimale regroupe els items).
• On évite l'usage intempestif de l'ouverture du tiroir caisse.
À ce modèle, nous nous permettons de déborder légèrement du cadre du travail en suggérant que les autres parties du programme offrant la gestion des produits soient dissimulés à l'usager «standard»
derrière les touches de fonction F1-F12, sous un schéma du type:
Ce menu serait apparent sur toutes les autres pages, à l'exception de la page de caisse (celle de ce travail) afin de toujours rendre clair comment y retourner.
Évaluation heuristique:
Loi de Fitts:
- Au niveau de la loi de Fitt, nous essayons de tirer le meilleur parti de la position des boutons de commande de contrôle en les disposant aux coins de l'écran pour en faciliter l'utilisation.
- Pour les boutons des catégories et des items, comme ils sont nombreux, nous avons à tout le moins utilisé un arrangement aligné, mais surtout avec de gros boutons facile à atteindre sans toutefois les coller pour éviter les erreurs.
- Le message aux bénévoles est facilement atteignable (haut) et la seule barre de défilement (qui ne servira à toute fin pratique jamais) est sur le côté de l'écran.
- Il est à noter que les deux petits boutons OK sont presque inutiles puisque naturellement l'utilisateur les remplacera par la touche Entrée du clavier, ce qui est un comportement naturel et efficace.
Mémorisation:
- L'information a été catégorisée en groupes logiques à deux niveaux, pour les catégories principales et aussi dans des sous-groupes logiques afin de permettre de facilement associer la disposition des éléments à une logique qui rendra la recherche plus rapide ensuite.
- Toutes les informations (les prix, les noms, les codes de raccourcis, l'état de la facture virtuelle et chaque touche entrée sont reflétés à l'écran en tout temps, ce qui annule tout besoin d'appel à la mémoire.
Couleurs:
- Sans exagérer, les sections de l'interface sont distinguées par des teintes différentes.
- De plus, l'usager est guidé en tout temps sur l'action à prendre puisque le choix suivant (logique) à faire est entouré de vert pâle.
Connexion avec le monde:
- Aucun vocabulaire technique n'est employé.
- Les codes de produit employé sont le plus significatifs que possible en employant la première lettre de la famille comme initiale du code. (N'oublions pas que les codes ne sont de toute façon pas obligatoires... (Par code nous entendons «S11» qui peut être mémorisé comme raccourcis par exemple.))
- Quelques métaphores ont été intégrées à l'interface. La plus importante est celle de la facture virtuelle à droite de l'écran. Tout le monde connaît le format d'une facture reçue en magasin, alors l'usager qui la voit se remplir comme telle sera rassuré sur l'état actuel de la caisse. La
seconde métaphore concerne la banderole virtuelle au haut de l'écran. Il s'agit là d'un objet que l'on voit souvent en publicité et on sait qu'il contient une information qu'on veut nous passer.
- Il y a peu de manipulation directe, mais elle existe avec la barre de défilement pour le cas d'une facture trop longue (rarissime).
- La capacité suggestive d'action de notre interface est très claire de par sa grande utilisation des boutons, des cases à remplir et d'encadrements verts pour motiver une direction.
- La disposition des boutons d'annulation et de retour à l'étape précédente de notre interface utilisent clairement un mapping naturel pour qui est habitué à l'utilisation du clavier d'ordinateur:
ils sont disposés da manière équivalente (en haut à gauche, en haut à droite) et occupent des fonctions similaires. (quasi identiques).
- La visibilité est quant à elle assurée par du texte en gros caractères, le fait qu'on évite de trop afficher de boutons/produits à la fois sur l'écran et qu'ils sont enlignés et regroupés clairement.
- Et finalement, la rétroaction est bien assurée également puisque toutes les actions possibles entraînent une réaction du système, que ce soit au niveau d'un affichage modifié quant aux informations ou alors aux couleurs de l'environnement. Les touches invalides entraînent un bip.
Cohérence et standards:
- À l'interne, les boutons de produits sont affichés de la même façon pour chaque catégorie.
- À l'externe, les usages de ESC ou de Backspace sont ceux qu'on s'attendrait dans la majorité des programmes. L'heure et la date sont dans un coin, ce qui est classique (et dans le coin habituel de Windows qui est très connu, de surcroît). Les fenêtres de dialogue emploient un format classique également. Finalement, le bip en cas de «mauvaise touche» est aussi un grand classique.
- Métaphorique: Clairement ici, les standards d'une facture de magasin sont respectés: liste des items, prix à droite, logo en haut, déroulement vers le haut, total en bas, etc.
Aide et documentation:
- Toute documentation externe est inutile ici pour l'interface du caissier: chaque bouton s'explique de lui-même.
- Chaque opération exécutable a été organisée de manière à contenir le minimum d'étapes (une seule pour la gestion des messages entrants ou sortants).
- Il faisait parti de notre mandat d'éviter de devoir en produire à l'externe.
Liberté et contrôle:
- L'usager peut annuler un item entré par erreur dans la liste ou annuler toute la liste (au choix).
- L'usager qui a entré une mauvaise lettre peut entrer la bonne sans perdre de temps (catégorie).
- Que l'usager ait fini d'entrer une mauvaise combinaison au clavier ou qu'il soit en milieu, la même touche (Backspace) permet de revenir à un état «prêt».
- L'usager peut faire une ouverture de la caisse sans vente, mais on a limité cette action afin d'en garder la trace.
- L'usager peut arrêter le défilement de la banderole s'il trouve cela agaçant. Tout en ayant le choix de retourner voir le message à volonté.
- L'usager peut entrer autant de messages qu'il veut pour les responsables et ce, en tout temps (même au milieu d'une facture!). Ce qui est aussi vrai pour l'arrêt de la banderole et la lecture du message ou l'ouverture manuelle de la caisse.
- Voir analyse et inscription négative plus bas.
Visibilité de l'état du système:
- En tout temps, on sait par l'encadré vert si on est rendu à choisir une catégorie, un item ou à remplir un message. Le fait que le tiroir s'ouvre éclaire aussi sur le fait qu'il est temps d'encaisser et de rendre la monnaie. En plus, si on a déjà entré un des deux chiffres du code d'un produit (plutôt que d'avoir cliqué sur le bouton), on le verra par l'encadré jaune pâle.
- Comme il n'y a pas de travail algorithmique, toutes les actions sont instantanées.
Flexibilité et efficacité:
- Les usagers débutants ou malhabiles ont de beaux gros boutons aisés à utiliser - Les usagers expérimentés peuvent utiliser de mémoire les codes de produit.
- Il n'y a jamais plus de deux clics (ou trois touches) à faire pour ajouter un produit. Ils sont tous très rapidement consultables et additionnables.
Prévention des erreurs:
- Elles sont impossibles puisqu'il n'y a pas d'entrée de noms pouvant être mals écrits. En fait, les touches invalides vont simplement produire un petit bip. Il faut toujours faire un choix entre différents items, le choix sera donc toujours existent.
- Le OK du message à laisser aux responsables est grisé lorsque la case est encore vide. Même chose pour le OK de la case de l'argent tendu.
- Finalement, on s'assurer que l'usager est certain lorsqu'il tente d'ouvrir manuellement le tiroir caisse.
- Il n'y a pas d'actions dont la forme est similaire sans que le sens ne le soit également (boutons différents (pas la même colonne ou dans un coin) pour faire nos choix).
- Il reste toujours possible que l'usager entre un code par habitude pour un produit similaire (baguette au poulet plutôt qu'au bœuf), mais ici mettre une barrière à ce genre d'erreur forcerait aussi une limitation de l'efficacité. Au total ce coût à payer nous semble rentable.
- Les erreurs d'état sont peu probables (code couleur) et ne sont de toute façon pas graves:
renvoyer une seconde lettre changera simplement la catégorie...
- Une faiblesse pourrait se trouver au moment où un usager a mal tapé un code d'item et ne regarde pas l'écran avant d'entrer la monnaie par exemple, il y aura alors une mauvaise entrée d'item et une mauvaise entrée de la monnaie. Le problème est qu'ici on a un nombre limité de touches et ne pas réutiliser les chiffres serait trop limitatif. De même, ajouter des contraintes pour forcer une validation des données ralentirait le travail de beaucoup. Il est plus simple d'Avoir un mécanisme de correction de la facture facilement accessible. (Backspace).
Reconnaissance et mémoire:
- Comme toutes les options sont en tout temps affichées à l'écran, il n'y a pas de concept à mémoriser. Il suffit, en tout temps, de faire des choix parmi les éléments devant nous.
- Vue la grande diversité des éléments, nous devons employer des descriptifs écrits pour identifier chaque item, ce qui rend la confusion peu probable même si quelque peu ralentie.
Erreur (détection et récupération):
- Ayant limité les entrées possibles au niveau de la prévention et n'ayant pas à faire de gestion des stocks, il n'y a pas ici d'erreur à récupérer.
- Voir analyse et inscription négative plus bas.
Esthétisme et minimalisme:
- Nous devions faire la balance entre l'attrait d'avoir peu d'informations présentées à la fois (minimalisme) et l'efficacité de l'interface (limiter le nombre d'étapes à exécuter). Il appert qu'en s'en tenant à deux listes principales (dont la seconde qui intègre les sous-catégories dans la même vue), on arrive à rester clair (deux colonnes enlignées clairement distinctes). Au niveau des ajouts graphiques à l'interface, par exemple des images pour représenter les catégories, nous ne croyons pas que cela ajouterait à l'utilisabilité puisque les catégories sont générées automatiquement et on prendrait ainsi le risque que les logos ne soient plus très représentatifs à un certain point dans le futur.
- Les couleurs choisies sont plus vers le pastel que les couleurs franches, permettant de contraster les étapes à suivre sans agresser pour autant.
- Les deux sections de messagerie combinent leurs éléments en un seul. Par exemple en affichant les directives directement dans la ligne où entrer le texte (texte qui s'effacera automatiquement dès qu'on y aura cliqué), on élimine le besoin d'un label supplémentaire. De même, en cliquant sur la banderole on affiche le message complet, nul besoin d'un bouton supplémentaire.
Analyse et inscription négative:
Au moment de l'analyse des heuristiques, après la dernière itération sur le prototype papier, plus particulièrement au moment de discuter de la liberté et du contrôle ainsi que de la récupération des erreurs, il est devenu clair qu'un petit détail avait été oublié, à savoir la possibilité d'entrer un élément négativement dans le système (permettre un retour du sandwich si l'usager changer d'avis par exemple. Il ne s'agissait pas d'un besoin formellement identifié au moment de l'entrevue, mais son existence semble utile.
En l'occurrence, la façon de procéder est très simple. Il s'agit d'utiliser un toggle, situé sous la liste des catégories, qui, en plus de mémoriser que la prochaine opération sera en négatif, a les effets visuels suivants:
- Encadrements en rouge clair plutôt qu'en vert clair (fonctionnement similaire autrement).
- Listing en oranger plutôt qu'en bleu foncé dans la facture virtuelle (avec le montant en négatif).
