Marché
SPREEAI pour les développeurs
Construis la cabine d'essayage
dans chaque écran.
Commencez par Shopify, le SDK Web ou une intégration d'API approuvée. Ce pôle fait passer votre équipe de la première décision à un lancement testé.
- 04
- chemins d'intégration
- v2.1
- SDK Web actuel
- 01
- liste de contrôle de lancement
Choisissez votre voie
Commencez là où votre
La pile de commerce vit.
Choisissez le chemin le plus rapide qui correspond à votre vitrine. Vous pouvez passer d'une application gérée à une intégration SDK ou API personnalisée à mesure que l'expérience se développe.
En directBientôt disponible
Le chemin le plus rapide
Application Shopify
Installer, synchroniser les vêtements, personnaliser et lancer sans backend personnalisé.Idéal pour les vitrines Shopify ↗ v2.1.0Site web personnalisé
Kit de développement logiciel Web
Contrôlez le placement, le style, les événements, le dimensionnement et le comportement d'ajout au panier.JavaScript + TypeScript ↗ DocumentsMobile natif
Kit de développement logiciel iOS
Intégrez l'expérience SPREEAI dans un parcours d'achat iOS existant.Ouvrir le guide iOS ↗ DocumentsMobile natif
SDK Android
Intégrer l'essayage virtuel dans une expérience produit Android avec des commandes natives.Ouvrir le guide Android ↗ Accès partenaireSystèmes personnalisés
API publiques
Utilisez la référence d'API approuvée pour les flux de travail côté serveur et de catalogue.Référence de l'API ouverte ↗Démarrage rapide du SDK Web
De l'installation à
bouton fonctionnel.
Authentifiez-vous une seule fois, puis affichez l'essayage virtuel ou le choix des tailles n'nimporte où sur la page. Utilisez les identifiants de test fournis lors de l'intégration et ne placez jamais de secret client dans le code du navigateur.
npm install @spreeai/web-sdk
# ou
yarn add @spreeai/web-sdkimport { init } from "@spreeai/web-sdk";
const sdk = await init({
clientId: "your-client-id",
partnerId: "your-partner-id",
});
if (sdk) {
await sdk.renderTryOnButton({
elementId: "spreeai-try-on",
garments: [{ garmentId: "your-garment-id" }],
enableAddToCart: true,
});
}events: {
onTryOnButtonClick: (event) => {
analytics.track("try_on_started", event);
},
onAddToCartClicked: async (event) => {
// Connectez-vous à votre flux de panier existant.
},
}Le modèle d'intégration
Quatre systèmes.
Un moment client.
Identifiants de produits, variantes, imagerie et contexte de marchandisage.
Les vêtements passent par des états de traitement, de révision et de préparation.
Votre vitrine demande l'expérience pour un produit éligible.
Essayez, trouvez votre taille, complétez votre look et retournez au paiement.
Voie de production
Prenez l'intégration
sur la ligne d'arrivée.
Un lancement propre est bien plus qu'un simple bouton qui fonctionne. Utilisez cette séquence pour aligner l'accès, les ressources, le comportement, la qualité et la mesure.
- 01Propriétaire · Produit + commerce
Définir le périmètre du premier parcours
Choisissez un canal, un groupe de catalogue, un moment client et une mesure de succès.
- 02Propriétaire · Ingénierie
Préparer l'accès
Confirmez l'ID du partenaire, les identifiants client approuvés, les autorisations de vitrine et l'environnement de staging.
- 03Propriétaire · Équipe Catalogue
Soumettre des actifs propres
Fournissez un vêtement par image, vue de face obligatoire, haute résolution, éclairage soigné et noms de fichiers alignés sur les SKU.
- 04Propriétaire · Front-end
Intégrer en staging
Afficher uniquement sur les produits éligibles, relier les variantes et le comportement du panier, et faire correspondre le point d'entrée à la marque.
- 05Propriétaire · QA + marque
Lancer le contrôle qualité du lancement
Tester mobile et ordinateur, couverture des navigateurs, accessibilité, performance, fidélité visuelle et états d'échec.
- 06Propriétaire · Commerce et analytique
Activer et mesurer
Activer les produits prêts, publier l'expérience préparée et surveiller l'adoption, l'achèvement et la conversion.
Référence d'actif
Une bonne entrée donne un meilleur résultat.
- JPEG ou PNG
- 2 000 × 2 000 px minimum
- Vue de face requise
- Vue de dos recommandée
- Éclairage neutre et uniforme
- UGS ou ID de style dans le nom de fichier
Référence développeur
Trouver le suivant
réponse utile.
Commencer ici
Premiers pas
Comprendre l'accès, les plateformes prises en charge et les premières décisions que votre équipe doit prendre.
Référence officielle ↗ Intégration géréeIntégration Shopify
Installez l'application, acceptez les conditions, synchronisez les vêtements, personnalisez le bouton et lancez-vous.
Référence officielle ↗ Kit de développement logiciel WebSurface d'API
Examiner l'initialisation, les options de rendu, le dimensionnement, la personnalisation et les interfaces typées.
Référence officielle ↗ API PartenaireRéférence de l'API publique
Explorez l'interface approuvée côté serveur mise à la disposition des partenaires authentifiés.
Référence Swagger ↗ QualitéActifs de vêtements
Préparez les images et les métadonnées des produits pour qu'elles passent facilement par l'ingestion et l'examen.
Guide SPREEAI ↗ ProductionAQ et lancement
Utilisez la liste de contrôle partagée pour le navigateur, les performances, l'accessibilité et le lancement.
Guide SPREEAI ↗ SupportDépannage
Résolvez les problèmes les plus courants d'authentification, d'éligibilité, de rendu et de performance.
Guide SPREEAI ↗ DocumentationGuides d'implémentation
Parcourez les guides de démarrage rapide publics, les normes d'actifs, les listes de contrôle de lancement et les conseils de dépannage.
Ouvrir la documentation ↗Aucune ressource de développeur ne correspond. Essayez “ Shopify ”, “ SDK ”, “ assets ” ou “ QA ”.”
Créer pour la production
Les détails qui protègent
l'expérience client.
Sécurité
Gardez les secrets côté serveur, n'utilisez que les environnements émis et faites pivoter les identifiants via le flux de travail du partenaire.
Confidentialité
Demandez des images de clients avec un consentement explicite et alignez le traitement des données sur votre plan d'intégration approuvé.
Performance
Chargez l'expérience là où c'est nécessaire, testez de vrais appareils et surveillez les régressions des pages de produits.
Accessibilité
Préserver l'accès au clavier, l'ordre de focalisation, les noms accessibles et un parcours utilisable lorsque l'expérience est indisponible.
FAQ développeur
Questions avant
le premier commit.
Quelle intégration devrions-nous choisir ?
Utilisez l'application Shopify pour le parcours géré le plus rapide, le SDK Web pour les intégrations web personnalisées ou sans tête (headless), les SDK natifs pour les expériences in-app, et la référence d'API approuvée pour les flux de travail côté serveur convenus lors de l'intégration.
D'où viennent les justificatifs d'identité ?
SPREEAI émet l'identifiant partenaire et les identifiants approuvés lors de l'intégration. Le SDK du navigateur utilise un identifiant client et un identifiant partenaire. N'intégrez jamais de secret client dans le code frontal.
L'application Shopify nécessite-t-elle des clés API ?
Le parcours d'intégration actuel de l'application Shopify connecte la boutique après l'étape des accords requis et de l'abonnement ; l'application gérée ne nécessite pas de copier les clés dans l'écran de configuration.
Pourquoi le bouton Essayage n'apparaît-il pas ?
Confirmez que le vêtement a terminé son traitement, qu'il est activé pour l'essayage virtuel, qu'il est associé au produit ou à la variante actif, et que le bloc d'application ou le conteneur SDK est présent sur le modèle de produit.
Quels événements client sont disponibles ?
Les rappels du SDK documentés couvrent les clics sur le bouton d'essayage et les interactions d'ajout au panier. Connectez-les à votre couche d'analyse sans inclure d'images de clients ni de données personnelles inutiles.
Les webhooks de serveur sont-ils disponibles ?
Les webhooks de type server-push ne font pas partie de la documentation du SDK actuellement publiée. Validez toute exigence d'événement côté serveur auprès de l'équipe d'ingénierie partenaire avant de vous y fier.
Où les développeurs trouvent-ils de l'aide ?
Utilisez le canal de support technique fourni lors de l'intégration ou par e-mail support@spreeai.com. Incluez l'environnement, l'identifiant du produit, le navigateur ou l'appareil, l'horodatage et un chemin de reproduction concis — n'envoyez jamais de secrets.
Quand le support du réseau de partenaires Amazon sera-t-il disponible ?
L'intégration au réseau de partenaires Amazon est en cours de développement. Elle est intentionnellement marquée comme « Bientôt disponible » jusqu'à ce que l'interface d'intégration et de production soit prête pour les développeurs externes.
Prêt à construire ?