App-Clips: Das „Ausprobieren vor dem Kauf“ mobiler Apps

Das Herunterladen einer App ist eine große Verpflichtung. „Ich möchte nur meinen Parkplatz bezahlen.“ „Ich möchte nur diesen Kaffee kaufen.“ Ich möchte nicht den App Store durchsuchen, mein Passwort eingeben, zwei Minuten warten und ein Konto registrieren. Geben Sie App Clips (iOS) und Instant Apps (Android) ein. Dabei handelt es sich um kleine (< 10 MB) Teile Ihrer App, die sofort ohne Installation gestartet werden. Sie erscheinen als Karte am unteren Bildschirmrand. Ein Fingertipp. Erledigt.

Warum Maison Code darüber spricht

Bei Maison Code Paris fungieren wir als das architektonische Gewissen unserer Kunden. Wir übernehmen oft „moderne“ Stacks, die ohne grundlegendes Verständnis für Skalierung gebaut wurden.

Wir diskutieren dieses Thema, weil es einen kritischen Wendepunkt in der technischen Reife darstellt. Die korrekte Implementierung unterscheidet ein fragiles MVP von einer widerstandsfähigen Plattform auf Unternehmensniveau.

Warum Maison Code für das „Phygital“ entwirft

Wir glauben, dass sich die Grenze zwischen „Store“ und „Site“ auflöst. Luxusmarken geben Millionen für physische Geschäfte aus. Sie geben Millionen für Apps aus. Aber es gibt eine Kluft zwischen ihnen. App Clips übernehmen die Rolle der Brücke. Wenn ein Kunde ein Produkt in Ihrem Geschäft hält, sollte sich Ihre App bereits auf seinem Telefon befinden. Keine Website. Eine einheimische Erfahrung.

1. Die Anwendungsfälle

1. Einzelhandel (The Smart Tag): Scannen Sie einen QR-Code auf einem Schuh, um die vorrätigen Größen anzuzeigen. Fordern Sie eine Größe für die Umkleidekabine an.
2. Zahlungen (The Scooter): Tippen Sie auf NFC auf einem Lime-Scooter, um ihn zu entsperren. Kein Konto erforderlich. Apple Pay und los geht’s.
3. Gutscheine (das Geschenk): Erhalten Sie eine iMessage mit einem hochwertigen Rabatt. Wenn Sie darauf tippen, wird der Clip geöffnet, nicht der Browser.
4. Restaurants: Scannen Sie den Tabellen-QR, um zu bestellen. Kein Kellner nötig.

2. Technische Einschränkungen (Die < 10 MB-Regel)

Apple ist streng. Die unkomprimierte Binärdatei muss weniger als 10 MB groß sein (manchmal 15 MB für iOS 17+). Das ist winzig. Eine Standard-React-Native-App ist locker 30 MB groß. Optimierungsstrategie:

• Tree Shaking: Entfernen Sie ungenutzten Code aggressiv.
• Keine umfangreichen Bibliotheken: Moment.js, Lodash, Lottie … löschen Sie sie.
• Assets auf CDN: Bilder nicht bündeln. Laden Sie sie aus dem Netzwerk.
• Code-Splitting: Wenn Sie React Native verwenden, verwenden Sie „import()“, um alles verzögert zu laden. Sie erstellen eine „Mini-App“, keine „Vollständige App“.

3. Implementierung in Expo / React Native

Expo Config Plugins machen dies beherrschbar, aber es ist immer noch fortgeschritten. Sie benötigen ein separates Ziel in Xcode.

„json // app.json (Expo-Konfiguration) { „expo“: { “ios”: { „bundleIdentifier“: „com.maisoncode.store“, „appStoreUrl“: „https://apps.apple.com/app/id123“, „associatedDomains“: [„applinks:maisoncode.paris“] }, „Plugins“: [ [ „expo-app-clip“, { „name“: „Maison Clip“, „bundleIdentifier“: „com.maisoncode.store.Clip“ } ] ] } } „ Sie müssen zwei Builds verwalten: Die Haupt-App und den Clip. Sie teilen sich den Code, haben aber unterschiedliche Einstiegspunkte.

4. Das Smart-App-Banner

Wie finden Benutzer den Clip?

1. Safari-Banner: <meta name="apple-itunes-app" content="app-id=123, app-clip-bundle-id=com.maisoncode.store.Clip">. Wenn der Benutzer Ihre Website in Safari besucht, wird eine Schaltfläche „Öffnen“ angezeigt.
2. NFC-Tags: Codiert mit der URL „https://maisoncode.paris/product/123“.
3. App-Clip-Codes: Diese kreisförmigen QR-Codes, die Apple entwickelt hat. Sie sind schön und proprietär.
4. Karten: Platzkarten in Apple Maps können einen Clip starten (z. B. „Essen bestellen“).

5. Zustandskontinuität (Datenübergabe)

Wenn der Benutzer das Clip-Erlebnis liebt und beschließt, die vollständige App herunterzuladen, darf er seinen Status nicht verlieren.

1. Der Benutzer fügt im Clip einen Artikel zum Warenkorb hinzu.
2. Der Benutzer installiert die vollständige App.
3. Der Benutzer öffnet die vollständige App und der Artikel befindet sich noch im Warenkorb.

Dies erreichen wir mithilfe von Shared App Groups (Freigabe des iOS-Schlüsselbunds). Oder einfacher: Speichern Sie die „cartId“ im lokalen sicheren Speicher. Überprüfen Sie beim vollständigen Start der App, ob Legacy-Daten aus dem Clip-Container vorhanden sind.

„Typoskript // Shared-Storage-Logik

• als SecureStore aus „expo-secure-store“ importieren;

const SHARED_GROUP = ‘group.com.maisoncode.data’;

Asynchrone Funktion exportieren saveCartId(id: string) { // Im freigegebenen Container speichern Warten Sie auf SecureStore.setItemAsync(‘cart_id’, id, { SchlüsselbundService: SHARED_GROUP }); } „

6. Die 8-Stunden-Regel (Push-Benachrichtigungen)

App-Clips haben eine Superkraft. Nach dem Start haben Sie die Berechtigung, 8 Stunden lang Push-Benachrichtigungen zu senden. Sie müssen nicht um Erlaubnis bitten. Anwendungsfall:

• Benutzer bestellt Essen über Clip.
• Sie senden: „Bestellung erhalten.“
• Sie senden: „Bestellung bereit.“
• Sie senden: „Laden Sie die vollständige App herunter, um Treuepunkte zu erhalten.“ Bei diesem temporären Kanal handelt es sich um hochwertige Immobilien. Spammen Sie nicht.

7. Das QR-Code-Design (Ästhetik)

Standard-QR-Codes sind hässlich. Die App-Clip-Codes von Apple sind kreisförmig und mit einer Marke versehen. Für deren Generierung sind jedoch spezielle Tools erforderlich. Verwenden Sie für generische QR-Codes „Designer QR“-Tools, die Ihr Logo einbetten und Ihre Markenfarben verwenden. Der QR-Code ist Teil der Verpackung. Es muss erstklassig aussehen. Nutzungshinweise einbetten: „Scan to Enable“. Gehen Sie nicht davon aus, dass die Leute wissen, was zu tun ist.

8. Die Auffindbarkeitslösung (Karten und Suche)

App-Clips sind nicht nur für physische Tags gedacht. Sie erscheinen in Apple Maps. Wenn Sie nach „Panera-Brot“ suchen, wird der Clip über die Schaltfläche „Essen bestellen“ gestartet. Sie erscheinen in der Spotlight-Suche. Verwenden Sie „NSUserActivity“, um den Inhalt Ihres Clips zu indizieren. Wenn Sie „Rote Schuhe“ verkaufen, indizieren Sie dieses Schlüsselwort. Wenn ein Benutzer auf seinem iPhone-Startbildschirm nach „Rote Schuhe“ sucht, wird Ihr Clip angezeigt. Das ist SEO für OS.

9. App-Clips testen (The TestFlight Pain)

Das Testen von Clips ist schwieriger als das Testen von Apps. Sie können es nicht einfach „ausführen“. Lokale Erfahrung:

• Sie müssen die „Lokale Erfahrung“ unter Einstellungen -> Entwickler -> App-Clips konfigurieren.
• Sie geben die URL „https://maisoncode.paris/p/123“ ein.
• Es startet die Debug-Binärdatei. Testflug:
• Sie müssen den Clip mit der Haupt-App hochladen.
• Tester sehen den Clip standardmäßig nicht. Sie müssen auf der TestFlight-Karte „App Clip öffnen“. Planen Sie zusätzliche Zeit für QS-Zyklen ein.

10. Das 30-Tage-Limit (Datenpersistenz)

App-Clips sind vergänglich. Das Betriebssystem löscht sie nach 30 Tagen Inaktivität. Und ganz entscheidend: Das Betriebssystem löscht ihre Daten. Cookies, LocalStorage, SecureStore… alles gelöscht. Strategie:

1. Cloud-Synchronisierung: Wenn sich der Benutzer anmeldet (Apple-ID), synchronisieren Sie seinen Warenkorb sofort mit Ihrem Backend.
2. Konvertierung: Ihr oberstes Ziel besteht darin, sie dazu zu bringen, die vollständige App innerhalb dieses Zeitfensters zu installieren.
3. Upgrade-Eingabeaufforderung: „Installieren Sie die vollständige App, um Ihren Bestellverlauf zu speichern.“ Verlassen Sie sich bei dauerhafter Speicherung nicht auf den lokalen Speicher.

11. Die Sicherheits-Sandbox (Einschränkungen)

App-Clips sind nicht vertrauenswürdig. Apple Sandboxing sie stark. Sie KÖNNEN NICHT:

• Zugriff auf HealthKit (Herzfrequenzdaten).
• Zugriff auf Kontakte oder Fotos (ohne ausdrückliche, schwer zu bekommende Erlaubnis).
• Hintergrundaufgaben ausführen (im Hintergrund synchronisieren). Sie KÖNNEN:
• Verwenden Sie Apple Pay.
• Standort verwenden (während der Verwendung).
• Verwenden Sie Bluetooth. Entwerfen Sie Ihren Ablauf unter Berücksichtigung dieser Grenzen. Versuchen Sie nicht, einen „Fitness-Tracker“ als Clip zu erstellen.

12. Sofortiger Hotspot und WLAN (The Magic)

Eine seltene, aber leistungsstarke Funktion. Sie können einen Clip konfigurieren, um das WLAN zu konfigurieren. Szenario: Benutzer betritt ein Café. Aktion: Scannt QR auf dem Tisch. Ergebnis: Clip wird gestartet UND verbindet das Telefon sofort mit dem WLAN des Coffee Shops. Keine Passworteingabe. Dies ist ein magisches „Willkommen“-Erlebnis, das Marken ignorieren.

13. Das Apple Pay Sheet (Umrechnung)

In einem App-Clip können Sie sie nicht auffordern, eine Kreditkarte einzugeben. Die Tastatur ist reibungsarm. Sie müssen Apple Pay verwenden. Die Benutzeroberfläche ist standardisiert. Der Benutzer vertraut ihm. Biometrie (FaceID) bestätigt die Zahlung. UX-Tipp: Die Schaltfläche „In den Warenkorb“ nicht anzeigen. Zeigen Sie einen „Apple Pay“-Button direkt auf der Produktseite an. Schritte reduzieren. Clip -> Apple Pay -> Fertig. Dies ahmt den „One Click Buy“ von Amazon nach.

14. Fazit

App Clips reduzieren die CAC (Customer Acquisition Cost) mobiler Apps. Sie senken die Eintrittsbarriere. Sie verwandeln „App installieren“ (hohe Reibung) in „App verwenden“ (null Reibung). Sie sind der perfekte Onboarding-Flow. Hören Sie auf, um Downloads zu betteln. Fangen Sie an, Mehrwert zu bieten.

---

eine Brücke zwischen Physischem und Digitalem schlagen?

Wir entwickeln App-Clip-Erlebnisse für den Einzelhandel.

Phygital Tech bereitstellen. Beauftragen Sie unsere Architekten.