Ensemble pour Clémence

Rôle

Développeuse Web

Cours

Challenge Digitale sans Frontière en 1ère année de Bachelor Cycle Web et Multimédia

Client

Outils

WordPress, HTML, CSS, JS

Contexte et Recherche

Ce projet a été réalisé dans le cadre de la semaine Digitale Sans Frontière, organisée par MyDigitalSchool. L’objectif était d’aider une association, œuvrant dans le domaine de la santé ou de l’aide à la personne, en améliorant sa visibilité en ligne grâce à une identité visuelle, une présence sur les réseaux sociaux et un site vitrine fonctionnel. L’équipe était composée de quatre personnes : deux designers (Chevalier Rémy et Vernageau Anaïs) et deux développeurs (Le Brech Tristan et moi-même).

La recherche a consisté à comprendre les besoins de l’association, à analyser des sites associatifs existants et à définir une structure claire, accessible et facile à maintenir. Après cette phase d’étude, le choix s’est porté sur WordPress, un CMS permettant à l’association de gérer son site de manière autonome, grâce à un guide utilisateur rédigé par l’équipe. Par ailleurs, l’identité visuelle du site, comprenant le logo, la palette de couleurs et les bannières, a été conçue par les designers du groupe.

Difficultés

Le choix des outils, des extensions et de la structure devait permettre une prise en main rapide par l’association, assurer une cohérence entre l’identité visuelle créée par les designers et l’intégration technique du site.

Compétences transversales

Collaboration avec des designers et un autre développeur, pour livrer un projet cohérent et fonctionnel. Échanges avec l’association pour comprendre ses besoins, ses contraintes et ses attentes.

Identité visuelle

TYPOGRAPHIE

Poppins

Moderne et accessible

Une police sans empattement moderne, lisible et polyvalente, idéale pour concevoir un site web à la fois esthétique, accessible et agréable à consulter.

PALETTE DE COULEURS

La palette de couleurs repose sur des tons bleu, cyan et marron, créant une identité visuelle douce, rassurante et cohérente avec les valeurs de l’association.

LOGO

Symbolique et sentimental

Le logo utilisé pour le site est une reprise de l’ancien logo de l’association, représentant un dauphin. Ce symbole a été conservé, car il s’agit de l’animal préféré de Clémence, la jeune fille pour laquelle l’association a été fondée. Il constitue un élément fort de l’identité émotionnelle et historique de l’association.

Développement

Le site a été développé sous WordPress, avec une structure claire et facile à administrer par l’association. Des extensions comme LiteSpeed Cache, Kadence Blocks, Spectra, ReSmush.it, WP Code Lite et HelloAsso ont été utilisées pour optimiser les performances, enrichir les pages et intégrer les formulaires de dons et d’adhésion. Le site comprend un header et un footer personnalisés ainsi que cinq pages principales : Accueil, À propos de nous, Événements, HelloAsso et Contact.

#loader {
 position: fixed;
 top: 0;
 right: 0;
 bottom: 0;
 left: 0;
 display: flex;
 justify-content: center;
 background: rgba(255, 255, 255, 0.9);
 align-items: center;
 z-index: 999999;
 transition: opacity 0.4s ease;
}

Intégration du module HelloAsso

Implémentation des dons et adhésions directement sur le site, sans redirection externe.

Site dynamique et accessible

Animations, blocs modulaires, pages structurées et navigation fluide, grâce à Kadence Blocks et Spectra.

Maintenance facilitée

Choix de WordPress + rédaction d’un guide utilisateur, pour permettre à l’association de gérer son site en toute autonomie.

Conclusion et résultat final

Ce projet a été une expérience enrichissante, mêlant développement web, collaboration avec une équipe et relation client réelle. Il m’a permis de créer un site vitrine complet, dynamique et facile à maintenir, tout en contribuant à la visibilité d’une association engagée. Une réalisation professionnelle qui met en valeur mes compétences techniques, mon sens du travail en équipe et ma capacité à répondre à des besoins concrets.