Prévisualiser les flows

Vous disposez de deux façons de prévisualiser votre flow sur différents types d’écrans :

Prévisualisation sur les appareils : vérifiez l’apparence de votre flow sur de vrais appareils à n’importe quelle étape du développement.
Prévisualisation dans l’Adapty Dashboard : prévisualisez votre flow pendant sa conception.

Aperçu sur les appareils

Pour prévisualiser votre flow sur un appareil réel :

Téléchargez l’application mobile Adapty pour iOS ou Android.
Dans le Flow & Paywall Builder, cliquez sur Test on device.

Bouton Test on device dans le Flow & Paywall Builder

Sélectionnez la langue du flow.
Scannez le QR code avec l’appareil photo ou ouvrez le lien. Votre flow s’ouvre alors dans l’application mobile Adapty.

Note

L’aperçu du flow dans l’application mobile Adapty affiche des prix fictifs, car elle ne peut pas accéder à vos produits dans les stores. Elle ne transmet également aucune valeur pour les tags personnalisés, vous voyez donc la valeur initiale de chaque tag.

Sélecteur de langue et code QR dans la boîte de dialogue Tester sur l'appareil

Dépannage

Si le flow ne s’ouvre pas dans l’aperçu, la cause habituelle est une action incomplète, un écran vide ou un produit non associé. Consultez Problèmes courants pour la liste complète.

Aperçu dans l’Adapty Dashboard

Tip

Pour vous assurer que votre flow est prêt à publier, prévisualisez-le sur un vrai appareil et vérifiez qu’il s’affiche sans erreurs.

Vous pouvez prévisualiser votre flow sur différents types d’écrans depuis la zone d’aperçu du Flow & Paywall Builder. Cela vous permet de vérifier que votre flow s’affiche correctement sur tous les appareils et toutes les tailles d’écran.

Grâce aux contrôles d’aperçu situés sous la zone d’aperçu, vous pouvez :

Sélectionner l’appareil sur lequel prévisualiser votre flow.
Basculer entre les modes d’aperçu horizontal et vertical.
Basculer entre les modes clair et sombre.
Changer de langue.

Tip

Prévisualisez toujours les différentes langues, car la longueur des mots varie selon les langues et la mise en page peut s’en trouver différente.
Dans la zone de prévisualisation du builder, chaque variable personnalisée affiche sa valeur initiale, par exemple Jane Doe pour une variable name. Pour un tag personnalisé, ne saisissez pas d’exemple : les utilisateurs voient cette valeur initiale en guise de fallback si votre application n’en transmet aucune. Entrez un mot qui convienne à tous, comme ami dans « Bon retour parmi nous, ami ! »

Aperçu des produits et offres

L’aperçu lit les variables de produit depuis votre catalogue Adapty, ce qui ne couvre qu’une partie de ce qu’un appareil peut résoudre :

prod_title affiche le titre du produit tel qu’il est stocké dans Adapty. prod_price et les variables prod_price_per_* affichent le prix stocké dans Adapty, en dollars américains — les utilisateurs voient à la place le prix localisé du store.
offer_price, offer_billing_period et offer_full_duration restent non résolues, donc l’aperçu affiche le nom de la variable entre accolades — par exemple, {{products.selectedProduct.offer_price}}. Ces valeurs parviennent au flow lorsque le SDK l’affiche dans votre application.
is_free_trial, is_pay_up_front et is_pay_as_you_go suivent l’offre sélectionnée sur la fiche produit. Sans offre, les trois valent false. Avec une offre, l’aperçu la traite comme un paiement à l’utilisation.

Les conditions sur le type d’offre basculent donc dans l’aperçu, mais seule la branche pay-as-you-go apparaît par défaut. Pour voir les autres branches, simulez le mode de paiement :

Sur le canevas, sélectionnez la carte produit qui contient l’offre.
Dans le panneau de droite, sous Product, ouvrez le menu déroulant des offres.
Sous Preview as, sélectionnez Free trial, Pay up front ou Pay as you go. Ce paramètre s’applique uniquement à la carte en cours.