Progressive Web Apps estão nos planos de muitas empresas para modernizar os sites e se adaptar às novas expectativas dos usuários. Assim como em muitas tecnologias, os PWAs geram dúvidas: é o que meus clientes querem, quanto isso vai expandir meus negócios? O que é tecnicamente viável?
![Identifique as partes interessadas.](https://web.dev/static/articles/drive-business-success/image/identify-stakeholders-f19f90a38a98d.jpg?authuser=6&hl=pt)
Para moldar sua estratégia digital, várias partes interessadas costumam estar envolvidas: o gerente de produtos e a diretora de marketing são coproprietários do impacto comercial de cada recurso, o diretor de tecnologia avalia a viabilidade e a confiabilidade de uma tecnologia, os pesquisadores de experiência do usuário validam se um recurso responde a um problema real do cliente.
Este artigo tem como objetivo ajudar você a responder a essas três perguntas e moldar seu projeto de PWA. Você começará com as necessidades do cliente, traduzirá isso em recursos de PWA e se concentrará em medir o impacto comercial de cada um.
Os PWAs atendem às necessidades dos clientes
Uma regra que adoramos seguir no Google ao criar produtos é "foque no usuário e todo o resto virá". Pense com foco no usuário: quais são as necessidades dos meus clientes e como um PWA as oferece?
![Identificar as necessidades do cliente.](https://web.dev/static/articles/drive-business-success/image/identify-customer-needs-90071b7def76e.jpg?authuser=6&hl=pt)
Ao fazer uma pesquisa com usuários, encontramos alguns padrões interessantes:
- Os usuários odeiam atrasos e problemas de confiabilidade no celular. O nível de estresse causado por atrasos relacionados a dispositivos móveis é comparável a assistir um filme de terror.
- 50% dos usuários de smartphone têm mais chances de usar o site para dispositivos móveis de uma empresa ao navegar ou fazer compras porque não querem fazer o download de um app.
- Um dos principais motivos para desinstalar um app é o armazenamento limitado. Um PWA instalado geralmente leva menos de 1 MB.
- Os usuários de smartphone são mais propensos a comprar em sites para dispositivos móveis que oferecem recomendações relevantes sobre produtos, e 85% dos usuários de smartphone afirmam que as notificações em dispositivos móveis são úteis.
De acordo com essas observações, descobrimos que os clientes preferem experiências rápidas, instaláveis, confiáveis e envolventes (F.I.R.E.).
Os PWAs usam recursos modernos da Web
Os PWAs oferecem um conjunto de práticas recomendadas e APIs modernas da Web que atendem às necessidades dos clientes, tornando seu site rápido, instalável, confiável e interessante.
Por exemplo, usar um service worker para armazenar os recursos em cache e fazer a pré-busca preditiva torna seu site mais rápido e confiável. Tornar seu site instalável oferece uma maneira fácil para que seus clientes o acessem diretamente da tela inicial ou do Acesso rápido aos apps. E APIs como as notificações push na Web facilitam o reengajamento de seus usuários com conteúdo personalizado para gerar fidelidade.
![Melhorar a experiência do usuário com recursos da Web.](https://web.dev/static/articles/drive-business-success/image/improving-user-experienc-525e5b12d1361.jpg?authuser=6&hl=pt)
Entenda o impacto nos negócios
A definição de sucesso nos negócios pode variar, dependendo da sua atividade:
- Usuários que passam mais tempo no seu serviço
- Redução das taxas de rejeição dos seus leads
- Aumento nas taxas de conversão
- Mais visitantes recorrentes
A maioria dos projetos com PWA resulta em uma taxa de conversão em dispositivos móveis mais alta. Saiba mais com os inúmeros estudos de caso de PWA. Dependendo dos seus objetivos, você pode priorizar os aspectos dos PWAs que fazem mais sentido para seu negócio, e não há problema algum. Os recursos do PWA podem ser selecionados e iniciados separadamente.
Vamos medir o impacto comercial de cada um desses ótimos recursos do F.I.R.E.
O impacto de um site rápido nos negócios
Um estudo recente da Deloitte Digital mostra que a velocidade da página tem um impacto significativo nas métricas de negócios.
Há muito que você pode fazer para otimizar a velocidade do seu site e melhorar as jornadas ideais para todos os usuários. Se você não sabe por onde começar, confira nossa seção Rápido e use o Lighthouse para priorizar o que é mais importante corrigir.
Ao trabalhar nas otimizações de velocidade, comece a medir a velocidade do site com frequência com ferramentas e métricas apropriadas para monitorar seu progresso. Por exemplo, meça suas métricas com o Lighthouse, corrija objetivos claros, como pontuações"boas" nas Core Web Vitals, e incorpore um orçamento de desempenho ao processo de build. Graças às suas medições diárias e à metodologia de "valor da velocidade", você pode isolar o impacto das mudanças de velocidade incremental e calcular a receita extra gerada pelo seu trabalho.
![Meça o valor da velocidade e relacione-o com as conversões.](https://web.dev/static/articles/drive-business-success/image/measure-value-speed-co-06eddc7056367.jpg?authuser=6&hl=pt)
O Ebay definiu a velocidade como objetivo da empresa para 2019. Ela usou técnicas como orçamento de desempenho, otimização de caminho crítico e pré-busca preditiva. A empresa concluiu que, para cada melhoria de 100 milissegundos no tempo de carregamento da página de pesquisa, a contagem de adição de cartões aumentava em 0,5%.
![Uma melhoria de 100 ms no tempo de carregamento resultou em um aumento de 0,5% na contagem de anúncios adicionados ao carrinho do eBay.](https://web.dev/static/articles/drive-business-success/image/a-100ms-improvement-load-e478244e678fe.jpg?authuser=6&hl=pt)
O impacto comercial de um site instalável
Por que você gostaria que um usuário instalasse seu PWA? Para facilitar o retorno ao seu site. Quando uma instalação de app Android adiciona pelo menos três etapas (redirecionamento para a Play Store, download do app, inicialização do app), a instalação do PWA é feita com um clique, sem desviar o usuário do funil de conversão atual.
![A experiência de instalação deve ser perfeita.](https://web.dev/static/articles/drive-business-success/image/the-install-experience-sh-ed2853f715bee.jpg?authuser=6&hl=pt)
Depois que um app é instalado, os usuários podem iniciá-lo com um clique usando o ícone na tela inicial, vê-lo na bandeja de apps ao alternar entre apps ou encontrá-lo em um resultado da pesquisa de app. Chamamos esse recurso dinâmico de Discover-Launch-Switch, e tornar o PWA instalável é a chave para desbloquear o acesso.
Além de ser acessível em plataformas de descoberta e inicialização conhecidas no dispositivo, um PWA é iniciado exatamente como um app específico da plataforma: em uma experiência independente, separada do navegador. Além disso, ele se beneficia de serviços de dispositivo no nível do SO, como o seletor de apps e as configurações.
Os usuários que instalam seu PWA provavelmente são os mais engajados, com métricas de engajamento melhores do que os visitantes casuais, incluindo mais visitas repetidas, maior tempo no site e taxas de conversão mais altas, geralmente em paridade com usuários de apps específicos da plataforma em dispositivos móveis.
Para tornar o PWA instalável, ele precisa atender aos critérios básicos. Depois que ela atender a esses critérios, promova a instalação na experiência do usuário no computador e no dispositivo móvel, incluindo iOS.
![Os PWAs podem ser instalados em qualquer lugar.](https://web.dev/static/articles/drive-business-success/image/pwas-are-installable-ever-7011cc3ca80b4.jpg?authuser=6&hl=pt)
Depois de começar a promover a instalação do PWA, meça quantos usuários estão instalando o PWA e como eles o usam.
Para maximizar o número de usuários que instalam seu site, convém testar diferentes mensagens de promoção ("instale em um segundo" ou "adicione nosso atalho para seguir seu pedido", por exemplo), posições diferentes (banner de cabeçalho, In-feed) e proponha-as em etapas diferentes do funil de instalação (na segunda página visitada ou após uma reserva).
Para entender a saída dos usuários e como melhorar a retenção, o funil de instalação pode ser medido de quatro maneiras:
- Número de usuários qualificados para a instalação
- Número de usuários que clicaram na solicitação de instalação
- Número de usuários que aceitaram e recusaram a solicitação de instalação
- Número de usuários que instalaram o app
Você pode promover a instalação do PWA para todos os usuários ou adotar uma abordagem mais cautelosa testando um pequeno grupo de usuários.
Alguns dias ou semanas devem fornecer dados suficientes para medir o impacto nos seus negócios. Qual é o comportamento das pessoas que vêm do atalho instalado? Eles interagem mais ou convertem mais?
Para segmentar os usuários que instalaram seu PWA, acompanhe o evento appinstalled
e use o JavaScript para verificar se os usuários estão no modo independente, o que indica o uso do PWA instalado.
Em seguida, use-os como variáveis ou dimensões para o acompanhamento de análise.
![Meça o valor da instalação.](https://web.dev/static/articles/drive-business-success/image/measure-value-installat-548e1ea88d1.jpg?authuser=6&hl=pt)
O estudo de caso do Weekendesk é interessante. Para aumentar a chance de um usuário instalar o PWA, ele promove a instalação na segunda página visitada. Os usuários que iniciaram o PWA pela tela inicial tinham mais de duas vezes mais probabilidade de reservar uma estadia pelo PWA.
![Os usuários com instalação têm uma taxa de conversão 2,5 vezes maior.](https://web.dev/static/articles/drive-business-success/image/installed-users-had-25-8216ba7aa9112.jpg?authuser=6&hl=pt)
A instalação é uma ótima maneira de incentivar as pessoas a voltar ao seu site e melhorar a fidelidade do cliente. Você também pode personalizar a experiência para usuários premium.
Mesmo que você tenha um app específico da plataforma, os usuários podem sentir que não querem ou não precisam instalá-lo. Esses usuários semi-engajados podem achar que um PWA é ideal, porque geralmente é considerado mais leve e pode ser instalado com menos atrito.
![Os PWAs podem alcançar usuários semi-engajados.](https://web.dev/static/articles/drive-business-success/image/pwas-reach-semi-engaged-4bb2ee5369255.jpg?authuser=6&hl=pt)
O impacto comercial de um site confiável
O jogo do dinossauro do Chrome, oferecido quando um usuário está off-line, é jogado mais de 270 milhões de vezes por mês. Esse número impressionante mostra que a confiabilidade da rede é uma oportunidade considerável para o uso de PWA, especialmente em mercados com redes não confiáveis ou dados móveis caros, como Índia, Brasil, México ou Indonésia.
Quando um app instalado de uma app store é iniciado, os usuários esperam que ele seja aberto mesmo sem conexão de Internet. Não é diferente com os Progressive Web Apps.
No mínimo, é preciso exibir uma página off-line simples que informe ao usuário que o app não está disponível sem uma conexão de rede. Em seguida, levante a experiência um passo adiante, fornecendo funcionalidades que façam sentido enquanto você estiver off-line. Por exemplo, você pode fornecer acesso a ingressos ou cartões de embarque, listas de desejos off-line, dados de contato da central de atendimento, artigos ou receitas que o usuário visualizou recentemente etc.
![Seja útil, mesmo quando estiver off-line.](https://web.dev/static/articles/drive-business-success/image/be-helpful-when-offline-94c8ecb14cadd.jpg?authuser=6&hl=pt)
Depois de implementar uma experiência do usuário confiável, convém medi-la: quantos usuários ficam off-line e em quais regiões geográficas eles permanecem no site quando a rede volta? O Analytics pode informar quando os usuários geralmente ficam off-line e on-line. Isso informa quantos usuários continuam navegando no site depois que a rede volta.
![O Trivago teve um aumento de 67% no número de usuários que voltaram a ficar on-line e continuaram navegando.](https://web.dev/static/articles/drive-business-success/image/trivago-saw-67-increase-b38f8ae3d7327.jpg?authuser=6&hl=pt)
O estudo de caso do Trivago ilustra como isso pode afetar seus objetivos de negócio. Para usuários que tiveram sessões interrompidas por um período off-line (cerca de 3% dos usuários), 67% deles continuaram navegando no site.
O impacto comercial de um site envolvente
As notificações push da Web permitem que os usuários ativem atualizações oportunas de sites de que precisam ou se importam, e permitem que você os envolva novamente com conteúdo personalizado e relevante.
No entanto, tome cuidado. Pedir que os usuários se inscrevam para receber notificações da Web quando chegarem e sem expor os benefícios pode ser percebido como spam e afetar negativamente sua experiência. Siga as práticas recomendadas ao solicitar notificações e inspire aceitação usando usos relevantes como atrasos de trem, monitoramento de preços, produtos esgotados etc.
Tecnicamente, as notificações push na Web são executadas em segundo plano graças a um service worker e geralmente são enviadas por um sistema criado para gerenciar campanhas (por exemplo, o Firebase). Esse recurso agrega muito valor comercial para usuários de dispositivos móveis (Android) e computadores. Ela aumenta as visitas repetidas e, consequentemente, as vendas e conversões.
Para avaliar a eficácia das suas campanhas push, você precisa analisar todo o funil, incluindo:
- Número de usuários qualificados para notificações push
- Número de usuários que clicam em uma solicitação da interface de notificação personalizada
- Número de usuários que concedem permissão de notificações push
- Número de usuários que recebem notificações push
- Número de usuários que interagem com as notificações
- Conversão e engajamento de usuários provenientes de uma notificação
![Avalie o valor das notificações push da Web.](https://web.dev/static/articles/drive-business-success/image/measure-value-web-push-b3c98247d6817.jpg?authuser=6&hl=pt)
Há muitos estudos de caso excelentes sobre notificações push da Web, como o sobre o Carrefour, que multiplicou a taxa de conversão por 4,5 ao reengajar usuários com carrinhos abandonados.
The P in PWA: um lançamento progressivo, recurso por recurso
Os PWAs são sites modernos que combinam o enorme alcance da Web com todos os recursos fáceis de usar que os usuários esperam em apps Android, iOS ou para computador. Eles usam um conjunto de práticas recomendadas e APIs modernas da Web que podem ser implementadas de maneira independente, dependendo das especificidades e prioridades do seu negócio.
![Inicie o PWA progressivamente.](https://web.dev/static/articles/drive-business-success/image/progressively-launch-pwa-afc6e174af615.jpg?authuser=6&hl=pt)
Para acelerar a modernização do seu site e torná-lo um PWA real, recomendamos que você seja ágil: lance recurso por recurso. Primeiro, pesquise com os usuários quais recursos trazeriam mais valor para eles. Depois, entregue-os com seus designers e desenvolvedores e, por fim, não se esqueça de medir precisamente a quantidade de dinheiro extra gerada pelo PWA.