Najszybsza ścieżka
SPREEAI dla programistów
Zbuduj przymierzalnię
na każdym ekranie.
Połącz swój katalog. Kształtuj ścieżkę klienta. Wprowadź Always On do swojego sklepu, korzystając ze ścieżki integracji dopasowanej do Twojego zespołu.
Wybierz swoją ścieżkę
Zacznij tam, gdzie jesteś
życie w stosie handlowym.
Użyj Shopify do zarządzanej konfiguracji lub zintegruj się z naszymi zestawami SDK i API. Wybierz funkcje, których potrzebuje Twoja firma i zadbaj o to, aby Twoja marka była zawsze na bieżąco ze swoją ścieżką zakupową.
Niestandardowa strona internetowa
Zestaw SDK sieci Web
Kontroluj rozmieszczenie, styl, zdarzenia, rozmiary i zachowanie opcji dodawania do koszyka.JavaScript + TypeScript DokumentyNatywna wersja mobilna
Zestaw SDK dla systemu iOS
Wprowadź doświadczenie SPREEAI do istniejącej ścieżki zakupowej w systemie iOS.Otwórz przewodnik iOS DokumentyNatywna wersja mobilna
Zestaw SDK dla Androida
Zintegruj funkcję przymierzania z produktem Android za pomocą natywnych elementów sterujących.Otwórz przewodnik po Androidzie Dostęp dla partnerówSystemy niestandardowe
Publiczne interfejsy API
Użyj zatwierdzonego odniesienia API dla przepływów pracy po stronie serwera i katalogowania.Otwarte odniesienie do APIRynek
Sieć partnerska Amazon
Już wkrótce w Amazon Partner Network i innych platformach, z nowymi sposobami integracji SPREEAI ze stosem narzędzi handlowych.Aktualizacje będą pojawiać się tutaj w pierwszej kolejnościSzybki start dla zestawu SDK sieci Web
Twoja pierwsza integracja.
Uwierzytelnij się raz, a następnie wyświetl opcję przymierzania lub zmiany rozmiaru w dowolnym miejscu na stronie. Użyj danych testowych wydanych podczas rejestracji i nigdy nie umieszczaj tajnego klucza klienta w kodzie przeglądarki.
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.
},
},
});Model integracji
Cztery systemy.
Jeden moment dla klienta.
Identyfikatory produktów, warianty, zdjęcia i kontekst merchandisingowy.
Odzież przechodzi przez etapy przetwarzania, przeglądu i gotowości.
W witrynie sklepu pojawia się prośba o udostępnienie informacji na temat kwalifikującego się produktu.
Przymierz, znajdź rozmiar, dokończ stylizację i wróć do kasy.
Skoncentrowana ścieżka do uruchomienia
Przygotuj się. Połącz.
Rozpocznij transmisję na żywo z pewnością siebie.
Trzy kamienie milowe z praktyczną listą kontrolną dla każdego z nich.
- 01 · Przygotuj się
Jasny punkt wyjścia.
Dostosuj podróż, dostęp i katalog.
Lista kontrolna przygotowań
- Wybierz jeden kanał, grupę katalogową i miarę sukcesu.
- Potwierdź dostęp partnera, poświadczenia i uprawnienia testowe.
- Zapewnij czytelne obrazy odzieży, zgodne z numerem SKU.
- 02 · Połącz
Spraw, by było to coś naturalnego.
Zbuduj etap przygotowawczy. Przetestuj całą podróż.
Lista kontrolna integracji
- Renderuj kwalifikujące się produkty i łącz warianty z zachowaniem koszyka.
- Dopasuj doświadczenie do marki.
- Sprawdź stan urządzeń mobilnych, komputerów stacjonarnych, dostępności, wydajności i awarii.
- 03 · Uruchomienie
Ucz się na podstawie rzeczywistych doświadczeń.
Włącz gotowe produkty i zmierz.
Lista kontrolna uruchomienia
- Potwierdź gotowość produktu i opublikuj etapowe doświadczenie.
- Monitoruj przyjęcie, realizację i konwersję.
- Użyj wyników, aby wybrać następną kategorię lub trasę.
Wartość bazowa aktywów
Dobre dane wejściowe przynoszą lepsze rezultaty.
- JPEG lub PNG
- Minimalna wielkość 2000 × 2000 pikseli
- Wymagany widok z przodu
- Zalecany widok z tyłu
- Neutralne, równomierne oświetlenie
- SKU lub identyfikator stylu w nazwie pliku
Odniesienie dla programistów
Znajdź następny
przydatna odpowiedź.
Zacznij tutaj
Rozpoczęcie pracy
Poznaj kwestie dostępu, obsługiwanych platform i pierwszych decyzji, jakie musi podjąć Twój zespół.
Oficjalne odniesienie Zarządzana integracjaShopify wdrażanie
Zainstaluj aplikację, zaakceptuj umowy, zsynchronizuj ubrania, spersonalizuj przycisk i rozpocznij publikację.
Oficjalne odniesienie Zestaw SDK sieci WebPowierzchnia API
Przegląd inicjalizacji, opcji renderowania, rozmiarów, dostosowywania i interfejsów typowych.
Oficjalne odniesienie API partneraPubliczne odniesienie do interfejsu API
Poznaj zatwierdzony interfejs po stronie serwera dostępny dla uwierzytelnionych partnerów.
Odniesienie do Swaggera JakośćAktywa odzieżowe
Przygotuj obrazy produktów i metadane, które bez problemu przejdą przez proces przetwarzania i przeglądu.
Przewodnik SPREEAI ProdukcjaKontrola jakości i uruchomienie
Skorzystaj ze wspólnej listy kontrolnej dotyczącej przeglądarki, wydajności, dostępności i uruchomienia.
Przewodnik SPREEAI WsparcieRozwiązywanie problemów
Rozwiąż najczęstsze problemy związane z uwierzytelnianiem, kwalifikowalnością, renderowaniem i wydajnością.
Przewodnik SPREEAI DokumentacjaPrzewodniki wdrożeniowe
Przeglądaj publiczne przewodniki szybkiego startu, standardy zasobów, listy kontrolne uruchamiania i wskazówki dotyczące rozwiązywania problemów.
Otwórz dokumentacjęBrak pasujących zasobów dla programistów. Spróbuj „Shopify”, „SDK”, „assets” lub „QA”.
Zbuduj do produkcji
Szczegóły, które chronią
doświadczenie klienta.
Bezpieczeństwo
Zachowaj tajemnice po stronie serwera, korzystaj wyłącznie z udostępnionych środowisk i wymieniaj dane uwierzytelniające w ramach przepływu pracy partnera.
Prywatność
Poproś klienta o udostępnienie zdjęć po uzyskaniu jego wyraźnej zgody i dostosuj przetwarzanie danych do zatwierdzonego planu integracji.
Wydajność
Wdrażaj rozwiązanie tam, gdzie jest potrzebne, testuj rzeczywiste urządzenia i monitoruj regresję stron produktów.
Dostępność
Zachowaj dostęp do klawiatury, kolejność zaznaczania, dostępne nazwy i użyteczną ścieżkę, gdy dane środowisko jest niedostępne.
Często zadawane pytania dla programistów
Pytania przed
pierwsze zatwierdzenie.
Jaką integrację powinniśmy wybrać?
Użyj aplikacji Shopify, aby uzyskać najszybszą zarządzaną ścieżkę, zestawu Web SDK do niestandardowego lub bezgłowego rozmieszczania stron internetowych, natywnych zestawów SDK do obsługi aplikacji oraz zatwierdzonego odniesienia do interfejsu API dla przepływów pracy po stronie serwera uzgodnionych podczas wdrażania.
Skąd pochodzą kwalifikacje?
SPREEAI wydaje identyfikator partnera i zatwierdzone dane uwierzytelniające podczas rejestracji. Zestaw SDK przeglądarki używa identyfikatora klienta i identyfikatora partnera. Nigdy nie osadzaj tajnego klucza klienta w kodzie front-end.
Czy aplikacja Shopify wymaga kluczy API?
Obecny proces wdrażania aplikacji Shopify łączy sklep po podjęciu wymaganych umów i dokonaniu subskrypcji. W przypadku zarządzanej aplikacji nie jest wymagane kopiowanie kluczy na ekran konfiguracji.
Dlaczego przycisk „Przymierz” się nie pojawia?
Sprawdź, czy przetwarzanie odzieży zostało zakończone, czy jest ona dostępna do przymierzania, czy jest powiązana z aktywnym produktem lub wariantem, a także czy blok aplikacji lub kontener SDK znajduje się na szablonie produktu.
Jakie zdarzenia klienckie są dostępne?
Udokumentowane wywołania zwrotne SDK obejmują kliknięcia przycisku „Try-On” i interakcje „Dodaj do koszyka”. Połącz je z warstwą analityczną bez uwzględniania zdjęć klientów ani zbędnych danych osobowych.
Czy webhooki serwerowe są dostępne?
Webhooki typu server-push nie są częścią aktualnie opublikowanej dokumentacji SDK. Przed użyciem webhooków należy skonsultować się z Partner Engineering w sprawie zakresu wymagań dotyczących zdarzeń po stronie serwera.
Gdzie programiści mogą uzyskać pomoc?
Skorzystaj ze ścieżki pomocy technicznej udostępnionej podczas wdrażania lub wyślij wiadomość e-mail support@spreeai.com. Podaj środowisko, identyfikator produktu, przeglądarkę lub urządzenie, znacznik czasu i zwięzłą ścieżkę odtwarzania — nigdy nie wysyłaj poufnych informacji.
Kiedy będzie dostępne wsparcie Amazon Partner Network?
Integracja z Amazon Partner Network jest w fazie rozwoju. Celowo oznaczono ją jako „Wkrótce”, dopóki interfejs wdrażania i produkcji nie będą gotowe dla zewnętrznych programistów.
Gotowy do budowy?