Prompt pour designmd.ai — Design system "Main Courante" (proposition "Salle de contrôle")Legacy format
Design system pour un logiciel de main courante électronique, priorisant la lisibilité en conditions dégradées et l'hospitalité en environnement opérationnel.
Typography
Every letter tells a story worth reading, and every typeface gives that story a new voice waiting to be heard.
Every letter tells a story worth reading, and every typeface gives that story a new voice waiting to be heard.
Every letter tells a story worth reading, and every typeface gives that story a new voice waiting to be heard.
Every letter tells a story worth reading, and every typeface gives that story a new voice waiting to be heard.
Design system pour un logiciel de main courante électronique, priorisant la lisibilité en conditions dégradées et l'hospitalité en environnement opérationnel.
Components
Buttons
Cards
Card Title
Sample body text for the card component.
StatusBadge
Success
Critical
Elevation & Depth
Do's & Don'ts
Do
Contexte produit
Logiciel de main courante électronique pour sociétés de gardiennage et de
sécurité privée, à vocation SaaS générique (pas une marque unique — le
logiciel doit rester crédible pour n'importe quelle société cliente).
Utilisé par deux profils :
• Agents de sécurité sur le terrain, en mobile, souvent de nuit, parfois
ganté, en conditions d'urgence (déclenchement PTI, alerte intrusion).
• Exploitants / responsables, en desktop, sur un tableau de bord temps
réel multi-sites.
Intention de design
Le produit doit se ressentir comme **un outil opérationnel de terrain
sécurisé**, pas comme une application grand public. Priorité absolue à la
lisibilité en conditions dégradées (faible luminosité, urgence, stress)
avant toute considération esthétique.
• Priorise la clarté et le contraste sur la décoration.
• Hiérarchie explicite entre : action critique (SOS/PTI) > alerte > incident
> information courante.
• Direction retenue : "Salle de contrôle" — esthétique de poste de
supervision/vigie (type PC sécurité, télésurveillance), pas une identité
de marque luxe. Dominante graphite/ardoise sombre + accent bleu-cyan
technique pour l'identité et les actions courantes, totalement séparé
de l'échelle de gravité.
• Aucune ambiguïté visuelle possible sur le bouton d'alerte : il doit être
reconnaissable même en vision périphérique.
Typographie
Une seule famille sans-serif, haute lisibilité, sans caractère décoratif,
lisible à petite taille sur mobile. Poids marqués pour les titres de
gravité/statut (les agents doivent identifier un niveau en un coup d'œil).
Composants prioritaires à définir
• Bouton SOS/PTI : toujours visible, plus grand que tout autre élément
interactif, zone de tap large, feedback visuel et haptique décrit.
• Carte d'entrée de main courante : famille d'événement (icône +
couleur), horodatage serveur, géolocalisation, statut.
• Badge de gravité/statut (incident ouvert/qualifié/en cours/clos).
• Carte "checklist de ronde" : point de contrôle validé/manqué, dans
l'esprit "field operations manual" — icône + règle concise.
• Formulaire de saisie rapide : dictée vocale, sélection de famille
d'événement, ajout photo — optimisé pour saisie one-hand.
• Tableau de bord exploitant : cartes d'incidents ouverts, agents en
poste, rondes du jour, alertes non traitées — desktop, dense mais scannable.
• Fiche matériel/véhicule : échéances, attribution, statut.
Layout et responsive
• Mobile-first pour l'app agent (terrain) : une action principale
visible à la fois, navigation au pouce.
• Desktop dense pour le back-office exploitant : grille multi-colonnes,
vue d'ensemble en un écran.
Motion
Minimal et fonctionnel : pas d'animation décorative. Les seules transitions
utiles sont celles qui confirment une action critique (ex. confirmation
visuelle du déclenchement PTI) — tout le reste doit rester instantané.
Use with MCP
Don't have the MCP? Install it here