Ofocus

UI/UX Design
Ofocus
2023
Ce projet, réalisé en collaboration avec trois autres membres, comprenait la proposition d'un concept de refonte pour un site web, englobant la révision de la structure, de l'interface et du design graphique. L'objectif principal était de repenser la manière dont l'entreprise présentait ses services au public. L'enjeu du projet était de créer un site web à la fois cohérent, convivial, intelligent et esthétiquement plaisant.

Recherche et analyse

La première étape du projet consiste à effectuer une analyse approfondie de l’entreprise et de son contexte commercial. À cette fin, nous avons utilisé le modèle « Business Model Canvas » comme outil d’analyse. Tout comme la compréhension des utilisateurs, cette phase est essentielle dans le développement d’une solution de design adaptée. Nous avons appliqué des méthodes inspirées par IDEO pour nos recherches utilisateurs, analysé les entreprises concurrentes, mené une entrevue approfondie avec la propriétaire pour mieux comprendre les enjeux et la clientèle, et recueilli des avis en ligne sur la compagnie pour enrichir notre perspective. Ces approches ont constitué la base de notre processus de recherche et d’analyse.

Définition du contenu et de la structure

Pour élaborer le contenu du site web, nous avons commencé par créer l’arborescence du site existant, que nous avons ensuite simplifiée. Au cours de ce processus, nous avons identifié une dispersion et une confusion dans la fonction de prise de rendez-vous en ligne. Afin de remédier à cette situation, nous avons élaboré un logigramme pour repenser le système de prise de rendez-vous de l’entreprise. Ce travail a été essentiel dans la définition et l’optimisation de la structure et du contenu du site internet.

Wireframe et tests utilisateurs

Ensuite, nous avons débuté la création de wireframes pour le site web, en concevant des versions destinées à l’ordinateur et au mobile. Des tests utilisateurs ont été effectués pour valider divers aspects et des ajustements ont été apportés pour faciliter la compréhension des utilisateurs en réponse à leurs retours.

Conception des interfaces intéractive

À la suite d’une exploration visuelle, nous avons développé un univers graphique pour exprimer l’intention de design. Suivant la direction artistique, nous avons créé un “design system” intégrant les directives concernant la typographie, les couleurs, ainsi que les éléments d’interface tels que les boutons, les menus et les icônes. En conclusion, nous avons transformé nos wireframes en maquettes finales interactives.

Réalisé avec

Laurence Babin

Benjamin Blais

Camille St-Arnaud