Modèle de flux de chatbot IA

Qu’est-ce que le modèle de flux de chatbot IA ?

Un modèle d’interaction pour chatbot destiné aux équipes produit, aux designers UX, aux services d’assistance et aux créateurs d’apps qui développent des expériences d’IA conversationnelle. Le modèle aide les utilisateurs à prototyper un flux de chat complet comprenant un lanceur, un panneau de chat, les états des messages, les réponses de l’assistant, les indicateurs de saisie, les réponses rapides, l’historique du chat, la gestion des erreurs et le basculement du mode clair au mode sombre.

What problem does the AI Chatbot Flow Template solve?

• Manque de structure pour les flux de conversation du chatbot

• Absence d’états de conception pour le mode clair et le mode sombre

• Comportement d’envoi, de saisie et de réponse des messages peu clair

• Mauvaise prise en charge des erreurs, des tentatives de réenvoi, des états hors ligne et des conversations vides

• Difficulté à montrer comment les utilisateurs passent entre le chat actif, l’historique et l’état minimisé

• Temps perdu à recréer à partir de zéro les modèles d’interface de chatbot courants

Comment utiliser le modèle AI Chatbot Flow

1. Personnalisez le nom du chatbot, le logo, le texte de l’en-tête et les couleurs du dégradé.

2. Mettez à jour les messages d’exemple pour qu’ils correspondent à votre produit ou à un cas d’utilisation lié au service d’assistance.

3. Reliez le lanceur au panneau de chat ouvert.

4. Associez les états d’envoi de message, d’indication de saisie par l’assistant, de réponse et de réponses rapides.

5. Ajoutez le flux du commutateur de thème pour passer du mode clair au mode sombre.

6. Incluez les états suivants : effacement de la conversation, historique du chat, réessai, hors ligne et minimisé.

7. Testez le flux avec des membres de l’équipe, des utilisateurs ou des parties prenantes.

Sections recommandées

Lanceur de chat

Affichez le petit point d’accès flottant sur lequel les utilisateurs appuient pour ouvrir le chatbot.

En-tête du chat

Présentez le nom du chatbot, le logo, la zone de marque en dégradé, l’action de fermeture et l’accès au menu.

Chat en mode clair

Affichez l’expérience de chat par défaut avec fond blanc, bulles utilisateur bleues, bulles de l’assistant pâles et une barre de réponse épurée.

Chat en mode sombre

Afficher la même conversation avec une interface indigo foncé, des bulles de message lumineuses et un texte à fort contraste.

Flux de messages

Prototyper la saisie de l’utilisateur, les messages envoyés, les indicateurs de saisie de l’assistant, les réponses et les horodatages.

Réponses rapides

Proposer des boutons de réponse adaptés au tapotement, tels que Suivre la commande, Renvoyer l’article ou Contacter le service d’assistance.

Historique du chat

Permettre aux utilisateurs de consulter et de rouvrir les conversations récentes.

États d’erreur et de récupération

Afficher les messages non envoyés, l’option de réessai, la bannière hors ligne et les réponses d’erreur de l’assistant.

Flux de suppression de la conversation

Ajouter une fenêtre de confirmation avant de supprimer la conversation en cours.

Erreurs courantes

• Concevoir un seul état de conversation

• Oublier le comportement en mode sombre

• Omettre l’indicateur de saisie de l’assistant

• Rendre le champ de réponse difficile à repérer

• Espacement incohérent des bulles de message

• Oublier les horodatages ou le statut des messages

• Omettre les états de réessai et hors ligne

• Supprimer les conversations sans confirmation

Façons d’éviter les erreurs

• Prototyper le parcours complet, du lanceur jusqu’à la réponse

• Maintenir la cohérence des bulles de message entre les deux thèmes

• Conserver la même conversation lors du changement de mode

• Afficher un retour clair après l’envoi, l’échec ou le réessai d’un message

• Ajouter un indicateur de saisie visible avant la réponse de l’assistant

• Concevoir des réponses rapides courtes et faciles à sélectionner

• Tester les actions de menu, d’historique, d’effacement et de minimisation

Fonctionnalités Miro que vous pouvez utiliser

• Cadres pour le mode clair, le mode sombre, l’historique et les états d’erreur

• Liens de prototype pour les flux du lanceur, de l’envoi, de la réponse, du menu et du changement de thème

• Formes pour les bulles de chat, les modales, les bannières et les éléments de réponse rapide

• Icônes pour l’envoi, la fermeture, l’émoji, la pièce jointe, le menu et le changement de thème

• Commentaires pour la relecture par l’équipe

• Notes autocollantes pour la logique de conversation et les cas limites

• Lignes de connexion pour cartographier le flux décisionnel du chatbot

FAQ

Q : Qui peut bénéficier de ce modèle ?

A : Chefs de produit, designers UX, designers UI, équipes produit IA, équipes du service d’assistance, équipes de start-up et créateurs d’apps qui conçoivent des expériences de chatbot.

Q : Ce modèle inclut-il le mode sombre ?

A : Oui. Il inclut le mode clair, le mode sombre et une interaction de changement de thème qui préserve la conversation en cours.

Q : Ce modèle peut-il être utilisé pour des chatbots de service d’assistance ?

A : Oui. Il est adapté à l’assistance produit, à l’aide aux commandes, aux flux de retour, aux assistants d’intégration et aux widgets d’aide par IA.

Q : Ce modèle inclut-il la gestion des erreurs ?

A : Oui. Il inclut les états d’envoi échoué, de réessai, hors ligne, d’erreur de l’assistant et de récupération.

Q : Avec quoi les participants repartiront-ils ?

A : Un prototype complet de chatbot comprenant un lanceur, un panneau de chat, les modes clair et sombre, l’envoi de messages, l’indicateur de saisie de l’assistant, les réponses rapides, l’historique, l’effacement de la conversation, les états d’erreur et le comportement en mode réduit.