PWA: o que Product Managers devem saber sobre essa tecnologia
Equipe de conteúdo - PM3

Equipe de conteúdo – PM3

10 minutos de leitura

Panorama do Mercado de Produto

Você já sofreu com a falta de armazenamento no seu celular ou até mesmo com a incompatibilidade de download de algum app? PWA é uma tecnologia que surgiu para resolver esse tipo de dor de cabeça dos usuários, assim como para facilitar bastante a vida dos Devs e profissionais de Produto. Se você ainda não sabe muito bem do que se trata isso, continue lendo! Aqui neste artigo você vai entender melhor o que tudo isso tem de tão revolucionário para sua vida em Produto.

O que é PWA?

PWA é a sigla para Progressive Web Apps. Mas o que isso quer dizer na prática? Hoje em dia, com os aplicativos celulares, as pessoas estão acostumadas a acessar suas redes sociais, como Facebook, Twitter e Instagram através dos aplicativos nativos. Entretanto, sabemos que esses aplicativos podem ocupar muito espaço no dispositivo, podendo assim, deixá-lo com uma performance mais lenta. E nada é mais frustrante para a experiência do usuário do que um aplicativo lento e travando, certo?

Quando falamos de PWA, estamos tratando de plataformas digitais que oferecem os mesmos recursos dos aplicativos, porém, por meio de navegadores comuns como o próprio Google ou até mesmo o Safari. Se você ainda não vê muito sentido no PWA, é porque com certeza não sofre com a dor de cabeça de não conseguir, por exemplo, fazer o download de um aplicativo por causa da não compatibilidade com o seu dispositivo.

Como Product Manager, desenvolver um produto em PWA significa que a experiência do usuário será semelhante, porém mais flexível. Ou seja, ainda assim você vai poder contar com notificações push e ícones na tela inicial.

Quando surgiu o PWA?

A Google, empresa de tecnologia multinacional, percebeu em 2015 que a maioria dos acessos à sites se davam por meio de dispositivos móveis. Essa descoberta foi o estopim para o surgimento das plataformas PWA. Nessa época, ela visualizou uma possibilidade democrática e acessível para que toda a  população tivesse a oportunidade de usufruir dos benefícios e interatividade dos aplicativos nativos.

O mais interessante disso tudo, é que os sites PWA funcionam em desktops, tablets e claro, mobile

Além disso, o dispositivo não necessita de conexão à internet, funcionando mesmo no modo offline. Como já mencionamos, o usuário recebe notificações assim como acontece no aplicativo. Nessa situação, o site PWA oferece informação constante sobre engajamento do seu perfil, por exemplo.

Diferença entre app, web app e PWA

O meio tecnológico possui muitas siglas, é verdade, e no meio de tantas fica difícil de entender as diferenças entre elas.

Agora, iremos descobrir as principais diferenças entre os app nativos, web app (web híbridos) e os sites PWA.

App nativos

Atualmente o Sistema Operacional Android e IOS são os que lideram os dispositivos móveis dos usuários. Os aplicativos nativos são aqueles desenvolvidos na linguagem operacional de um determinado sistema. Isso quer dizer que aplicativos como o WhatsApp, vão sim funcionar em ambos os sistemas, mas cada um dentro da sua linguagem operacional.

Características dos aplicativos nativos

  • Maior número de funcionalidades por conta da integração com o sistema operacional do dispositivo;
  • Design mais atrativo;
  • Permite o uso de tecnologias com maior desenvolvimento;
  • Geolocalização;
  • Funcionalidade offline através dos dados que ficam armazenados no dispositivo móvel;
  • Aproximação/conexão com o cliente.

Web app

Os web app ou aplicativos híbridos como também são conhecidos, foram desenvolvidos com o intuito de oferecer ao usuário o melhor dos dois mundos envolvendo os aplicativos nativos e os PWA.

Quando o assunto é funcionalidade, esses aplicativos não ficam atrás dos apps nativos. Muito pelo contrário, oferecem a mesma experiência ao usuário. O grande diferencial está na forma como cada um é desenvolvido. Se por um lado, os aplicativos nativos são desenvolvidos baseado na linguagem operacional de um determinado sistema, os web apps, por sua vez, têm seu desenvolvimento baseado em linguagens Java, HTML ou CSS.

Características dos web apps:

  • Desenvolvimento mais rápido;
  • Design similar para cada tipo de plataforma, sofrendo apenas adaptações.

Progressive Web App

Diferente dos outros, o PWA é uma página de internet com funcionalidades e layout semelhantes a um aplicativo nativo. Sendo assim, seu grande diferencial é não necessitar de um download.

Características do PWA

  • Ocupa menos espaço de armazenamento;
  • Não precisa ser instalado;
  • Atalho na tela inicial do seu dispositivo;
  • Compartilhável por meio da URL;
  • Funcionamento offline ou com conexão instável;
  • Adaptabilidade;
  • Tempo de carregamento mais curto;
  • Mais engajamento e conversão de usuários;
  • Menor esforço com o desenvolvimento.

9 empresas que aderiram ao Progressive Web App

Apesar de ser pouco conhecido, muitas empresas já utilizam PWA. Talvez você já tenha passado por algum, mas não sabia do que se tratava. Aqui listamos alguns:

Revista Forbes

  • Após se render ao PWA, a revista Forbes cresceu:
  • 43% as sessões por usuário;
  • 20% nas impressões por página;
  • 100% na taxa de engajamento;
  • 6 vezes o número de leitores de seus artigos.

Tinder

O Tinder, aplicativo de relacionamento mais popular do mundo, notou que seus usuários acessavam o PWA mais vezes do que o aplicativo nativo, o que impactou diretamente no aumento do envio de mensagens e no tempo gasto na navegação.

AliExpress

A versão PWA do e-commerce proporcionou os seguintes resultados para o produto:

  • Aumento de 104% de conversão de novos usuários;
  • 2 vezes mais acessos às páginas;
  • Aumento de 74% no tempo de sessão.

Pinterest

Em seu site antigo, a conversão alcançava apenas 1% das pessoas. Esse cenário mudou depois da implementação do PWA, pois as receitas sob os anúncios gerados pelos usuários aumentou 44%, consequentemente, os cliques aumentaram em 50% e o engajamento em 60%.

Trivago

Criado em 2005, o maior motor de busca e comparador de preços de hotéis expandiu e alcançou diversos outros países. 

Tal expansão trouxe milhares de visitas ao site e foi nesse momento que a necessidade de um PWA foi percebida. Assim, a Trivago aderiu a essa tecnologia e com isso alcançou um aumento de 150% no seu engajamento. O número de cliques em ofertas elevou quase 100% e o mais inacreditável: 67% dos usuários que acessam a plataforma offline, permanecem quando ficam online.

Jornal The Washington Post

Em 2016, o The Washington Post também aderiu ao PWA. Essa estratégia se deu principalmente porque o jornal local gostaria que seus usuários tivessem acesso ao noticiários mesmo quando sem internet. Os benefícios da escolha foram muitos: o tempo gasto de carregamento reduziu em cerca de 90% e as pesquisas realizadas por usuários aumentaram em 23%.

Starbucks

O PWA da Starbucks veio para facilitar a vida dos consumidores, principalmente quando o assunto é ver o cardápio. Os clientes podem acessar o menu de informações, informações nutricionais e personalizar seu pedido ainda que esteja navegando de forma offline. Bem mais prático, não?

Twitter

O Twitter é um rede social muito popular, cerca de 80% de seus usuários acessam a rede através do dispositivo móvel, isso quer dizer que a empresa precisa pensar em como melhorar cada vez mais a experiência dos usuários mobile. O resultado de implementação do PWA foi: as visualizações de página por sessão aumentaram em 65%, o envio de tweets em 70% e a taxa de retorno de tela reduziu em 20%.

Dicas para desenvolver um produto PWA

Até aqui você viu toda a parte teórica sobre o PWA e, no tópico anterior, teve a oportunidade de conferir alguns exemplos que mostram os impactos positivos que empresas obtiveram ao desenvolver uma versão PWA para seus produtos digitais.

Agora veremos algumas dicas de como desenvolver um produto assim, caso faça sentido para seus usuários. O que você precisa saber como Product Manager é que existem exigências técnicas para a criação de um PWA. Entender esses aspectos vai te ajudar a acompanhar status das demandas e também a negociar com stakeholders de Engenharia. Confira quais são elas:

  • Um PWA precisa ser um ambiente seguro, e para isso, é obrigatória a existência de uma conexão com https
  • Outro requisito básico para um PWA é que ele deve ser desenvolvido de forma independente para que o usuário consiga navegar de forma offline.
  • As respostas que o seu programa fornecer devem ser suportadas em qualquer formato de tela, da mesma forma que precisa ser funcional e adaptável aos diversos navegadores existentes.
  • Manifest.json é essencial e se trata de um arquivo que fica responsável por tornar o PWA atraente. Isso quer dizer que nome, cor do browser, modo de execução e a personalização da experiência de uso são geradas a partir dele.
  • As imagens devem ter largura e altura de medidas iguais, além de serem elaboradas dentro do padrão de 512px X 512px.
  • O nome pode até parecer difícil, mas o Service Worker (SW) é o que torna possível navegar offline. Por isso, sua instalação é indispensável!
  • A tags (ou etiquetas como também são chamadas) são as responsáveis por fazer com que o usuário consiga rastrear um PWA através da busca nas páginas da internet.
  • A etapa de fiscalização é a última antes de finalmente ter o PWA em ação. Ela pode ser executada em apenas um clique, utilizando algumas ferramentas.

Conclusão

Aqui neste artigo, vimos que a tecnologia PWA é muito útil e pode proporcionar diversos benefícios em uma estratégia de produto. Porém, é claro que Product Managers devem avaliar se realmente faz sentido investir nesse tipo de plataforma. Isso envolve pensar em experiência do usuário, nos hábitos de uso do público-alvo e, claro, no retorno para o negócio. Ou seja a priorização desse tipo de iniciativa no backlog vai depender de contexto, mas sem dúvidas, vale a pena ficar de olho nessa oportunidade.

Leia também: