# Documentation des Interfaces

Cette section documente les interfaces utilisateur de RoadWave (mobile et web).

## Organisation

### Mobile (Flutter)
L'application mobile est l'interface principale pour les utilisateurs finaux (conducteurs, piétons, touristes).

- **[Navigation & Architecture](mobile/navigation.md)** : Structure de navigation, routing
- **Écran d'accueil** : Feed de recommandations géolocalisées
- **Lecteur audio** : Player HLS, contrôles, playlists
- **Carte & découverte** : Vue carte, exploration géographique
- **Profil & réglages** : Jauges d'intérêt, paramètres

### Web (Créateurs)
L'interface web est destinée aux créateurs de contenu et aux annonceurs.

- **Dashboard** : Vue d'ensemble, statistiques
- **Upload de contenu** : Import audio, métadonnées, géolocalisation
- **Statistiques** : Analytics, revenus

## Conventions de documentation

### Captures d'écran
Placez les images dans `docs/interfaces/assets/` et référencez-les ainsi :

```markdown
![Description](assets/mobile/home-screen.png){ width="300" }
```

### Diagrammes de flux
Utilisez Mermaid pour les parcours utilisateur :

```mermaid
graph LR
    A[Ouverture app] --> B{GPS actif?}
    B -->|Oui| C[Chargement recommandations]
    B -->|Non| D[Demande permission]
    D --> C
```

### Onglets multi-plateformes
Pour montrer des variations iOS/Android :

=== "iOS"
    Comportement spécifique iOS

=== "Android"
    Comportement spécifique Android

## Principes de design

- **Mobile-first** : L'app mobile est l'expérience principale
- **Géolocalisation centrale** : L'UI doit toujours contextualiser par rapport à la position
- **Audio en arrière-plan** : Player persistant, mini-player
- **Mode sombre** : Support obligatoire (conduite de nuit)
- **Accessibilité** : WCAG 2.1 AA minimum