App Clips bieden een snelle manier om toegang te krijgen tot specifieke functies van een iOS-app zonder het hele ding te downloaden. Ze stellen gebruikers in staat om eenvoudig een app te ervaren en ervan te profiteren, wat hen kan aanmoedigen om de volledige app te downloaden.
Hoe app-clips verschillen van traditionele apps
Het belangrijkste verschil tussen een app-clip en een traditionele app ligt in hun niveau van functionaliteit en functies. App Clips bieden snelle toegang tot een specifieke functie van een app. Ontworpen om gemakkelijk ontdekt en gelanceerd te worden, geven App Clips gebruikers de nodige functionaliteit om een taak te voltooien.
Zodra de taak is voltooid, wordt de clip automatisch verwijderd na een periode van inactiviteit.
App Clips worden meestal gestart vanaf websites, NFC-tags, het scannen van QR-codes en meer.
Aan de andere kant moeten traditionele apps vóór gebruik volledig worden gedownload en geïnstalleerd op het apparaat van een gebruiker. Ze zijn doorgaans uitgebreider en bieden het volledige scala aan functies en gebruikerservaring. Traditionele apps verwerken meer frequente use-cases, waarmee bij de ontwikkeling rekening moet worden gehouden.
Een effectieve app-clip ontwerpen met React Native
Aangezien app-clips een iOS-platformfunctie zijn, moet u met het iOS-project werken binnen een React Native-app.
Er is geen vaste manier om een iOS App Clip te bouwen met React Native. Er zijn echter enkele factoren waarmee u rekening moet houden bij het maken van een effectieve en functionele app-clip.
Grootte van de app-clip
Een groot struikelblok waarmee u te maken krijgt, is dat u de grootte van uw app-clip onder de vereiste benchmark van 10 megabyte houdt.
Een App Clip en de bijbehorende volledige app delen bepaalde kernfunctionaliteit. Beide apps kunnen bijvoorbeeld meldingen verzenden en API-aanroepen doen. U moet echter alle onnodige functies weglaten, afhankelijk van het doel van de App Clip.
Deze beperkte functionaliteit betekent dat de App Clip een kleinere set native afhankelijkheden heeft die nodig zijn om te functioneren.
Aangezien App Clips een gerichte, lichtgewicht ervaring bieden, moet u expliciet zijn over de native afhankelijkheden die voor de App Clip zijn gedefinieerd. U definieert deze afhankelijkheden in het iOS Pod-bestand voordat u de Pods handmatig installeert.
Functioneel UI-ontwerp voor de app-clip
App Clips zijn doorgaans op dezelfde manier opgebouwd als de volledige app-ervaring. Beslissen hoe uw app-clip de volledige app het beste kan weerspiegelen, terwijl u gefocust blijft op zijn taak en licht van gewicht bent, is iets om over na te denken. Neem Shazam's App Clip en volledige app:
Hun ontwerparchitectuur is in wezen hetzelfde, evenals enkele basisfunctionaliteiten. Het ontwerp van uw App Clip moet gericht zijn op functionaliteit en bruikbaarheid. Bouw het om soepel te werken en laat alleen informatie aan de gebruiker zien wanneer dit absoluut noodzakelijk is.
Structuur van de gedragscode
U kunt profiteren van de gedeelde overeenkomsten tussen een app-clip en de volledige app bij het plannen van de structuur van uw code.
Het delen van code tussen de twee doel-apps zou ideaal zijn voor onderhoud. Door een gemeenschappelijke codebasis te delen, kunt u ook het aantal externe bibliotheken en afhankelijkheden die aan het project worden toegevoegd, verminderen.
De gedeelde codebasis kan een set JavaScript-bestanden zijn die de bedrijfslogica van de app bevatten. U kunt vervolgens uw Xcode-project configureren om deze codebase te gebruiken door de gedeelde codebase als afhankelijkheid toe te voegen.
U moet ervoor zorgen dat beide versies van uw app eventuele gedeelde code bevatten. Gebruik een tool zoals Metro Bundler voor de React Native-app en Xcode's build-fasesysteem voor de App Clip.
Aan de slag met het maken van de app-clip
Om je eerste door React Native aangedreven app-clip te bouwen, open je het React Native iOS-project in Xcode nadat je een eenvoudig React Native-project hebt gemaakt met npx reageren native init.
Apple heeft App Clips gelanceerd met de iOS 14-software-update, dus je hebt je simulator met iOS 14 nodig om een App Clip te kunnen uitvoeren.
Een nieuw App Clip-doel maken in Xcode:
- Selecteer Bestand > Nieuw > Doel > App Clip (zoek naar "App Clip" in de zoekbalk om het App Clip-doel aan uw project toe te voegen):
- Ga dan verder met het invullen van de opties voor de App Clip:
Om een App Clip-ervaring op te nemen in het bestaande Xcode-project, voegt Xcode een nieuwe bouwfase toe aan het app-doel. U kunt de App Clip in deze beginfase binnen Xcode uitvoeren, maar deze zal leeg lijken omdat er nog geen UI-componenten aanwezig zijn.
Om de gebruikerservaring voor de App Clip op te bouwen, integreert u React Native-code om alle benodigde UI-elementen te definiëren. Door gebruik te maken van React Native, kunt u een intuïtieve en responsieve interface voor uw App Clip creëren die effectief werkt op alle iOS-apparaten.
Nadat u de React Native-code in het Xcode-project hebt geïntegreerd, kunt u een voorbeeld van de App Clip-gebruikersinterface bekijken en de nodige aanpassingen maken.
Zoals eerder vermeld, is het bouwen van een app-clip met React Native niet anders dan het bouwen van een reguliere iOS-applicatie met React Native. Zorg er wel voor dat u constant de grootte van de app-clip bijhoudt tijdens het bouwen en toevoegen van nieuwe afhankelijkheden voor de app.
Toekomstige mogelijkheden voor app-clips
App Clips kunnen mogelijk een revolutie teweegbrengen in de manier waarop we omgaan met mobiele apps en de fysieke wereld. U kunt ze gebruiken voor contactloos betalen, bewegwijzering, augmented reality, het Internet of Things (IoT), on-demand services, kaartjes voor evenementen en toegangscontrole. Verwacht nieuwe en creatieve use-cases voor app-clips naarmate de technologie zich ontwikkelt.
Kortom, App Clips bieden snelle en gemakkelijke toegang tot app-functies, waardoor ze een efficiënte en handige oplossing zijn voor gebruikers die veel onderweg zijn.
