Créer un flow
Vous pouvez créer un flow de plusieurs façons :
- À partir d’un modèle : Commencez avec un flow complet à plusieurs écrans et modifiez n’importe quel élément.
- À partir d’une maquette Figma : Sélectionnez des frames dans Figma, envoyez-les à Adapty, et modifiez le résultat comme un flow.
- Avec un outil de code IA : Chargez le skill flow-generator, décrivez le flow en langage naturel, et l’outil le construit via la CLI Adapty.
- De zéro : Commencez avec un seul écran vierge.
- À partir d’un paywall existant : Recréez un paywall du Paywall Builder sous forme de flow, avec sa mise en page, ses textes, ses produits et ses localisations.
Vous souhaitez en savoir plus sur la création de flows ? Regardez les tutoriels vidéo étape par étape dans notre playlist YouTube.
Créer un flow
- Ouvrez la page Flows.
- Cliquez sur Create flow.
- Choisissez une option :
- Browse templates (ouvre la bibliothèque de templates)
- Start from scratch (crée un flow vide)
- Renommez le flow dans l’éditeur. Cliquez sur le nom du flow dans l’en-tête et saisissez un nouveau nom.
Adapty autorise les noms de flow en double. Renommez chaque nouveau flow, sinon vous créerez plusieurs flows Untitled difficiles à distinguer.
Utiliser un modèle
La bibliothèque de modèles contient plusieurs modèles qui servent de point de départ pour votre flow. Chacun est un flow complet avec plusieurs écrans, des éléments interactifs et une navigation fonctionnelle. Vous pouvez modifier n’importe quel élément pour le personnaliser.
Pour appliquer un modèle :
- Dans la bibliothèque de modèles, parcourez les cartes de modèles. Chaque carte affiche des captures d’écran d’aperçu d’un flow.
- Cliquez sur Use as template sur la carte souhaitée.
Le modèle se charge dans le builder. À partir de là, vous pouvez modifier n’importe quel élément, écran ou propriété.
Partir de zéro
Partir de zéro crée un flow avec un seul écran vierge. Concevez l’écran avec les éléments de la bibliothèque d’éléments.
Importer un design depuis Figma
Article principal : Importer un design depuis Figma
Si une maquette de paywall existe dans Figma, vous pouvez l’envoyer à Adapty plutôt que de reconstruire les écrans manuellement :
- Installez le plugin Adapty pour Figma.
- Sélectionnez les frames et activez le plugin.
- Adapty reçoit votre flow avec sa mise en page, ses textes et ses images. Les éléments interactifs doivent être configurés manuellement.
Migrer un paywall depuis l’ancien Paywall Builder
Article principal : Convertir un paywall en flow
Plutôt que de créer un flow à partir d’un modèle, vous pouvez convertir un paywall existant de l’ancien builder.
Ouvrez la page du paywall dans le tableau de bord et cliquez sur Move to new builder. Adapty recrée le paywall sous forme de nouveau flow en brouillon, en conservant la mise en page, les textes, les produits et les localisations. L’ancien paywall reste fonctionnel pour assurer une transition en douceur.
Changer de template
Vous pouvez changer de template depuis le builder. Ouvrez le panneau Screens et cliquez sur le bouton Templates pour rouvrir la bibliothèque de templates, puis choisissez un nouveau template.
Appliquer un nouveau template remplace votre brouillon de flow actuel. Adapty vous demande de confirmer — cliquez sur Use template pour continuer, ou sur Cancel pour conserver votre brouillon. Une fois confirmé, le brouillon précédent ne peut pas être restauré. Le flow publié reste actif et n’est pas affecté.
Polices personnalisées dans les templates
Article principal : Polices personnalisées dans le Flow & Paywall Builder
Les templates marqués d’une puce Custom font utilisent des polices personnalisées. Ces polices ne sont pas incluses dans le SDK. Survolez la puce pour voir quelles polices le template utilise.
Pour afficher la typographie prévue sur l’appareil, ajoutez les fichiers de polices à votre bundle d’application. Les versions plus anciennes de l’application qui ne disposent pas de la police utiliseront une police système par défaut.
Pour changer une police sans affecter les versions précédentes, copiez le flow, modifiez la police dans la copie, et limitez la copie aux versions de l’application qui incluent la police.