Projets similaires
Design Produit, web, app, branding · De zéro à un · 2023-2025
Concevoir un logiciel de gestion de chantier qui fonctionne vraiment
Du Prototype à 2 000 Clients
Toolkit avait besoin de design produit pour lever des fonds et atteindre le product-market fit dans la construction tech. Pendant 12 mois, j'ai mené le design de bout en bout dans une équipe légère CEO-Dev-Designer avec validation continue auprès des utilisateurs. Nous avons livré trois versions majeures : prototype de financement (3 mois), V2 riche en fonctionnalités (5 mois) et V3 optimisée mobile (4 mois). Le produit a atteint 2 000 clients payants en 24 mois, sécurisé l'adoption entreprise dès le lancement et levé une Série A en novembre 2025.
Visiter Toolkit"Victor a travaillé avec Toolkit en tant que designer UX/UI dès les premières étapes. Nous avons mené ensemble des ateliers de découverte avant même de construire le produit, ce qui lui a permis de comprendre en profondeur l'industrie du bâtiment. Il a transformé des exigences métier complexes en parcours utilisateurs parfaitement adaptés, exactement ce dont une startup comme la nôtre avait besoin. Grâce à son expérience, Victor a aussi mis en place des systèmes fondamentaux (UI kit, patterns d'interaction) qui nous ont fait gagner un temps de développement considérable par la suite."
Pierre-Marie Nigay
Fondateur @ Toolkit
Toolkit App
Logiciel de gestion de chantier qui fonctionne vraiment.
Vue d'ensemble
Introduction
Les logiciels de construction sont écrasants. Les outils historiques empilent toutes les fonctionnalités dans des interfaces denses, forçant les utilisateurs à traverser des workflows complexes pour accomplir des tâches basiques. Les conducteurs de travaux jonglent entre plusieurs projets, les ouvriers sur site ont besoin de mises à jour rapides, et les équipes bureau demandent une planification détaillée. Une seule interface ne peut pas servir tous ces besoins de manière égale.
Toolkit a abordé le problème différemment. Plutôt que de construire une énième solution complète, nous nous sommes concentrés sur les workflows essentiels que les équipes de construction utilisent quotidiennement : planifier les tâches par zones, suivre l'avancement, gérer les documents, coordonner les équipes. Le défi était d'offrir de la sophistication sans complexité.
Mon rôle
J'ai rejoint l'équipe comme seul designer dans un trio. Le CEO apportait l'expertise métier acquise en années de recherche sur les workflows du bâtiment. Le lead développeur construisait les fondations techniques. Mon rôle : transformer les exigences business en un produit scalable que les utilisateurs adopteraient vraiment. Pas d'équipe design, pas de researchers, pas de product managers. Juste une collaboration serrée, une validation continue et des itérations rapides.
Projet et impact
Sur 12 mois, nous sommes passés du prototype de financement à la maturité plateforme. Chaque phase ajoutait de la sophistication tout en maintenant la simplicité. La révélation progressive cachait la complexité jusqu'au moment opportun. Les interfaces context-aware s'adaptaient aux tâches utilisateur. Les opérations par lot réduisaient les actions répétitives. La hiérarchie visuelle prévenait la surcharge d'information à grande échelle.
L'approche a fonctionné. Les clients entreprise ont déployé dès le lancement. Les utilisateurs gérant plus de 15 chantiers ont adopté la plateforme. Le produit a atteint 2 000 clients payants en 24 mois et sécurisé une levée Série A. Cette étude de cas montre comment nous y sommes arrivés.
Contexte et approche
Trois phases, du prototype de financement à la maturité plateforme. La Phase 1 a sécurisé le financement initial avec les fonctionnalités core. La Phase 2 a ajouté des interactions sophistiquées et le support multi-projets. La Phase 3 a atteint l'optimisation mobile et la scalabilité du design system. Résultat : 2 000 clients, adoption entreprise, Série A en moins de 24 mois.
Phase 1 · Mois 1-3
Fondation
Architecture core et workflows essentiels.
Livrables cles
•Architecture authentification & navigation
•Workflows creation & gestion projet
•Bibliotheque taches avec sequences drag-drop
•Planning V1 avec cartes colorees
•Systeme abonnement (individuel + entreprise)
•Export PDF
Défi design central
Interface de planification montrant la tension fondamentale : les projets de construction contiennent 50-100+ tâches réparties sur plusieurs zones et timelines.
Défi design central
Processus de recherche
Validation lean dans une équipe de trois. Microsoft Clarity fournissait l'analytics comportemental. Le CEO menait 5-7 appels utilisateurs par semaine.
Processus de recherche
Fondation
Scope MVP sécurisant le financement initial. Infrastructure core : auth sans mot de passe, navigation double sidebar, workflows projet.
Fondation
Workflow de création projet
Processus en quatre étapes, des bases du projet au lancement de l'équipe. Design en révélation progressive : étapes de setup visibles pendant la création, se réduisant automatiquement une fois le projet actif.
Workflow de création projet
Principes d'interaction core
Principes de design évitant la surcharge fonctionnelle. Révélation progressive, conscience du contexte, efficacité par lot, hiérarchie visuelle.
Principes d'interaction core
Phase 1 - Fondation
Première expérience
Authentification sans mot de passe
La connexion par magic link élimine la friction des mots de passe pour les ouvriers sur site.
Authentification sans mot de passe
État vide
Accueil des nouveaux utilisateurs avec navigation sidebar principale.
État vide
Pattern de formulaire
Approche mobile-first utilisée dans toute l'application.
Pattern de formulaire
Détail Chantier v1
Layout desktop initial établissant l'architecture double sidebar.
Détail Chantier v1
Détail Chantier v2
Métadonnées déplacées vers la vue d'édition. Seuls les contacts restent visibles.
Détail Chantier v2
Show and Hide navigation
Secondary sidebar collapsing and expanding on demand. Setup sections (zones, companies, task libraries) prominent during project creation, collapsing once project active. Operations sections (planning, documents, observations) surfacing as primary navigation. Progressive disclosure: complexity hidden until relevant, interface adapting to project lifecycle stage.
Navigation afficher/masquer
Sidebar secondaire se réduisant et s'étendant à la demande.
Tasks
Reusable templates with title, estimated duration, and responsible trade. Grouped in libraries by site type, they reduce repetitive data entry and ensure consistent information across projects.
Création de tâches
Création assistée pour ajout rapide et paramétrage de chaque phase.
Sequences
Ordered sets of tasks that populate the planning automatically when applied to a project. Sequences encode team expertise into repeatable workflows, cutting setup time significantly.
Séquences de tâches
Le templating fait partie de l'ADN de Toolkit. Le planificateur peut sauvegarder des séquences.
Planning
Gantt-style canvas organized by trade or zone. The initial version used colorful task cards for quick visual parsing. Later iterations refined the task component design and the interaction model around scheduling and multi-select.
Planning v1
Premier canvas avec esthétique de cartes colorées. Le poids visuel fonctionnait avec 10-15 tâches mais devenait écrasant à 50-100+ tâches.
Composant tâche v1
Tailles et variations multiples pour différents contextes.
Composant tâche v1
Composant tâche v2
Système raffiné avec quatre états. Hauteur réduite, couleurs désaturées.
Composant tâche v2
Planning v2
Évolution du canvas avec système visuel raffiné. Zones multiples et 50+ tâches visibles simultanément sans surcharger l'interface.
Planning v2
Multi-sélection
Glissement rectangulaire pour opérations par lot sur zones et timeline.
Multi-sélection
Menu contextuel
S'adaptant à la tâche sélectionnée avec actions priorisées.
Menu contextuel
Zoom adaptatif
Contrôles basculant entre échelles jour, semaine, mois.
Zoom adaptatif
Expand layout on planning view
To enhance ease of use on the planning we implemented a way to expand the layout to focus on task management, without getting confusion with navigation panel.
Extension du layout
Zoom avant et arrière sur le canvas pour meilleure concentration.
Phase 2 - Expansion fonctionnelle
La fondation validée, la Phase 2 s'est concentrée sur l'expansion des capacités tout en maintenant la simplicité. Nous avons introduit un système de menu dynamique qui s'adapte au contexte utilisateur, réduisant la charge cognitive et fluidifiant les workflows. Le défi était d'ajouter des fonctionnalités puissantes sans encombrer l'interface.
Système de menu dynamique
Le menu dynamique s'adapte au contexte de la tâche courante. En éditant une tâche, les actions pertinentes apparaissent immédiatement. En consultant les logs d'activité, les options de filtrage prennent la priorité. Cette conscience du contexte réduit les étapes de navigation et garde les utilisateurs concentrés sur leur workflow actuel.
Menu île dynamique
Modification de tâche contextuelle avec actions rapides.
Task manipulation in planning
Edit duration and task information on the fly directly from the planning canvas.
Manipulation de tâches
Modifier durée et informations à la volée.
Batch edition
Select a zone or multiple tasks on the canvas, apply parameters in 20 seconds. Users managing 50-100+ tasks need efficient ways to apply changes across groups.
Édition par lot
Sélectionner zone ou tâches, appliquer paramètres en 20 secondes.
Système d'interface
Architecture de composants pour le menu dynamique, assurant la cohérence dans tous les contextes.
Système d'interface
Section activité
Vue détail tâche avec menu dynamique, log d'activité et actions contextuelles.
Section activité
Phase 3 - Maturité plateforme
La Phase 3 a apporté la maturité plateforme avec le hub projet et l'évolution mobile. Les clients entreprise avaient besoin de gérer plusieurs chantiers depuis un dashboard unique. Les ouvriers sur site avaient besoin d'un accès mobile équivalent à l'expérience desktop. Nous avons livré les deux sans compromis.
Hub projet
Le hub projet offre une vue d'ensemble de tous les chantiers. Les managers peuvent rapidement évaluer l'avancement, identifier les blocages et explorer des projets spécifiques. Les indicateurs visuels font remonter les éléments urgents sans nécessiter une navigation profonde.
Hub projet v3
Dashboard multi-sites avec indicateurs de progression et filtres.
Mobile evolution
Construction happens on-site, often in challenging conditions. The mobile experience needed to be robust, fast, and usable with gloves. We redesigned the navigation system for touch-first interaction while maintaining feature parity with desktop.
Navigation mobile
Système de menu tactile avec support des gestes et zones d'action accessibles au pouce.
Fondation design system
Une équipe de trois personnes ne peut pas se permettre de redesigner des composants pour chaque fonctionnalité. Nous avons construit un design system qui scale avec le produit : composants réutilisables, patterns cohérents et langage visuel partagé. Cette fondation a permis une itération rapide tout en maintenant la qualité.
Design system
Bibliothèque de composants avec tokens, patterns et guidelines d'usage pour une implémentation cohérente.
Système d'icônes
Set d'icônes personnalisé pour fichiers et dossiers, optimisé pour la gestion documentaire du bâtiment.
Système d'icônes
Impact
L'approche design a livré des résultats business mesurables. En nous concentrant sur les workflows core et la complexité progressive, nous avons créé un produit que les clients entreprise comme les petites équipes pouvaient adopter rapidement. Les chiffres parlent d'eux-mêmes.
Impact projet
Métriques clés et jalons atteints sur le cycle de développement produit de 12 mois.
2 000+
Clients payants en 24 mois après le lancement
Série A
Financement sécurisé en novembre 2025
Entreprise
Clients gérant plus de 15 chantiers ont adopté dès le lancement