?
Guideintermédiaire

UX patterns pour applications IA

Les patterns d'interface qui fonctionnent : streaming, feedback, incertitude, fallbacks.

UX Patterns pour applications IA

Les applications IA posent des défis UX uniques : latence imprévisible, réponses non-déterministes, et risque d'erreurs invisibles. Voici les patterns qui fonctionnent en production.

1. Streaming progressif

Afficher la réponse token par token plutôt qu'attendre la génération complète.

  • Réduit le temps perçu de 50-80%
  • Donne un sentiment de "l'IA réfléchit en temps réel"
  • Permet à l'utilisateur d'interrompre si la direction est mauvaise
// Pattern de streaming React
function StreamingResponse({ stream }) {
  const [text, setText] = useState('');

  useEffect(() => {
    stream.on('token', (token) => setText(prev => prev + token));
  }, [stream]);

  return <div className="animate-in">{text}<Cursor /></div>;
}

2. Indicateurs de confiance

Communiquer le niveau de certitude de l'IA à l'utilisateur :

  • Badges de confiance (haute/moyenne/basse)
  • Mise en évidence des sources citées
  • Avertissement explicite quand l'IA "n'est pas sûre"
  • Différenciation visuelle entre faits vérifiés et inférences

3. Human-in-the-loop

Permettre à l'utilisateur de valider, corriger ou rejeter :

  • Boutons feedback (thumbs up/down) sur chaque réponse
  • Mode "suggestion" : l'IA propose, l'humain valide
  • Approbation obligatoire pour les actions à haut impact
  • Possibilité d'éditer la sortie de l'IA avant de l'utiliser

4. Progressive disclosure

Révéler la complexité graduellement :

  • Réponse courte par défaut, "Voir plus" pour les détails
  • Sources cachées mais accessibles en un clic
  • Mode expert optionnel montrant le raisonnement

5. Gestion de l'erreur et de l'incertitude

Fallbacks gracieux

État 1 : Réponse de qualité → Affichage normal
État 2 : Réponse incertaine → Affichage avec caveat
État 3 : Pas de réponse → Suggestion de reformulation
État 4 : Erreur technique → Message clair + alternatives

Gestion des hallucinations

  • Ne jamais présenter la sortie IA comme un fait absolu
  • Toujours offrir un lien vers les sources
  • Permettre le signalement ("Cette information est incorrecte")

6. Guidage de l'utilisateur

  • Suggestions de prompts pour les nouveaux utilisateurs
  • Autocomplétion de requêtes basée sur l'historique
  • Exemples interactifs montrant les capacités
  • Limitations affichées clairement ("Je ne peux pas...")

7. Feedback et itération

  • Permettre de rafiner la demande sans repartir de zéro
  • Historique des échanges pour le contexte
  • "Régénérer" avec un angle différent
  • Collecte de feedback implicite (temps passé, copie, partage)

Anti-patterns à éviter

  • Prétendre que l'IA est infaillible
  • Pas d'indicateur de chargement pendant la génération
  • Forcer un format conversationnel quand un formulaire serait mieux
  • Cacher les limites du système

Sources

productUXdesign