Dans mon premier billet de blog sur FormFlow j’ai présenté comment mettre en place un bot capable de procéder à un sondage auprès des utilisateurs. Dans le deuxième billet, nous avons découvert les attributs de FormFlow et comment les utiliser pour améliorer l’expérience utilisateur de notre bot.
Toutefois, notre bot n’offre pas encore le résultat souhaité. En effet, nous voulons que les questions posées à l’utilisateur varient en fonction de ses réponses. De ce fait, certaines questions ne doivent pas être posées.
Exemple. Si le bot demande à l’utilisateur : Pour quelle plateforme développez-vous ? Dans les trois réponses proposées (Web, Mobile et Cloud), si l’utilisateur choisit :
- Web. La question suivante devra être : Quel framework Web utilisez-vous ? Et les questions liées au Cloud et au mobile ne devront pas être posées
- Mobile. La question suivante devra être : Quel outil de développement mobile utilisez-vous ?
Le diagramme ci-dessous illustre notre besoin :
Comment mettre en place un bot capable de répondre à ces exigences en utilisant FormFlow ? C’est ce que nous verrons dans ce billet de blog.
FormBuilder
Dans le premier billet sur FormFlow, nous avons utilisé FormBuilder et quelques lignes de code ont été suffisantes pour générer le questionnaire de notre enquête :
Code c# : | Sélectionner tout |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 | [Serializable] public class SurveyForm { [Prompt("Quel est votre poste ? {||}")] public JobOptions Job; [Prompt("Combien d'années d'expérience avez-vous ? {||}")] public ExperienceOptions Experience; [Prompt("Pour quelle plateforme developpez-vous ? {||}")] public PlatformOptions Platform; [Prompt("Quels langages de programmation utilisez-vous ? {||}")] public List<LanguageOptions> Language; [Prompt("Quel Framework Web utilisez-vous ? {||}")] public WebFrameworkOptions WebFramework; [Prompt("Quel outil de développement mobile utilisez-vous ? {||}")] public MobileDevToolsOptions MobileDevTools; [Prompt("Quelle plateforme Cloud utilisez-vous ? {||}")] public CloudOptions Cloud; [Prompt("Voulez-vous recevoir notre newsletter ? {||}")] public bool Newsletter; [Prompt("Quel est votre adresse email ? {||}")] public string Email; public static IForm<SurveyForm> BuildForm() { return new FormBuilder<SurveyForm>() .Message("Merci de prendre quelques minutes pour repondre aux questions de cette enquête.") .Build(); } } |
Il est possible de customiser FormBuilder pour obtenir un meilleur résultat.
Actuellement, l’ordre des questions du questionnaire est établi en suivant la déclaration de chaque question. De ce fait, la question « Quel est votre poste ? » est la première question, ensuite « Combien d’années d’expérience avez-vous ? » est la seconde, ainsi de suite.
Nous pouvons toutefois utiliser FormBuilder pour définir l’ordre de nos questions en utilisant la méthode Field, comme suit :
Code c# : | Sélectionner tout |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 | public static IForm<SurveyForm> BuildForm() { return new FormBuilder<SurveyForm>() .Message("Merci de prendre quelques minutes pour repondre aux questions de cette enquête.") .Field(nameof(Job)) .Field(nameof(Experience)) .Field(nameof(Language)) .Field(nameof(Platform)) .Field(nameof(WebFramework)) .Field(nameof(MobileDevTools)) .Field(nameof(Cloud)) .Field(nameof(Newsletter)) .Field(nameof(Email)) .Confirm("Est-ce votre selection ? {*}") .Build(); } |
Définir dynamiquement la prochaine question
Nous souhaitons maintenant que les questions Cloud, Web, et Mobile soient affichées en fonction de la réponse de l’utilisateur à la question « Pour quelle plateforme développez-vous ? ». Cela se fera en trois étapes :
1 – Écrire une méthode qui retourne la prochaine étape
Nous allons dans un premier temps écrire une méthode qui retourne la prochaine étape (NextStep). Cette méthode doit prendre en paramètre un objet, qui est la réponse à la question précédente et un objet de type SurveyForm qui permettra de mettre à jour les données du questionnaire. Dans le corps de la méthode, en fonction du choix de l’utilisateur, nous allons retourner la prochaine étape.
L’implémentation de cette méthode est la suivante :
Code c# : | Sélectionner tout |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 | private static NextStep SetNextAfterPlatform(object value, SurveyForm state) { var selection = (PlatformOptions)value; state.Platform = selection; if (selection == PlatformOptions.Web) { return new NextStep(new[] { nameof(WebFramework) }); } else if (selection == PlatformOptions.Mobile) { return new NextStep(new[] { nameof(MobileDevTools) }); } else { return new NextStep(new[] { nameof(Cloud) }); } } |
2 – Utiliser la réflexion pour accéder à la méthode SetNext
Nous allons passer la méthode SetNextAfterPlatform en paramètre de la méthode SetNext. Il faut noter que celle-ci prend en paramètre un délégué. SetNext est une méthode de l’interface IField<T>. Nous allons pour cela utiliser la réflexion :
Code c# : | Sélectionner tout |
1 2 | .Field(new FieldReflector<SurveyForm>(nameof(Platform)) .SetNext(SetNextAfterPlatform)) |
3 – Modifier le statut des questions suivantes en fonction de la réponse de l’utilisateur
Les questions qui auront pour statut false ne seront pas prises en compte dans le questionnaire. Pour matérialiser cela, nous allons procéder comme suit :
Code c# : | Sélectionner tout |
1 2 3 4 | .Field(nameof(WebFramework), state=>state.Platform==PlatformOptions.Web) .Field(nameof(MobileDevTools), state => state.Platform == PlatformOptions.Mobile) .Field(nameof(Cloud), state => state.Platform == PlatformOptions.Cloud) |
Si l’utilisateur a choisi par exemple Web, cette question sera active, tandis que les questions Cloud et Mobile seront inactives.
Nous allons procéder de même pour la question concernant la Newsletter :
Code c# : | Sélectionner tout |
1 2 3 4 5 6 7 8 9 10 11 12 13 | private static NextStep SetNextAfterNewsletter(object value, SurveyForm state) { if ((bool)value == true) { return new NextStep(new[] { nameof(Email) }); } else { return new NextStep(); } } |
et
Code c# : | Sélectionner tout |
1 2 3 | .Field(new FieldReflector<SurveyForm>(nameof(Newsletter)) .SetNext(SetNextAfterNewsletter)) .Field(nameof(Email), state => state.Newsletter) |
Ci-dessous le code complet :
Code c# : | Sélectionner tout |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 | [Serializable] public class SurveyForm { [Prompt("Quel est votre poste ? {||}")] public JobOptions Job; [Prompt("Combien d'années d'expérience avez-vous ? {||}")] public ExperienceOptions Experience; [Prompt("Pour quelle plateforme developpez-vous ? {||}")] public PlatformOptions Platform; [Prompt("Quels langages de programmation utilisez-vous ? {||}")] public List<LanguageOptions> Language; [Prompt("Quel Framework Web utilisez-vous ? {||}")] public WebFrameworkOptions WebFramework; [Prompt("Quel outil de développement mobile utilisez-vous ? {||}")] public MobileDevToolsOptions MobileDevTools; [Prompt("Quelle plateforme Cloud utilisez-vous ? {||}")] public CloudOptions Cloud; [Prompt("Voulez-vous recevoir notre newsletter ? {||}")] public bool Newsletter; [Prompt("Quel est votre adresse email ? {||}")] public string Email; public static IForm<SurveyForm> BuildForm() { return new FormBuilder<SurveyForm>() .Message("Merci de prendre quelques minutes pour repondre aux questions de cette enquête.") .Field(nameof(Job)) .Field(nameof(Experience)) .Field(nameof(Language)) .Field(new FieldReflector<SurveyForm>(nameof(Platform)) .SetNext(SetNextAfterPlatform)) .Field(nameof(WebFramework), state=>state.Platform==PlatformOptions.Web) .Field(nameof(MobileDevTools), state => state.Platform == PlatformOptions.Mobile) .Field(nameof(Cloud), state => state.Platform == PlatformOptions.Cloud) .Field(new FieldReflector<SurveyForm>(nameof(Newsletter)) .SetNext(SetNextAfterNewsletter)) .Field(nameof(Email), state => state.Newsletter) .Confirm("Est-ce votre selection ? {*}") .Build(); } private static NextStep SetNextAfterPlatform(object value, SurveyForm state) { var selection = (PlatformOptions)value; state.Platform = selection; if (selection == PlatformOptions.Web) { return new NextStep(new[] { nameof(WebFramework) }); } else if (selection == PlatformOptions.Mobile) { return new NextStep(new[] { nameof(MobileDevTools) }); } else { return new NextStep(new[] { nameof(Cloud) }); } } private static NextStep SetNextAfterNewsletter(object value, SurveyForm state) { if ((bool)value == true) { return new NextStep(new[] { nameof(Email) }); } else { return new NextStep(); } } } |
Le code source de ce qui est présenté ci-dessus est disponible sur mon GitHub, à l’adresse suivante.
Vous avez plusieurs autres options pour customiser FormFlow. Vous pouvez en apprendre plus en consultant le tutoriel suivant.
Dans mon prochain billet, nous verrons comment mettre en place rapidement un bot intelligent en utilisant QnA Maker et Azure.
Restez connecté !