Aller au contenu

Qomon : refonte web d'une plateforme de mobilisation internationale

Qomon aide les associations et ONG à coordonner bénévoles et communautés. Entre mobilisation locale et campagnes internationales, son site devait expliquer des usages différents sans perdre les responsables associatifs.

Qomon a fait appel à Gemeos, agence web spécialisée dans les associations, pour revoir l'UX/UI, la direction artistique, le développement Webflow et le SEO international.

Smartphone affichant la page tarifs mobile de Qomon « Purpose-built Plans & Pricing » avec curseur de contacts

Expliquer la mobilisation aux coordinateurs comme aux décideurs

Qomon s'adresse à des organisations dont les besoins vont de l'animation d'une communauté à la coordination des bénévoles ou à la gestion de campagnes. La présentation d'un logiciel international devait donc parler à deux niveaux : les équipes opérationnelles qui utilisent les outils au quotidien et les responsables qui évaluent leur impact. L'ancien parcours devait évoluer vers une lecture plus claire de ces cas d'usage.

Gemeos a travaillé une direction artistique compatible avec l'ADN engagé de Qomon, puis conçu des pages UX/UI pour les différentes fonctionnalités, les cas d'usage et la demande de démonstration. L'intégration Webflow et la structuration SEO ont été pensées pour soutenir les ressources de la plateforme et ses publics internationaux.

Industrie
Saas
Services
DA
UX/UI Design
Intégration
SEO
Pages web Qomon sur fond violet : accueil vert clair « Turn volunteers into doers » avec interface Teams

Direction artistique : Un univers SaaS engagé et international

La direction artistique de Qomon devait rendre visibles trois valeurs centrales : Innovation, Community et Impact. L'équipe Gemeos a développé un univers visuel moderne et ambitieux, aligné avec les codes des meilleurs SaaS internationaux tout en conservant l'ADN humain et engagé de la marque.

Élément DAApproche
Univers visuelSaaS premium, engagé et international
Écrans produitDémonstration de l'interface mobile & desktop
PhotographieHumain, terrain, bénévoles en action
AnimationsInteractions orientées engagement & action
  • Typographie de Qomon, « Aa » blanc et citron sur fond violet
  • Palette animée Qomon : violet, citron, rose et encre
  1. Concept 1 : Humain & Engagé

    Un hero photographique plein écran avec des portraits de militants souriants qui installe immédiatement l'émotion et l'engagement citoyen. Le fond prune profond de la page crée un univers distinctif et mémorable. Les cards features en rose poudré avec photos de terrain et stats produit alternent émotion et preuve fonctionnelle. Une direction chaleureuse et militante qui parle directement aux organisations associatives et aux équipes de campagne.

  2. Concept 2 : Blanc & Feature-First

    Un design épuré sur fond blanc qui met le produit et ses fonctionnalités au premier plan. Le hero splitté texte/interface démontre la puissance de la plateforme dès le premier regard. La grille de features en quatre cards, CRM, Mobilisation Terrain, Mobile, API, structure l'offre de façon claire et exhaustive. Une direction plus SaaS et professionnelle, pensée pour des décideurs qui veulent évaluer l'outil avant de s'engager.

  3. Concept 3 : Vert Acide & Bold

    Un parti pris graphique radical avec vert acide comme couleur signature qui tranche avec tous les codes habituels du civic tech. Le hero blanc avec typographie extra-bold en noir et blocs colorés vifs crée un impact immédiat. La capture produit pleine largeur démontre la richesse de l'interface. Le bloc testimonial sur fond vert acide avec grande citation est percutant et mémorable. Une direction audacieuse et énergique qui positionne Qomon comme un acteur qui ose bousculer les codes de son secteur.

Maquette de page d’accueil Qomon : deux personnes souriantes, titre « Passez à l’action avec Qomon » et logos partenaires
Concept 1
Ordinateur portable affichant le fichier Figma de Qomon avec les maquettes des pages du site en vert, rose et violet

UX/UI Design : Des pages qui convertissent les organisations en clients

Le design UX/UI des pages de Qomon distingue deux cibles principales : les “doers” (coordinateurs terrain, gestionnaires de campagne) et les “dreamers” (directeurs, responsables de causes). Chaque section démonstre clairement la valeur produit et pousse à l'essai ou la démo.

Page designéeObjectif UX
HomepagePitch de la plateforme, CTA essai gratuit
Pages fonctionnalitésMobilisation, data & CRM, campagnes
Pages use casesONG, associations, mouvements politiques
Page pricingPlans adaptés aux organisations mid-market
Page aboutMission, équipe, impact (70 pays, 1 000 causes)
  • Cartes violettes Qomon For NonProfits et Qomon For Advocacy avec leurs photos, sur fond citron
  • iPhone dont la page défile, sur fond rose, ouvert sur la page Plans & Pricing mobile de Qomon
  • Carte citron « Qomon Campaign Offer » à 650 € pour toute la campagne, sur fond violet
Page tarifs mobile du site Qomon sur smartphone : « Purpose-built Plans & Pricing », curseur de contacts et devise

Intégration Webflow : Un site international performant

Le développement Webflow de Qomon a été pensé pour une audience internationale. Le site est responsive et intègre les meilleures pratiques techniques pour garantir performance et maintenabilité.

Aspect techniqueDétail
PlateformeWebflow
ResponsiveDesktop, tablette et mobile
LocalisationSite international (EN prioritaire)
PerformanceOptimisation core web vitals
CMSBlog et ressources en Webflow CMS
  • Bandeau violet de chiffres clés Qomon : +2k bénévoles, 5000 actions, 340 sympathisants, sur fond citron
Page CRM du site Qomon sur ordinateur portable, titre « Centralize Your Data » et aperçu des équipes, fond rose

SEO : Visibilité internationale pour une plateforme à fort potentiel

La stratégie SEO de Qomon a été pensée pour conquérir les classements sur des requêtes stratégiques en anglais et en français : volunteer management software, plateforme mobilisation ONG, logiciel bénévoles. L'optimisation on-page, la structure technique et le maillage interne ont été traités pour maximiser la visibilité dans les marchés cibles.

Axe SEOAction
Recherche de mots-clésEN + FR, NGO / politique / bénévoles
Optimisation on-pageTitres, meta, Hn, alt texts
SEO techniqueVitesse, structure URL, sitemap
Maillage interneLiens entre use cases et fonctionnalités
Contenu SEOPages ciblées sur requêtes à fort intent
  • Cartes de la section « Trusted. Awarded. » de Qomon : badges SourceForge, Slashdot et Capterra, changelog et prix Campaigns & Elections, sur fond rose

Nos dernières réalisations

+250 entreprises accompagnées

Des sites designés et développés avec

Voir tous les projets

Vous allez notre collaboration, c’est garanti

Prêt à faire décoller votre activité ?

demander un devis

Let’s f*****G GO !!