SDK Mobile - iOS - Kleep Docs

Repositório Github: https://github.com/KlipFit/kleep-spm

Instalação

Este processo só precisa de ser seguido uma vez, na primeira vez que instala o SDK no seu projeto. Consulte a secção Atualização para ver as instruções para atualizações subsequentes.

Adicione o seguinte pacote: https://github.com/KlipFit/kleep-spm
Altere a regra de dependência para: até à próxima versão major

Permissões

Adicione a seguinte permissão ao seu projeto em info.plist: NSCameraUsageDescription

Utilização

Método 1: `requestSize`

Este método permite implementar a lógica do CTA.

parâmetro	prioridade	descrição
productID	obrigatório	O seu ID de produto
retailerName	obrigatório	Nome do retalhista
customerID	opcional	Identificador CRM, utilizado para análise
trackingID	opcional	ID de utilizador utilizado por solução de tracking externa

Esquema lógico Este esquema explica como atualizar o CTA que abre o Kleep. https://www.figma.com/board/BlurZ01lR3JBQZeTUU98TE/Mobile---CTA-Logic?node-id=0-1&t=ccXWciNziIdfhgew-1 Exemplo de implementação

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)
	          }
        }
    }
}

Método 2: `loadView`

Este método é chamado quando o CTA é clicado. Permite carregar os diferentes ecrãs. O programador que integra o SDK deve incorporá-los numa bottom sheet.

parâmetro	prioridade	descrição
productID	obrigatório	O seu ID de produto
retailerName	obrigatório	Nome do retalhista
customerID	opcional	Identificador CRM, utilizado para análise
trackingID	opcional	ID utilizado por fornecedor de tracking externo

Exemplo de implementação

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
}

Método 3: `track`

Este método permite fazer o tracking de eventos personalizados.

parâmetro	prioridade	descrição
eventName	obrigatório	Nome do evento a fazer tracking
params	opcional	Informação associada ao evento

import Klipfit

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

Pretendemos fazer o tracking de 3 eventos:

eventName	Acionador
`product_viewed`	Quando o PDP é visualizado
`product_added_to_cart`	Quando o produto é adicionado ao carrinho
`checkout_completed`	Quando a encomenda é confirmada após o pagamento

product_viewed Parâmetros (CSV) Exemplo

{
		productId: str
}

product_added_to_cart Parâmetros (CSV) Exemplo

{
    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 Parâmetros (CSV) Exemplo

{
    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"
				}
	    }
	    ...
    ],
}

Bem-vindo

CMS

Mobile

Painel

Dados

Privacidade

SDK Mobile - iOS

Instalação

Permissões

Utilização

Método 1: `requestSize`

Método 2: `loadView`

Método 3: `track`

​Instalação

​Permissões

​Utilização

​Método 1: requestSize

​Método 2: loadView

​Método 3: track

Instalação

Permissões

Utilização

Método 1: `requestSize`

Método 2: `loadView`

Método 3: `track`