14 de abril de 2020
Blog

O que são PWAs?

O conceito e a ideia de PWAs (Progressive Web Apps ou Aplicativos Web Progressivos) não são de hoje. O termo existe desde 2015, quando a Google apresentou essa nova forma de experiência web nos dispositivos móveis. Nos últimos anos, PWAs têm ganhado cada vez mais força e mais pessoas estão apostando nessa ideia.

Mas, o que são PWAs de fato? Um Aplicativo Web Progressivo é um aplicativo web que usa recursos modernos do navegador para fornecer uma experiência semelhante a um aplicativo nativo aos usuários. Esses aplicativos são hospedados em servidores, acessíveis por URLs e indexados pelos mecanismos de pesquisa. Segundo a Google, os PWAs devem ser:

Confiáveis

Quando é aberto na tela inicial do usuário, um Progressive Web App é carregado instantaneamente, independentemente do estado da rede, e nunca mostra o downasaur, mesmo em condições de rede incertas. Como os principais recursos do PWA são pré-armazenados em cache, ele é capaz de eliminar a dependência à rede, garantindo uma experiência instantânea e confiável para seus usuários.

Rápidos

Cerca de 53% dos usuários abandonam um site se ele levar mais de 3 segundos para carregar e, uma vez carregado, os usuários esperam que ele seja rápido, sem rolagem irregular ou interfaces de resposta lenta. A maioria dos sites carregam todos os arquivos (que geralmente são os mais pesados) quando acessados pela primeira vez e isso acaba impactando a experiência do usuário, que tem que esperar esse processo acabar para começar a interagir com o site.

Por isso, um PWA não apenas deve abrir rapidamente ao ser acessado, mas também deve ter um curto tempo para resposta em suas interfaces, para diminuir o que é chamado de Tempo até Interatividade (TTI https://developers.google.com/web/tools/lighthouse/audits/time-to-interactive), carregando os arquivos e executando chamadas em outros recursos e fontes apenas quando realmente necessários.

Engajadores

PWAs devem fazer com que o usuário sinta como se estivesse em um aplicativo nativo no dispositivo. Os Progressive Web Apps podem ser instalados e ficam na tela inicial do usuário, sem a necessidade de uma loja de aplicativos. Eles oferecem uma experiência imersiva em tela cheia e podem até envolver novamente os usuários com Notificações Push.

A “Era dos Aplicativos Móveis” está acabando?

O “boom” de aplicativos para dispositivos móveis que começou em julho de 2008, quando a Apple lançou a App Store, já não é mais o mesmo. Muitas empresas sabem o quanto é difícil e custoso fazer com que as pessoas baixem seus aplicativos. Você já parou para pensar em quantos aplicativos da App Store ou Play Store você baixa por mês?

Segundo o The State of Mobile 2019, da App Annie, em termos de tempo de uso, os aplicativos mais usados em 2018 foram os aplicativos de comunicação e redes sociais, responsáveis por 50% do tempo gasto em aplicativos globalmente. Isso foi seguido por reprodutores e editores de vídeo (15%) e jogos (10%). De acordo com Statista, 96% do tempo dos usuários é gasto em 10 aplicativos. Desses 96%, a maior parte do tempo é utilizada em até 3 aplicativos.

Diante desse cenário, torna-se cada vez mais importante entender a forma como usuários se relacionam com aplicativos para identificar aspectos de experiência de usuário que podem ser melhorados, não apenas nos próprios aplicativos originais, mas para sugestão e aplicação em outras opções.

Retenção do usuário

A retenção é a medida do percentual de usuários que retornam a um aplicativo algum tempo após a sua aquisição. No caso de aplicativos, a retenção é avaliada pela quantidade de usuários que continuam a usar um aplicativo, por exemplo, um, dois ou três meses após o seu download. A rotatividade é o oposto, medindo a porcentagem de pessoas que não retornam a um produto ou serviço depois de um certo período, migrando para outra opção no mercado.

De acordo com os dados da Localytics, 43% dos usuários ainda usam aplicativos um mês após o download, o que significa que 29% dos usuários geram rotatividade e não estão mais usando esses aplicativos após um mês. As coisas pioram com o passar do tempo, chegando em uma média de 71% de rotatividade (churning rate) no 3º mês.

A retenção também pode ser mais minuciosa, sendo medida em quantos usuários retornam a um aplicativo em um número específico de dias após o download. Cerca de 24,9% dos usuários revisita os aplicativos um dia após o seu download, enquanto apenas 9,4% dos usuários revisita os aplicativos duas semanas após o download.

Assim, apenas ter um aplicativo nas lojas não significa que as pessoas o usarão ou, até mesmo, farão o seu download. No mundo dos aplicativos nativos — no qual grandes bases de usuários, frequência de tráfego, entre outros pontos, são necessários para monetização —, por mais maravilhosa que seja uma nova ideia de aplicativo, ela custa cada vez mais publicidade e promoção para atingir uma massa crítica e gerar receita com eficiência.

Qual a diferença entre desenvolver um aplicativo nativo e um PWA?

Construir aplicativos nativos pode ser uma solução bem cara para algumas empresas, pois requer a manutenção de duas equipes de desenvolvedores, uma Android e outra iOS Como é necessário garantir que duas versões de aplicativo estejam atualizadas , desenvolver novas funcionalidades pode acabar impactando bastante a produtividade de uma equipe ou de uma empresa.

Pelo fato de que tudo que precisamos saber para desenvolver um PWA são tecnologias web, não há a necessidade de times distintos com conhecimentos em sistemas operacionais diferentes. Para aplicativos iOS, ainda é necessário passar pela revisão da Apple a cada versão nova. Por outro lado, um PWA é hospedado em um servidor e acessado através de um endereço na barra dos navegadores. Desse modo, ele não necessita da aprovação da Apple e não precisar enviar novas versões às lojas de aplicativos.

No sistema Android, a Google Play Store já oferece suporte à publicação de PWAs na loja, o que acaba trazendo muitos benefícios e tornando melhor a experiência do usuário, como se ele estivesse utilizando um aplicativo instalado de verdade.

Dessa forma, para o desenvolvimento de PWAs, é preciso apenas conhecimento em tecnologias web (existem diversas opções entre frameworks e bibliotecas) para atender a usuários de praticamente todas as plataformas, sem ser necessário ser especialista no sistema operacional do usuário.

Outro aspecto importante a ser considerado no desenvolvimento de apps e PWAs é o espaço necessário para a instalação deles no disco rígido. Uma tendência que vem crescendo cada vez mais são os serviços baseados em nuvem e os modelos de Software como Serviço (Software as a Service ou SaaS) entregues por navegadores em vez de instalar o software propriamente dito. Hoje já temos muitos SaaS bem consolidados, como Netflix e Spotify, que também atendem aos usuários de aplicativos,mas a ideia de um SaaS é que tudo que precisamos é de uma conexão com a Internet.

O objetivo de SaaS é que eles possam ser acessados de qualquer dispositivo, em qualquer lugar. Esse princípio os assemelha muito aos princípios e características de um PWA. Como PWAs são uma opção que considera tanto a diminuição de espaço no disco rígido necessário para funcionar, a redução de dados necessários para funcionar e contam, ainda, com versões off-line que os deixam menos dependentes de uma rede de internet, eles podem ser um meio para alcançar um SaaS que seja ainda mais acessível e independente.

Checklist

Existe uma série de itens e características criadas pela Google que definem o que são esperados de um PWA:

Progressivo: feito para qualquer usuário, independentemente do browser;
Responsivo: feito para qualquer dispositivo (desktop, tablet e mobile);
Conectável: funciona mesmo se o usuário estiver offline;
App-like: o usuário deve se sentir em um aplicativo nativo;
Atualizado: não é necessário baixar atualizações do aplicativo, o browser simplesmente irá detectar e atualizar a versão automaticamente, caso necessário;
Seguro: feito somente com HTTPS (Hyper Text Transfer Protocol Secure), procurando garantir que o domínio ou endereço é verificado;
Engajável: através de Notificações Push, o usuário pode ser constantemente engajado;
Instalável: é possível adicionar um ícone na tela principal do smartphone e desktop com apenas um clique;

Assim, embora existam muitas coisas que possam levar um PWA de uma linha de base a uma experiência exemplar, a lista de verificação disponibilizada pela Google pode ajudar as equipes a criarem as melhores experiências possíveis. A lista inclui, segundo eles, todas as coisas que são necessárias para um PWA da linha de base e como dar um passo adiante e proporcionar uma usabilidade fantástica pensando no usuário, nas condições (muitas vezes limitadas) que ele pode ter e não na plataforma em si.

Uma ferramenta que pode auxiliar muito durante o desenvolvimento de PWAs é a Lighthouse, também criada pela própria Google. Inicialmente, a ferramenta foi projetada para auditar PWAs, mas seu objetivo é auxiliar no aprimoramento de todos os aspectos de um App Web. Ela pode ser executada via terminal ou instalada no Chrome como uma extensão. A ferramenta aplica testes em um site, trazendo dicas, sugestões e possíveis soluções em 5 pontos diferentes: Performance, Acessibilidade, Boas Práticas (Best Practices), SEO (Search Engine Optimization ou Otimização de Ferramenta de Busca) e PWA.

Essas 5 diferentes categorias observadas pela Lighthouse procuram validar, de acordo com métricas estudadas pela Google, o quanto seu site ou PWA pontua de acordo com esses estudos. Isso impacta diretamente na classificação ou posição do site quando um usuário faz uma pesquisa na Google, pois o algoritmo de busca também leva a classificação em consideração.

Limitações em relação aos aplicativos nativos

Um ponto negativo em relação aos PWAs é que eles ainda não têm o controle total sobre o hardware do dispositivo em que estão instalados. Bluetooth, lista de contatos e NFC (Near Field Communication ou Comunicação de Campo de Proximidade) são alguns exemplos de funcionalidades que ainda não conseguem ser acessadas pelos PWAs.

Outro ponto é que, apesar da Google, Microsoft e Mozilla estarem apostando alto nessa nova abordagem, a Apple ainda não está. No iOS 11.3, versão recente do sistema operacional móvel da Apple, foi adicionado um suporte ao conjunto básico de novas tecnologias por trás da ideia de Progressive Web Apps. Porém, ainda há muita coisa a ser implementada e corrigida para fornecer uma experiência de usuário que é esperada de um PWA de verdade.

A Apple parece não demonstrar tanta pressa para implementar total suporte a esses aplicativos — por exemplo, , mas não obrigatório no quesito PWA, é o envio de Notificações Push. Ainda assim, mesmo que a Apple não adote os PWAs inteiramente, eles já são realidade e estão ao nosso redor com resultados notáveis, que veremos logo abaixo.

Estudos de caso

Abaixo, podemos ver algumas das grandes empresas no mundo que já adotaram PWAs e os resultados que isso trouxe para essas empresas:

Tinder

O Tinder, aplicativo de relacionamento, desenvolveu seu próprio PWA em cerca de 3 meses. Embora o aplicativo Android da Tinder exija o download de 30 MB, a sua versão PWA oferece a experiência principal do Tinder a um custo de dados de 2,8 MB. O PWA também parece incentivar mais atividades. Comparado aos usuários dos aplicativos nativos, os usuários do PWA mais, ou seja, arrastam com mais frequência o dedo para o lado na tela (funcionalidade do aplicativo para mostrar ou não interesse por outro usuário), enviam mais mensagens e usam o aplicativo por períodos mais longos.

Uber

A Uber precisava de um aplicativo que pudesse ser usado por qualquer pessoa, independentemente da velocidade do dispositivo e da rede. Sua solução foi desenvolver um PWA que imita seus aplicativos nativos em funcionalidade, mas que apresentava um tamanho em MB significativamente menor em dados armazenados. Usando pequenas bibliotecas e SVGs (Scalable Vector Graphics ou Gráficos de Vetor Escaláveis) em vez de imagens sempre que possível, o Progressive Web App do Uber tem apenas 50 KB e carrega em menos de três segundos mesmo em redes 2G!

Twitter

Embora a adoção de smartphones tenha aumentado para 3,8 bilhões de conexões até o final de 2016, 45% das conexões móveis ainda estão em redes 2G mais lentas, de acordo com a GSMA (Global System for Mobile Communications Association ou Associação de Sistema Global para Comunicação Móvel), órgão de comércio que representa os interesses de operadoras de redes móveis em todo o mundo. Com o Twitter Lite — versão PWA do aplicativo de rede social Twitter —, podemos ter uma visualização de imagens e vídeos antes de escolher quais carregar totalmente. Isso reduz o uso de dados em até 70%, tornando mais acessível o uso do Twitter em áreas em que dados móveis são caros.

iFood

O iFood, aplicativo de entrega de comida, também lançou, recentemente, seu PWA. Essa versão ocupa apenas 280 KB no Android, mas não conta com envio de notificações sobre os status dos pedidos e cupons — porém, o time da iFood já está trabalhando nisso, segundo o aplicativo.