> ## Documentation Index
> Fetch the complete documentation index at: https://docs.arkatech.fr/llms.txt
> Use this file to discover all available pages before exploring further.

# Design et Expérience Utilisateur (UI/UX)

**Objectif :** Transformer le cahier des charges fonctionnel en une interface visuelle concrète et validée, tout en respectant les contraintes techniques du Backoffice.

### Responsabilités et Outils

* **Responsable :** Manager Designer.
* **Intervenants :** Designers (Exécution), Chef de Projet (Arbitre), Manager Dev (Consultant faisabilité).
* **Outils :** Figma (Design system & Prototypage), Storybook (Documentation design) lié avec Storybook Connect dans Figma.

### Le Workflow de Design

Le design ne doit jamais commencer sans une structure validée. On suit généralement ce triptyque :

1. **L'Architecture d'Information (Sitemap) :** Schéma de l'arborescence du site ou de l'application.
2. **Les Wireframes (Basse Fidélité) :** Structure en noir et blanc pour valider l'emplacement des éléments sans être distrait par les couleurs.
3. **Les Maquettes Haute Fidélité :** Application de la charte graphique client sur les wireframes validés.

### Le "Design-to-Dev Handover" (Passation au Dev)

C'est le point de friction classique. Pour l'éviter, le Designer doit fournir dans le **Wiki Projet** :

* **Le Design System :** Couleurs (HEX), Typographies, Boutons, États (survol, actif, erreur).
* **Le Prototype Interactif :** Pour que le développeur comprenne les animations et les transitions.
* **Spécifications des composants :** Indiquer quels éléments sont issus du Backoffice standard et lesquels sont du "sur-mesure" total.