Étude de cas : Nexivo, l'application compagnon intelligente pour Connect-IT25

Chez We Do Dev Work, nous sommes spécialisés dans la création de solutions logicielles sur mesure qui répondent à des défis concrets. En partenariat avec les organisateurs de Connect-IT25, nous avons eu pour mission de concevoir une application capable d'enrichir l'expérience des participants de manière significative. Le résultat est Nexivo, une application compagnon intuitive conçue pour aider les visiteurs à s'orienter sur le site, à créer leur propre programme et à interagir avec les autres participants en temps réel.

Avec un délai serré de 5 semaines, nous avons immédiatement mobilisé notre équipe de design. Nous avons élaboré des wireframes détaillés qui nous ont permis de discuter et de finaliser un périmètre clair en quelques jours seulement. Une fois les attentes définies, nous avons commencé à concevoir l'expérience utilisateur et les interfaces de l'application. Heureusement pour nous, Connect-IT25 possédait déjà une identité de marque établie, ce qui nous a permis de nous concentrer principalement sur l'ergonomie de l'application.

En raison du calendrier restreint, nous avons travaillé simultanément sur l'architecture technique pendant que les maquettes UI étaient finalisées. Notre équipe d'ingénierie devait concevoir une base évolutive capable de gérer des centaines de participants sans latence.

Après seulement une semaine de design et d'architecture, notre équipe de développement a commencé le codage. Sans surprise, certaines fonctionnalités ont dû être affinées en cours de route. Grâce à notre approche de développement agile, nous avons pu alterner rapidement entre la refonte d'une fonctionnalité et sa réintégration en développement.

En l'espace de 3 semaines, nous disposions d'une solution testable hébergée sur un environnement bêta, que Connect-IT25 a utilisé pour nous faire part de retours précieux. Cela nous a laissé 2 semaines pour peaufiner l'application et même ajouter des fonctionnalités supplémentaires ! Le résultat : une livraison impeccable juste avant le début de l'événement.

Grâce à une planification rigoureuse, une conception centrée sur l'essentiel pour l'utilisateur, des choix technologiques judicieux et une phase de développement agile, nous avons pu bâtir Nexivo de zéro en seulement 5 semaines et dépasser les attentes ! Plongeons plus en détail dans nos choix et leurs raisons.

Choix de design

Avant de passer au design, nous nous sommes fait une priorité de comprendre les besoins des participants et des organisateurs. Notre phase de recherche devait être rapide, mais ultra-ciblée. Nous avons combiné analyse des utilisateurs, étude de la concurrence et prototypage rapide pour passer efficacement de l'idée à l'exécution.

Voici notre approche :
Étape 1 - Recueil des besoins client : Notre processus a débuté par une session de découverte approfondie avec l'organisateur.
Étape 2 - Discussion d'équipe et cadrage : Avec les retours des organisateurs, nous avons mené des ateliers collaboratifs avec nos équipes produit, design et développement.
Étape 3 - Analyse concurrentielle : Pour mieux comprendre les standards du secteur et les attentes des utilisateurs.
Étape 4 - Wireframing : Nous avons utilisé des wireframes basse fidélité sur Figma pour tracer les flux et mises en page clés avant de passer à l'interface haute fidélité.
Étape 5 - Décisions de design : Sur la base de nos recherches, les principes suivants ont façonné l'interface finale :

Navigation minimaliste : Seulement 5 onglets en bas — Accueil, Calendrier, Infos, Participants et Social.
Écran d'accueil contextuel : Affichage des informations cruciales, des sessions en cours et à venir avec des actions rapides.
Hiérarchie visuelle : Les horaires des sessions, les numéros de salles et les noms des intervenants sont faciles à scanner d'un coup d'œil.

Ce processus de recherche structuré nous a permis d'avancer vite tout en restant centrés sur l'utilisateur. Cela garantissait que Nexivo soit non seulement construit rapidement, mais surtout bien construit.

Bien que Nexivo ait été conçu pour Connect-IT25, nous savions dès le départ que l'application devait être réutilisable pour de futurs événements, chacun ayant son propre branding et son identité visuelle. Pour résoudre ce problème, nous avons construit Nexivo sur un framework de design flexible capable de s'adapter facilement à n'importe quelle identité visuelle (CI) sans modifier la structure de base. Nous avons implémenté un système de thèmes permettant aux organisateurs d'intégrer leurs couleurs de marque et leurs préférences typographiques. Tous les composants (boutons, cartes, barres de navigation) suivent des règles d'espacement cohérentes et utilisent des jetons (tokens) pour les marges, les couleurs et les tailles de police.

De plus, l'un des points forts de Nexivo est la simplicité des interactions en temps réel entre participants, à l'image des plateformes de communication modernes. Nous avons introduit un onglet Social dédié comprenant deux outils : Communauté et Messagerie Directe. La fonction Communauté propose des canaux de discussion ouverts pour partager des expériences, tandis que la Messagerie Directe permet des connexions privées pour un networking plus qualitatif.

Choix techniques

Les décisions architecturales clés incluaient le choix du backend, du framework frontend et du lieu de déploiement. Nous avions plusieurs contraintes majeures :
L'application doit supporter de nombreux utilisateurs simultanés.
Le support mobile est indispensable.
Les frameworks et technologies choisis doivent permettre un développement rapide.

Compte tenu de ces contraintes, voici nos choix :

Puisque notre backend doit gérer l'authentification, les websockets, le CRUD classique des événements et des profils, ainsi que le stockage de fichiers, nous avons opté pour Supabase. Supabase est un backend open source qui intègre nativement la plupart de ces fonctionnalités. C'est un avantage majeur car l'utilisation de ces outils prêts à l'emploi nous fait gagner un temps précieux normalement alloué à l'écriture des gestionnaires d'auth, d'upload ou d'API. Bien que Supabase puisse être auto-hébergé, nous avons choisi une offre cloud pour ne pas avoir à gérer l'infrastructure, libérant ainsi du temps pour le développement.

Pour le frontend, nous avons d'abord choisi de créer une PWA plutôt que d'utiliser un framework mobile natif ou agnostique. Nous savions que les utilisateurs seraient presque exclusivement sur mobile, mais pour accélérer le développement, il nous fallait un framework agnostique. Nous avons donc écarté le développement natif Kotlin ou Swift. Le choix de la PWA s'est imposé par le système d'authentification prévu : les utilisateurs reçoivent un e-mail avec un jeton de connexion. Une PWA permet de se connecter immédiatement sans passer par un store d'applications, évitant ainsi un parcours utilisateur fastidieux.

Nous avons choisi NextJS pour bâtir cette PWA. Le rendu côté serveur (SSR) nous offre une grande flexibilité. Nous pouvons mettre en cache les données sur le serveur pour accélérer les temps de chargement, offrant une expérience fluide proche d'une application native. Les pages peuvent être pré-chargées avec les informations de l'événement et du profil, garantissant des performances exceptionnelles. Comme nous maîtrisons parfaitement NextJS chez WDDW, nous avons pu livrer les fonctionnalités rapidement tout en optimisant l'ensemble.

Pour l'hébergement frontend, nous avons choisi AWS Amplify, principalement pour sa configuration CDN intégrée et ses pipelines de déploiement. Le service gère également l'auto-scaling nativement, réduisant la gestion d'infrastructure critique.

Cependant, tout n'a pas été simple malgré cette stack technique. Voici les leçons que nous en avons tirées :

• Le type de jeton requis pour l'authentification n'était pas un lien magique classique ; nous avons dû développer notre propre jeton temporel utilisable pendant toute la durée de l'événement. Cela a permis aux utilisateurs d'ouvrir l'application dans différents navigateurs ou plusieurs fois par jour.

• Un problème récurrent concernait l'ouverture du clavier dans l'interface de chat, qui ne redimensionnait pas correctement la PWA. Nous l'avons résolu avec des gestionnaires de redimensionnement personnalisés, un souci qui ne se poserait pas avec un framework natif.

• Le rendu côté serveur ajoute une couche de complexité. Nous avons passé beaucoup de temps à optimiser les performances, du temps qui aurait pu servir au développement de fonctionnalités. Nous sommes ravis du résultat, mais cela n'a été possible que grâce à notre expertise approfondie de NextJS.