Soutenir l’économie locale en développant une application web

Local Heroes est une plateforme web créée en mars 2020 par l’équipe de Coteries, au début de la crise sanitaire du Covid-19. Avec un MVP (Minimum Viable Product) conçu et développé bénévolement en un weekend, ce projet offre une solution simple et gratuite aux commerçants locaux qui peuvent mettre en avant leur activité, leurs produits et leurs cours tout en continuant de développer leurs affaires. Les visiteurs peuvent quant à eux chercher et trouver ces héros locaux autour d’eux partout en Suisse, et les contacter directement pour acheter leurs produits ou participer à leurs activités proposées.

Local Heroes est un exemple parfait d’un produit que nous avons entièrement créé chez Coteries et où toute l’équipe a été fortement impliquée: conception, design, développement, marketing. Toute l’équipe a apporté ses compétences pour aider les commerçants locaux!

Expertises mises à profit:

• Brainstorming
• Conception de l’expérience utilisateur et de l’interface (UX/UI Design)
• Création de contenus
• Développement web
• Gestion de produit et gestion de projet
• Référencement naturel (SEO)
• Mise en place de balises et suivi du trafic (tracking)
• Promotion au moyen du marketing digital

En mars 2020, au début de la crise sanitaire liée au Covid-19, notre équipe, alors organisée rapidement en télétravail, a voulu apporter ses compétences digitales aux maraîchers et commerçants qui ont dû repenser leur façon de travailler face aux mesures sanitaires alors en vigueur.

À la manière d’un startup weekend, toute l’équipe a commencé à discuter un vendredi soir pour imaginer un concept qui permettrait d’apporter un soutien quotidien aux activités des producteurs et commerçants locaux.

Rapidement, l’idée d’une application web où chacun pourrait trouver des maraîchers et commerçants locaux autour de soi prend forme. Mettre ces professionnels des circuits courts en avant, tels des héros locaux, en leur permettant d’avoir un profil présenté avec une interface attractive devient l’objectif du projet.

Local Heroes est né!

La plateforme est dans un premier temps basée uniquement sur du contenu généré par les utilisateurs (“User Generated Content”), afin de pouvoir rapidement alimenter la plateforme avec du contenu de qualité et en quantité. Les héros peuvent donc être proposés par tout le monde et seront mis en avant uniformément.

L’application web est d’abord conçue pour trouver des héros locaux autour de soi en rentrant son code postal, avec une carte disponible. L’approche est optimisée pour une utilisation mobile et permet d’y accéder aussi bien sur son téléphone que sur un ordinateur de bureau.

L’équipe marketing travaille de concert avec l’équipe design pour créer une interface simple à utiliser et au design épuré. Les contenus sont élaborés pour faire passer des messages forts, clairs et pertinents.

L’identité visuelle est également définie autour d’un thème visuel frais, qui évoque le local et la durabilité, et qui vise à montrer cette dynamique de soutien envers les producteurs et commerçants.

Plus tard, les spécialistes UX de Coteries ont conçu d’autres fonctionnalités comme la revendication de profils, l’abonnement aux actualités des héros, la présentation de produits ou la proposition d’activités. Parfois, le contenu généré par les utilisateurs a pu poser quelques difficultés en termes de flux utilisateurs, mais tous les chemins ont été optimisés pour fonctionner idéalement.

La plateforme est développée sur mesure par nos ingénieurs, en utilisant le framework javascript React. Plusieurs développeurs travaillent sur le projet pour l’ajout de diverses fonctionnalités. La collaboration sur le code s’est faite aisément, grâce à une coordination interne optimale et une documentation de projet complète.

Un sous domaine est également créé pour intégrer un blog avec WordPress, gérable de manière autonome sans solliciter les développeurs et pour publier régulièrement du contenu en lien avec la plateforme.

La gestion de projet est un élément capital pour Local Heroes étant donné que toutes les équipes sont concernées. À la création, les idées fusaient et nous avons dû rapidement prioriser et organiser les tâches par équipe pour pouvoir annoncer le lancement de l’application web après le weekend.

Une fois lancée, le backlog, soit la liste des fonctionnalités à développer, était toujours chargé. Nous avons créé des “epics”, des groupes de tâches importantes, pour pouvoir suivre l’évolution de manière structurée et organiser le développement sur le long terme.

Local Heroes est un projet interne auquel nous ne pouvons pas toujours allouer énormément de ressources (et oui, car les clients avant tout, quand même!), mais nous établissons régulièrement des spécifications en fonction des designs et priorisons les fonctionnalités à développer.

La synchronisation entre les membres de l’équipe est ainsi toujours idéale: nous analysons les besoins, nous réalisons un design puis nous implémentons. Nous continuons aujourd’hui à développer la plateforme, notamment avec l’ajout récent d’activités pour les héros et les visiteurs.

La manière la plus durable pour acquérir du trafic pour Local Heroes est l’acquisition organique, plus que des campagnes publicitaires. L’optimisation du référencement naturel (SEO) est donc un point très important pour que la plateforme soit référencée, trouvée, et mise en avant sans investissements publicitaires majeurs.

Avec l’utilisation de framework JavaScript (React), il faut savoir que la tâche d’analyse des pages par les robots des moteurs de recherche est rendue plus complexe, car le rendu est généré côté client (sur la plateforme). Cela garantit une expérience optimale pour les visiteurs, mais les robots ont généralement du mal à lire le contenu, le navigateur et l’ordinateur (ou téléphone) des visiteurs s’occupant de générer le contenu à partir de fichiers JavaScript.

Pour pallier ce problème, nous avons rajouté du rendu dynamique, généré côté serveur, afin que les robots puissent lire de l’HTML simplifié tout en garantissant une expérience utilisateur optimale en tout temps.

Dorénavant, les robots peuvent donc lire les pages correctement et référencer dans les moteurs de recherche le contenu qui sera affiché aux visiteurs.

Avec ses 2’500 héros aujourd’hui, la plateforme dispose d’un large contenu qualitatif, mais impossible à optimiser – rapidement – à la main. C’est pourquoi nos ingénieurs ont dû trouver comment automatiser notamment:

• l’URL de chaque page, pour présenter des informations pertinentes sur le héros concerné directement dans l’adresse
• l’affichage des balises « méta » de chaque page, qui sont basées sur le contenu de la page et les caractéristiques de chaque héros
• la mise à jour et l’envoi du plan du site (sitemap) aux moteurs de recherche, pour une indexation quotidienne et régulière

De plus, nous avons naturellement fait en sorte que la structure des balises Hn soit cohérente.

Grâce à tout ceci, l’acquisition organique de Local Heroes représente aujourd’hui plus de 50% de son trafic. Mais le travail ne s’arrête pas là, nous devons encore optimiser les images de manière automatique, la gestion des langues pour les robots et… bien plus!

Pour bien comprendre comment est utilisé Local Heroes, nous devions mettre en place un suivi du trafic optimal.

Nous avons initialement implémenté Google Tag Manager et Google Analytics pour pouvoir suivre quelques actions utilisateurs concernant la plateforme, afin de savoir si les visiteurs avaient plutôt intérêt à mener telle ou telle action.

Nous avons intégré un suivi complet d’événements directement dans le code, structuré et optimisé. Google Tag Manager reçoit les événements et les envoie directement à Google Analytics. Nous disposons ainsi d’un suivi anonyme complet pour comprendre comment les visiteurs utilisent la plateforme, et ainsi nous permettre de l’améliorer. Le fait d’avoir un gestionnaire de balises entre l’application web et Google Analytics permet de gagner en souplesse et d’avoir plus de contrôle sur la gestion des données, et à terme, sur la gestion des cookies.

Le tout est reporté dans un rapport automatique Google Data Studio pour visualiser rapidement les données nécessaires à notre compréhension.

En marge de la gestion du contenu en collaboration avec l’équipe de design, nos spécialistes marketing ont mené diverses actions et campagnes pour promouvoir la plateforme auprès de diverses audiences, à plusieurs étapes de son développement.

Nous avons publié plusieurs communiqués de presse et avons eu la chance de pouvoir réaliser plusieurs interviews auprès de journalistes, qui auront repris dans divers médias des nouvelles à propos de Local Heroes, notamment:

• au lancement: La solidarité digitale s’organise sur Bilan
• L’explosion du commerce en ligne sur Heidi News
• Rendre désirable une économie durable sur Bilan
• Née avec la pandémie, la plateforme Local Heroes liste 2200 adresses

Les pages des réseaux sociaux ont été créées dès le lancement puis alimentées par nos soins. Local Heroes est présent sur Instagram, Facebook et dispose d’une page vitrine LinkedIn.

Nous avons réalisé diverses campagnes publicitaires au moyen de Facebook Ads: des campagnes de notoriété ou d’autres campagnes plus localisées (par exemple ciblée auprès des vacanciers en été 2020 pour inciter à chercher des héros locaux autour de leur lieu de vacances), généralement basées sur des objectifs de portée (reach).

Nous avons réalisé plusieurs campagnes d’emailing pour communiquer des nouvelles aux abonnés et aux héros: mises à jour de la plateforme, nouvelles opportunités et fonctionnalités, sondages, etc.

La publication régulière d’articles de blog offre à la communauté un point de repère pour se tenir informée des dernières nouveautés que nous mettons en avant. Côté SEO, nous pouvons rafraîchir le contenu et remonter dans les réseaux de recherche.

Aujourd’hui nous sommes fiers de contribuer activement au développement de l’économie locale avec Local Heroes, en étant au maximum à l’écoute de nos utilisateurs et en ajoutant des fonctionnalités répondant à leurs besoins concrets, liés à leur activité sur le terrain.

Ajoutez ou retrouvez vos héros locaux favoris sur la plateforme et devenez, peut-être, ambassadeur!