Mobile SDK - iOS - Kleep Docs

Github Repository: https://github.com/KlipFit/kleep-spm

Installazione

Questo processo deve essere eseguito una sola volta, la prima volta che è necessario installare l’SDK nel tuo progetto. Fai riferimento alla sezione Aggiornamento per le istruzioni sugli aggiornamenti successivi.

Aggiungi il seguente pacchetto: https://github.com/KlipFit/kleep-spm
Cambia la regola di dipendenza a: fino alla versione major successiva

Permessi

Aggiungi il seguente permesso al tuo progetto in info.plist: NSCameraUsageDescription

Utilizzo

Metodo 1: `requestSize`

Questo metodo consente di implementare la logica del CTA.

parametro	priorità	descrizione
productID	obbligatorio	Il tuo ID prodotto
retailerName	obbligatorio	Nome del retailer
customerID	opzionale	Identificatore CRM, usato per le analisi
trackingID	opzionale	ID utente usato da una soluzione di tracciamento esterna

Schema logico Questo schema spiega come aggiornare il CTA che apre Kleep. https://www.figma.com/board/BlurZ01lR3JBQZeTUU98TE/Mobile---CTA-Logic?node-id=0-1&t=ccXWciNziIdfhgew-1 Esempio di implementazione

import Klipfit

struct ContentView: View {
    @State var isOpenView = false
        
    var body: some View {
        VStack {
            Spacer()
            Button("Open Kleep") {
                isOpenView = true
            }
            Spacer(minLength: 40)
            
            Button("obtenir la taille") {
                Klipfit.shared.requestSize(productID: String, retailerName: String, trackingID: String, customerID: String) { kleepResult in
                    switch kleepResult {
                    case .notSupported:
	                    // Hide CTA
                        print("NotSupported")
                    case .noRecommendationYet:
	                    // Display CTA with neutral label
                        print("NoRecommendationYet")
                    case .recommendationFound(let result):
	                    // Display CTA with size reco
                        print("RecommendationFound: ", result)
                    }
                }
            }
	            Spacer()
        }
        .sheet(isPresented: $isOpenView) {
            KlipFitFindSizeView { result, variantID in 
							// addToCart(variantID)
	          }
        }
    }
}

Metodo 2: `loadView`

Questo metodo viene chiamato quando si clicca sul CTA. Consente di caricare le diverse schermate. Lo sviluppatore che integra l’SDK deve incorporarle in un bottom sheet.

parametro	priorità	descrizione
productID	obbligatorio	Il tuo ID prodotto
retailerName	obbligatorio	Nome del retailer
customerID	opzionale	Identificatore CRM, usato per le analisi
trackingID	opzionale	ID usato da un provider di tracciamento esterno

Esempio di implementazione

struct KlipFitFindSizeView: UIViewControllerRepresentable {
		
		public var onResult: KleepOnResultCompletion

    func makeUIViewController(context: Context) -> KlipftNavigationController {
        guard let viewController =
        KlipftNavigationController.loadView(
                productID: String,
                retailerName: String,
                language: KleepLanguageCode, // .fr .en .es .it .pt .nl 
                trackingID: "",
                customerID: "",
                stocks: [String : Bool]?,
                onResult: onResult
        )
        else {
            fatalError("ViewController not implemented in storyboard")
        }
        viewController.navigationBar.isHidden = true
        return viewController
    }
    func updateUIViewController(_ uiViewController: KlipftNavigationController, context: Context) {
    }
    typealias UIViewControllerType = KlipftNavigationController
}

Metodo 3: `track`

Questo metodo consente di tracciare eventi personalizzati.

parametro	priorità	descrizione
eventName	obbligatorio	Nome dell’evento da tracciare
params	opzionale	Informazioni associate all’evento

import Klipfit

Klipfit.shared.track(eventName: String, params: [String: Any]? = nil)

Vogliamo tracciare 3 eventi:

eventName	Trigger
`product_viewed`	Alla visualizzazione della PDP
`product_added_to_cart`	All’aggiunta del prodotto al carrello
`checkout_completed`	Alla conferma dell’ordine dopo il pagamento

product_viewed Parametri (CSV) Esempio

{
		productId: str
}

product_added_to_cart Parametri (CSV) Esempio

{
    productId: str,
    variantId: str,
    cart: [
	    {
		    productId: "123ABC456",
		    variantId: "123ABC456-00R",
				sku: "XYZ",
		    size: "S",
		    quantity: 2,
		    price: {
						amount: "50",
				    currencyCode: "EUR"		    
		    }
	    },
	    {
		    productId: "123ABC456",
		    variantId: "123ABC456-00R",
		    sku: "XYZ",
		    size: "S",
		    quantity: 1,
		    price: {
				    amount: "40",
				    currencyCode: "USD"
				}
	    }
	    ...
    ],
}

checkout_completed Parametri (CSV) Esempio

{
    orderId: "000001",
    cart: [
	    {
		    lineItemId: "000001#1",
		    productId: "123ABC456",
		    variantId: "123ABC456-00R",
				sku: "XYZ",
		    size: "S",
		    quantity: 2,
		    price: {
						amount: "50",
				    currencyCode: "EUR"		    
		    }
	    },
	    {
			  lineItemId: "000000#2",
		    productId: "123ABC456",
		    variantId: "123ABC456-00R",
		    sku: "XYZ",
		    size: "S",
		    quantity: 1,
		    price: {
				    amount: "40",
				    currencyCode: "USD"
				}
	    }
	    ...
    ],
}

Benvenuto

CMS

Mobile

Dashboard

Dati

Privacy

Mobile SDK - iOS

Installazione

Permessi

Utilizzo

Metodo 1: `requestSize`

Metodo 2: `loadView`

Metodo 3: `track`

​Installazione

​Permessi

​Utilizzo

​Metodo 1: requestSize

​Metodo 2: loadView

​Metodo 3: track

Installazione

Permessi

Utilizzo

Metodo 1: `requestSize`

Metodo 2: `loadView`

Metodo 3: `track`