Type de projet :
Modèle de vidéo éducative / Qualité & management des processus
Sujet :
Sensibilisation à la maîtrise des processus dans un contexte ISO
Objectif
Explorer comment l’animation peut simplifier la compréhension d’une exigence technique
Outils :
Adobe After Effects, Adobe Premiere Pro
Le contexte
Lorsque la Fondation Peniel m'a confié la refonte de son site web, celui-ci remplissait sa fonction de présence en ligne, mais n'offrait plus une expérience à la hauteur de l'image que l'organisation souhaitait projeter.
L'identité visuelle était peu exploitée, la navigation manquait de fluidité et plusieurs éléments interactifs, comme certains boutons et liens, ne fonctionnaient plus correctement ou redirigeaient vers des pages inadaptées.
L'objectif de cette refonte n'était donc pas uniquement de moderniser le design, mais de redonner au site son rôle de véritable outil de communication.
Les priorités de la refonte
Avant toute intervention graphique, j'ai identifié les principaux points de friction.
La refonte s'est articulée autour de plusieurs objectifs :
- mieux exploiter l'identité visuelle de la Fondation ;
- rendre la navigation plus intuitive ;
- corriger les liens et fonctionnalités défaillants ;
- améliorer la lisibilité des contenus ;
- moderniser l'interface tout en conservant une utilisation simple.
Chaque amélioration devait contribuer à renforcer la crédibilité du site et faciliter l'accès à l'information.
Découvrez la version de démonstration du site repensé pour la Fondation Peniel. Cette prévisualisation présente les améliorations apportées en termes de design, d'expérience utilisateur et de structuration des contenus, avant son déploiement sur le domaine officiel.
👉 Voir le projet : https://dev.tsadoq.io/fondation-peniel/
Une refonte pensée pour les visiteurs
Au-delà de l'aspect esthétique, j'ai repensé l'organisation des contenus afin de guider plus naturellement les visiteurs.
Les couleurs de la Fondation ont été davantage intégrées pour renforcer la cohérence de l'identité visuelle, tandis que la hiérarchie des informations a été revue pour mettre en valeur les missions, les actions et les appels à l'engagement.
L'expérience utilisateur a également été améliorée grâce à une navigation plus claire et à la correction des éléments interactifs qui nuisaient au parcours des visiteurs.
Avant / Après
La vidéo ci-dessus illustre l'évolution du site entre son état initial et sa version repensée.
Au-delà du changement visuel, elle met en évidence un travail de restructuration visant à offrir une expérience plus fluide, plus cohérente et plus professionnelle.
| Avant | Après |
|---|---|
| Identité visuelle de la Fondation peu exploitée | Couleurs et éléments graphiques mieux intégrés pour renforcer la cohérence visuelle |
| Navigation peu intuitive et certains éléments non fonctionnels | Parcours utilisateur amélioré avec des liens et boutons mieux structurés |
| Interface avec une présentation basique | Design modernisé avec une mise en page plus claire et plus professionnelle |
| Informations difficiles à parcourir rapidement | Contenus mieux hiérarchisés pour faciliter la lecture et l'accès à l'information |
| Site ne reflétant pas pleinement l'image de l'organisation | Une vitrine digitale plus cohérente avec les valeurs et les actions de la Fondation |
.comparison-table {
width: 100%;
overflow-x: auto;
}
.comparison-table table {
width: 100%;
border-collapse: collapse;
font-size: 16px;
}
.comparison-table th,
.comparison-table td {
padding: 16px;
text-align: left;
border: 1px solid #e5e5e5;
vertical-align: top;
}
.comparison-table th {
font-weight: 700;
}
.comparison-table td:first-child {
width: 50%;
}
.comparison-table td:last-child {
width: 50%;
}
Ce que ce projet m'a appris
Une refonte réussie ne consiste pas simplement à remplacer un ancien design par un nouveau.
Elle consiste à comprendre les difficultés rencontrées par les visiteurs, à corriger les points de blocage et à construire une expérience qui inspire confiance dès les premières interactions.
C'est cette approche que j'essaie d'appliquer à chacun de mes projets : utiliser le design comme un levier de clarté, de crédibilité et d'impact.