Cet article est le 3ème de notre série consacrée au guide du lancement d'un A/B Tests sous Kameleoon. Si vous ne les avez pas déjà consultés, vous pouvez retrouver ici la 1ère partie consacrée à l'élaboration du code JavaScript de la variation et ici la 2ème consacrée à l'intégration du code dans Kameleoon
Recette de la variation
Le ciblage en phase de recette
Kameleoon dispose d'une fonctionnalité prévisualisation. Avec cette fonctionnalité, Kameleoon génère un lien vous permettant de recetter le rendu visuel de votre test sur les devices souhaités (il suffit d'avoir le lien !)... mais je n'ai pas pris l'habitude de fonctionner avec pour plusieurs raisons
- Pour recetter, vous devez disposer pouvoir ouvrir un lien : ce qui va vous empêcher de recetter l'A/B Test en webview app par exemple
- Et surtout : avec ce type de fonctionnement : vous recettez uniquement la variation. Pas le ciblage. Vous ne pouvez donc pas prévoir le comportement du test en condition réelle : va-t-il y avoir un important effet flickering ? Votre ciblage actuel fonctionne-t-il correctement ?
Comme il n'y a également pas de site de préproduction pour eloquentdata.fr, nous allons ici vous présenter comment recetter l'A/B Test directement en production
Pour cela, vous devez trouver un critère unique à votre configuration. Pour cela, voici les différentes options qui s'offrent à vous (par ordre de préférence) :
- La meilleure solution si disponible : utiliser votre identifiant client (qui est souvent visible dans le cookie ou dans le dataLayer)
- Vous pouvez cibler via un paramètre dans l'url ➡ Inconvénient : peut ne pas fonctionner pour certains parcours en single page application ou si vous souhaitez recetter votre test en webview (où il n'est pas possible de modifier l'url)
- Vous pouvez utiliser un sessionStorage à vos initiales ➡ Inconvénient : nécessite de pouvoir manipuler le session storage de votre device, ce qui sera souvent bloquant sur tablette et smartphone
- Vous pouvez utiliser votre adresse IP ➡ Inconvénient : l'adresse IP peut parfois mettre quelques précieuses secondes à être disponible, ce qui fait que vous allez avoir un effet flickering important pour votre A/B Test qui n'existera pas une fois passé en production. Autre problème : l'ensemble des salariés de votre entreprise (sur la même adresse IP que vous) seront exposés à cet A/B Test ! Vous risquez de recevoir des messages paniqués "Pourquoi tu as mis en test en production alors qu'on a dit qu'on le ferait mardi prochain ?"
Sur eloquentdata.fr, il n'existe pas (pas encore ?) de possibilité de se connecter avec son compte client. Nous ne pouvons donc pas exploiter la première option.
Nous allons donc utiliser un paramètre de requête dans l'url par exemple "abtest=AM", ce qui correspond au code suivant
document.location.href.indexOf("abtest=AM") > -1
Le code de ciblage de la variation dans cette configuration de test donne alors
if((document.location.hostname + document.location.pathname == "www.eloquentdata.fr/") && document.location.href.indexOf("abtest=AM") > -1){return true}
L'allocation du trafic en phase de recette
Pour recetter votre A/B Test, vous allez devoir visualiser chacune des variations. Dans notre cas, c'est assez simple il n'y a qu'une seule variation 🎉🎉
Pour envoyer 100% du trafic vers la variation, il faut aller dans Finaliser > répartition du trafic > et mettre la variante 1 sur "100%"
Votre test est désormais prêt pour recette. Vous pouvez le mettre en ligne en allant dans "Statut > Mettre en ligne"
Visualiser le test en mode recette
Le test est désormais en ligne. Ici, nous allons le recetter en allant sur la page https://www.eloquentdata.fr/?abtest=AM en navigation privée et console ouverte
Si le test n'est pas visible (le bouton "télécharger" ne devient par vert), il faut taper le code suivant dans la console
Kameleoon.API.Experiments.getAll()
Cette commande vous retourne un objet vous indiquant l'ensemble des tests actifs sur votre site (y compris ceux qui ne sont pas actifs sur la page en question)
Si votre test n'est pas dans la liste, cela veut sans doute dire que le script Kameleoon n'est pas à jour ; fermez la page, attendez quelques minutes et re-essayez
Si le test est dans la liste, mais qu'il n'est pas visible sur la page, alors il y a peut-être une erreur de ciblage. Pour vous en assurer utilisez la commande
Kameleoon.API.Experiments.getActive()
Vous obtenez ici un objet avec l'ensemble des tests actifs sur la page
Si votre test n'apparait pas, cela signifie qu'il y a une erreur dans le segment de ciblage que vous utilisez.
Si votre test apparait, mais qu'aucune modification ne se produit, alors il faut regarder attentivement dans la console pour voir si vous avez un message d'erreur lié à votre A/B Test. Il se peut que le code de votre variation ne soit pas adapté, ou que vous ayez fait une erreur dans l'intégration dans Kameleoon