> For the complete documentation index, see [llms.txt](https://docs.thewalletcrew.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.thewalletcrew.io/guides-design/fr/conception/loyalty-card-template-configuration.md). # Configuration du modèle de carte de fidélité Personnalisez un modèle de carte de fidélité pour Apple Wallet et Google Wallet : couleurs, images, code-barres, en-tête et champs de face, contenu du verso de la carte et mise en page d'affiche iOS 27. Que vous soyez un nouveau client qui doit créer le modèle des cartes qui seront distribuées aux clients, ou un expert de The Wallet Crew qui doit mettre à jour un modèle existant, cet article est une visite guidée du concepteur de modèles. L'objectif est de configurer un modèle de Carte qui reflète l'identité de la marque, affiche les bonnes informations aux clients et garantit une expérience fluide sur Apple Wallet et Google Wallet. ## Architecture Apple et Google ont chacun leurs propres modèles de carte de fidélité, comme vous pouvez le voir ci-dessous. {% tabs %} {% tab title="Apple" %}

{% endtab %} {% tab title="Google" %}

{% endtab %} {% endtabs %}

	Image de couverture
Carte Apple	https://493872178-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F96iMF0cPuLTC7ZRnUWG9%2Fuploads%2F3HTF0raNps6AjxLdaCKK%2Fdesign-loyalty-card-apple-example-loyalty-card-3.png?alt=media&token=c5d95f71-bf9b-456b-b414-44d57d43441f
Carte Apple	https://493872178-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F96iMF0cPuLTC7ZRnUWG9%2Fuploads%2FB0yY4vj4GoA5t4pJuSCH%2Fdesign-loyalty-card-apple-example-loyalty-card-2.png?alt=media&token=983317c6-bc3d-4abc-a0ff-822e167d5425
Carte Apple	https://493872178-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F96iMF0cPuLTC7ZRnUWG9%2Fuploads%2FdYTfGor2yipBBTxLLxq6%2Fdesign-loyalty-card-apple-example-loyalty-card.png?alt=media&token=072864e6-5b62-47fa-ac7a-dfcf616e9f78

	Image de couverture
Carte Google	https://493872178-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F96iMF0cPuLTC7ZRnUWG9%2Fuploads%2F9lLIIOnTwgCm0tELCNvQ%2Fdesign-loyalty-card-capture-d-e-cran-2026-01-26.png?alt=media&token=5157706d-fae2-43a8-8290-e52dc5fb6012
Carte Google	https://493872178-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F96iMF0cPuLTC7ZRnUWG9%2Fuploads%2F532V5smCuiYijIi1jcby%2Fdesign-loyalty-card-capture-d-e-cran-2026-01-26-3.png?alt=media&token=23ab6e7e-c8bb-4d11-b3f3-f810d0cdbaef
Carte Google	https://493872178-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F96iMF0cPuLTC7ZRnUWG9%2Fuploads%2FgV44BJ5SHBMyyecGBbZR%2Fdesign-loyalty-card-capture-d-e-cran-2026-01-26-2.png?alt=media&token=4d8e95ed-8ad7-4eb2-a505-1d8c7914eebc

{% hint style="info" %} **Pour aller plus loin, retrouvez tous les détails des deux versions :** {% endhint %} **Apple :** {% embed url="" %} **Android :** {% embed url="" %} ### Comment le configurer dans The Wallet Crew The Wallet Crew fournit un **concepteur de modèles** utilisé pour **personnaliser les cartes de fidélité** distribuées aux clients. Voyons en détail comment personnaliser chaque section. ## Apple **Examinons les différentes sections du concepteur de modèles Apple.** {% hint style="info" %} **Nouveau avec iOS 27.** Les cartes de fidélité peuvent désormais utiliser la mise en page poster de Apple Wallet **mise en page poster**, avec une illustration sur toute la carte et jusqu'à deux actions mises en avant sous la Carte. Les sections ci-dessous décrivent la mise en page classique, que les anciens iPhone continuent d'afficher. Voir [Apple Wallet sur iOS 27](#apple-wallet-on-ios-27) pour les options du poster. {% endhint %} ### Section générale La section générale comporte deux champs obligatoires : * **Description**: une brève description de la Carte, qui apparaîtra au verso de la carte * **Nom de l'organisation**: le nom de l'entreprise ou de la marque émettant la Carte Il est également possible d'ajouter un texte à côté du logo, **activer le partage de la Carte** afin que les clients puissent la transmettre à d'autres personnes, la fonctionnalité « void » pour les coupons, ainsi qu'une date de validité et une date d'expiration utilisées pour les billets d'événement. La section **définit la distance** à partir d'une latitude et d'une longitude pertinentes auxquelles la Carte est valide, pour **les notifications de géorepérage.**

### Code-barres Choisissez le **type de code-barres** compatible avec le logiciel de point de vente. La valeur du code-barres correspond aux **identifiants** qui permettent d'identifier la carte par le terminal en magasin. Enfin, le texte alternatif peut être utilisé pour afficher les données du code-barres si celui-ci ne peut pas être scanné.

### Couleurs et images Pour changer la couleur d'arrière-plan de la carte, il suffit de **d'ajouter le code couleur dans les champs** prévus à cet effet. Pour ajouter une image, téléversez-la depuis l'appareil utilisé. ### Champs d'en-tête Cette section est particulièrement importante dans la version Apple, car les cartes sont **empilées les unes sur les autres**. Seul l'en-tête de la carte reste visible. Il est donc important que cette section attire l'œil et donne envie de cliquer sur la carte, notamment en affichant les informations les plus importantes, comme les points de fidélité ou d'autres informations pertinentes.

### Champs recto Les champs recto sont ceux utilisés pour **afficher des informations sur le recto de la carte**, sous l'image bandeau. L'intitulé est le même pour chaque utilisateur (par langue), mais la valeur peut être personnalisée pour afficher le nom du client ou le nombre de points.

{% hint style="warning" %} **Pour personnaliser les champs recto, demandez à l'équipe technique quelle valeur dynamique saisir.** {% endhint %} ### Champs verso Cette section, située au dos de la carte de fidélité, comprend plusieurs informations utiles pour le client : * Fonctionnement du programme de fidélité * Récompenses disponibles * Reçus * Offres et messages personnalisés * La possibilité d'ajouter des liens, comme l'emplacement de leur magasin préféré, un lien pour mettre à jour leur compte et leurs préférences, l'accès aux conditions générales, etc.

### Autres sections Sur Apple, il existe quatre autres sections : * **Emplacements**: Utilisée pour les notifications de géorepérage. * **Balises**: Également utilisée pour les notifications de géorepérage. * **Identifiant du magasin associé**: Utilisé pour lier une application publiée sur l'Apple Store * **NFC**: Une fonctionnalité qui permet aux clients d'échanger du contenu numérique et de connecter des appareils électroniques d'un simple contact. {% hint style="warning" %} **Veuillez contacter The Wallet Crew pour activer ces fonctionnalités** {% endhint %} {% hint style="danger" %} **Une fois les modifications terminées, n'oubliez pas de cliquer sur « enregistrer » en haut du concepteur de modèles !** {% endhint %} *** ## Apple Wallet sur iOS 27 iOS 27 donne aux cartes de fidélité Apple Wallet un nouveau design centré sur l'image, appelé **mise en page poster**. Une illustration sur toute la carte remplace l'image bandeau, un logo dédié se place en haut, les principales informations sont superposées à l'image, et jusqu'à deux **actions mises en avant** apparaissent sous la Carte. L'objectif est d'obtenir une carte qui se démarque dans Wallet et offre aux utilisateurs finaux un accès en un clic à l'action la plus utile, comme la consultation de leurs avantages. The Wallet Crew construit la version poster et la version classique de la Carte à partir du même modèle. Les iPhone sous iOS 27 et versions ultérieures affichent la mise en page poster ; les anciens iPhone continuent d'afficher la mise en page classique décrite ci-dessus. Rien ne change pour les cartes existantes tant que le modèle n'est pas basculé vers la nouvelle mise en page et que les cartes ne sont pas actualisées.

Exemples concrets

* Une marque de mode utilise un visuel de campagne saisonnière comme illustration et le modifie pour les soldes sans toucher aux champs. * Un programme de fidélité beauté affiche le nom du membre et son niveau comme champs récapitulatifs, et le nom du programme dans le pied de page. * Un détaillant ajoute une **Voir les avantages de l'adhésion** action mise en avant qui ouvre la page des avantages, ainsi qu'une **Commande en livraison ou retrait** pour les commandes click and collect.

### Activer les options iOS 27 Les options iOS 27 sont en bêta, elles sont donc masquées par défaut dans le concepteur de modèles. Chaque personne qui modifie des modèles les active pour son propre compte. 1. Ouvrez le menu de profil en haut à droite du back-office et activez **Fonctionnalités bêta**. Un **BETA** badge apparaît dans la barre supérieure.

2. Allez à **Wallet → Modèles**, ouvrez le modèle de fidélité, puis l' **Apple** onglet. 3. Dans la **Général** section, cochez **Utiliser la nouvelle mise en page iOS 27**. Les options marquées du badge **iOS 27+** ne s'appliquent qu'aux iPhone sous iOS 27 et versions ultérieures.

3. L'aperçu iOS27 apparaît, ainsi que les nouveaux champs iOS27

### Configurer les champs iOS 27 La mise en page iOS 27 utilise le même modèle Apple que la mise en page classique. Il n'y a pas de modèle distinct à créer ou à maintenir. Les champs partagés continuent de configurer la Carte classique. Les champs marqués **iOS 27+** configurent uniquement la mise en page poster. Cela permet de conserver l'alignement des deux mises en page tout en gérant le contenu spécifique à iOS 27 là où c'est nécessaire. {% hint style="warning" %} **Conservez le contenu classique.** L'image bandeau, le logo et le champ principal sont toujours utilisés par les iPhone sous iOS 26 et versions antérieures. Ne les videz pas lors du passage à la mise en page poster. {% endhint %} ### Images du poster La mise en page poster ajoute deux emplacements d'image dans la **Images** section, tous deux marqués **iOS 27+**. Les dimensions en pixels sont trois fois l'espace alloué par Apple Wallet en points, afin que les images restent nettes sur les iPhone récents ; le concepteur affiche l'espace alloué sous chaque image. | Position | Taille | Conseils | | ----------------------------------------- | ----------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | | **Illustration (arrière-plan du poster)** | 1074 × 1344 px (358 × 448 pt) | Arrière-plan sur toute la carte. Gardez le sujet au centre, car iOS recadre les bords différemment selon chaque iPhone. Évitez le texte dans l'image et laissez en bas une zone calme et contrastée pour le code-barres. | | **Logo (mise en page poster)** | 378 × 90 px (126 × 30 pt) | En haut à gauche du poster, à la place du logo standard. Un PNG transparent d'une seule couleur, contrastant avec l'illustration, est le plus lisible. |

Les images classiques restent dans le modèle pour les anciens iPhone : le **icône** (261 × 261 px, requis), le **logo** (1440 × 450 px) et le **bandeau** (1125 × 432 px). L' **Modifier l'image** option recadre l'illustration sans téléverser de nouveau fichier.

Le logo du poster. Vérifiez qu'il reste lisible sur le haut de l'illustration.

{% hint style="warning" %} **L'illustration fait passer la Carte au format poster.** Sous iOS 27, une Carte avec une illustration s'affiche avec la mise en page poster. Pour revenir à l'apparence classique sur tous les iPhone, supprimez l'illustration et décochez également l'option. {% endhint %} ### Champs récapitulatifs et du pied de page Le poster n'affiche pas le champ principal. Ses informations principales proviennent des **champs récapitulatifs**, affichés sous le code-barres, et d'un seul **champ de pied de page** en bas de la carte. Les champs d'en-tête conservent leur rôle : ils restent la seule partie visible lorsque les cartes sont empilées dans Wallet.

**Champs récapitulatifs** se trouvent dans la **Champs recto** section, sous **Champs principaux**, avec le **iOS 27+** badge. Seuls les trois premiers sont affichés. Chacun comporte un libellé facultatif et une valeur obligatoire, tous deux traduisibles et compatibles avec les valeurs dynamiques ; le nom du membre, le niveau, le solde de points ou le numéro de carte sont des contenus typiques.

**Champs de pied de page** ne contiennent qu'un seul champ, avec une valeur et aucun libellé. **Ajouter un champ de pied de page** est grisé une fois le premier champ créé, et une valeur longue est tronquée par des points de suspension après environ 30 caractères ; le pied de page fonctionne donc mieux pour une information courte, comme le nom du programme.

{% hint style="info" %} **Renseignez les deux côtés.** Les champs secondaires alimentent la mise en page classique et les champs récapitulatifs alimentent le poster. Une valeur laissée vide d'un côté manque sur les iPhone correspondants. {% endhint %} ### Couleurs et options d'affichage Le poster ajoute quelques options à côté de **Utiliser la nouvelle mise en page iOS 27** et dans la **Couleurs** section. **Utiliser les couleurs automatiques** permet à iOS de déduire les couleurs du texte à partir de l'illustration ; sur le poster, cela remplace les couleurs définies manuellement, donc décochez-le pour imposer les couleurs de la marque. **Supprimer l'assombrissement de l'en-tête** supprime le dégradé sombre qu'iOS ajoute derrière l'en-tête, ce qui n'a de sens que lorsque le haut de l'illustration est suffisamment sombre pour que l'en-tête reste lisible. Le **couleur d'arrière-plan du pied de page** définit la couleur de la bande du pied de page ; si elle est laissée vide, l'illustration transparaît.

### Actions mises en avant Les actions mises en avant sont des boutons affichés directement sous la Carte sous iOS 27. Elles raccourcissent l'accès à l'action la plus utile du programme de fidélité, sans ouvrir le verso de la carte. La **Actions mises en avant** section se trouve en bas de l'onglet Apple. Chaque action a un **Type d'action**, choisi dans une liste, et une **URL**, qui peut être une page web, un lien profond vers l'application de la marque ou un `tel:` lien, et accepte des valeurs dynamiques. Deux actions au maximum sont affichées, dans l'ordre de la liste. Apple Wallet définit l'icône et le libellé à partir du type d'action, donc le texte ne peut pas être personnalisé. Pour une carte de fidélité, les types les plus pertinents sont **Voir les avantages de l'adhésion**, **Voir les offres et récompenses**, **Acheter en ligne ou dans l'application**, **Commande en livraison ou retrait**, et **Prendre rendez-vous**. Les clics sont suivis comme les autres liens de la Carte, avec des détails sur leur provenance (verso de la carte ou actions mises en avant).

{% hint style="info" %} **Conservez aussi un lien au verso.** Les iPhone sous iOS 26 et versions antérieures n'affichent pas les actions mises en avant. Dupliquer le lien le plus important dans les champs verso le rend accessible à chaque utilisateur final. {% endhint %} ### Testez avant le déploiement L'aperçu du back-office est une approximation proche, mais Apple Wallet contrôle le recadrage et le rendu finaux. Avant de déployer le nouveau design sur les cartes existantes, installez une carte de test sur un iPhone sous iOS 27 et sur un iPhone sous iOS 26 ou antérieur, vérifiez le recadrage de l'illustration et la lisibilité de chaque champ, scannez le code-barres en caisse et testez chaque action mise en avant. Une fois le modèle enregistré, les cartes existantes conservent leur apparence actuelle jusqu'à ce qu'une mise à jour soit envoyée, idéalement planifiée en dehors des heures de pointe pour les gros volumes. {% hint style="danger" %} **Une fois les modifications terminées, n'oubliez pas de cliquer sur « enregistrer » en haut du concepteur de modèles !** {% endhint %} *** ## Google **Le concepteur de modèles Google est un peu différent de celui d'Apple.** {% hint style="warning" %} **Quelques éléments à connaître avant de configurer le modèle Google :** {% endhint %} 1. Certains champs, tels que « issue » et « program name », sont **obligatoires** 2. Google préconfigure les champs en fonction de leur valeur prévue ; il vaut donc mieux ne pas saisir le nom du client dans le champ des points de fidélité, par exemple, même si c'est ainsi qu'il devrait apparaître sur la Carte 3. Les valeurs dynamiques (par ex. {{firstName}}) doivent être **placées dans des champs dynamiques dédiés**. Les champs « Label » sont destinés uniquement au texte statique. **Examinons les différentes sections.** ### Section générale La section générale comporte trois **champs obligatoires**: * **Émetteur**: le nom de la marque ou de l'entreprise qui émet la Carte * **Nom du programme**: il apparaît au recto de la Carte et correspond généralement au nom du programme de fidélité * **État**: l'état de la Carte (active, expirée, terminée, inactive)

### Plusieurs appareils et titulaires Configurer un modèle revient à décider **si le client peut partager sa Carte ou non**. Google propose trois options : * **Plusieurs titulaires**: cela signifie que le client peut partager sa Carte avec n'importe qui * **Un utilisateur, tous les appareils**: un client, mais avec plusieurs appareils (une montre, par exemple) * **Un utilisateur, un appareil**

### Compte La section Compte contient le **nom du client** et son **identifiant**.

{% hint style="warning" %} **Veuillez noter qu'il s'agit d'un champ facultatif et qu'une valeur dynamique ne peut pas être utilisée dans le champ de libellé.** {% endhint %} ### Liens supplémentaires Cela apparaît au verso de la carte et peut contenir le **lien d'un magasin ou d'un site web**.

### Points de fidélité, récompenses et niveaux de récompenses Ces champs servent à configurer les **points de fidélité**, ainsi que les **récompenses** ou **niveaux de récompenses** (par exemple, l'état du programme de fidélité).

### Messages Cette section, située au verso de la carte de fidélité, comprend plusieurs **informations utiles** pour le client : * Fonctionnement du programme de fidélité * Récompenses disponibles * La possibilité d'ajouter des liens, comme l'emplacement de leur magasin préféré, un lien pour mettre à jour leur compte et leurs préférences, l'accès aux conditions générales, etc.

### Opportunités à valeur ajoutée Cette section ajoute une **petite section en bas de la carte de fidélité**. Elle sert à afficher des offres ou des actualités.

{% hint style="danger" %} **Une fois les modifications terminées, n'oubliez pas de cliquer sur « enregistrer » en haut du concepteur de modèles !** {% endhint %} ## FAQ

Dois-je enregistrer ma configuration et mettre à jour toutes les cartes ?

Une fois le modèle modifié, il existe **deux options :** * Enregistrer la configuration sans envoyer de mise à jour sur toutes les cartes : c'est la meilleure option s'il y a beaucoup de cartes. La configuration peut être enregistrée et une mise à jour planifiée pendant la nuit, afin d'éviter l'impact d'une mise à jour massive. * Enregistrer la configuration et envoyer une mise à jour : c'est la meilleure option pour les tests, ou lorsqu'il n'existe que quelques cartes dans l'environnement.

Comment modifier la configuration pour une autre langue ?

Le design de la Carte peut être modifié pour chaque langue. Cliquer sur « général » dans le menu permet d'ajouter une langue. Elle apparaît ensuite dans le concepteur de modèles et peut être modifiée.

Pourquoi les options iOS 27 ne sont-elles pas visibles dans le concepteur de modèles ?

Les options iOS 27 sont en bêta et n'apparaissent qu'une fois **Fonctionnalités bêta** est activé dans le menu de profil, en haut à droite du back-office. Le réglage est personnel, donc chaque personne qui modifie des modèles doit l'activer.

Les cartes de fidélité existantes changent-elles lorsque les utilisateurs finaux passent à iOS 27 ?

Non. Une Carte n'utilise la mise en page poster que lorsque son modèle dispose de la nouvelle mise en page et d'une illustration, et que la Carte a été actualisée. En attendant, elle conserve son apparence classique sur tous les iPhone.

Que voient les utilisateurs finaux sous iOS 26 ou antérieur ?

La mise en page classique, construite à partir du même modèle avec le logo, le bandeau, le champ principal et les champs verso. Le pied de page et les actions mises en avant ne sont pas affichés, tandis que le code-barres, les mises à jour et les notifications fonctionnent comme d'habitude.

La mise en page iOS 27 change-t-elle quoi que ce soit dans Google Wallet ?

Non. L'onglet Google du modèle est indépendant et continue de fonctionner comme décrit ci-dessus.

--- # Agent Instructions This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com. ## Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation by asking a question. Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters: ``` GET https://docs.thewalletcrew.io/guides-design/fr/conception/loyalty-card-template-configuration.md?ask=&goal= ``` `ask` is the immediate question: it should be specific, self-contained, and written in natural language. `goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.