Projet
Design System
Palette, composants et conventions UI du portail.
Design system
Ce portail est construit sur Nuxt UI (template docs) avec un theme "cyber" moderne et sobre.
Uniformiser l'experience utilisateur : memes codes couleurs, memes composants, memes micro-interactions.
Palette
- Primary (cyber) : actions principales, information, progression.
- Signal : attention, doute, points a verifier.
- Incident : risque eleve, urgence, gestion d'incident
Exemple : ordinateur bloqué ou données devenues inaccessibles. .
Primary
cyber
Actions / Information
Badges de severite
Utiliser des badges coherents pour toute evaluation (URL, phishing
Exemple : un faux mail "Votre facture impayée" demandant de cliquer rapidement. , posture, incident).
Faible
Callouts
Pour les recommandations et mises en garde.
Une protection efficace combine **prevention**, **detection** et **reaction**.
Ne cliquez jamais sur un lien recu par SMS/email sans verifier l'expediteur et le domaine.
En cas de suspicion (compte compromis, rancongiciel, fuite), appliquez immediatement la procedure "incidents".
Micro-interactions
- Transitions courtes (150-250ms)
- Survols discrets (pas d'animations agressives)
- Respect de
prefers-reduced-motion