Aperçu du projet(Project Overview)
【Contexte et enjeux】
Le tableau de bord étudiant de Langara College est un système important qui soutient la vie quotidienne des étudiants, notamment l’inscription aux cours et la consultation des emplois du temps. Cependant, l’interface existante présente une disposition densément remplie de petits liens textuels, ce qui pose des problèmes de faible visibilité et un risque élevé d’erreurs de manipulation.
Interface actuelle : Le tableau de bord existant avec de nombreux éléments textuels alignés
【Redéfinition des utilisateurs cibles】
Au-delà des jeunes étudiants typiques de 20 à 30 ans, le public cible a été élargi pour inclure les seniors de 60 à 70 ans inscrits dans les programmes de Continuing Studies (formation continue) de l’établissement. Une interface intuitive est nécessaire même pour les utilisateurs qui ont du mal à distinguer les petits caractères en raison de la presbytie ou des changements de vision liés à l’âge.
【Objectif】
Réaliser une interface accessible permettant à tous les étudiants, indépendamment de l’âge ou de la condition physique, de comprendre les informations d’un seul coup d’œil et d’atteindre sans hésitation les actions souhaitées.
Identification des problèmes(Current Issues)
Faible visibilité et lisibilité dues aux petits textes
De petits caractères sont densément alignés dans la barre latérale, rendant difficile l’identification des textes pour les étudiants de 60 à 70 ans dont la presbytie progresse.
Risque d’erreurs de manipulation dû à la faible surface cliquable
Comme la zone cliquable des liens textuels est étroite, il existe un risque d’appuyer par erreur sur un élément voisin ou de poursuivre une opération sur la base d’une mauvaise reconnaissance.
Current UI: Densité d’information élevée, difficile à scanner
Charge cognitive élevée due à l’absence d’aides visuelles (icônes, etc.)
L’écran entier est dominé par du texte neutre, ce qui empêche de « juger d’un seul coup d’œil » lors de la recherche d’informations (détails des cours, paiements, etc.) et allonge le temps de recherche.
Approche de conception(Design Approach)
Proposal: Menu principal avec boutons et icônes
Remplacement des petits liens textuels par une interface de type boutons, facile à presser et immédiatement identifiable. Réduction significative du risque d’erreurs de manipulation et de la charge cognitive.
Passage des liens textuels à une interface de type grands boutons
Adoption d’un format de boutons avec une zone cliquable (cible de tap) élargie. Cela rend les boutons faciles à presser pour tout le monde, indépendamment de la vue, et aide à prévenir les erreurs de manipulation.
Association « texte + icônes intuitives »
Ajout d’icônes permettant de comprendre la fonction visuellement avant de lire le texte. Cela réduit la charge cognitive et permet d’identifier d’un seul coup d’œil le prochain élément à actionner.
Structuration de l’information (tableaux et actions directes)
Les informations sur les cours et les emplois du temps ont été organisées visuellement sous forme de tableaux. Des éléments de conception tels que le placement d’une « icône d’envoi d’e-mail » à côté du nom de l’enseignant créent des parcours permettant d’atteindre l’action souhaitée avec un minimum d’étapes.
Fonctionnalités clés(Key Features)
Menu principal (navigation)
La liste de textes de la barre latérale a été éliminée et remplacée par des boutons faciles à presser et de grands pictogrammes (icônes).
Inscription aux cours et emploi du temps hebdomadaire
Proposal: Emploi du temps hebdomadaire visuellement organisé
Restructuration visuelle du tableau des horaires. Les informations nécessaires peuvent être scannées d’un seul coup d’œil, réduisant considérablement la charge cognitive.
Interface de type emploi du temps qui visualise les jours de la semaine et les horaires sous forme de blocs. Le contraste des couleurs et les icônes sont utilisés pour permettre aux étudiants de saisir leur propre emploi du temps d’un seul coup d’œil.
Détails des cours et accès aux enseignants
Proposal: Affichage tabulaire des informations détaillées avec boutons d’action
Organisation en tableau des informations sur l’enseignant, le lieu et l’horaire, avec l’icône e-mail placée à proximité immédiate.
Permet de saisir les informations nécessaires et de finaliser l’action en un minimum d’étapes.
Le nom de l’enseignant, le lieu et l’horaire sont présentés sous forme de tableau. Une icône à côté du nom de l’enseignant, permettant d’accéder directement à un formulaire d’e-mail, a été ajoutée pour réduire le nombre d’étapes nécessaires.
Réflexion et enseignements(Reflection)
Lorsque l’on utilise quelque chose au quotidien, on a tendance à négliger les problèmes avec l’idée que « c’est difficile à voir, mais on s’y habitue ». En portant mon attention sur l’ensemble des utilisateurs — y compris les étudiants de 60 à 70 ans inscrits en Continuing Studies —, j’ai pu réaliser l’essence de l’UX : « Ce qui est évident pour moi peut être un inconvénient pour quelqu’un d’autre ».
Ce projet m’a appris l’importance de ne pas se contenter d’améliorer l’apparence, mais de prendre en compte de manière approfondie les différences de visibilité liées à la presbytie et aux conditions physiques, et de poursuivre une conception que n’importe qui peut utiliser sans se perdre ni forcer (conception inclusive).