Site internet Transhépate Bretagne Ouest - 2022
Association
Transhépate Bretagne-Ouest
Outils et logiciels utilisés
WordPress
Figma
Suite Adobe
Rôle
UI Designer
Webmaster
Livrables
Maquette/Prototype
Site internet
Vidéo promotionnelle
Charte graphique
Kakemono
Flyers
Affiche commerciale
Aperçu
Transhépate Bretagne Ouest est une association née en 1991 d’un élan de solidarité des premiers greffés du foie désireux d’aider les malades en attente de transplantation. L’aide que nous apportons est fondée sur notre expérience de transplantés et de malades hépatiques. Notre priorité est de promouvoir le don d’organes et de tissus. Nous menons également des actions de prévention et de sensibilisation sur les maladies hépatiques.
Notre association est actuellement implantée dans quasiment tous les centres de transplantation hépatique et regroupe en son sein toutes les grandes associations régionales de greffés du foie. Notre champ d’action couvre l’ensemble des malades atteints d’une déficience hépatique sévère, et en particulier les malades atteints par les hépatites virales.
Notre association est prêt à vous accueillir ! Venez rejoindre notre association pour pousser le domaine hépatique le plus loin possible. Nous vous accompagnerons pour votre attente ou pour des conseils après l’opération.
Missions
Dans le cadre de la modernisation des supports de communication web de l’association, ma mission a été de faire un site Web informatif pour Transhépate Bretagne-Ouest. Leurs anciens sites étaient obsolètes, et aucun des administrateurs savaient comment s’y prendre pour améliorer leurs interfaces.
C’est dans ce contexte, que j’ai re-façonner l’interface de Transhépate Bretagne-Ouest. L’objectif était d’avoir une architecture simple et un design épuré pour les
utilisateurs. Parmi les objectits, nous devions livrer un cahier des charges validés par l’administration de Transhépate Bretagne-Ouest. A la suite de ce cahier des charges, il fallait créer univers graphique (charte graphique). Après la validation de l’univers graphique, nous avons devions créer une maquette
Desktop, une maquette Mobile. Notre objectif final est e site internet crée grâce aux CMS WordPress et ses plug-ins. A terme, ce site Web sera un support de communication important de l’association.
Contraintes
Peu d’information statistique pour analyser le Traffic du site internet. Cependant, sur ce projet, j’ai pu m’épanouir car j’ai eu une réelle liberté sur mes choix graphiques
Problèmes et besoins
Site obsolète
Univers graphique décalé par rapport au message de l'association
Avoir des supports de communication identifiable
Un site à l'ére du temps
Formation des clients
Phases de projet
Découverte du client
TRANSHEPATE
Les missions de Transhepate sont :
- La visite et soutien aux patients malades hospitalisés au CHU de Rennes et aux transplantés hépatiques du Grand Ouest,
- Le soutien morale aux malades en attente de greffe et à leur famille grâce aux rencontre avec des transplantés bénévoles lors de leur visite au CHU de Rennes.
- Création d’un pont d’information entre malades et les médecins hépatologues.
- Diffuser l’information sur la transplantation hépatique en relation avec les médecins.
- Informer et diffuser en direction du grand public, en accord avec le corps médical.
- Soutenir et aider la recherche médicale sur les maladies hépatiques et sur la transplantation.
Analyse de l'existant
Dans le cadre de la modernisation des supports de communication web de l’association, ma mission a été de faire un site Web informatif pour Transhépate Bretagne Ouest. Leurs anciens sites étaient obsolètes, et aucun des administrateurs savaient comment s’y prendre pour améliorer leurs interfaces.
C’est dans ce contexte, que j’ai re-façonner l’interface de Transhépate Bretagne-Ouest. L’objectif était d’avoir une architecture simple et un design épuré pour les utilisateurs.
Ces éléments sont les éléments sur lequel je me suis appuyé pour effectuer l’analyse de l’existant, à part ce site, l’association n’avait pas vraiment de support de communication numérique à jour.
Elaboration de l'univers graphique de l'association
Logotype de base
1ère proposition
Logotype finale
Changement de typographie : Comic sans Ms
Une police souvent contestée et non utilisée par le professionnels. Le comic sans MS, dans ce logo permet d’aller à contre-courant de ce qui s’est déjà fait auparavant. La police est chaleureuse et renvoie un message positif à l’oeil. C’est cet effet que j’ai voulu faire ressortir et aussi la reconnaissance rapide de l’oeil.
Symbolique du logo
Nous avons représenté les bras qui aident et donnent plutôt que de représenter le manque, comme sur l’ancien logo. Le triangle représente l’unité, la proportion, la sécurité et l’équilibre. Le «plus» signifie que chacun peut donner ou apporter son aide à une personne déficiente.
Changement de coloris
On ne modifie pas la couleur du logo mais l’on ajoute une couleur pour casser la redondance de vert et apporter une chaleur dans le «trans» et le «+».
Le but est de ne pas ennuyer l’oeil avec trop de vert mais équilibrer la part des couleurs.
Structure du logo
Les informations sont centrées les unes par rapport aux autres. Les éléments sont posés, aérés, l’espace entre eux est calculé ce qui permet à chacun d’être facilement lisible, quels que soient les supports (petit ou grand format) sur lesquels ils se trouvent.
Le moodboard
Pour pouvoir justifier mes choix mais aussi puiser de l’inspiration, j’ai établi un moodboard retraçant les aspects de Transhépate Bretagne-Ouest. Avec les photos des assemblées et des journées de fêtes, l’un des mots d’ordres de cette association est l’unité. Le don est aussi représenté avec les mains qui souhaitent recevoir et celle qui donne. J’y ai intégré la lumière, des conseils et recommandations que les membres reçoivent, pour égayer leur vie. J’ai aussi intégré la gratitude représenté par tous ces gens qui effectuent des dons
La charte graphique
Cette nouvelle identité visuelle réussit à donner une véritable signature à l’association, qui se traduit par la mise en place de codes, règles graphiques et la création d’un univers visuel associé. C’est avec la collaboration de ses membres, et dans le respect des règles établies, que cette nouvelle identité valorisera l’association Transhépate Bretagne-ouest et participera à sa prospérité.
UX : Travaux sur l'expérience utilisateur
Une conception centrée utilisateur
Le terme d’UX est souvent associé au numérique avec l’ampleur grandissante des nouvelles technologies, mais en réalité, l’expérience utilisateur ne s’y limite pas. Elle est omniprésente et essentielle.
Plus encore que les caractéristiques fonctionnelles ou techniques du produit ou du service que vous vendez, c’est toute l’expérience créée autour de lui et par lui qui est centrale : les sensations qu’il procure, la facilité qu’il apporte, les émotions qu’il fait naître, le souvenir qu’il laisse, etc. Cette expérience favorisera l’interaction d’une personne avec une enseigne et jouera en faveur d’une bonne relation client.
Les personas (cible)
UI : Travaux sur le design du site
Arborescence
Wireframe
Maquettes et prototypages
Les maquettes ont été faites sur le logiciel Figma. Grâce à ce logiciel qui est collaboratif, nous avons pu solliciter les clients pour des réunions pour la validation de fonctionnalités et de pages. Ces réunions régulières nous permettaient de faire des points sur l’avancement du site et des supports de communication.
Réalisations sur ce projet
Supports de communication print
Campagne "Nouvelle vie"
Cette campagne a été crée pour promouvoir l’association Transhépate Bretagne-Ouest. On y voit des personnes transplantés du foie qui arrivent à vivre leur vie malgré cette opération très difficile.
Affiche pour la journée nationale du don d'organes
Affiche pour la journée d'étude "les avancées de transplantation du foie"
Carte de visite
Kakémono devant le chu de Rennes
Flyer de présentation de l'association
Vidéo flyer et carte de visite
Ces supports de communication sont des éléments clés pour l’avenir de l’association. Ils sont de véritable vitrines pour l’association
Vidéo promotionnelle pour l'association et la création de leur site web
Ce support de documentation a pour but de présenter l’association sur les canaux de communication Web tels que le site internet Transhépate Bretagne-Ouest, les réseaux sociaux tels que Linkedin et Facebook. Le but était de produire un support de communication média pour les canaux les plus importants de nos jours, les réseaux.