Caminho mais rápido
SPREEAI para desenvolvedores
Construa o provador
em todas as telas.
Conecte seu catálogo. Molde a jornada do cliente. Integre o Always On à sua loja virtual com o caminho de integração ideal para sua equipe.
Escolha o seu caminho
Comece onde seu
A pilha de comércio está ativa.
Use Shopify para uma configuração gerenciada ou integre-se com nossos SDKs e APIs. Escolha os recursos que sua empresa precisa e mantenha a experiência de compra da sua marca.
Site personalizado
SDK Web
Controle o posicionamento, o estilo, os eventos, o tamanho e o comportamento de adicionar ao carrinho.JavaScript + TypeScript DocumentosNativo para dispositivos móveis
SDK do iOS
Integre a experiência SPREEAI a uma jornada de compras existente no iOS.Abra o guia do iOS DocumentosNativo para dispositivos móveis
SDK do Android
Integre a experimentação virtual em um produto Android com controles nativos.Abra o guia do Android Acesso para parceirosSistemas personalizados
APIs públicas
Utilize a API de referência aprovada para fluxos de trabalho do lado do servidor e do catálogo.Referência da API abertaMercado
Rede de Parceiros da Amazon
Em breve na Amazon Partner Network e em outras plataformas, com mais maneiras de integrar o SPREEAI à sua infraestrutura de comércio.As atualizações aparecerão aqui primeiro.Guia rápido do SDK Web
Sua primeira integração.
Autentique-se uma única vez e, em seguida, visualize a opção de experimentar ou ajustar o tamanho em qualquer lugar da página. Use as credenciais de teste fornecidas durante o processo de integração e nunca insira um segredo do cliente no código do navegador.
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.
},
},
});O modelo de integração
Quatro sistemas.
Um momento para o cliente.
Identificações de produtos, variantes, imagens e contexto de merchandising.
As peças de vestuário passam pelas fases de processamento, revisão e preparação.
Sua loja virtual solicita a experiência para um produto elegível.
Experimente, encontre o tamanho, complete o look e volte para o caixa.
Um caminho focado para o lançamento
Prepare-se. Conecte-se.
Viva com confiança.
Três etapas importantes, com uma lista de verificação prática para cada uma.
- 01 · Preparar
Um ponto de partida claro.
Alinhe a jornada, o acesso e o catálogo.
Lista de verificação de preparação
- Escolha um canal, um grupo de catálogo e uma métrica de sucesso.
- Confirme o acesso do parceiro, as credenciais e as permissões de teste.
- Forneça imagens de vestuário nítidas e alinhadas com o SKU.
- 02 · Conectar
Faça com que pareça natural.
Integre o ambiente de teste. Teste todo o percurso.
Lista de verificação de integração
- Renderizar para produtos elegíveis e conectar variantes e comportamento do carrinho.
- Associe a experiência à marca.
- Verifique o estado em dispositivos móveis, computadores, acessibilidade, desempenho e falhas.
- 03 · Lançamento
Aprenda com a experiência prática.
Habilite os produtos prontos e faça as medições.
Lista de verificação de lançamento
- Confirme se o produto está pronto e publique a experiência em fase de testes.
- Monitorar a adoção, a conclusão e a conversão.
- Use os resultados para orientar a próxima categoria ou jornada.
Linha de base do ativo
Boas contribuições geram melhores resultados.
- JPEG ou PNG
- mínimo de 2.000 × 2.000 px
- Vista frontal necessária
- Vista traseira recomendada
- Iluminação neutra e uniforme
- SKU ou ID do estilo no nome do arquivo
Referência do desenvolvedor
Encontre o próximo
Resposta útil.
Comece aqui
Começando
Entenda o acesso, as plataformas compatíveis e as primeiras decisões que sua equipe precisa tomar.
Referência oficial Integração gerenciadaShopify integração
Instale o aplicativo, aceite os termos, sincronize as peças de roupa, personalize o botão e comece a usar.
Referência oficial SDK WebSuperfície da API
Analise a inicialização, as opções de renderização, o dimensionamento, a personalização e as interfaces tipadas.
Referência oficial API de ParceirosReferência da API pública
Explore a interface aprovada do lado do servidor, disponível para parceiros autenticados.
Referência Swagger Qualidadeativos de vestuário
Prepare imagens e metadados do produto que passem sem problemas pelos processos de ingestão e revisão.
Guia SPREEAI ProduçãoControle de qualidade e lançamento
Use a lista de verificação compartilhada para navegador, desempenho, acessibilidade e entrada em produção.
Guia SPREEAI ApoiarSolução de problemas
Resolva os problemas mais comuns de autenticação, elegibilidade, renderização e desempenho.
Guia SPREEAI DocumentaçãoGuias de implementação
Consulte guias de início rápido públicos, padrões de ativos, listas de verificação de lançamento e orientações para resolução de problemas.
Abrir documentaçãoNão foram encontrados recursos de desenvolvedor correspondentes. Tente “Shopify”, “SDK”, “assets” ou “QA”.
Criar para produção
Os detalhes que protegem
a experiência do cliente.
Segurança
Mantenha os segredos no servidor, use apenas ambientes autorizados e alterne as credenciais no fluxo de trabalho do parceiro.
Privacidade
Solicite imagens do cliente com consentimento explícito e alinhe o tratamento de dados com seu plano de integração aprovado.
Desempenho
Carregue a experiência onde for necessário, teste em dispositivos reais e monitore as regressões nas páginas dos produtos.
Acessibilidade
Mantenha o acesso por teclado, a ordem de foco, os nomes acessíveis e um caminho utilizável quando a experiência não estiver disponível.
Perguntas frequentes do desenvolvedor
Perguntas antes
o primeiro commit.
Qual integração devemos escolher?
Use o aplicativo Shopify para o caminho gerenciado mais rápido, o SDK da Web para posicionamento web personalizado ou sem interface gráfica, os SDKs nativos para experiências de aplicativos e a referência de API aprovada para fluxos de trabalho do lado do servidor, conforme acordado durante a integração.
De onde vêm as credenciais?
O SPREEAI emite o ID do parceiro e as credenciais aprovadas durante o processo de integração. O SDK do navegador usa um ID do cliente e um ID do parceiro. Nunca incorpore um segredo do cliente no código do front-end.
O aplicativo Shopify requer chaves de API?
O fluxo de integração atual do aplicativo Shopify conecta a loja após a etapa de contratos e assinatura necessários; o aplicativo gerenciado não exige a cópia de chaves na tela de configuração.
Por que o botão "Experimentar" não aparece?
Confirme se a peça de roupa concluiu o processamento, se está habilitada para Experimentação Virtual, se está mapeada para o produto ou variante ativa e se o bloco do aplicativo ou o contêiner do SDK está presente no modelo do produto.
Quais eventos para clientes estão disponíveis?
Os callbacks do SDK documentados abrangem cliques no botão "Experimentar" e interações de "Adicionar ao carrinho". Conecte-os à sua camada de análise sem incluir imagens do cliente ou dados pessoais desnecessários.
Os webhooks de servidor estão disponíveis?
Os webhooks de push do servidor não fazem parte da documentação do SDK atualmente publicada. Consulte a equipe de Engenharia de Parceiros para definir o escopo de qualquer requisito de evento do lado do servidor antes de utilizá-lo.
Onde os desenvolvedores podem obter ajuda?
Utilize o canal de suporte técnico fornecido durante o processo de integração ou envie um e-mail. support@spreeai.comInclua o ambiente, o ID do produto, o navegador ou dispositivo, o registro de data e hora e um caminho de reprodução conciso — nunca envie informações confidenciais.
Quando estará disponível o suporte para a Amazon Partner Network?
A integração com a Amazon Partner Network está em desenvolvimento. Ela está marcada como "Em breve" propositalmente até que a interface de integração e produção esteja pronta para desenvolvedores externos.
Pronto para construir?