Application web vente et SAV

PORTAIL ÉQUIPEMENTS

Catalogue / Ingénierie / Administration

Un portail de vente et de service après-vente d'équipements qui réunit les tarifs distributeurs, le dimensionnement de compresseurs, les calculs techniques et le diagnostic de pannes dans un espace adapté à chaque rôle.

Tableau de bord du portail d'équipements, sans marque, avec les outils commerciaux et techniques

Faites glisser pour voir la suite →

01

Portail de vente et de SAV d'équipements

Un espace de vente technique pour les équipements industriels à air comprimé. Les équipes des distributeurs doivent trouver le bon produit, consulter leurs tarifs, vérifier une caractéristique technique et résoudre un problème de SAV sans perdre le fil.

L'application réunit ces tâches dans un portail adapté aux rôles, pour les distributeurs et les administrateurs. Elle couvre le choix des produits et le service après-vente ; la commande, le paiement et l'encaissement ne font pas partie de ce projet.

Cette présentation utilise une identité générique et des données commerciales fictives. La marque de l'entreprise et les données clients ne sont pas incluses.

02

Un espace de travail complet

Produits et tarifs
Catalogue avec recherche, filtres par catégorie, fiches techniques, accessoires associés, tarifs par niveau et prix spécifiques par distributeur.
Choix de l'équipement
Dimensionnement des compresseurs à partir du débit d'air et de la pression, avec réglages de compensation et recommandations de sécheurs adaptés.
Ingénierie
Quatorze calculateurs : pression, débit, puissance, coût énergétique, fuites d'air, perte de charge, réservoirs, sécheurs et dimensionnement électrique.
Support SAV
Une bibliothèque de pannes avec recherche, un dépannage guidé, des références de modèles, causes, contrôles, solutions et outils pour techniciens.
Bibliothèque de documents
Fiches techniques liées aux produits, avec recherche et téléchargement. La démo ouvre un écran d'exemple clairement identifié.
Administration
Produits, imports CSV, catégories, tarifs, distributeurs, accès utilisateurs, fabricants, modèles, documents et édition des guides de pannes.

Démo en ligne

Essayez par vous-même

Choisissez Technicien distributeur ou Administrateur. Vos modifications sont conservées temporairement en mémoire sur le serveur, le temps de votre session ; « Reset demo » restaure les données d'exemple. Aucun compte réel, paiement ni service d'e-mail n'est connecté. L'interface de la démo est en anglais.

Plein écran↗
Catalogue produits avec équipements génériques, caractéristiques et prix distributeur

Faites glisser pour voir la suite →

03

Du catalogue à la bonne spécification

  1. Trouver l'équipement. Recherche par caractéristiques et filtrage du catalogue par catégorie.
  2. Comparer les caractéristiques. Débit d'air, pression de service, puissance moteur, alimentation et autres détails techniques.
  3. Voir le bon prix. Le moteur de tarification applique d'abord les prix spécifiques du distributeur, puis son niveau tarifaire.
  4. Compléter la sélection. Sécheurs, réservoirs, filtres, purgeurs, kits d'entretien compatibles et fiches techniques associées.
Outil de dimensionnement de compresseurs avec les besoins saisis et les équipements calculés

Faites glisser pour voir la suite →

04

L'ingénierie au moment de la décision

Le dimensionnement relie la demande en air et les conditions d'utilisation aux équipements possibles. La bibliothèque d'exemple contient 123 compresseurs et 29 sécheurs, avec un facteur de compensation du débit réglable.

Calculs disponibles

  • Conversions d'unités de pression, débit et puissance, et conversion en débit d'air libre
  • Diamètre de tuyauterie, perte de charge, dimensionnement des réservoirs et sécheurs
  • Coût énergétique, économies de la vitesse variable, coût des fuites et des pertes de pression
  • Dimensionnement des câbles et disjoncteurs

Ces outils fournissent des résultats de calcul à vérifier ; ils ne remplacent ni les spécifications des équipements ni l'avis d'un ingénieur qualifié.

Dépannage guidé sur mobile

05

Le SAV sur le terrain

À partir d'une panne signalée, les techniciens suivent un parcours de diagnostic structuré, avec le fabricant et le modèle lorsqu'ils sont connus. La bibliothèque de la démo contient 68 fiches de pannes.

Chaque fiche peut regrouper symptômes, causes probables, contrôles, solutions et outils nécessaires. Une vue de dépannage guidé rend ces informations faciles à suivre sur un téléphone.

Une navigation adaptée au mobile garde le catalogue, les outils de dimensionnement et les informations SAV accessibles loin du bureau.

Espace administrateur de gestion des prix et des niveaux tarifaires

Faites glisser pour voir la suite →

06

Un espace d'administration opérationnel

L'accès administrateur ouvre la partie gestion de la même application. Les modifications de produits alimentent directement le catalogue, et les tarifs restent liés aux fiches distributeurs qui déterminent ce que voit chaque utilisateur.

Fonctions de gestion

  • Créer et modifier des produits, importer des fichiers CSV, gérer les catégories et associer des options
  • Gérer les tarifs par niveau et les prix spécifiques par distributeur
  • Gérer les distributeurs, les utilisateurs, leur statut et leurs accès selon le rôle
  • Tenir à jour fiches techniques, guides de pannes, fabricants, modèles et outils

La démo publique utilise volontairement des rôles à choisir plutôt qu'une vraie authentification. Les écrans d'administration conservent leurs contrôles de rôle côté serveur, mais les rôles de démo ne sont pas des identifiants réels.

07

Une démo fonctionnelle, aux limites claires

L'interface repose sur Next.js, React, TypeScript, Tailwind CSS, shadcn/ui et Lucide. Les pages rendues côté serveur et les actions serveur utilisent un adaptateur de démo compatible Supabase, alimenté par des données d'exemple plutôt que par une vraie base de données.

Un cookie identifie le jeu de données temporaire de chaque visiteur. Les modifications de produits et de tarifs restent visibles pendant la session et peuvent être réinitialisées. Un redémarrage du serveur ou l'expiration de la session les efface aussi : ce n'est volontairement pas un stockage permanent.

Les invitations et e-mails de récupération sont simulés. Le téléchargement des fiches techniques mène à un document d'exemple, et les images importées sont conservées temporairement. La démo est une application serveur séparée, indépendante du style et de la navigation du portfolio.

Application
Portail responsive de vente technique et de SAV
Accès
Vues technicien distributeur et administrateur
Données de démo
Données fictives, modifications par session et réinitialisation

Avis client

Merci pour tout ce travail. Tu es une star… Je m'en veux encore de ne pas t'avoir trouvé plus tôt. Merci encore pour ton engagement sur ce projet. Je suis ravie du résultat.

Avis traduit de l'anglais

Prof. Nicola CheshireProf. Nicola CheshireCheffe de projet, Wright Air Compressors · Afrique du Sud

Ensuite

Autres projets

  • Application web

    Car Wash Mobile

    Une plateforme de gestion d'interventions pour une entreprise de lavage mobile : un planning, une fiche de travail par véhicule et un portail où chaque client suit ses propres interventions.

    Étude de cas →Essayer la démo
  • Application iOS privée

    Mobile Wash Technicians

    L'application iPhone des techniciens Mobile Wash : interventions assignées, saisie des véhicules, photos de prestation et clôture des bons de travail. Distribuée en privé au personnel via Apple Business Manager.

    Étude de cas →Essayer la démo
  • Logiciel de caisse

    Caisse de Quincaillerie

    Un logiciel de caisse et de gestion hors ligne pour une quincaillerie : facturation entièrement au clavier, vente au sac, au mètre et au kilo, crédit client et dix-sept rapports pour le gérant.

    Étude de cas →Essayer la démo
  • Publicités vidéo UGC par IA

    Trusted Health Products

    Des publicités vidéo au style créateur pour une marque américaine de santé naturelle fondée par un vétéran, réalisées avec des présentateurs générés par IA. Huit spots verticaux pour ses gammes OraMD (soin bucco-dentaire), ReliefMD (soulagement des douleurs) et Earth & Elm (soin de la peau).

    Étude de cas →
  • Visuels produit et campagne par IA

    Gymanimal

    Les visuels produit et lifestyle de la collection Summer Essentials de Gymanimal, marque néerlandaise de vêtements de sport pour femmes : des photos studio pour chaque fiche produit et des scènes de campagne en trois coloris.

    Étude de cas →
  • Visuels produit et lifestyle par IA

    LXG Society

    Des visuels still life et lifestyle pour LXG Society, marque britannique de casquettes premium : les casquettes mises en scène avec des voitures de collection, du sport et des accessoires de studio, puis portées en terrasse, en ville et sur le green.

    Étude de cas →

Construisons votre projet

Vous avez une idée ? Réservez un appel gratuit, choisissez le créneau qui vous convient et je vous envoie un lien Google Meet.

Disponible pour de nouveaux projets

MR

Mohomed Rimzan

Appel découverte

Un échange sur votre projet web ou mobile. J'étudie votre besoin et je réponds à vos questions.

30m
Google Meet

Octobre 2026

DIM
LUN
MAR
MER
JEU
VEN
SAM

Jeu. 8

Votre nom et votre e-mail servent uniquement à organiser l'appel. Confidentialité

Étape 1

Réservez un appel gratuit

Je découvre votre projet, vos objectifs et vos besoins. Sans aucun engagement.

Étape 2

Recevez votre proposition

Un périmètre et un planning sous 24 à 48 h. Un prix clair, sans surprise.

Étape 3

Je développe, vous lancez

Je développe par étapes validées ensemble, puis je livre un outil au service de vos objectifs.