Logo Bathyscaphe

Un nouveau site pour
La Cravate Solidaire !

Depuis 2015, l’agence Bathyscaphe accompagne la cravate solidaire dans le cadre d’un mécénat de compétences. Pour en savoir plus, cliquez ici

De cette collaboration solidaire, différents outils de communication ont vu le jour : plaquettes commerciales et pédagogiques, films événementiels et institutionnels, motion designs, vitrophanie, flocage intégral d’un bus… autant d’actions destinées à faire connaître l’association et ses actions !
Mais un projet d’envergure a été entamé en 2021 : la refonte du site internet de l’association.

La première mission de Bathyscaphe à bien entendu été d’accompagner la Cravate solidaire dans la définition de ses besoins.

Yann Lotodé – Directeur du développement national, comment cet accompagnement t’a permis d’avancer ?

L’accompagnement proposé par l’agence nous a permis de structurer notre besoin et les objectifs de l’association.
La Cravate Solidaire se développe fortement chaque année, il était donc important pour nous d’avoir un regard extérieur pour présenter l’association, ses valeurs, ses missions et ses projets de façon claire.

Une fois l’ensemble des besoins « rassemblés », Marine, notre directrice de clientèle a structuré une arborescence. Simple Marine, d’organiser tant de contenus ?

Nous accompagnons La Cravate Solidaire depuis longtemps et travaillons avec eux régulièrement, nous les connaissons donc plutôt bien. De prime abord, cette connaissance de leurs valeurs et leurs actions peut sembler être un atout pour la construction de l’arborescence du nouveau site. Mais il ne faut pas tomber dans le piège ! Pour imaginer une arborescence, il faut vraiment prendre de la hauteur.

À mon sens, il y a deux éléments primordiaux. Le premier, c’est de comprendre les enjeux du site définis par La Cravate. Le second, c’est de se mettre à la place d’une personne qui ne connait pas l’association. Comment organiser l’ensemble des contenus pour que cette personne puisse trouver l’information qu’elle est venue chercher en 3 clics maximum, et de manière instinctive ? L’idée est alors de catégoriser, d’organiser, de faire et parfois de défaire pour proposer l’arborescence la plus simple et la plus logique possible. Proposer une arborescence efficiente n’est jamais simple, mais avec ces deux clés, c’est déjà plus facile !

 

« Il était surtout important qu’il puisse y avoir des passerelles efficaces et intuitives pour permettre une navigation fluide et à 360°. »

 

C’est cette ossature qui a permis à La Cravate Solidaire de rédiger les différents contenus, comment cela t’a permis d’avancer Yann ?

Une fois l’arborescence créée, nous avons pris la mesure des contenus à rédiger. Nous les avons structurés avec l’ensemble des équipes au niveau national. Au total plus d’une vingtaine de rédacteurs se sont mobilisés pour livrer des textes clairs et adaptés à une lecture digitale.
L’agence Bathyscaphe a ensuite assuré une relecture globale pour apporter de l’harmonie dans le ton et dans le style. Ainsi notre discours est cohérent sur le fond et sur la forme !

Cette arborescence a également permis d’imaginer un univers graphique en totale cohérence avec l’image de la cravate. Apolline comment tu as abordé la création du site ?

L’ancien site internet avait été réalisé il y a presque 10 ans, il était temps de lui apporter un coup de jeune et de lui donner une place centrale dans la communication de l’association. Nous souhaitions que le site soit à leur image : énergique et plein de vie. Cela tombe bien car l’univers graphique de l’association, que nous avons le plaisir de faire vivre et évoluer depuis des années, est en adéquation avec leur tempérament et se prête donc très bien à une lecture digitale.

Graphiquement, le site interpelle dès « la home ». Des aplats francs, aux teintes colorées et joyeuses, des encadrés qui organisent les modules, et surtout de belles places aux photos, qui illustrent les actions et surtout les acteurs de l’association. Les bénévoles, les bénéficiaires et les équipes dirigeantes sont au cœur de la plateforme et font vivre les pages.

Il était surtout important qu’il puisse y avoir des passerelles efficaces et intuitives pour permettre une navigation fluide et à 360°. Pouvoir passer d’une page à une autre sans se perdre, sans hésiter, avec simplicité à guider notre travail. L’arborescence ayant été pensée dans cette optique, il s’agissait de suivre sa logique pour en renforcer les effets.

Les pages conçues apportent des informations clés pour mieux comprendre les actions de La Cravate Solidaire, pour demander un accompagnement, proposer son soutien, suivre son actualité et son évolution. Et je pense sans me tromper, qu’elles donnent envie d’adhérer !

 

Yann, cette première piste répondait à tes attentes ?

Oui totalement ! Cela nous a rassurés d’avoir une création validée et des pages thématiques déclinées avant même que CodePhenix commence à coder le site internet.
C’était assez magique de pouvoir avoir un template à remplir en ligne et cela a permis à nos équipes et à moi-même de bien nous projeter pour rédiger les contenus.

Création validée, pages thématiques déclinées, le site a pu être envoyé à Brieuc, dirigeant de l’association CodePhenix.

Brieuc, en quelques mots tu nous présentes CodePhenix ?

CodePhenix est une association née il y a 4 ans avec un objectif clair : permettre aux sortants de prison de profiter des opportunités d’emploi du milieu du numérique pour réussir leur réinsertion et éviter la récidive. Pour cela, nous avons imaginé et mis en place un programme organisé autour de 3 axes : formation, expérience professionnelle et préparation au retour à l’emploi

Concrètement, nous formons des personnes, en milieu carcéral (et donc sans accès à internet) à l’intégration web durant 6 mois, puis nous les employons au sein de notre agence web en détention où ils vont pouvoir développer une première expérience professionnelle. Enfin, en parallèle de tout cela, nous consacrons du temps aux techniques de recherche d’emploi et nous faisons intervenir un maximum de professionnels du secteur afin que nos apprenants puissent échanger avec eux, mieux cerner le milieu du numérique et sortir du syndrome de l’imposteur.

Comment s’est passée cette mission en collaboration avec LCS et Bathyscaphe ?

Très bien ! Nous connaissions bien La Cravate Solidaire et nous étions très fiers qu’ils nous choisissent pour participer à la refonte de leur site internet. Nos apprenants détenus sont particulièrement motivés à travailler sur des projets porteurs de sens et ont montré leur enthousiasme dès que je leur ai parlé de la prestation.
La collaboration avec Bathyscaphe s’est très bien passée. Après les réunions de cadrages, nous avons reçu des maquettes très claires, jolies et ambitieuses : tout ce qu’on aime ! Les apprenants n’avaient presque plus qu’à les intégrer, puis à prendre en compte les retours de l’agence.
Finalement, c’est sûrement l’un des projets grâce auquel nos apprenants ont le plus progressé techniquement et ont pu se rendre compte de l’exigence que l’on attend d’intégrateurs professionnels.

Apolline, Marine comment avez-vous supervisé le développement avec CodePhenix?

Marine : Quel que soit le partenaire avec lequel nous travaillons sur le développement des sites que nous créons, nous procédons toujours de la même manière : le partenaire est impliqué très vite dans le projet. Dès la première phase de création, nous partageons avec lui les pages imaginées. Cela nous permet de nous assurer que tout est bien réalisable (et dans le budget prévu). Il est à notre sens primordial qu’un expert technique du développement nous confirme qu’il est en mesure de réaliser ce que nous imaginons. C’est donc ce que nous avons mis en place avec CodePhenix, assez naturellement. Au fil des pages déclinées, Brieuc nous confirmait la faisabilité des fonctionnalités techniques avant que nous partagions ces pages avec La Cravate Solidaire. Une fois l’ensemble des pages validées, nous avons transmis les fichiers sources à Brieuc pour développement, et avons de nouveau organisé une réunion de travail pour présenter les sources, et évoquer les points de vigilance à avoir.

Apolline : Au cours de développement du site par CodePhenix, nous avons pu opérer un suivi et remonter des informations de recettage sur l’ensemble du site. Il s’agit alors de s’assurer que le développement des pages par Brieuc et ses équipes est bien conforme aux créations de pages validées par La Cravate Solidaire.
Nos demandes de corrections, organisées par pages et catégories ont ainsi pu être prises en compte au fil de l’eau, ce qui a, nous l’espérons, facilité le bon déroulement du développement du site et permis d’assurer une mise en ligne sans faille.

Il s’agissait pour nous d’une première collaboration avec Code Phoenix, et elle s’est très bien déroulée. Brieuc et ses équipes ont su comprendre notre création et la reproduire de manière fidèle. C’est une première que nous réitérerons !

Le site est en ligne depuis le 1er mars. Un site contemporain à la navigation fluide et à l’image de La Cravate Solidaire, n’est-ce pas Yann ?

Notre ancien site n’était plus à notre image. Normal ! L’association a grandi, mûrit en 13 ans… L’ancien site lui, n’a que très peu évolué.
Nous avons depuis le 1er mars un site qui correspond à notre image !
Nos bénévoles, partenaires, équipes et administrateurs ont accueilli avec joie cette nouvelle version digitale de nous 😉

Merci à l’agence pour ce magnifique travail dont nous avions bien besoin.

Découvrez le nouveau site de La Cravate Solidaire ici