Prototype d’un site web et d’une application mobile – Service urologie

CHU Henri Mondor

Méthodologie

Problématique

Recherche sur l’existant
Proto-personas
Parcours utilisateur

Solution

Prototype
Tests utilisateurs
Wire Frame

Application

Prise en compte des retours

//01 Etat des lieux

//02 Problématique

Page d’accueil :

• Le contenu de la page d’accueil n’informe pas sur la nature du site web, il n’y a pas d’information sur la localisation du service de urologie
• Il n’y a pas de prise de rendez vous.

Menu :

• Celui ci est agencé verticalement et l’utilisateur n’identifie pas le menu instinctivement
• Au survol du menu, il est difficile de visualiser l’état des éléments survolés
• Les choix visuels ne permettent pas la bonne navigation dans éléments unitaires du menu

Module de recherche :

• Si l’utilisateur cherche à revoir un service ou une information sans connaître le mot exact, il n’a pas d’outil lui permettant d’effectuer une recherche recherche intuitive

Minimalisme et efficacité pour donner confiance chez l’utilisateur :

Problématique :
• Textes ayant la même mise en forme et absence de titre visible.
• Absence
de visuels ou d’icônes afin d’aérer la page et faciliter la compréhension.

//02 Solution

Page d’accueil :

Garder
le contenu et la conception visuelle de l’interface utilisateur
concentrés sur l’essentiel
• Prise de rendez vous rapide (
• Icônes informant des fonctions du site web ( pôle
clinique, enseignement et recherche)

Menu :

• Menus situés dans des endroits familiers (en haut de la page)
• L’interface utilisateur doit communiquer l’état des éléments à l’utilisateur ( survol, clic…)
• Mettre en évidence graphiquement la catégorie qu’il consulte actuellement (contraste, ombre)
Problématique actuel :
• Celui ci est agencé verticalement et l’utilisateur n’identifie pas le menu instinctivement
• Au survol du menu, il est difficile de visualiser l’état des éléments survolés
• Les choix visuels ne permettent pas la bonne navigation dans éléments unitaires du menu
Menu

 

Module de recherche :

• Module de recherche situé dans des endroits familiers (en haut de la page)
• La recherche permet aux utilisateurs de localiser rapidement le contenu au sein d’un site web.
• Une recherche permet aux utilisateurs de saisir une requête pour afficher lister toutes les pages qui pourrait l’intéresser.

 

 

Minimalisme et efficacité pour donner confiance chez l’utilisateur :

• Équilibre et alignement En équilibrant et en alignant correctement le contenu de votre design, vous faciliterez la navigation dans vos mises en page et les rendrez visuellement plus attrayantes
• Utilisez les marges, les colonnes et les repères pour structurer votre design
• Pour exprimer un langage visuel partagé, les éléments graphiques qui illustre un thème doivent être identique à chaque évocation de ce thème quel que soit la page
• Pour soutenir les objectifs principaux

 

Proto-personas

//03 Livrable – Application

Nouvelle version du menu.

Zoning sur les pages principales du site web en responsive sur mobile.

Nouveau logo créé avec illustrator.

Logo CHU Henri Londor 500px

Prototypage sur Figma du nouveau site web