Projet
Mouvement Intérieur
Le centre de dramathérapie et de théâtre social offre des salles insonorisées, une adhésion créative et un annuaire de dramathérapeute.
Genèse du projet
Un projet réel conçu comme pigiste
Ce projet est né d’une collaboration avec une amie qui lançait un centre de dramathérapie à Montréal. Elle avait besoin d’un site web professionnel pour appuyer son plan d’affaires. C’est donc mon premier contrat personnel complet, réalisé du début à la fin.
Objectifs
- Créer une maquette sur mesure selon les besoins de la cliente
- Intégrer le site dans WordPress avec le thème Divi
- Utiliser les illustrations fournies pour construire une identité visuelle cohérente
- Intégrer un formulaire MailerLite pour la gestion des abonnés
Technologies utilisées
- WordPress comme CMS de base.
- DIVI comme outil de construction d’un thème personnalisé
- CSS personnalisé pour ajuster le visuel qui m’était impossible à faire avec DIVI
Défis rencontrés
L’intégration du formulaire MailerLite a été complexe en raison des limites de la plateforme. J’ai dû adapter le design pour qu’il s’intègre harmonieusement au reste du site.
Autre défi : j’ai commencé la maquette trop tôt, avant d’avoir reçu le script final, ce qui m’a forcé à revoir plusieurs sections.
Ce que j’ai appris
Ce projet m’a permis de mieux comprendre les contraintes liées à Divi, notamment la manipulation du DOM en CSS. J’ai aussi appris à mieux planifier mes étapes de travail en fonction du contenu réel.
Historique
Le coup de fil d'une amie
Laurianne Brabant et Nathasa Williot ont développé le projet d’un centre de dramathérapie à Montréal. Ce centre se veut un endroit qui supportera les professionnels d’art-thérapie à pratiquer dans un endroit conçu selon leurs besoins.
Dans leur plan d’affaires, un site web était inévitable. C’est là que Laurianne m’a téléphoné.
Le code
Le duo WordPress & DIVI
Pour ce projet, j’ai opté pour WordPress avec le thème Divi. Pas par réflexe, mais parce que c’était la solution la plus adaptée aux besoins de la cliente :
- une structure claire et responsive
- une intégration fluide du contenu et des illustrations
- un environnement qu’elle pourrait facilement prendre en main
Divi m’a permis de construire rapidement les sections du site tout en gardant la liberté d’ajuster le design avec du CSS personnalisé. Ce n’est pas un outil que j’utilise systématiquement, mais ici, il s’est imposé comme le bon choix — à la fois efficace, souple et accessible.
CSS personnalisé
Malgré le grand éventail des possibilités qu’offre WP et DIVI, j’aime bien avoir du contrôle sur certains aspects par le code. C’est pour cette raison que j’ai manipulé les éléments du menu à l’aide du CSS. J’ai créé des classes permettant de manipuler les sections en flex que DIVI 4 n’offre pas. J’ai aussi créé du design avec des pseudo-classes ::before et ::after pour améliorer l’aspect visuel.
MailerLite
Mouvement Intérieur devait avoir des formulaires de contact et d’abonnement à une infolettre. Pour ce faire j’ai choisi d’y aller avec Mailerlite. La solution gratuite leur suffisait pour l’instant et je le connaissais bien.
J’ai mis en place le formulaire et améliorer l’aspect du code qu’ils fournissent pour l’intégration. J’ai pu le mettre aux couleurs du site.
J’ai fait, avec la cliente, un tour d’horizon de MailerLite pour leur montrer les fonctionnalités d’automatisation, et comment se servir des groupes pour organiser les contacts qui s’inscrivaient par le formulaire.
Fonctionnalités
Autres tâches connexes
- Prise en charge du domaine et de l’hébergement
- Création de compte email professionnel sur l’hébergeur
- Site bilingue
- Formulaire d’abonnement intégré
- Design responsive et illustratif
- Navigation simple et épurée
- Site administrable par la cliente