Percorso più veloce
SPREEAI per gli sviluppatori
Costruisci il camerino
in ogni schermo.
Collega il tuo catalogo. Dai forma al percorso del cliente. Integra Always On nel tuo negozio online con il percorso di integrazione più adatto al tuo team.
Scegli il tuo percorso
Inizia da dove ti trovi
vita dello stack commerciale.
Utilizza Shopify per una configurazione gestita oppure integra i nostri SDK e API. Scegli le funzionalità di cui la tua azienda ha bisogno e mantieni intatto il percorso di acquisto del tuo marchio.
Web personalizzato
SDK Web
Controlla il posizionamento, lo stile, gli eventi, le dimensioni e il comportamento di aggiunta al carrello.JavaScript + TypeScript DocumentiMobile nativo
SDK iOS
Integra l'esperienza SPREEAI in un percorso di acquisto iOS esistente.Apri la guida iOS DocumentiMobile nativo
SDK Android
Integrare la funzione di prova virtuale nell'esperienza utente di un prodotto Android utilizzando i controlli nativi.Apri la guida di Android Accesso per i partnerSistemi personalizzati
API pubbliche
Utilizzare la documentazione API approvata per i flussi di lavoro lato server e di catalogo.Riferimento API apertoMercato
Rete di partner Amazon
Presto disponibile su Amazon Partner Network e altre piattaforme, con ulteriori modalità di integrazione di SPREEAI nel tuo stack di e-commerce.Gli aggiornamenti appariranno prima qui.Guida rapida all'SDK Web
La tua prima integrazione.
Autenticati una sola volta, poi visualizza la prova gratuita o la regolazione delle taglie in qualsiasi punto della pagina. Utilizza le credenziali di test fornite durante la fase di onboarding e non inserire mai un client secret nel codice del browser.
npm install @spreeai/web-sdk@3.0.0
# or
yarn add @spreeai/web-sdk@3.0.0import { init } from "@spreeai/web-sdk";
import "@spreeai/web-sdk/dist/web-sdk.css";
// Add <div id="spreeai-try-on"></div> to the product page first.
const sdk = await init({ clientId: "your-client-id" });
if (sdk) {
await sdk.renderTryOnButton({
elementId: "spreeai-try-on",
garments: [{ garmentId: "your-garment-id" }],
enableAddToCart: true,
});
}// Pass events inside renderTryOnButton's options.
await sdk?.renderTryOnButton({
elementId: "spreeai-try-on",
garments: [{ garmentId: "your-garment-id" }],
events: {
onTryOnButtonClick: (event) => {
console.info(event.name);
},
onAddToCartClicked: (event) => {
// Connect event.garments to your storefront's cart.
},
},
});Il modello di integrazione
Quattro sistemi.
Un momento speciale con il cliente.
Codici prodotto, varianti, immagini e contesto di merchandising.
I capi di abbigliamento passano attraverso le fasi di elaborazione, revisione e prontezza.
Il tuo negozio online richiede l'esperienza per un prodotto idoneo.
Prova i capi, trova la taglia, completa il look e torna alla cassa.
Un percorso mirato al lancio
Preparati. Connetti.
Vai in vita con fiducia.
Tre traguardi, con una pratica lista di controllo per ciascuno.
- 01 · Preparare
Un punto di partenza chiaro.
Allineare il percorso, l'accesso e il catalogo.
Lista di controllo preparatoria
- Scegli un canale, un gruppo di catalogo e un indicatore di successo.
- Conferma l'accesso del partner, le credenziali e le autorizzazioni di staging.
- Fornire immagini di capi di abbigliamento nitide e coerenti con i codici SKU.
- 02 · Connetti
Fai in modo che sembri autentico.
Prevedi delle fasi di test. Testa l'intero percorso.
Lista di controllo per l'integrazione
- Visualizza i prodotti idonei e collega le varianti e il comportamento del carrello.
- Allineare l'esperienza al marchio.
- Verifica lo stato di funzionamento su dispositivi mobili, desktop, l'accessibilità, le prestazioni e gli eventuali errori.
- 03 · Lancio
Impara dall'esperienza pratica.
Abilita i prodotti pronti e misurali.
Lista di controllo per il lancio
- Conferma la disponibilità del prodotto e pubblica l'esperienza simulata.
- Monitorare l'adozione, il completamento e la conversione.
- Utilizzare i risultati per orientare la categoria o il percorso successivo.
Baseline degli asset
Un buon input porta a risultati migliori.
- JPEG o PNG
- 2.000 × 2.000 px minimo
- Vista frontale richiesta
- Vista posteriore consigliata
- Illuminazione neutra e uniforme
- SKU o ID stile nel nome del file
Riferimento per sviluppatori
Trova il prossimo
risposta utile.
Inizia da qui
Iniziare
Comprendere l'accesso, le piattaforme supportate e le prime decisioni che il team deve prendere.
Riferimento ufficiale Integrazione gestitaShopify onboarding
Installa l'app, accetta i termini e le condizioni, sincronizza i capi, personalizza il pulsante e avvia la pubblicazione.
Riferimento ufficiale SDK Websuperficie API
Esamina l'inizializzazione, le opzioni di rendering, il dimensionamento, la personalizzazione e le interfacce tipizzate.
Riferimento ufficiale API per i partnerRiferimento API pubblico
Scopri l'interfaccia lato server approvata e disponibile per i partner autenticati.
Riferimento allo stile Qualitàbeni di abbigliamento
Prepara immagini e metadati dei prodotti che vengano acquisiti e revisionati senza intoppi.
Guida SPREEAI ProduzioneControllo qualità e lancio
Utilizzare il browser condiviso, la checklist per le prestazioni, l'accessibilità e la messa in produzione.
Guida SPREEAI SupportoRisoluzione dei problemi
Risolvere i problemi più comuni relativi ad autenticazione, idoneità, rendering e prestazioni.
Guida SPREEAI DocumentazioneGuide all'implementazione
Consulta le guide rapide pubbliche, gli standard di gestione degli asset, le checklist di avvio e le linee guida per la risoluzione dei problemi.
Documentazione apertaNessuna risorsa sviluppatore corrispondente. Prova con “Shopify”, “SDK”, “assets” o “QA”.
Progettare per la produzione
I dettagli che proteggono
l'esperienza del cliente.
Sicurezza
Mantieni le informazioni riservate lato server, utilizza solo ambienti autorizzati e fai ruotare le credenziali nel flusso di lavoro dei partner.
Privacy
Richiedete le immagini dei clienti con il loro esplicito consenso e allineate la gestione dei dati al vostro piano di integrazione approvato.
Prestazione
Carica l'esperienza dove necessario, testa su dispositivi reali e monitora le regressioni delle pagine prodotto.
Accessibilità
Preservare l'accesso tramite tastiera, l'ordine di messa a fuoco, i nomi accessibili e un percorso utilizzabile anche quando l'esperienza non è disponibile.
Domande frequenti per gli sviluppatori
Domande prima
il primo commit.
Quale integrazione dovremmo scegliere?
Utilizza l'app Shopify per il percorso gestito più veloce, l'SDK Web per il posizionamento web personalizzato o headless, gli SDK nativi per le esperienze app e il riferimento API approvato per i flussi di lavoro lato server concordati durante l'onboarding.
Da dove provengono le credenziali?
SPREEAI rilascia l'ID partner e le credenziali approvate durante la fase di onboarding. L'SDK del browser utilizza un ID client e un ID partner. Non incorporare mai un segreto client nel codice front-end.
L'app Shopify richiede chiavi API?
L'attuale flusso di onboarding dell'app Shopify si connette al negozio dopo la fase di accordi e abbonamento richiesti; l'app gestita non richiede la copia delle chiavi nella schermata di configurazione.
Perché il pulsante "Prova" non compare?
Verificare che l'elaborazione del capo sia stata completata, che sia abilitato per la prova virtuale, che sia associato al prodotto o alla variante attiva e che il blocco dell'app o il contenitore SDK siano presenti nel modello del prodotto.
Quali eventi per i clienti sono disponibili?
Le callback SDK documentate coprono i clic sul pulsante "Prova virtuale" e le interazioni di aggiunta al carrello. Collegale al tuo livello di analisi senza includere immagini dei clienti o dati personali non necessari.
Sono disponibili i webhook del server?
I webhook di push lato server non sono inclusi nella documentazione SDK attualmente pubblicata. Prima di farvi affidamento, è necessario definire i requisiti relativi agli eventi lato server con il team di ingegneri del partner.
Dove possono trovare aiuto gli sviluppatori?
Utilizzare il percorso di supporto tecnico fornito durante l'onboarding o inviare un'e-mail support@spreeai.comIncludi l'ambiente, l'ID del prodotto, il browser o il dispositivo, la data e l'ora e un percorso di riproduzione conciso: non inviare mai informazioni riservate.
Quando sarà disponibile il supporto per Amazon Partner Network?
L'integrazione con Amazon Partner Network è in fase di sviluppo. È contrassegnata come "Prossimamente" finché l'interfaccia di onboarding e di produzione non saranno pronte per gli sviluppatori esterni.
Pronti a costruire?