Camino más rápido
SPREEAI para desarrolladores
Construir el probador
en cada pantalla.
Conecta tu catálogo. Define la experiencia del cliente. Integra Always On en tu tienda online con la solución de integración que mejor se adapte a tu equipo.
Elige tu camino
Comienza donde tu
La pila de comercio sigue viva.
Utilice Shopify para una configuración gestionada o integre con nuestros SDK y API. Elija las funciones que su empresa necesita y mantenga la experiencia de compra de su marca.
Web personalizada
SDK web
Controla la ubicación, el estilo, los eventos, el tamaño y el comportamiento al añadir al carrito.JavaScript + TypeScript DocumentosMóvil nativo
SDK de iOS
Integre la experiencia SPREEAI en un proceso de compra existente en iOS.Abrir la guía de iOS DocumentosMóvil nativo
SDK de Android
Integra la función de prueba gratuita en la experiencia de un producto Android con controles nativos.Abrir la guía de Android Acceso de sociosSistemas personalizados
API públicas
Utilice la referencia de API aprobada para los flujos de trabajo del lado del servidor y del catálogo.Referencia de Open APIMercado
Red de socios de Amazon
Próximamente en la red de socios de Amazon y otras plataformas, con más formas de integrar SPREEAI en tu conjunto de herramientas de comercio electrónico.Las actualizaciones aparecerán aquí primero.Guía de inicio rápido del SDK web
Tu primera integración.
Autentícate una sola vez y luego muestra la opción de prueba o ajuste de tamaño en cualquier parte de la página. Usa las credenciales de prueba que se te proporcionaron durante el proceso de incorporación y nunca incluyas una clave secreta del cliente en el código del navegador.
npm install @spreeai/web-sdk@3.0.0
# or
yarn add @spreeai/web-sdk@3.0.0
import { 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.
},
},
});
El modelo de integración
Cuatro sistemas.
Un momento del cliente.
Identificadores de producto, variantes, imágenes y contexto de comercialización.
Las prendas pasan por diferentes etapas: procesamiento, revisión y preparación.
Tu tienda online solicita esta experiencia para un producto que cumpla los requisitos.
Pruébatelo, encuentra tu talla, completa el look y vuelve a la página de pago.
Un camino enfocado hacia el lanzamiento
Prepárate. Conéctate.
Vive con confianza.
Tres hitos, con una lista de verificación práctica para cada uno.
- 01 · Preparar
Un punto de partida claro.
Alinear el recorrido, el acceso y el catálogo.
Lista de verificación de preparación
- Elija un canal, un grupo de catálogo y una medida de éxito.
- Confirme el acceso de los socios, sus credenciales y los permisos de entorno de prueba.
- Proporcione imágenes de prendas nítidas y alineadas con el código SKU.
- 02 · Conectar
Haz que parezca algo autóctono.
Construye por etapas. Prueba todo el proceso.
Lista de verificación de integración
- Renderizar para productos elegibles y conectar variantes y comportamiento del carrito.
- Adapta la experiencia a la marca.
- Compruebe el estado en dispositivos móviles, ordenadores de escritorio, accesibilidad, rendimiento y fallos.
- 03 · Lanzamiento
Aprende del uso real.
Habilitar productos listos y medir.
Lista de verificación de lanzamiento
- Confirma que el producto está listo y publica la experiencia preparada.
- Supervisar la adopción, la finalización y la conversión.
- Utilice los resultados para orientar la siguiente categoría o ruta.
Línea base de activos
Una buena información de entrada produce un mejor resultado.
- JPEG o PNG
- Mínimo de 2000 × 2000 píxeles
- Se requiere vista frontal
- Se recomienda la vista trasera.
- Iluminación neutra y uniforme
- SKU o ID de estilo en el nombre del archivo
Referencia del desarrollador
Encuentra el siguiente
respuesta útil.
Empezando
Comprenda el acceso, las plataformas compatibles y las primeras decisiones que su equipo debe tomar.
Referencia oficial Integración gestionadaShopify incorporación
Instala la aplicación, acepta los acuerdos, sincroniza las prendas, personaliza el botón y empieza a usarla.
Referencia oficial SDK webSuperficie API
Revise la inicialización, las opciones de renderizado, el dimensionamiento, la personalización y las interfaces tipadas.
Referencia oficial API de sociosReferencia de la API pública
Explore la interfaz del servidor aprobada disponible para los socios autenticados.
Referencia a Swagger Calidadactivos de prendas de vestir
Prepare imágenes y metadatos de productos que se procesen sin problemas durante la ingesta y la revisión.
Guía SPREEAI ProducciónControl de calidad y lanzamiento
Utilice el navegador compartido, el rendimiento, la accesibilidad y la lista de verificación para la puesta en marcha.
Guía SPREEAI ApoyoSolución de problemas
Resuelve los problemas más comunes de autenticación, elegibilidad, renderizado y rendimiento.
Guía SPREEAI DocumentaciónGuías de implementación
Consulte las guías de inicio rápido públicas, los estándares de activos, las listas de verificación de lanzamiento y la guía de solución de problemas.
Abrir documentaciónNo se encontraron recursos para desarrolladores que coincidan. Pruebe con “Shopify”, “SDK”, “assets” o “QA”.
Construir para producción
Los detalles que protegen
la experiencia del cliente.
Seguridad
Mantenga la información confidencial en el servidor, utilice únicamente los entornos autorizados y rote las credenciales a través del flujo de trabajo del socio.
Privacidad
Solicite imágenes de los clientes con su consentimiento explícito y ajuste el manejo de datos a su plan de integración aprobado.
Actuación
Implementa la experiencia donde sea necesaria, prueba dispositivos reales y supervisa las regresiones en las páginas de productos.
Accesibilidad
Conservar el acceso al teclado, el orden de enfoque, los nombres accesibles y una ruta utilizable cuando la experiencia no esté disponible.
Preguntas frecuentes para desarrolladores
Preguntas antes
el primer commit.
¿Qué integración deberíamos elegir?
Utilice la aplicación Shopify para la ruta administrada más rápida, el SDK web para la ubicación web personalizada o sin interfaz gráfica, los SDK nativos para experiencias de aplicaciones y la referencia de API aprobada para flujos de trabajo del lado del servidor acordados durante la incorporación.
¿De dónde provienen las credenciales?
SPREEAI emite el ID de socio y las credenciales aprobadas durante el proceso de incorporación. El SDK del navegador utiliza un ID de cliente y un ID de socio. Nunca incluya un secreto de cliente en el código de la interfaz.
¿La aplicación Shopify requiere claves API?
El flujo de incorporación actual de la aplicación Shopify conecta la tienda después del paso de acuerdos y suscripción requeridos; la aplicación administrada no requiere copiar claves en la pantalla de configuración.
¿Por qué no aparece el botón de Probar?
Confirme que la prenda haya finalizado su procesamiento, que esté habilitada para la prueba gratuita, que se corresponda con el producto o variante activa y que el bloque de la aplicación o el contenedor SDK esté presente en la plantilla del producto.
¿Qué eventos para clientes están disponibles?
Las funciones de devolución de llamada del SDK documentadas cubren los clics en el botón "Probar" y las interacciones para añadir productos al carrito. Conéctalas a tu capa de análisis sin incluir imágenes de clientes ni datos personales innecesarios.
¿Están disponibles los webhooks del servidor?
Los webhooks de envío de datos desde el servidor no forman parte de la documentación del SDK publicada actualmente. Consulte con el equipo de ingeniería de socios cualquier requisito relacionado con eventos del servidor antes de utilizarlo.
¿Dónde pueden obtener ayuda los desarrolladores?
Utilice la vía de soporte técnico proporcionada durante la incorporación o envíe un correo electrónico. support@spreeai.comIncluya el entorno, el ID del producto, el navegador o dispositivo, la marca de tiempo y una ruta de reproducción concisa; nunca envíe información confidencial.
¿Cuándo estará disponible el soporte para Amazon Partner Network?
La integración con Amazon Partner Network está en desarrollo. Está marcada intencionadamente como "Próximamente" hasta que la interfaz de incorporación y producción esté lista para desarrolladores externos.
¿Listo para construir?