Projet : Manger sain à l'école

Les détails du projet

Pour qui ?

Une association qui agit pour une alimentation scolaire saine et équilibrée

Situation initiale ?

Manger sain à l’école est une association qui a créé de dizaines d’outils en open source pour faciliter le bien manger à l’école et qu’elle mettait à disposition gratuitement à travers un site web. L’association Bleu blanc zèbre qui porte le projet afin d’organiser les mises en relation institutionnelles a décidé de procéder à une refonte totale du backoffice de ce site qui n’était malheureusement pas à la hauteur de son impact, afin de le rendre plus attractif et de crédibiliser la démarche aux yeux des décideurs.

Objectifs recherchés ?

• Garder le contenu initial, tout en retravaillant à 100% la forme
• Avoir un site vitrine plus ergonomique, qui permette aux visiteurs de mieux comprendre la démarche et accéder aux outils
• Limiter au maximum les coûts de la mise en place - pas de budget car projet associatif

Solutions que j’ai apportées ?

• Un site vitrine simple et facile à prendre en main, même pour une personne qui n’est pas très à l’aise avec les outils informatiques
• Une centralisation de toutes les ressources dans une base de données connectée au site vitrine

‍

‍Mise en place de la solution

Etape 1 : Cadrage du projet

• définir les objectifs du site
• comprendre la démarche du site pour définir le nouveau parcours utilisateur et la nouvelle arborescence et ses pages : Accueil, Livre, Outils, La presse, Contact + pages légales
• définir le nouveau look & feel du site : couleurs vives, ambiance minimaliste, mais dynamique, logo en accord avec la thématique du site
• définir la structure de la base de donnée qui alimentera le répertoire de ressources disponible sur le site
• définir le wireframing des nouvelles pages pour organiser et présenter de la meilleure façon les contenus déjà existants

‍

Etape 2 : Exécution du projet

FRONTEND

Pour construire le site et afficher les différents documents, j’ai utilisé Softr qui est un constructeur d’interface et qui permet de se connecter/synchroniser avec la base de données pour afficher les modifications en temps réel.

‍

‍

BACKEND

Pour stocker et alimenter le site avec les bons documents, j’ai créé une base de données avec Airtable, organisée en 3 tables.

Chaque table alimente une ou plusieurs pages du site. Chaque modification dans Airtable s’affiche automatiquement sur le site.

• La Table “Documents” → cette table alimente la page “Outils” du site. Elle contient donc tous les documents téléchargeables, groupés par catégorie. Chaque catégorie de la base de données correspond au type de document qu’on visualise sur le site. Ce filtre permet donc d’afficher de façon dynamique dans chaque sous-page “Outil” que les documents concernant l’outil en question.
• La Table “Liens presse” → cette table alimente la page “La presse en parle”. Elle contient les différentes mentions du projet dans la presse, que ça soit des articles, des guides, des concours, avec leurs dates de publication, leurs descriptions, et les liens externes correspondants.
• La Table “Contacts” → cette table alimente la page “Contact”. Elle contient les différentes coordonnées des personnes qui se cachent derrière le projets : nom, prénom, photos, biographie, structures, liens sites web et réseaux sociaux

‍

‍

Etape 3 : Livraison du projet

Une fois finis les tests et vérifications de mon côté, j’ai livré le nouveau back-office du site à l’association porteuse du projet, avec son mode d’emploi complet sous forme de tutoriels vidéo disponibles sur une page Notion dédiée.

Grâce à cette documentation, l’association Bleu Blanc Zèbre est désormais autonome dans la gestion du site et peut se charger des derniers ajustements de contenu avant la mise en ligne du nouveau site. Cette mise en ligne devrait se faire d’ici fin 2022.

‍

‍

‍

Rembobine Valentina 🤔 Quels bénéfices a apporté ta solution ?

• Une expérience visiteur améliorée grâce à un parcours utilisateur plus simple et fluide
• Un site plus attractif qui crédibilise et valorise d’avantage la démarche de l’association auprès de sa cible
• Modifications rapides dans la base de données et disponibles en temps réel sur le site
• Coût de maintenance très réduit, car hébergement gratuit grâce à la version gratuite de Softr

‍

‍