Le panneau Interactions vous permet de définir comment les éléments d’un flow réagissent aux événements — tels que les appuis, l’apparition d’éléments et les soumissions de formulaires. Pour chaque événement, vous assignez une ou plusieurs actions : naviguer entre les écrans, afficher ou masquer des éléments, ouvrir des URLs, définir des variables, etc. Utilisez des conditions pour personnaliser le flow en fonction des données utilisateur.

Chaque interaction suit une chaîne en trois parties :

1. Element : Le composant d’écran qui déclenche l’interaction — un bouton, une réponse de quiz, un champ de saisie, ou autre.
2. Trigger : L’événement qui active la logique, comme un appui, l’apparition d’un élément, ou la soumission d’un formulaire.
3. Action : La tâche que le flow exécute en réponse. Un seul trigger peut lancer plusieurs actions à la suite.

Configurer les interactions

Pour configurer une interaction :

1. Sélectionnez un élément à l’écran ou dans le panneau Layers.
2. À droite, passez au panneau Interactions et cliquez sur Add trigger.

3. Dans la section Button triggers, sélectionnez le type de déclencheur.

4. Cliquez sur Add action, cliquez sur le nom de l’action, puis sélectionnez un type d’action dans le menu déroulant de la fenêtre Edit action.

5. Configurez les propriétés de l’action en fonction du type d’action sélectionné.
6. Si nécessaire, cliquez sur Add action pour ajouter d’autres actions pour le même déclencheur.

Types de déclencheurs

Les déclencheurs s’activent en réponse aux actions de l’utilisateur, aux changements d’état des éléments ou au chargement de l’écran. On screen appear est universel ; les autres sont spécifiques à un élément.

Déclencheur	Se déclenche quand…	Pris en charge sur
On screen appear	L’écran se charge	Tous les éléments
On tap	L’utilisateur appuie sur l’élément	Boutons, options de quiz, bascules, comptes à rebours, vidéos
On changed	L’utilisateur modifie la valeur du champ (saisie, sélection d’une date ou d’une heure)	Tous les éléments de saisie
On submit	L’utilisateur valide une saisie de texte en appuyant sur Entrée ou Terminé sur le clavier	Champs texte
On timer end	Un élément Countdown atteint zéro	Countdown
On playback finished	Une Vidéo atteint la fin	Vidéo

Pour les éléments sans interactions intégrées (comme Loader), On screen appear est le seul déclencheur disponible.

Types d’action

Naviguer vers un écran

Il s’agit de l’action principale pour déplacer les utilisateurs entre les écrans. Elle amène l’utilisateur vers un écran de destination spécifié.

Pour cette action, vous n’avez qu’à définir l’écran de destination. Si vous souhaitez activer la navigation dynamique, consultez Navigation et branchement ou la section Actions conditionnelles.

Passer à l’écran suivant

Fait avancer l’utilisateur vers l’écran suivant dans l’ordre des écrans du flow. Utilisez cette option pour les flows linéaires, où l’ordre des écrans dans l’éditeur correspond à l’ordre dans lequel vous souhaitez que les utilisateurs les voient.

Retour en arrière

Ramène l’utilisateur à l’écran précédent dans son historique de navigation, plutôt qu’à l’écran précédent dans la séquence.

Ouvrir une URL

Ouvre une adresse web spécifique. Utilisez cette action pour envoyer les utilisateurs vers des pages web, des articles ou des profils de réseaux sociaux en dehors des écrans natifs de votre application.

Pour cette action, vous pouvez configurer deux paramètres :

• URL address : Définissez une adresse URL. Vous pouvez également la rendre dynamique — par exemple, pour rediriger les utilisateurs vers différentes pages en fonction de leur réponse à un quiz ou des données qu’ils ont soumises. Pour ce faire, cliquez sur et sélectionnez la variable que vous souhaitez utiliser.
• Open in external browser : Définissez où vous souhaitez ouvrir les liens externes. Par défaut, ils s’ouvrent dans un navigateur intégré à l’application pour garder les utilisateurs dans l’app. Cochez la case Open in external browser si vous souhaitez ouvrir les liens dans un navigateur externe.

Fermer le flow

Ferme le flow en cours.

Afficher/masquer des éléments

Affiche ou masque un élément spécifique à l’écran.

Cette action remplace l’état initial défini dans Visibility dans le panneau Design. Si Visibility est défini sur Hide, l’action Show le fera apparaître.

Afficher une alerte

Affiche une fenêtre pop-up système native. Les utilisateurs doivent appuyer sur Ok pour continuer.

Pour les alertes, vous devez définir leur Title et leur Message. Dans les deux champs, vous pouvez utiliser des variables pour rendre le contenu dynamique. Pour ce faire, cliquez sur et sélectionnez la variable souhaitée.

Définir une variable

Met à jour la valeur d’une variable dans le flow. Avant d’ajouter cette action, créez des variables dans le panneau Variables à gauche (voir Variables).

Cliquez sur Add variable et définissez autant de variables et de valeurs que nécessaire.

Achat

Déclenche un flux d’achat directement depuis un bouton ou une interaction dans votre onboarding. Utilisez cette action pour permettre aux utilisateurs de s’abonner ou d’acheter un produit sans quitter le flow.

Vous pouvez configurer deux comportements pour cette action :

• In-app store : Lance un achat natif. Définissez Product sur un produit spécifique, ou sur products.selectedProduct pour la sélection actuelle de l’utilisateur sur l’écran.
• Web payment : Redirige l’utilisateur vers un paywall web au lieu de déclencher un achat natif. Utilisez cette option lorsque vous souhaitez gérer la transaction en dehors de l’application, par exemple pour des offres d’abonnement web.

Restaurer les achats

Déclenche le flow de restauration des achats sur l’appareil. Les utilisateurs appuient sur ce bouton lorsqu’ils ont déjà souscrit un abonnement sur un autre appareil ou après avoir réinstallé l’application, et ont besoin de récupérer l’accès à leurs droits.

Il n’y a rien à configurer pour cette action — Adapty gère la restauration via le flow natif du store.

L’action Restore purchases est également préconfigurée sur le lien Restore dans le preset de bouton Links (voir Configurer les achats).

Sélectionner un produit

Définit quel produit est sélectionné dans un groupe de produits à l’écran. Utilisez cette action quand un élément autre que la carte produit doit changer la sélection — par exemple, un toggle qui fait basculer l’utilisateur entre un abonnement annuel et un abonnement hebdomadaire.

Quand l’action s’exécute, la sélection se déplace vers le produit cible. La mise en surbrillance de la carte, tout texte lié à products.selectedProduct, et la cible de l’action Acheter suivent toutes la nouvelle sélection.

Pour cette action, définissez Product sur l’élément produit cible. Le sélecteur n’affiche que les éléments produits appartenant à un groupe sélectionnable de produits sur le même écran. Si l’écran comporte plusieurs groupes de produits, le sélecteur liste les produits valides de tous ces groupes. Les produits provenant d’autres écrans, les éléments produits hors d’un groupe et les autres types d’éléments n’apparaissent pas. Chaque produit est affiché sous son titre de produit Adapty plutôt que sous le nom de son élément.

Vous pouvez aussi ajouter Select product dans une action conditionnelle — par exemple, pour sélectionner un produit quand un interrupteur est activé et un autre quand il est désactivé.

Select product n’est pas disponible dans deux endroits :

• Dans les composants réutilisables : La sélection de produit fonctionne par écran, donc une action dans un composant ne peut pas résoudre un produit. Si une action enregistrée se retrouve dans un composant, le champ Product affiche un avertissement à la place du sélecteur.
• Sur le déclencheur On tap d’une carte produit : Appuyer sur une carte la sélectionne déjà, donc une sélection explicite sur cette même interaction entrerait en conflit. L’action reste disponible sur cette carte pour d’autres déclencheurs, et sur tous les autres éléments.

Actions personnalisées

Une action personnalisée déclenche un Action ID nommé que votre propre code applicatif gère. Utilisez-la lorsque les types d’actions intégrés ne couvrent pas ce dont vous avez besoin.

Adapty fournit le déclencheur ; votre application implémente le comportement :

1. Dans le builder, vous assignez un Action ID à l’interaction d’un élément.
2. Lorsque l’utilisateur déclenche l’interaction, le flow transmet l’ID à votre application.
3. Votre application fait correspondre l’ID et exécute votre code.

Configurer une action personnalisée

1. Dans la fenêtre Edit action, attribuez un Action ID — une chaîne que votre application reconnaîtra (par exemple, show_discount).
2. Dans le code de votre application, implémentez un gestionnaire pour cet Action ID. Consultez Gérer les actions de paywall pour les détails d’implémentation et les exemples de code.

Ce que vous pouvez faire avec les actions personnalisées

Une action personnalisée ne fait rien par elle-même. Vous définissez un identifiant d’action statique dans le builder, et votre code applicatif gère ce qui se passe lorsqu’il reçoit cet identifiant. Chaque cas d’usage ci-dessous suit le même schéma : assignez un identifiant dans le flow, puis gérez-le dans votre code.

• Déclencher un événement in-app : Envoyez un ID tel que viewed_special_offer, puis enregistrez l’événement dans vos analytics quand votre application le reçoit.
• Demander une permission système : Envoyez un ID tel que request_location, puis appelez la boîte de dialogue de permission du système d’exploitation depuis votre application. Pour les permissions que la boîte de dialogue ne peut pas accorder, ouvrez les paramètres système du téléphone à la place. Adapty n’affiche pas la boîte de dialogue — c’est votre application qui le fait.
• Démarrer une authentification native : Envoyez un ID tel que login_google, puis affichez votre propre écran de connexion. Le flow ne peut pas connecter l’utilisateur.
• Appliquer une logique métier : Envoyez un ID tel que apply_discount, puis déverrouillez du contenu ou modifiez l’état de l’application de votre côté.
• Transmettre une réponse de quiz à votre application : Attribuez un Action ID différent à chaque option (par exemple, goal_weight_loss et goal_muscle), puis lisez l’ID dans votre code. Utilisez l’ID pour définir un attribut utilisateur personnalisé sur lequel vous pourrez segmenter ultérieurement. Étant donné que l’action ne transporte qu’un ID fixe, c’est le seul moyen de rapporter le choix — le flow ne peut pas envoyer la valeur sélectionnée.

Ce que les actions personnalisées ne peuvent pas faire

Les actions personnalisées sont statiques. L’ID d’action est fixé au moment où vous créez le flow — il ne peut pas lire les variables ni les saisies utilisateur. Lorsque l’action se déclenche, votre application reçoit uniquement cet ID, jamais l’e-mail, le numéro de téléphone ou toute autre information saisie par l’utilisateur. Les champs de saisie restent dans le flow en tant que variables pour le branchement et la personnalisation. Pour exploiter ces valeurs dans votre application, collectez-les via votre propre interface ou API.

Les actions personnalisées sont également unidirectionnelles. Votre application ne peut pas renvoyer de résultat au flow, et le flow n’attend pas que votre code se termine. Si une action Navigate next suit l’action personnalisée, l’utilisateur passe à l’écran suivant même si votre code échoue — par exemple, si l’utilisateur ferme votre écran de connexion sans s’être connecté. Combiné à l’Action ID statique, cela exclut toute validation de saisie utilisateur dans votre application — par exemple, vérifier un code SMS saisi par l’utilisateur et brancher le flow selon le résultat. Si la suite du flow dépend de ce que votre code a fait, divisez le flow entre deux placements.

Poursuivre le flow en fonction du résultat

Si certains écrans ne doivent apparaître qu’après la réussite d’une action personnalisée — par exemple, les écrans qui suivent une connexion — divisez le flow entre deux placements et laissez votre application décider quand afficher la deuxième partie :

1. Dans le premier placement, créez un flow qui se termine par une action personnalisée (par exemple, login).
2. Dans votre application, gérez l’Action ID : affichez votre écran de connexion et vérifiez si l’utilisateur s’est connecté.
3. Si l’utilisateur s’est connecté, affichez le flow du deuxième placement avec les écrans suivants.

De cette façon, votre application contrôle la transition en fonction du résultat réel, au lieu que le flow navigue en avant indépendamment du résultat.

Actions conditionnelles

Utilisez des actions conditionnelles pour diriger les utilisateurs vers différents parcours en fonction de leurs données.

Voici quelques cas d’usage courants :

• Vous avez un quiz sur l’écran et souhaitez orienter les utilisateurs vers différents écrans selon leurs réponses. Dans ce cas, ajoutez une action conditionnelle à un bouton.
• Vous souhaitez proposer différents produits et offres à différents groupes d’utilisateurs. Placez-les sur des écrans distincts et configurez des conditions sur un bouton de navigation.
• Vous souhaitez ignorer certaines étapes pour les utilisateurs qui ont déjà terminé un tutoriel lors d’une session précédente.

Les actions conditionnelles fonctionnent comme une chaîne if / else-if / else. L’application lit les règles de haut en bas et s’arrête à la première correspondance :

1. IF : Le flow vérifie la condition principale.
   • Elle est True ? Le flow exécute immédiatement les actions THEN et s’arrête.
   • Elle est False ? Le flow passe à la section suivante.
2. ELSE IF : Vous pouvez ajouter des vérifications supplémentaires ici (ex. : « Si l’utilisateur n’est pas Premium, est-il en période d’essai ? »).
3. ELSE (Fallback) : Si aucune règle ci-dessus ne correspond, le flow exécute les actions de cette dernière section.

Pour chaque règle, sélectionnez une variable à évaluer et une action à exécuter. Vous pouvez définir plusieurs actions par règle.

Pour savoir comment rendre les éléments sélectionnables et les organiser en groupes pour les utiliser dans des conditions, consultez Éléments sélectionnables et groupes.

Dépannage

Toute action avec des champs obligatoires manquants bloque la prévisualisation et la publication. Consultez Problèmes courants pour la liste complète.