Les Apple’s iOS 14 App Clips : le guide AppsFlyer pour développeurs

Apple's ios 14 apps clips guide
Introduction

Les nouveautés après la sortie d’iOS 14

Avec la sortie d’iOS 14, nous considérons queles App Clips sont une étape innovante d’Apple.

Chez AppsFlyer, nous voyons dans ces Apple App Clips l’avenir des applications, en particulier pour celles que vous n’utilisez pas quotidiennement. Nous avons élaboré ce guide complet pour vous aider à développer votre premier App Clip.  

Pourquoi des clips d’application ? Pourquoi maintenant?

Imaginons que vous entrez dans un café et remarquez une longue file d’attente.

À côté de la caisse, vous voyez un panneau vous invitant à éviter les files d’attente et à acheter votre café via l’application du lieu.

Une première impression ?

La mienne serait : « Je ne vais pas installer une application qui occupera une place précieuse sur mon appareil ».

Cela m’amènerait en outre à me demander quel type de données seraient recueillies sur ma vie, et je serais probablement spammé.

Non merci. Tout ça simplement pour éviter la file d’attente…

Évitez les files d’attente sans renoncer à la confidentialité

Les Apple App Clips sont sur le point de changer votre façon de penser, et peut être aussila façon dont nous interagissons avec notre environnement à l’aide de nos appareils mobiles. Les clips d’application iOS14 vous permettent de faire des activités “ici et maintenant” en utilisant votre appareil presque instantanémentsanssacrifierla confidentialitéou partager votre géolocalisation.

Dans l’exemple de café ci-dessus, le code QR « invoquera » un clip d’application où vous êtes identifié en utilisant un Apple Sign-in. Vous pourrez alors payer via Apple Pay, en quelques secondes, sans faire la queue.

Les App Clips nécessitent que les développeurs d’applications comprennent quelques nouveaux concepts et les développent parallèlement à leur application, ce qui peut nécessiter des remodelages.

 Important Ce blog est basé sur le développement réel d’un App Clip et de recherches approfondies (documentation et vidéo incluses), rassemblant toutes les vidéos WWDC 2020 liées aux clips d’application, avec des notes sur la version iOS 14, et des expériences post-sortie. Voir l’App clip complet et jumeléici.

L’invocation du flux « App clip »
Chapitre 1

L’invocation du flux « App clip »

Cette section s’intéressera au fonctionnement complet du App Clip – depuis l’utilisateur jusqu’au différentes méthodes de bascule vers l’application complète.

L’invocation du flux « App clip »

Les clips d’application démarrent lorsqu’un utilisateur interagit avec une «invocation». 

Les invocations sont une notion très importante dans les App Clips que nous allons détailler.

Supposons que l’utilisateur ait tagué une balise NFC, qui est une invocation de clip d’application.

Voici ce qui suit :

  1. Le système iOS détecte que la balise NFC est une invocation d’App Clip et extrait un « URL d’invocation ».

    L’URL d’invocationdéfinit la fonctionnalité attendue de cette invocation. Il sera transmis à l’App Clip avec toutes les données nécessaires pour diriger l’utilisateur vers la fonctionnalité requise en lien avec la balise NFC. Si l’application est déjà installée, elle sera lancée et l’URL d’invocationsera transmis de la même manière qu’un Universal Link.

    Avis important pour les développeurs : L’URL d’invocation n’est pas transmis à l’application complètesi l’utilisateur choisit d’installer l’app complète à partir de la App Clip Card ou des bannières App Clip. Dans ces types de cas, l’utilisateur doit à nouveau déclencher l’invocation (scanner le code QR ou toucher le tag NFC). L’URL d’invocation passe ensuite au travers duNSUserActivitycomme décrit ci-dessus.

    Le développeur peut transmettre l’URL d’invocation du clip d’application vers l’application complète, à l’aide du shared storage.

    Voici quelques exemples:
    1. https://megacoffee.com/buy/paris/table/6 – L’App Clip s’ouvre dans le menu d’achat de l’agence parisienne où la table #6 est déjàparamétrée dansles préférences. L’utilisateur s’identifie via Apple Sign-in, paie avec Apple Pay,et voilà, la commande est terminée… Ce flux nécessiteune vérification de localisation, expliquée en détail ici. 
    2. https://scooter.me/rent?scooter_id=3456 – Le clip d’application est ouvert dans le menu de location avec un identifiant de scooter déjàprogrammé. L’App Clip peut informer l’utilisateur que son temps de location est sur le point de se terminer. Ce flux nécessite une App Clip notification, expliquée en détail ici. 
  2. L’iOS vérifie que l’URL d’invocation est bien valide, en lisant un fichier Apple-App-Site-Association (AASA) à partir du domaine de l’URL d’invocation. La configuration du fichier AASA est expliquée en détailici
  3. Une fois l’URL d’invocation vérifiée, l’iOS présente une App Clip Card à l’utilisateur.

    Alors qu’une application donnée ne peut avoir qu’un seul App Clip, les développeurs peuvent créer plusieurs cartes (cards) pour différents cas d’utilisation.
L’invocation du flux « App clip » pour Apple

Chaque App Clip Card est associée à une seule App Clip Experience (les expériences App Clip sont expliquées en détail au chapitre 5).

Le système iOS affiche la App Clip Card liée à l’expérience quicorrespond le mieuxà l’URLd’invocation sur laquelle l’utilisateur a cliqué.

L’App Clip Card est ensuite présentée par le système, sans aucune interaction de développeur, et sans aucun code impliqué.

L’App Clip Card répond à plusieurs objectifs :

  1. Elle présente à l’utilisateur une introduction générale sur les fonctionnalités de l’App Clip, et elle est similaire à la page de l’application dans l’App Store, dans le cadre d’un flux de téléchargement complet. Cela pourrait être être par exemple une photo du café avec une brève description de l’entreprise.
  2. Il affiche les autorisations du développeur et permet à l’utilisateur de les désactiver. Veuillez noter que les clips d’application iOS14 ont très peu d’autorisations et contiennent une liste réduite. En prime, les utilisateurs renforceront leurs confiance grâce à la politique de confidentialité renforcée d’App Clip.
  3. Un bouton CTA informe l’utilisateur des principales fonctionnalités attendues de l’App Clip, telles que : louer, acheter, partager ou s’enregistrer, etc.
  4. Une petite bannière dirige l’utilisateur vers la version complète de l’application dans l’App Store.

Lorsque le CTA de la carte est cliqué, l’iOS télécharge le clip d’application depuis l’App Store. Cela se fait rapidement car la taille maximale d’un clip d’application est de 10 Mo.

Pour référence, il s’agit d’un poids assez raisonnable, car les applications récemment soumises représentent en moyenne 38 Mo.

L’URL d’invocation est transmise à l’App Clip via NSUserActivity. Le développeur utilise l’URL pour créer un deep linkvers les fonctionnalités spécifiées. Le développeur peut utiliser des paramètres de l’URL, par exemple, extraire le nom de la succursale et le numéro de table de l’URL dans cette illustration : https://megacoffee.com/buy/paris/table/.

Lorsque le clip d’application est initialement téléchargé, il affiche une bannière qui dirige l’utilisateur vers l’application complète au sein de l’App Store. Le développeur peut afficher à nouveau la bannière en utilisant SKOverlay qui est décrit en détail ici.

App Clip SKoverlay
Les invocations d’Apps clips
Chapitre 2

Invocations et expériences pour les Apple App Clips

Cette section décrit en détail comment un App Clip est appelé, quelle App Clip Card est affichée, quelles données sont transmises, et comment, l’App Clip.

Un clip d’application est généré à partir d’une invocation.

Une invocation n’est pas un simple clic, à l’image de l’Universal Link.

Une invocation est un objet créé par Apple, que seuls les outils ou l’infrastructure Apple peuvent actuellement créer pour vous. On ne sait toujours pas comment, actuellement, vous obtenez un « App Clip URL», qui vous permettrait simplement d’envoyer un SMS ou de placer un code QR (nous mettrons à jour ce processus dès qu’Apple fournira plus de détails).

Méthodes d’invocation

Bannière d’application intelligente de Safari

Des métadonnées peuvent être ajoutées au header d’un site Web afin de créer une bannière d’application intelligente qui sera présentée dans Safari.

Voici un exemple d’extrait de code que vous devez ajouter :

L’app-id est inclus dans les cas où l’appareil fonctionne sur iOS 13 ou une version antérieure.

À ce moment, la bannière dirigera l’utilisateur vers l’application complète dans l’App Store.

Pour ce clic, l’URL qui présente la bannière est l’URL d’invocation.

Bannière d'application intelligente Safari

iMessages 

Lorsqu’un utilisateur partage un lien vers un site qui affiche une bannière intelligente, le message présentera une bannière, qui invoquera un App Clip.

L’URL d’invocation, dans ce cas,est configurée dans l’URL du site.

Configuration de la bannière de l'application intelligente Safari

Balise NFC 

  • Un tap sur une balise, qui encode une URL d’invocationassociée à un clip d’application, va invoquer cet App Clip. 
  • Un URL d’invocationest configurée à l’intérieur de la balise.
  • Le tag NFC peut être créé à l’aide de n’importe quel outil ou infrastructure qui est capable de générer des tags NFC lisibles par les appareils Apple.
  • Le tag peut être lu même lorsque l’écran est verrouillé.

Codes visuels

  • Les clips d’application peuvent être invoqués à l’aide de n’importe quel code QR, qui encode uneURL d’invocationassocié.
  • Pour enclencher le processus, le code QR doit être scanné à l’aidede l’application Camera – Appareil photo ou du lecteur de code-barres natif d’Apple.
  • Apple prévoit de publier un code visuellement distinct qui hébergera à la fois une balise NFC au milieu, entourée d’un code scannable et circulaire. L’un des objectifs d’Apple est de familiariser les utilisateurs d’iOS que lorsque vous appuyez ou scannez ce code, afin de diriger vers un clip d’application. 
Codes visuels de Safari Smart App Banner

Emplacements

Suggestions basées sur la localisation de Siri – Apple n’a pas encore procédé à une divulgation complète (mises à jour à venir).

Plans 

Les balises sur une carte peuvent inclure une balise qui invoquent un clip d’application. La vérification de l’URL d’invocation du clip est décrite en détail ici.

Chaque App Clip Invocation est associé à une URL.

L’URL commence toujours par `https://mygreatapp.com/`. `https` est leschemeet `mygreatapp.com` est l’hôte ou le domaine

iOS doit vérifier l’URL d’invocation pour s’assurer que l’éditeur du clip d’application possède bien le domaine. Si ce n’est pas le cas, l’utilisateur se verrait très probablement vulnérable à la fraude et à d’autres actes malveillants. 

Étant donné que le scheme est “https” (par opposition à “http”), l’URL d’appel sera vérifiée à l’aide du certificat SSL, garantissant que le développeur de l’App Clip possède le domaine.

iOS vérifie le domaine en accédant à unfichier Apple-App-Site-Association (AASA). Ce fichier est généralement connu pour vérifier les liens universels pour un domaine donné.

Afin de vérifier les clips d’application iOS14, vousdevezajouter la section suivante au fichier AASA :

{
“appclips”: {
“apps”: [“ABCED12345.com.fruitstore.feedmeapp.Clip”]
}

}

Remarque importante sur les fichiers AASA : Apple a annoncé lors de la WWDC2020 son intention d’améliorer les mécanismes d’accès aux fichiers AASA à partir des appareils. Au lieu que les appareils récupèrent l’AASA directement à partir du domaine associé à une application, Apple récupère les fichiers AASA et les met en cache dans un CDN. Les appareils accéderont au CDN d’Apple et regrouperont les fichiers AASA, eux-mêmes récupérés dans des lectures et des opérations plus optimales. 

Par conséquent, ce mécanisme proposé pourrait avoir un impact sur le nombre de récupérations de fichiers AASA.

Domaines valides AASA
Statut de l'URL du domaine AASA

L’état de ce cache par rapport aux URL d’invocation définies pour un clip d’application spécifique peut être trouvé dans les informations de version d’App Store Connect, sous «Domain URL Status ».

La construction doit avoir un App Clip valide (la valeur ‘HAS APP CLIP’ est ‘YES’).  

La colonne de statut du cache est ce qui pilote l’App Clip Invocation sur les appareils des clients. En cliquant sur « Debug Status »,Apple a accès à votre fichier AASA en temps réel et valide les URL. Le Domain URL statusest affiché ci-dessus. 

Expériences de clips d'applications
Chapitre 3

Expériences de clips d’application

Le terme le plus important à comprendre à propos des clips d’application Apple est probablement ses « expériences ».

Une App Clip Experience est une action proposée à l’utilisateur, par exemple acheter, louer, s’enregistrer dans un hôtel, et la liste continue. Chaque expérience affiche une App Clip Card différente. Si vous souhaitez afficher une App Clip Card spécifique, vous devez définir une expérience spécifique.

Comment une invocation est-elle associée à une expérience et comment cela entraîne l’affichage de l’App Clip Card correspondante ?

Comme nous l’avons vu ci-dessus, chaque invocation contient une URLd’invocation. Et, iOS fait correspondre l’URL d’invocation aux URL que vous avez enregistrées dans le cadre de votre App Clip Experience. Il affichera l’App Clip Experienceavec l’URL qui contient le préfixe correspondant spécifié. 

Par exemple, on peut créer une App Clip experience avec https://myrental.com/rent comme URL pour couvrir des URL comme https://myrental.com/rent/car, https://myrental.com/rent/suv, et etc., etc.  


Toutefois, si une entreprise déploie plusieurs opérations, il est recommandé de configurer uneApp Clip Experiencepour une ou plusieurs opérations et d’utiliser une App Clip Card et un URL d’invocation différent pour chaque opération.

Par exemple, https://myrental.com/rent/car/il, https://myrental.com/rent/car/jp, etc.

Le Default App Clip Experience

Dans App Store Connect, sur la page‘nouvelle version de l’application’, vous devez configurer uneApp Clip Experience par défaut et fournir les métadonnées suivantes pour la carte App Clip :

  • Une image de header
  • Un sous-titre qui fournit plus d’informations sur le clip d’application.
  • Un CTA qui apparaît pour lancer le clip d’application.
L’App Clip experience

Une App Clip experience par défaut est utilisée pour déclencher un clip d’application à partir des bannières d’application intelligentes et des liens que les utilisateurs partagent dans l’application Messages, lorsque les expériences de clip d’application avancées ne sont pas configurées.

Aucune URL d’invocation n’est requise pour enregistrer une expérience de clip d’application par défaut.

Si le système vérifie un App Clip, il affichera la valeur par défaut, même si aucun URL d’invocation n’a été défini (voir la section suivante). Encore une fois, cela n’est vrai que pour la bannière d’application intelligente dans Safari ou pour les liens partagés pour ces sites dans les messages.

Le App Clip Experience avancé

Le App Clip Experience avancé permet d’effectuer les opérations suivantes :

  • Prendre en charge toutes les invocations possibles, y compris les invocations à partir de balises NFC et les codes visuels.
  • Associer votre App Clip à un emplacement physique.
  • Associer un URL d’invocation à votre clip d’application.

Comme décrit précédemment, cela permet l’utilisation de plusieurs App Clips Cards pour diverses analyses de rentabilisation. Chaque expérience donnera lieu à une carte spécifique, personnalisée dans l’App Store lors de la création de l’App Clip Experience.

expérience de App Clip Experience avancé
(L’image est tirée de l’App Store Connect)
Nouvelle expérience de clip d'application
(L’image est tirée de l’App Store Connect)
Tableau de bord des expériences de clip d'application
(L’image est tirée de l’App Store Connect)
Développement d'un clip d'application
Chapitre 4

Développer un clip d’application

Pour découvrir facilement les Apple App Clips, nous avons créé un exemple simplifié, de l’utilisation à l’intégration vers une application complète. 

L’exemple montre les fonctionnalités App Clip suivantes :

  • Création de clips d’application.
  • Droits de domaines associés configurés pour les clips d’application iOS14 et les liens universels dans l’application complète.
  • Partage de ressources entre l’application complète et App Clip.
  • Extraction de l’URL d’invocation de NSUserActivity dans l’application complète et le clip d’application.
  • Notifications.
  • Transmission de données du clip d’application à l’application complète à l’aide d’App group.
  • Vérification de l’emplacement.
  • Recommander l’application complète à partir du clip d’application, à l’aide de SKOverlay.
Limitations des App Clip
Chapitre 5

Limitations des App Clip

Apple a imposé plusieurs limitations aux App Clips, afin de permettre aux utilisateurs de profiter de fonctionnalités instantanées avec un maximum de confidentialité et de transparence. 

Ces limitations servent à fournir à l’utilisateur un meilleur contrôle sur ses données privées et à devenir plus à l’aise avec les normes de confidentialité de l’application :

  • Les clips d’application sont limités à 10 Mo.
  • Les clips d’application ne sont pas inclus dans les sauvegardes iOS (il s’agit en fait plus d’une fonctionnalité que d’une limitation).
  • Les frameworks suivants ne sont pas disponibles pour les App Clips : CallKit,CareKit,CloudKit,HealthKit,HomeKit,ResearchKit,SensorKitetSpeech. L’utilisation de l’un de ces frameworks dans un App Clip n’entraîne pas d’erreurs au moment de la compilation, mais leurs API renvoient des valeurs qui indiquent une indisponibilité, des données vides ou des codes d’erreur au moment de l’exécution.
  • Le Limit App Trackingest toujours activé dans les clips d’application d’Apple, pour protéger la confidentialité des utilisateurs et empêcher le tracking des utilisateurs. Les clips d’application ne peuvent pas demander l’autorisation de suivre un utilisateur avec AppTrackingTransparency. Le nom et IdentifierForAdvertisers (IDFA) et IdentifierForVendor (IDFV) renvoient une chaîne de zéros.
  • Les clips d’application ne peuvent pas effectuer d’activités en arrière-plan, telles que la mise en réseau en arrière-plan avecURLSessionou maintenir les connexions Bluetooth lorsque le clip d’application n’est pas utilisé.
  • Pour protéger les données utilisateur, l’App Clips d’Apple ne peut pas accéder aux élément suivants :
    • Données de mouvement et de fitness.
    • Apple Musique et médias.
    • Données provenant d’applications telles que Contacts, Fichiers, Messages, Rappels et Photos.
  • Un clip d’application ne peut pas partager de données avec une autre application, à l’exception de l’application complète correspondante.
  • Une limitation importante est l’accès à la localisation. Les clips d’application ne peuvent pas demander un accès continu à la localisation. Cela peut créer un problème avec les invocations associées à un emplacement géographique. Il est important de vérifier que l’URL d’invocation (par exemple https://mybigcup/seattle/table/17) est bien à Seattle, afin d’éviter la confusion de l’utilisateur payant la facture de quelqu’un d’autre. À cette fin, les Apple App Clips permettent aux utilisateurs de vérifier l’emplacement de l’appareil à l’intérieur d’un polygone, au lieu d’accéder à un emplacement exact. Cependant, pour un accès continu à la localisation, ils peuvent demander l’autorisation <En cours d’utilisation>, qui se réinitialise automatiquement au jour suivant à 4h00, heure locale.
Test des clips d'application iOS 14
Chapitre 6

Test des clips d’application iOS14

Les clips d’application Apple peuvent être difficiles à tester, car le flux d’invocation commence au sein du système et implique l’App Store Connect. Ainsi, lors de la création initiale de l’App Clip, vous devrez vous appuyer sur les mesures suivantes pour tester l’invocation :

Tester le traitement de l’URL d’invocation 

Une étape critique du test d’un clip d’application consiste à s’assurer que l’URL d’invocation entrant est : 

  1. Extrait avec succès de l’activité NSUserActivity.
  2. Décomposé correctement avec ses paramètres.
  3. Exécuté avec le flux approprié.

Pour injecter une URL d’invocation dans un test, les étapes à suivre sont les suivantes :

  1. Cliquez sur Produit -> Modifier le schéma…
  2. Définissez la variabled’environnement_XCAppClipURLsur la valeur de l’URL d’invocation .
  3. Exécutez le schéma App Clip sur la cible. Le NSUserActivity contiendra cette valeur.

Pour voir un exemple de ce code, cliquez ici.

Tester l’apparence d’une App Clip Card à l’aide de Local Experiences. 

L’apparence d’une App Clip Card est une partie importante de l’interaction de l’utilisateur. Ceci est testé au début, avant de soumettre l’application à App Store Connect, et avant de définir le fichierApple-App-Site-Associationdans votre domaine. 

La définitiond’expériences localeséquivaut à la définitiond’expériences avancéesdansl’App Store Connect

Limitations des expériences locales :

  • Il est possible d’invoquer l’App Clip Card à l’aide de deux méthodes :
    • Le Code QR (lecture à l’aide du lecteur de code-barres iOS natif)
    • La Balise NFC
  • Pris en charge à partir d’iOS 14.2, combiné avec Xcode 12.2 et supérieur.
  • Les Local Experiences remplacent les Advanced Experiences dans l’App Store Connect.
  • Les expériences locales ne peuvent lancer qu’une application signée pour le développement, Ad Hoc ou TestFlight. Ilne peut paslancer une application déjà publiée sur App Store Connect.   
Définir des clips d'application Apple pour l'expérience locale
(L’image est prise à partir d’un appareil iOS)
Les App Clips d'Apple, expérience locale
(L’image est prise à partir d’un appareil iOS)
Les clips d'application enregistrent l'expérience locale
(L’image est prise à partir d’un appareil iOS)

Comment définir des expériences locales :

  1. Assurez-vous que votre appareil est activé en mode développeur.
  2. Connectez votre appareil iOS 14.2 et plus à Xcode 12.2 et plus, à l’aide d’un câble.
  3. Accédez àExpériences locales – Paramètres -> Développeur -> Expériences locales(sous la section “APP CLIPS TESTING”).
  4. Créez une nouvelle expérience en choisissant `Enregistrer l’expérience locale…`
  5. Créez l’expérience comme vous créeriez une Advanced App Clip Experience dans App Store Connect.

Comment procéder à l’invoquer à l’aide des expériences locales :

  1. Ajoutez un clip d’application à votre appareil en utilisant les méthodes suivantes :
    1. Créez et exécutez le clip d’application à l’aide de Xcode.
    2. Créez un fichieripapour le clip d’application à l’aide de la fonctionnalité d’archivage dans Xcode et installez-le sur l’appareil.
    3. Distribuez le clip d’application aux utilisateurs via TestFlight.
  2. Scannez un code QR à l’aide du lecteur de code-barres iOS natif ou taguez un NFC. Le code QR et le NFC doivent coder une URL d’invocation qui chevauche l’URL définie dans l’expérience locale. Cela correspond aux mêmes règles de chevauchement des expériences avancées dans l’App Store Connect.

Test après soumission à App Store Connect

Lors de la soumission de l’application complète et du clip d’application à l’App Store, vous pouvez définir des appels de clip d’application dans l’onglet TestFlight. Chaque invocation est définie avec son URL d’invocation. 

Le test après soumission à l’App Store Connect
(L’image est tirée de l’App Store Connect)
Add App Clip invocation
(L’image est tirée de l’App Store Connect)

Les testeurs bêta de l’application reconnaissent les invocations dans le TestFlight et exécutent le clip d’application comme si une invocation avait été cliquée à l’aide de l’URL d’invocation, telle que définie à l’étape précédente.

App clips : conclusions
Chapitre 7

App clips : conclusions

Les clips d’application représentent une nouvelle étape dans la façon dont les applications seront consommées et développées tout en offrant aux utilisateurs iOS des fonctionnalités plus instantanées. Cela offre davantage de liberté aux concepteurs et aux développeurs. 

L’expérience utilisateur des App Clips peut être classée en deux phases :

  • Here-and-Now‘ – Un App Clip pour les interactions entre l’utilisateur et son environnement immédiat, réalisées de manière simple mais hautement sécurisée.
  • ‘On-Going-Universal’– Une application complète qui permet à l’utilisateur d’interagir constamment avec les fonctionnalités de l’application, et de recevoir des notifications et des services dans le monde entier. 

Apple a fait un excellent travail en créant l’infrastructure relative à ces deux phases, et en concevant une bascule facile entre l’App Clip et les phases d’application complètes. 

Nous pensons que de nombreuses entreprises peuvent et doivent tirer parti de cette nouvelle technologie pour offrir à leurs clients et utilisateurs une plus grande valeur et de meilleures interactions. Pour vous, ce guide complet approfondir vos connaissances sur Apple App Clips.

Pour plus d’informations, consultez la documentation Apple App Clips.

Background
Prêt à mesurer chaque action sereinement ?