Jalur tercepat
SPREEAI untuk pengembang
Bangun ruang ganti
ke setiap layar.
Hubungkan katalog Anda. Bentuk perjalanan pelanggan. Hadirkan Always On ke toko online Anda dengan jalur integrasi yang sesuai dengan tim Anda.
Pilih jalanmu
Mulailah dari tempat Anda berada
Commerce Stack aktif.
Gunakan Shopify untuk pengaturan terkelola, atau integrasikan dengan SDK dan API kami. Pilih fitur yang dibutuhkan bisnis Anda dan pertahankan alur belanja merek Anda.
Situs web kustom
SDK Web
Mengontrol penempatan, gaya, peristiwa, ukuran, dan perilaku tambah ke keranjang.JavaScript + TypeScript DokumenPonsel asli
SDK iOS
Integrasikan pengalaman SPREEAI ke dalam alur belanja iOS yang sudah ada.Buka panduan iOS DokumenPonsel asli
Android SDK
Integrasikan fitur coba pakai ke dalam pengalaman produk Android dengan kontrol bawaan.Buka panduan Android Akses mitraSistem khusus
API Publik
Gunakan referensi API yang telah disetujui untuk alur kerja sisi server dan katalog.Referensi API TerbukaPasar
Jaringan Mitra Amazon
Segera hadir di Amazon Partner Network dan platform lainnya, dengan lebih banyak cara untuk mengintegrasikan SPREEAI ke dalam tumpukan perdagangan Anda.Pembaruan akan muncul di sini terlebih dahulu.Panduan singkat Web SDK
Integrasi pertama Anda.
Lakukan otentikasi sekali, lalu tampilkan fitur coba pakai atau penyesuaian ukuran di mana saja pada halaman. Gunakan kredensial uji yang diberikan selama proses orientasi dan jangan pernah memasukkan rahasia klien ke dalam kode 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.
},
},
});Model integrasi
Empat sistem.
Satu momen pelanggan.
ID produk, varian, gambar, dan konteks pemasaran.
Pakaian melewati berbagai tahapan pemrosesan, peninjauan, dan kesiapan.
Toko online Anda meminta pengalaman tersebut untuk produk yang memenuhi syarat.
Cobalah, temukan ukuran yang sesuai, lengkapi penampilan Anda, dan kembali ke halaman pembayaran.
Jalur terfokus menuju peluncuran
Bersiaplah. Terhubunglah.
Jalani hidup dengan penuh percaya diri.
Tiga tahapan penting, dengan daftar periksa praktis untuk masing-masing tahapan.
- 01 · Persiapan
Titik awal yang jelas.
Menyelaraskan perjalanan, akses, dan katalog.
Daftar periksa persiapan
- Pilih satu saluran, grup katalog, dan ukuran keberhasilan.
- Konfirmasikan akses mitra, kredensial, dan izin penyiapan.
- Sediakan gambar pakaian yang bersih dan sesuai dengan SKU.
- 02 · Terhubung
Buatlah terasa seperti di tempat asalnya.
Bangun secara bertahap. Uji seluruh alur proses.
Daftar periksa integrasi
- Tampilkan produk yang memenuhi syarat dan hubungkan varian serta perilaku keranjang belanja.
- Sesuaikan pengalaman dengan merek.
- Periksa status seluler, desktop, aksesibilitas, kinerja, dan kegagalan.
- 03 · Peluncuran
Belajarlah dari penggunaan nyata.
Aktifkan produk siap pakai dan lakukan pengukuran.
Daftar periksa peluncuran
- Konfirmasikan kesiapan produk dan publikasikan pengalaman yang telah diuji coba.
- Memantau adopsi, penyelesaian, dan konversi.
- Gunakan hasil tersebut untuk memandu kategori atau perjalanan selanjutnya.
Garis dasar aset
Masukan yang baik menghasilkan hasil yang lebih baik.
- JPEG atau PNG
- Minimal 2.000 × 2.000 piksel
- Tampilan depan diperlukan
- Disarankan melihat dari belakang.
- Pencahayaan netral dan merata
- SKU atau ID gaya dalam nama file
Referensi pengembang
Temukan selanjutnya
Jawaban yang bermanfaat.
Mulai dari sini
Memulai
Pahami akses, platform yang didukung, dan keputusan pertama yang perlu diambil tim Anda.
Referensi resmi Integrasi terkelolaShopify orientasi
Instal aplikasinya, setujui perjanjian, sinkronkan pakaian, sesuaikan tombolnya, dan mulai tayang.
Referensi resmi SDK WebPermukaan API
Tinjau inisialisasi, opsi rendering, ukuran, kustomisasi, dan antarmuka bertipe.
Referensi resmi API MitraReferensi API publik
Jelajahi antarmuka sisi server yang disetujui dan tersedia untuk mitra yang telah diautentikasi.
Referensi kesombongan KualitasAset garmen
Siapkan citra produk dan metadata yang dapat diproses dengan lancar melalui proses pemasukan dan peninjauan.
Panduan SPREEAI ProduksiQA & peluncuran
Gunakan daftar periksa bersama untuk browser, kinerja, aksesibilitas, dan peluncuran.
Panduan SPREEAI MendukungPenyelesaian Masalah
Atasi masalah otentikasi, kelayakan, rendering, dan performa yang paling umum.
Panduan SPREEAI DokumentasiPanduan implementasi
Telusuri panduan memulai cepat publik, standar aset, daftar periksa peluncuran, dan panduan pemecahan masalah.
Buka dokumentasiTidak ada sumber daya pengembang yang cocok. Coba “Shopify,” “SDK,” “assets,” atau “QA.”
Membangun untuk produksi
Detail-detail yang melindungi
Pengalaman pelanggan.
Keamanan
Jaga kerahasiaan di sisi server, gunakan hanya lingkungan yang telah diterbitkan, dan lakukan rotasi kredensial melalui alur kerja mitra.
Pribadi
Minta akses gambar pelanggan dengan persetujuan yang jelas dan sesuaikan penanganan data dengan rencana integrasi yang telah disetujui.
Pertunjukan
Muat pengalaman di tempat yang dibutuhkan, uji perangkat sungguhan, dan pantau regresi halaman produk.
Aksesibilitas
Pertahankan akses keyboard, urutan fokus, nama yang mudah diakses, dan jalur yang dapat digunakan saat pengalaman tersebut tidak tersedia.
Pertanyaan yang Sering Diajukan Pengembang
Pertanyaan sebelumnya
Komit pertama.
Integrasi mana yang sebaiknya kita pilih?
Gunakan Aplikasi Shopify untuk jalur terkelola tercepat, Web SDK untuk penempatan web kustom atau headless, SDK native untuk pengalaman aplikasi, dan referensi API yang disetujui untuk alur kerja sisi server yang disepakati selama onboarding.
Dari mana kredensial berasal?
SPREEAI menerbitkan ID mitra dan kredensial yang disetujui selama proses onboarding. SDK browser menggunakan ID klien dan ID mitra. Jangan pernah menyematkan rahasia klien dalam kode front-end.
Apakah aplikasi Shopify memerlukan kunci API?
Alur onboarding aplikasi Shopify saat ini menghubungkan ke toko setelah langkah perjanjian dan berlangganan yang diperlukan; aplikasi terkelola tidak memerlukan penyalinan kunci ke layar pengaturan.
Mengapa tombol Coba Pakai tidak muncul?
Konfirmasikan bahwa proses pembuatan pakaian telah selesai, fitur Coba Pakai (Try-On) telah diaktifkan, sesuai dengan produk atau varian yang aktif, dan bahwa blok aplikasi atau kontainer SDK ada pada templat produk.
Acara klien apa saja yang tersedia?
Fungsi callback SDK yang terdokumentasi mencakup klik tombol Coba-Pakai dan interaksi tambah ke keranjang. Hubungkan fungsi-fungsi ini ke lapisan analitik Anda tanpa menyertakan gambar pelanggan atau data pribadi yang tidak perlu.
Apakah webhook server tersedia?
Webhook server-push bukan bagian dari dokumentasi SDK yang diterbitkan saat ini. Konsultasikan dengan Partner Engineering mengenai persyaratan event sisi server sebelum mengandalkannya.
Dari mana para pengembang mendapatkan bantuan?
Gunakan jalur dukungan teknis yang disediakan selama proses orientasi atau melalui email. support@spreeai.comSertakan lingkungan, ID produk, peramban atau perangkat, stempel waktu, dan jalur reproduksi yang ringkas—jangan pernah mengirimkan informasi rahasia.
Kapan dukungan Amazon Partner Network akan tersedia?
Integrasi Amazon Partner Network sedang dalam pengembangan. Fitur ini sengaja ditandai sebagai "Segera Hadir" hingga antarmuka onboarding dan produksi siap untuk pengembang eksternal.
Siap untuk membangun?