12 melhores exemplos de aplicativos da Web progressivos (PWAs) em 2022

Publicados: 2022-01-03

Índice

Não é nenhum segredo que o desempenho é vital para o sucesso e a lucratividade de qualquer empreendimento online. Como consequência, sites de todos os setores estão utilizando um novo padrão chamado Progressive Web Apps (PWAs) para melhorar seu desempenho.

Com suporte do Google, a tecnologia front-end visa oferecer um alto nível de desempenho, independentemente do dispositivo ou da condição da rede. Eles conseguem isso aprimorando os PWAs com qualidades de aplicativo nativo que são confiáveis, rápidas e envolventes. Embora receba muita atenção, o conceito de PWAs é relativamente novo para a maioria das pessoas.

Para entender profundamente como um Progressive Web App difere de sites responsivos convencionais, a melhor maneira é observar alguns bons exemplos de PWAs.

Aqui está uma lista de exemplos impressionantes de Progressive Web App em vários setores – para que você possa experimentar a nova tecnologia da Web.

1. Starbucks

starbucks pwa no celular
Starbucks PWA na área de trabalho
Starbucks PWA em dispositivos móveis e computadores

Com o objetivo de fornecer pedidos on-line acessíveis e fáceis de usar a todos os seus clientes, a Starbucks criou um PWA do sistema de pedidos na Web, que oferece uma experiência semelhante ao seu aplicativo nativo existente. Em outras palavras, com sua capacidade de funcionar no modo offline, o Starbucks PWA permite que seus clientes naveguem no menu, personalizem seus pedidos e adicionem itens aos seus carrinhos – tudo sem acesso consistente à Internet. Uma vez on-line, eles podem visualizar os preços específicos do local e fazer seus pedidos de comida e bebida.

Como a maior parte do PWA está disponível sem conexão de rede, é ótimo para clientes em trânsito que podem entrar e sair da conectividade ao longo do dia ou para mercados emergentes, como comunidades rurais, onde a conexão é menos confiável. Ao lançar o novo PWA de pedidos, a Starbucks já obteve resultados significativos. O PWA é 99,84% menor que o aplicativo iOS existente da Starbucks, tornando o aplicativo da web o favorito entre seus usuários. Como resultado, eles dobraram o número de usuários da web que fazem pedidos todos os dias, com os usuários de desktop agora fazendo pedidos aproximadamente na mesma proporção que os usuários de dispositivos móveis.

2. Debenhams

Debenhams PWA no celular
Debenhams PWA na área de trabalho
Debenhams PWA em dispositivos móveis e desktops

Ao falar de marcas que estão transformando sua experiência de compra na indústria da moda, você não pode perder Debenham. A famosa marca do Reino Unido percebeu que, embora seu site antigo tivesse aumentado o tráfego móvel, a taxa de conversão móvel não estava crescendo. Então eles concluíram que era hora de uma transformação digital, caso contrário, seu crescimento digital e geral desaceleraria em breve. A marca buscou uma solução que pudesse oferecer uma experiência tranquila para os usuários, principalmente em dispositivos móveis.

A PWA foi a resposta para a equipe da Debenhams. Depois de transformar seu site antigo em um PWA, seu esforço certamente valeu a pena. Eles melhoraram a experiência do cliente removendo bloqueios na jornada do cliente – páginas lentas, estrutura difícil de navegar, processo de checkout complicado. No geral, a Debenhams teve um aumento de 40% na receita móvel e um aumento de 20% nas conversões.

3. BMW

BMW PWA no celular
BMW PWA na área de trabalho
BMW PWA no celular e desktop

Como marca pioneira na indústria automobilística, a BMW prova que não tem medo de novas tecnologias, seja com seus carros ou com seu site. Para melhorar a experiência do cliente, a marca buscou fornecer conteúdo de qualidade e envolvente, que refletisse seus valores.

O novo PWA da BMW definitivamente oferece aos usuários uma experiência 'uau'. A primeira coisa que qualquer um notaria são as imagens e vídeos de alta resolução, e a web carrega praticamente instantaneamente com todos esses recursos (4X vezes mais rápido que o site antigo). Seus relatórios também mostraram outros números impressionantes após o estabelecimento do PWA: aumento de 4X no número de pessoas que clicam da página inicial para um site de vendas da BMW; 50% de crescimento em usuários móveis e 49% mais visitas ao site em comparação com o site antigo.

4. Flipboard

flipboard pwa
Flipboard PWA na área de trabalho
Flipboard PWA em dispositivos móveis e desktops

Como a revista social mais popular do mundo, o Flipboard permite que os leitores acompanhem todos os tópicos, notícias e eventos de seu interesse, em um único lugar. A partir do interesse do usuário, a plataforma reúne notícias e histórias de todo o mundo em formato de revista. Os usuários do Flipboard podem seguir suas fontes favoritas e salvar histórias, imagens e vídeos em suas próprias revistas do Flipboard para ler mais tarde ou compartilhar com outras pessoas.

O Flipboard é um dos melhores exemplos de PWA para notícias online. O PWA minimiza o uso de dados para oferecer uma experiência de navegação ágil e rápida, em uma interface bonita. Até o lançamento de seu PWA, o Flipboard era um aplicativo móvel, que só é apresentado em dispositivos móveis. Portanto, agora o PWA permite que o Flipboard ofereça uma experiência semelhante ao seu aplicativo nativo completo na Web, tornando-o disponível também para usuários de desktop.

5. Fatia de som

soundlice pwa
Soundslice PWA na área de trabalho
Soundslice PWA em dispositivos móveis e desktops

Soundslice é o software avançado de educação musical na web que revoluciona a forma como os músicos aprendem e praticam música. A empresa faz uso do PWA para oferecer a melhor experiência de criação e aprendizado de música. O software baseado em PWA torna o processo de aprendizagem de uma música mais fácil e eficiente para músicos autodidatas com um player de música inovador. O player Soundslice permite que os usuários aprendam uma música enquanto lêem e ouvem em qualquer dispositivo, seja um telefone ou um desktop de tela grande. Além disso, os professores de música podem utilizar a ferramenta para criar aulas de música interativas. Com foco em aprender com as gravações, a Soundslice também possui uma loja que vende aulas e transcrições.

6. Jogo de 2048

2048 pwa
Jogo 2048 PWA na área de trabalho
Jogo 2048 PWA no celular e desktop

O jogo de quebra-cabeça 2048 foi lançado originalmente como um aplicativo gratuito para Android e iOs em 2014. Ele imediatamente se tornou um sucesso viral com mais de 4 milhões de usuários em menos de uma semana após o lançamento. O jogo é simples e viciante. Descrito como “Candy Crush para geeks da matemática”, seu objetivo é combinar blocos com os mesmos números para totalizar 2048. Uma versão oficial do PWA está disponível em 2048game.com para que os jogadores possam obter acesso instantâneo de qualquer navegador da web. Com transições suaves e visualização em tela cheia, é difícil diferenciar o PWA de seu equivalente de aplicativo nativo. Além disso, o 2048 PWA pode ser totalmente jogado no modo offline.

7. Fazer Minha Viagem

makemytrip pwa
Faça minha viagem pwa
MakeMyTrip PWA no celular e desktop

O site MakeMyTrip.com é um ótimo exemplo de PWA. A principal empresa de viagens da Índia tem cerca de oito milhões de visitantes em seu site mensalmente, com o tráfego móvel representando dois terços. Como o celular se tornou o canal preferido para reservas entre os clientes do MakeMyTrip, eles desenvolveram um PWA que levou a uma experiência de web móvel rápida, confiável e refinada.

A nova experiência de PWA triplicou sua taxa de conversão reduzindo o tempo de carregamento da página em 38%. Em comparação com o site móvel anterior, o MakeMyTrip gerou um aumento de 160% nas sessões de usuários e reduziu a taxa de rejeição em 20% .

8. Uber

uber pwa
Uber PWA
Uber PWA no celular e desktop

À medida que a empresa se expande para novos mercados, sua web Uber foi reconstruída do zero como um PWA para oferecer uma experiência de reserva comparável ao aplicativo móvel nativo. O Uber PWA foi projetado para viabilizar a reserva de carros em redes 2G de baixa velocidade. Construído em torno do conceito de uma experiência semelhante a um aplicativo que é acessível em todos os navegadores modernos, o PWA é ótimo para passageiros em dispositivos de baixo custo, que podem não ser compatíveis com o aplicativo nativo da Uber.

Ao trazer a experiência nativa em um aplicativo da web super leve, a Uber permitiu solicitações de viagens rápidas, independentemente da localização, velocidade da rede e dispositivo. O aplicativo principal de apenas 50kB permite carregar em 3 segundos em redes 2G.

9. Kopa (Padpiper )

Kopa PWA móvel
Área de trabalho Kopa PWA
Kopa PWA no celular e desktop

A Kopa (anteriormente chamada de Padpiper) é a plataforma para ajudar os alunos a encontrar facilmente moradias confiáveis ​​para períodos escolares e estágios e permitir que os proprietários encontrem rapidamente inquilinos adequados para seus espaços. De fato, a plataforma agora suporta 9.000 escolas e possui mais de 100 listagens em seu PWA. Eles verificaram os proprietários e listaram as avaliações para economizar tempo para os alunos encontrarem o melhor ajuste. Depois que os alunos adicionarem o endereço do trabalho, eles poderão procurar as direções para o trabalho em cada listagem na página de resultados. O aplicativo da Web também pode conectar alunos a outras pessoas que estão trabalhando perto deles ou descobrir onde seus colegas de classe estão em cooperação.

10. Pinterest

pinterest pwa
Pinterest PWA
PWA do Pinterest em dispositivos móveis e computadores

Com foco no crescimento internacional, o Pinterest iniciou sua nova experiência na web móvel desde o início como um PWA. A rede social descobriu que apenas 1% de seus usuários móveis convertem em inscrições, logins ou instalações de aplicativos, devido ao baixo desempenho no celular.

Ao perceber que a oportunidade de melhorar a conversão era enorme, eles reconstruíram a web móvel usando a tecnologia PWA, o que levou a vários resultados positivos: O tempo gasto aumentou 40% em comparação com a web móvel anterior, a receita de anúncios gerada pelo usuário aumentou 44% e os engajamentos principais aumentaram 60%

11. Gostoso

gostoso pwa
PWA gostoso
Yummly PWA em dispositivos móveis e desktops

Yummly é a plataforma inteligente de descoberta de culinária que aprende o gosto de um indivíduo, as necessidades nutricionais, o nível de habilidade e muito mais para recomendar receitas personalizadas, listas de compras e entrega de supermercado em uma hora. Junto com seu aplicativo nativo para Android e iOS, o Yummly também está disponível em navegadores da Web como um PWA. Assim como sua presença nativa, o Yummly PWA oferece um mecanismo de busca de comida, culinária e receitas. Ele permite que os usuários pesquisem em mais de um milhão de receitas, provenientes dos principais sites de alimentos, blogs de nicho ou marcas de alimentos locais. Além disso, os resultados da pesquisa podem ser filtrados por ingrediente, dieta, alergia, nutrição, preço, culinária, horário, sabor, pratos e muito mais.

12. Spotify

spotify pwa
Spotify pwa
Spotify PWA em dispositivos móveis e desktop

Seu player de música favorito agora é alimentado por PWA. Devido a algum desacordo entre o Spotify e a Apple em relação à comissão da loja de aplicativos de 30% da Apple, o Spotify achou uma oportunidade oportuna para começar a desenvolver uma versão PWA de seu aplicativo - como muitas outras grandes marcas. Em comparação com sua contraparte de aplicativo nativo, a versão do PWA é consideravelmente mais rápida com sua própria interface de usuário única e adaptável que altera seu plano de fundo à medida que o usuário avança no aplicativo. Como muitos outros PWAs, os usuários também são solicitados a adicionar o Spotify PWA à tela inicial, tornando o Spotify PWA mais acessível e compatível com suas outras versões.

Empacotando

O PWA pode ser aplicado a muitas seções da esfera da tecnologia, desde jogos PWA até PWA Magento. Para entender mais profundamente sobre o PWA e seus casos de uso em seu campo específico, consulte nossos outros artigos dedicados:


Leitura adicional

15 melhores exemplos de comércio sem cabeça em 2022
15 melhores exemplos de comércio sem cabeça em 2022
Luke Vu 3 de janeiro de 2022 11 minutos de leitura
11 melhores jogos de Progressive Web Apps (PWAs) em 2022
11 melhores jogos de Progressive Web Apps (PWAs) em 2022
Luke Vu 3 de janeiro de 2022 5 minutos de leitura
10 melhores aplicativos da Web progressivos (PWAs) para comércio eletrônico 2022
10 melhores aplicativos da Web progressivos (PWAs) para comércio eletrônico 2022
Perada 3 de janeiro de 2022 7 minutos de leitura
10 melhores exemplos de PWA Magento
10 melhores exemplos de PWA Magento
Luke Vu 25 de dezembro de 2020 11 minutos de leitura