Plataformas

Aplicativo móvel WooCommerce para clientes: opções e plano de teste

Como oferecer aos clientes WooCommerce seu próprio aplicativo iOS e Android: as quatro rotas comparadas, quando cada uma se adapta e um plano de teste para checkout, logins e plugins.

Ilustração em guache de uma dona de uma loja de plantas envolvendo um vaso de planta ao lado de seu telefone e uma pilha de pacotes

Um aplicativo móvel WooCommerce para clientes é um aplicativo iOS e Android separado sob o nome da sua loja que os clientes instalam para navegar e comprar. Você pode obter quatro maneiras: um plug-in de aplicativo que redesenha seu catálogo a partir da API WooCommerce, um conversor de site para aplicativo que carrega sua loja ativa, um serviço gerenciado ou uma construção personalizada. O caminho certo depende principalmente de quanto da sua loja reside em plug-ins.

Este guia ajuda você a escolher uma rota e provar que ela funciona em sua própria loja antes de gastar dinheiro. Para a versão curta, consulte o WooCommerce para a página do aplicativo. Para uma comparação mais ampla que abrange também sites de conteúdo WordPress, leia WordPress para plug-ins de aplicativos versus conversores.

O aplicativo WooCommerce é oficial para clientes?

Não. O aplicativo WooCommerce na App Store e no Google Play é um aplicativo de gerenciamento de loja para comerciantes. WooCommerce documentação de aplicativos móveis descreve nesses termos: você processa pedidos, cria e gerencia produtos e recebe pagamentos pessoalmente. Seus clientes não podem comprar nele e ele não carrega sua marca.

Um aplicativo de cliente é uma coisa diferente. Ele tem o nome e o ícone da sua loja, fica na tela inicial do comprador e abre o catálogo, o carrinho e a área da conta. WooCommerce não envia um, então cada loja o adquire de terceiros ou o constrói.

Uma loja WooCommerce deveria ter um aplicativo?

Um aplicativo ganha seu lugar quando as mesmas pessoas compram de você continuamente. Antes de comparar rotas, compare sua loja com essas questões.

  • Os clientes fazem novos pedidos? Café, ração para animais de estimação, suplementos, cuidados com a pele, materiais de impressão e peças comerciais são comprados em uma bicicleta. Um ícone na tela inicial e um login salvo encurtam cada pedido repetido.
  • Os clientes fazem login para fazer alguma coisa? Assinaturas para pausar ou pular, reservas para gerenciar, listas de preços de atacado, rastreamento de pedidos e downloads dão às pessoas um motivo para abrir uma área de conta regularmente.
  • Você tem novidades que valem a pena ser notificadas? Quedas, reabastecimentos, faixas sazonais e impulso de vendas. Uma loja que muda duas vezes por ano tem pouco para enviar.
  • O site para celular já é bom? Se os compradores por telefone abandonarem seu checkout hoje, um aplicativo desenvolvido nesse checkout herdará o problema.

Se a maioria dos seus pedidos vier de visitantes iniciantes que chegam por meio de pesquisas ou anúncios, concentre-se no site para celular. Ninguém instala um aplicativo para comprar uma vez.

O que torna o WooCommerce diferente de uma loja hospedada?

WooCommerce oferece WordPress e permite montar o resto. Uma loja típica oferece um tema, um ou três gateways de pagamento, uma calculadora de remessa e, em seguida, os plug-ins que a tornam sua: assinaturas WooCommerce, reservas, complementos de produtos, um plug-in de preços de atacado, um esquema de fidelidade, um campo de checkout personalizado para notas de entrega.

Portanto, faça uma pergunta sobre cada rota abaixo: o aplicativo mostra o que meus plug-ins adicionam ou apenas o que o núcleo do WooCommerce conhece?

Quais são as quatro maneiras de obter um aplicativo de cliente WooCommerce?

Rota 1: um plugin de aplicativo que reconstrói a loja a partir da API

Vários serviços se conectam à sua loja através do API REST WooCommerce, geralmente com um plugin WordPress complementar, e desenhe produtos, categorias, carrinho e pedidos como suas próprias telas nativas. Você projeta o aplicativo no painel do fornecedor e paga uma assinatura.

Bom em: listas de produtos nativas e páginas de produtos que rolam e são animadas como qualquer aplicativo de compras, e uma tela inicial que você pode ter um layout diferente do seu site.

Verifique com atenção: a API descreve produtos, variações, clientes e pedidos. Não descreve o que um plugin de terceiros renderiza na página. Um formulário de complementos, um calendário de reservas, preços baseados em funções ou uma etapa de checkout personalizada exigem que o fornecedor tenha suporte integrado para aquele plug-in específico. Alguns desses serviços mostram o checkout do seu site em um WebView por esse motivo. Peça ao fornecedor uma lista de extensões e gateways suportados e compare-a com sua própria lista de plug-ins, linha por linha.

Rota 2: um conversor de site para aplicativo

Um conversor cria um shell nativo em torno do seu site ativo. O shell fornece o ícone do aplicativo, tela de inicialização, cabeçalho nativo, menus e guias inferiores e notificações push opcionais. Sua vitrine é carregada em um WebView, o mesmo mecanismo de navegador que o Safari e o Chrome usam.

Bom em: fidelidade. Qualquer que seja o seu tema e plug-ins renderizados em um telefone, é o que o aplicativo mostra, porque é a mesma página do mesmo servidor. Nada precisa ser sincronizado e você não mantém um segundo catálogo ou design.

Verifique com atenção: você não obtém telas de produtos redesenhadas nativamente. O aplicativo é tão rápido e organizado quanto seu site para celular e nada melhor. Algumas coisas se comportam de maneira diferente em um navegador incorporado e no Safari ou Chrome, e é para isso que serve o plano de teste abaixo.

SiteTo.App faz esse caminho. Você cola o URL da sua loja, define o nome, o ícone e as guias e visualiza o aplicativo em seu próprio telefone gratuitamente. Uma versão custa US$ 29 para Android, US$ 79 para iOS ou US$ 99 para ambos, pago uma vez.

Rota 3: um serviço de aplicativo gerenciado

Um serviço gerenciado normalmente usa a mesma abordagem WebView para suas páginas e adiciona uma equipe: eles configuram o aplicativo, criam telas nativas personalizadas onde você deseja, enviam para as lojas e fazem a manutenção por uma taxa mensal. Nosso Comparação SiteTo.App vs MobiLoud analisa um desses serviços em detalhes.

Rota 4: um aplicativo personalizado

Um desenvolvedor ou agência cria um aplicativo com base na API REST e na API Store, com todas as telas projetadas para sua loja. Este é o caminho para coisas que um site não pode fazer, como trabalhar totalmente offline. O preço é de projeto e precisa de manutenção, incluindo retrabalho quando você altera um plugin do qual o aplicativo depende.

Como as rotas se comparam?

Plug-in de aplicativo baseado em APIConversor de site para aplicativoServiço gerenciadoAplicativo personalizado
Telas de produtos e carrinhosNativo, desenhado pelo fornecedorSeu site para celularSeu site mobile, além de telas nativas personalizadasNativo, criado para você
Plug-ins de terceirosSomente aqueles que o fornecedor oferece suporteTudo o que funciona no seu site para celularTudo o que funciona no seu site para celularCada um integrado à mão
ConfiraFluxo do fornecedor ou seu site em um WebViewFinalização da compra do seu siteFinalização da compra do seu siteConstruído ou incorporado
Modelo de preçosSubscriçãoTaxa única de construçãoTaxa mensalProjeto mais manutenção
Quem envia para as lojasVaria de acordo com o fornecedorVocêO serviçoVocê ou sua agência
Trabalhe quando você mudar de lojaVerifique novamente o suporte do pluginGeralmente nenhumGeralmente nenhumTempo do desenvolvedor

A associação de desenvolvedor da Apple (US$ 99 por ano) e o registro do Google Play (US$ 25 uma vez) se aplicam a todas as rotas. O guia de custos do aplicativo do site cobre todo o orçamento.

Qual rota se adapta a qual loja WooCommerce?

Escolha um plugin de aplicativo baseado em API se sua loja está perto do estoque WooCommerce, com produtos simples e variáveis ​​​​e um gateway mainstream, e uma navegação nativa é mais importante para você do que um baixo custo fixo.

Escolha um conversor se sua loja móvel já funciona bem e uma parte significativa dela vem de plugins. Isso inclui caixas de assinatura, reservas, configuradores de produtos, lojas de atacado com preços logados e lojas com checkout personalizado.

Escolha um serviço gerenciado se você deseja que uma equipe seja responsável pelo lançamento e manutenção ou se precisa de telas nativas personalizadas no topo do seu site e a taxa mensal faz sentido em relação à receita do seu aplicativo.

Escolha uma construção personalizada se o aplicativo precisar fazer algo que um navegador não pode: funcionar corretamente off-line, conversar com hardware Bluetooth, usar realidade aumentada ou continuar trabalhando em segundo plano.

Quando SiteTo.App é a escolha errada?

  • Seu site para celular é o problema. Um tema lento ou um checkout estranho em um telefone serão igualmente lentos e estranhos no aplicativo. Corrija o site primeiro.
  • Você precisa de impulso no ciclo de vida. SiteTo.App envia título, texto, imagem e link para todos que aderiram, por meio de seu próprio projeto Firebase. Ele não envia notificações automatizadas de carrinho abandonado ou status de pedido e ainda não possui segmentos ou agendamento.
  • Você vende conteúdo digital no iOS. O aplicativo usa a finalização da compra do seu site e não adiciona compras no aplicativo da Apple. Veja as notas de publicação abaixo.

Também não é adequado para Bluetooth, AR, uso off-line intenso ou processamento em segundo plano.

Como você testa uma loja WooCommerce como um aplicativo?

Use um iPhone real e um telefone Android real se você planeja enviar ambos e siga estas etapas em ordem. Anote o URL da página sempre que algo falhar.

Passo 1: Prepare a loja

Coloque cada gateway de pagamento em modo de teste ou sandbox ou crie um produto oculto de baixo preço e um cupom de 100% que você pode reembolsar. Crie uma nova conta de cliente para teste.

Etapa 2: navegue e construa um carrinho

Abra uma categoria, use filtros e pesquise e, em seguida, abra um produto variável. Escolha suas opções, preencha os campos complementares e adicione-o ao carrinho. Observe o minicarrinho ou contagem de carrinhos. Se permanecer em zero, provavelmente um cache de página está servindo conteúdo armazenado. WooCommerce orientação de cache diz para excluir as páginas Carrinho, Checkout e Minha conta e seus cookies de sessão e carrinho do cache.

Etapa 3: verificar os totais

Aplique um cupom, insira um endereço de entrega real e compare as taxas de frete e impostos com o mesmo carrinho do seu site. Eles devem corresponder exatamente, pois o mesmo servidor está fazendo a aritmética.

Etapa 4: pague com todos os gateways

O pagamento é onde um WebView no aplicativo tem maior probabilidade de ser diferente de um navegador de telefone, portanto, reserve mais tempo para essa etapa.

  • Campos do cartão na página, como os do WooPayments ou Stripe, normalmente se comportam como na web móvel. Use um cartão de teste que acione o 3-D Secure e confirme se o desafio aparece e é concluído.
  • Redirecionar gateways enviar o cliente para um banco, uma carteira ou uma janela do PayPal. Siga todo o caminho e confirme que você acessa a página de pedido recebido dentro do aplicativo, não no navegador do telefone, com o aplicativo deixado para trás mostrando uma finalização de compra desatualizada.
  • Apple Pay e Google Pay os botões são exibidos apenas quando o script do gateway decide que o ambiente os suporta, e um WebView no aplicativo não é o mesmo ambiente do Safari ou do Chrome. O Google documenta requisitos específicos para Google Pay no Android WebView, e WooPayments publica seu próprio notas de compatibilidade de checkout expresso. Trate os botões da carteira como um bônus. O pagamento com cartão deve estar sempre disponível ao lado deles.

Depois, verifique se o pedido aparece no wp-admin com o status correto e se o email de confirmação chegou.

Etapa 5: testar contas e sessões

Registre-se ou faça login, abra Minha conta e visualize um pedido. Em seguida, feche o aplicativo completamente e abra-o novamente. Você ainda deve estar conectado com seu carrinho intacto. Solicite uma redefinição de senha e siga o link do e-mail para ver onde ele abre e se a viagem de volta ao aplicativo faz sentido.

Se você usa um plugin de login social, experimente cada botão. Google bloqueia sua tela de login em WebViews incorporados, portanto, um botão "Continuar com o Google" pode mostrar um erro. O login por e-mail e senha é o caminho confiável, portanto, certifique-se de que seja oferecido.

Etapa 6: execute a jornada de cada plugin

Liste os plug-ins voltados para o cliente que tornam sua loja sua e execute uma jornada completa para cada um.

  • Subscriptions: compre um, suspenda-o, altere a forma de pagamento e cancele-o em Minha conta.
  • Bookings: escolha uma data e hora no calendário do tamanho de um telefone e conclua a reserva.
  • Atacado ou B2B: entre com uma conta comercial, confirme os preços comerciais exibidos e faça um novo pedido.

Passo 7: Arrume a moldura

Ignore o banner do cookie e qualquer pop-up do boletim informativo. Verifique se o cabeçalho fixo, a barra inferior ou o botão flutuante de bate-papo do seu tema não se duplicam com o cabeçalho e as guias nativos. O SiteTo.App pode executar scripts que ocultam o cabeçalho e os pop-ups do seu site dentro do aplicativo, portanto, anote tudo o que deseja remover. Se um firewall ou CAPTCHA desafiar você durante o login, certifique-se de que um cliente real possa transmiti-lo por telefone.

O que os resultados devem lhe dizer?

ResultadoO que fazer
Tudo passaEscolha suas guias, crie e prossiga para a publicação
Falta um botão de carteira, mas os cartões funcionamLance com cartões e trate as carteiras como uma melhoria posterior
Um gateway de redirecionamento não retorna ao aplicativoFale com o gateway sobre uma opção na página ou ofereça um gateway diferente
A página de um plugin quebra na largura do telefoneCorrija no site; a correção também ajuda os compradores da web em dispositivos móveis
O checkout é lento ou confusoMelhore o checkout móvel antes de criar qualquer aplicativo

O que você deve configurar no próprio aplicativo?

Use as partes nativas do aplicativo para agilizar a compra repetida.

  • Abas inferiores: Casa, Loja ou sua categoria mais forte, Carrinho e Minha conta funcionam para a maioria das lojas. Uma loja com muitos pedidos pode apontar uma guia diretamente para /my-account/orders/.
  • Selo do carrinho: com a ajuda de um desenvolvedor, o SDK SiteTo.App JS pode observar um URL no seu site e mostrar o número que ele retorna como um emblema em uma guia. WooCommerce Armazenar endpoint do carrinho da API retorna um items_count para o carrinho atual, que um desenvolvedor pode usar como valor do selo.
  • Push: conecte Firebase usando o Guia do Firebase e decida com antecedência o que você enviará.

As alterações de produto, preço e estoque no wp-admin aparecem no aplicativo sem uma nova versão. A alteração do ícone, do nome do aplicativo ou de outras configurações nativas precisa de uma reconstrução, e as reconstruções posteriores são citadas separadamente.

O que as lojas WooCommerce precisam saber antes de publicar?

Você envia o aplicativo de suas próprias contas Apple e Google. SiteTo.App assina a versão do iOS e a carrega para TestFlight em sua conta Apple, para que você não precise de um Mac ou Xcode, e fornece um AAB para Google Play ou um APK. O criar e publicar guia percorre cada etapa. A Apple e o Google decidem o que será aprovado e ninguém pode prometer o resultado. Esses pontos surgem principalmente nas lojas WooCommerce.

Bens físicos usam seu próprio checkout. da maçã Diretrizes para revisão de aplicativos dizem que os bens e serviços consumidos fora do aplicativo são pagos por métodos diferentes da compra no aplicativo (seção 3.1.3 (e)). Uma loja que envia produtos está em terreno sólido.

Os bens digitais são diferentes. O conteúdo usado dentro do aplicativo, como um curso pago, uma videoteca ou uma área exclusiva para membros, se enquadra nas regras de compra no aplicativo da Apple na seção 3.1. O Google Play tem sua própria política de pagamentos para produtos digitais no aplicativo. Leia ambos antes de criar se os produtos digitais ou assinaturas pagas são uma parte real de suas vendas.

Oferecer exclusão de conta. A Apple espera que qualquer aplicativo que suporte a criação de contas permita que as pessoas comecem a excluir suas contas de dentro do aplicativo. A página padrão Minha conta do WooCommerce não tem essa opção. Adicione um com um plugin ou um formulário de solicitação claramente identificado.

Dê aos revisores uma maneira de entrar. Se os preços ou produtos estiverem protegidos por um login, como em muitas lojas de atacado, forneça uma conta de teste funcional nas notas de revisão.

Mostre mais do que um site. A Diretriz 4.2 da Apple pede que os aplicativos ofereçam mais do que um site reembalado. Guias nativas, um cabeçalho nativo e notificações push ajudam, assim como uma loja com funcionalidade real por trás de um login. O Guia da diretriz 4.2 explica como preparar e o guia de publicação abrange listagens, capturas de tela e respostas de privacidade.

Perguntas comuns

Preciso instalar um plugin WordPress?

Não com um conversor. SiteTo.App funciona a partir do URL da sua loja pública, portanto você não adiciona um plug-in ao WordPress ou cria uma chave de API REST. Os serviços de aplicativos baseados em API geralmente precisam de um plug-in complementar e acesso à API, porque leem seu catálogo diretamente.

O que acontece com o aplicativo quando atualizo o WooCommerce ou um plugin?

O aplicativo mostra a loja atualizada na próxima vez que for aberta, sem nenhuma nova compilação. Isso também significa que uma atualização de plug-in que interrompe seu checkout móvel o interrompe no aplicativo ao mesmo tempo. Execute um pedido de teste rápido em um telefone após atualizações significativas, como faria para o site.

Posso iniciar no Android primeiro?

Sim. Uma versão Android custa US$ 29 e o registro no Google Play custa US$ 25 uma vez. Comprar a versão iOS posteriormente custa US$ 79, então os dois comprados separadamente custam US$ 108 contra US$ 99 para os dois juntos.

Próxima etapa

Abra sua loja no seu telefone e faça um pedido de teste. Se tudo correr bem, visualize sua loja WooCommerce como um aplicativo gratuitamente, execute as sete etapas acima e verifique preços uma vez que você sabe que funciona.

Veja seu site como um aplicativo

Personalize a experiência e visualize-a antes de escolher uma plataforma.

Crie sua visualização

Continue lendo

Todos os guias