Concevoir des formats d'in-app populaires

Aperçu

L’éditeur In-App de Pushwoosh simplifie le processus de création de messages in-app de n’importe quel format et pour n’importe quel objectif commercial. Comme vous effectuez le travail plus rapidement, vous pouvez mener des expériences rapides et obtenir les résultats souhaités en moins de temps.

Pour créer un in-app à partir de zéro, il vous suffit de concevoir une mise en page de message en utilisant des blocs à glisser-déposer et de personnaliser chaque élément pour l’adapter au style de votre application et à vos objectifs commerciaux. Vous n’avez pas besoin d’expérience en codage ou en design pour créer des in-apps attrayants et à fort taux de conversion — juste quelques conseils sur la meilleure façon d’utiliser l’éditeur In-App de Pushwoosh.

Ci-dessous, nous décrirons comment créer :

In-apps en plein écran — le plus souvent, les offerwalls et les paywalls se présentent sous cette forme ;
In-apps en écran partiel — vous pouvez les utiliser pour les demandes d’opt-in et de récupération d’opt-out, la promotion de produits et les annonces de fonctionnalités.

Message in-app en plein écran

Créons un message in-app promotionnel pour le secteur du fitness à titre d’exemple :

Aperçu d'un exemple de message in-app promotionnel en plein écran pour une application de fitness avec une image et un bouton CTA

Dans votre compte Pushwoosh, allez dans Content → Rich Media et cliquez sur Add template :

Capture d'écran montrant la section Rich Media avec le bouton Add template en surbrillance

Saisissez un nom de modèle, sélectionnez Create new template, et cliquez sur Add template :

Capture d'écran montrant la boîte de dialogue de création de modèle avec le champ du nom et l'option Create new template

Dans notre exemple, nous allons créer un in-app à partir de zéro en utilisant un modèle vierge. Vous pouvez également choisir l’un des modèles par défaut et le modifier selon vos besoins.

Tout d’abord, définissez la taille de popup souhaitée dans l’onglet Popup :

Maintenant, ajoutons une image à notre message in-app. Allez dans l’onglet Content et faites glisser le bloc image sur le canevas. Cliquez sur le bloc et téléchargez votre fichier. Vous pouvez également sélectionner une photo de stock gratuite directement dans l’interface de l’éditeur en cliquant sur More Images → Stock Photos :

Recommandations d’images pour les in-apps en plein écran (orientation portrait)

Image et texte	Haute résolution : 1200 x 1000 px Taille minimale : 600 x 500 px Ratio d’aspect : 6:5
Image seule	Haute résolution : 1200 x 2000 px Taille minimale : 600 x 1000 px Ratio d’aspect : 3:5

Image et texte

Haute résolution : 1200 x 1000 px

Taille minimale : 600 x 500 px

Ratio d’aspect : 6:5

Image seule

Haute résolution : 1200 x 2000 px

Taille minimale : 600 x 1000 px

Ratio d’aspect : 3:5

Définissez la couleur d’arrière-plan du message in-app : allez dans l’onglet Popup et sélectionnez la couleur souhaitée.

Maintenant, vous pouvez ajouter le texte de votre message in-app. Dans notre exemple, nous placerons le texte par-dessus l’image. Pour ce faire, sélectionnez l’image et cliquez sur Apply Effects. Cliquez sur le bouton Text, insérez votre contenu et ajustez ses paramètres :

Ajoutons également du texte sous l’image. Allez dans l’onglet Content et faites glisser le bloc de texte sur le canevas. Insérez votre texte et personnalisez ses paramètres si nécessaire.

Enfin, ajoutez le bouton et configurez sa couleur, sa taille et d’autres paramètres :

Dans la section Action, vous pouvez spécifier l’action à effectuer après avoir cliqué sur le bouton. Nous sélectionnerons l’option URL or Deeplink :

Cliquez sur Save pour appliquer les modifications.

Vous pouvez maintenant utiliser votre message in-app promotionnel de l’une de ces manières :

Message in-app en écran partiel

Comme exemple de message in-app en écran partiel, nous allons créer une popup pour obtenir le consentement de l’utilisateur à l’envoi de notifications push. Ce message peut également aider à récupérer ceux qui se sont désabonnés des notifications.

Allez dans votre compte Pushwoosh, ouvrez la section Content → Rich Media, et cliquez sur Add template :

Capture d'écran montrant la navigation de la section Rich Media et le bouton Add template

Saisissez un nom de modèle, choisissez Create new template, et cliquez sur Add template :

Capture d'écran montrant la boîte de dialogue de création de modèle avec la saisie du nom et l'option Create new template sélectionnée

Nous allons créer un in-app à partir de zéro en utilisant un modèle vierge. Alternativement, vous pouvez sélectionner l’un des modèles par défaut et l’adapter à vos besoins.

Ajoutons une image de fond pour notre popup. Ouvrez l’onglet Popup, cliquez sur Show More Options dans la section Content, et téléchargez l’image :

Ajoutez les blocs de contenu sur le canevas. Chaque bloc représentera un élément de contenu distinct, tel qu’un en-tête, du texte, etc.

Ajoutons une image au premier bloc de contenu et ajustons son apparence :

Ajoutez un titre au deuxième bloc. Définissez la police, la couleur et les autres paramètres de texte souhaités.

Maintenant, ajoutez le texte de votre message in-app au troisième bloc de contenu. Vous pouvez expérimenter avec la police, la couleur, l’alignement du texte, la hauteur de ligne et les paramètres de remplissage.

Enfin, ajoutons un bouton à notre popup. Personnalisez la couleur du bouton, l’arrondi et d’autres paramètres si nécessaire.

Cliquez sur Save pour appliquer toutes les modifications.

Vous pouvez utiliser votre nouveau modèle de message in-app de l’une de ces manières :