Reddit PWA: como as principais mídias sociais utilizam o aplicativo da Web

A adoção de novas tecnologias é uma parte inevitável da inovação e do crescimento dos negócios online. Geralmente, as grandes empresas podem experimentar facilmente os gadgets mais recentes, aumentando a satisfação do cliente e se destacando da concorrência. O PWA será a próxima grande novidade, adotado por várias marcas gigantes como Reddit PWA, Facebook PWA e Alibaba PWA.

Com isso dito, o PWA é considerado o novo padrão para sites modernos e um player promissor para substituir aplicativos nativos. No entanto, é incrivelmente acessível para pequenas e emergentes empresas. No estudo de caso de hoje, vamos mergulhar de cabeça no Reddit PWA e ver como esse popular site de mídia social tira proveito do PWA.

Uma visão geral do Reddit

O Reddit foi fundado em 2005 por Steve Huffman e Alexis Ohanian da Universidade da Virgínia. Seu nome foi um ajuste na resposta “eu li” quando outros querem compartilhar uma história.

É uma plataforma massiva onde os usuários podem enviar postagens em vários tipos de conteúdo, como notícias sociais, discussão em fóruns, conteúdo da web ou uma rede reunida. É parte do que torna o Reddit popular, sendo a fonte acumulada de discussões de conhecimento em quase todos os campos de aprendizado.

Além disso, o Reddit permite que as pessoas permaneçam anônimas ao fazer qualquer pergunta, abrindo espaço para uma experiência aberta e emocionante para navegar por qualquer informação que seus cérebros desejem.

As postagens do Reddit são determinadas pela comunidade. Um post ou subreddit só pode ser movido para cima se os usuários votarem nele com base em como eles o consideram útil. Dessa forma, spam ou informações prejudiciais e enganosas podem ser reduzidos.

Seu principal público-alvo são universitários, bolsistas com experiência em Internet e defensores de mídia social entre 18 e 29 anos. Eles classificaram a 10ª rede social mais popular nos EUA, com quase 48 milhões de usuários ativos mensais e mais de 430 milhões de usuários ativos mensais em todo o mundo.

Como a integração do PWA ajuda as marcas a impulsionar as conquistas

Acelerando a experiência do usuário

Muitas marcas chegam ao PWA para aumentar a velocidade de carregamento de seus aplicativos. Tomemos o caso do Uber PWA como exemplo. Sabendo que seus clientes estão (na maioria das vezes) usando o Uber com pressa, eles criaram um Uber PWA minúsculo, mas poderoso, que pode carregar em 3 segundos, mesmo em conexões tão lentas quanto 2G.

Acelerar a jornada do usuário reduzirá a taxa de rejeição e, assim, aumentará a taxa de conversão potencial. As pessoas hoje em dia muitas vezes consideram as páginas de carregamento lento como assistir a um filme irritante que eles abandonariam a qualquer minuto.

O Walmart também calculou que, com apenas uma melhoria de 1 segundo no tempo de carregamento, a taxa de conversão já aumentou 2%.

Aumente o valor do cliente

O PWA não apenas pode ajudá-lo a melhorar o carregamento da primeira página, mas também cria transições suaves e perfeitas entre páginas e elementos. Em outras palavras, a experiência do usuário no site também será agradável.

Para lojas de comércio eletrônico e marketplaces, quanto mais tempo os clientes permanecerem nas páginas, melhor significa que eles estão interessados ​​nos itens oferecidos. Ao mesmo tempo, aqueles que tendem a fazer compras a granel acham a jornada de compra fácil e rápida.

O PWA pode habilitar notificações push em momentos cruciais, reconectando-se com usuários frequentes para engajamento, agregando mais valor aos negócios online.

Desfocar o Online – Distância Offline

Com a capacidade de trabalhar offline, o PWA permite que os usuários continuem sua jornada online inacabada em movimento, navegando pelas páginas carregadas.

Eles também podem fazer alterações no conteúdo e tudo será salvo em segundo plano para a sincronização mais próxima quando a conexão for reaplicada.

Todos os dispositivos agem da mesma forma

Pequenas empresas podem alocar orçamentos para outros investimentos essenciais enquanto economizam custos na integração de PWA.

Ter que criar um aplicativo rápido apenas para qualquer dispositivo pode manter o desempenho consistente em todas as presenças online e maximizar o tempo e os recursos para atrair e adquirir clientes.

É assim que as empresas em crescimento podem aumentar sua receita com eficiência.

Desafios do Reddit antes da integração com PWA

O Reddit sempre quis uma solução para incentivar seus usuários a usar o aplicativo, principalmente via desktop. Eles estavam procurando uma maneira de tornar quase sem esforço para seus usuários mudarem para aplicativos.

Os dados mostram que uma das principais desvantagens do uso de aplicativos é consumir muito armazenamento. Por outro lado, uma instalação de PWA requer menos de 1 MB.

Além disso, o processo de download do Reddit é considerado um matador de tempo devido à sua quantidade volumosa. Alguns tópicos do Reddit disseram que era surpreendente não ver o Reddit trabalhando no PWA anteriormente e otimizando as funcionalidades.

Os resultados do Reddit PWA

Sobre o projeto

Embora o PWA mantenha a mesma aparência em todas as plataformas, cada navegador o suporta de maneira diferente. O menu de três pontos simplifica a instalação ou desinstalação do PWA da Web com o Chrome em vez do Microsoft Edge.

Os sinais pop-up como “Instalar aplicativo na tela inicial” são considerados fáceis de usar e obrigatórios para que os visitantes sejam incentivados a usar os aplicativos.

Sobre a função

• A velocidade de carregamento: eficientemente rápido e suave
• A transição entre páginas e elementos: elementos de aparência instantânea e responsivos
• A facilidade de navegação: layout de conteúdo suspenso típico com efeitos de foco pós-expansão, familiar, intuitivo e sem esforço
• O nível de engajamento com cada interação: é globalmente satisfatório. A maneira como o logotipo do Reddit aparece para que o conteúdo de carregamento apareça instantaneamente faz com que o site pareça mais rápido

Como construir um PWA como o Reddit?

Dicas com o Reddit PWA

Certifique-se de atender aos requisitos principais do PWA. Ele deve começar rápido, mas também permanecer rápido durante toda a jornada do usuário. O Reddit PWA mostra uma velocidade vertiginosa desde o primeiro carregamento, e todo o conteúdo aparece instantaneamente à medida que você rola, garantindo uma experiência de usuário responsiva.

Exclusivamente no iOS, os recursos de reengajamento, como mensagens pop-up e notificações para instalação do PWA, não são suportados pela Apple.

Se você deseja praticar o desenvolvimento avançado para obter a funcionalidade ideal, saiba que os PWAs são criados com base nas práticas recomendadas e nas APIs da Web modernas. Eles podem ser aplicados para trabalhar de forma independente ou em combinação, dependendo das prioridades do seu negócio e demandas específicas.

Reddit PWA focado em aumentar a velocidade primeiro, todo o resto segue. É como dizer: “Ei, veja o desempenho do nosso aplicativo móvel, imagine o que você obterá se fizer o download do aplicativo”. Observe que, depois que os visitantes rolam, o Reddit permite flexões para incentivar os usuários a mudar para o aplicativo.

Para alinhar a aparência moderna do seu site e desbloquear seu PWA em todo o potencial, o Google incentiva a priorizar a estratégia ágil, que é lançar recurso por recurso e ver se o combo funciona para você.

Esse ponto de vista permite que você acompanhe a resposta do mercado passo a passo. Analisar os dados rastreados pode dizer quais recursos os usuários mais gostam de usar e o que não agrega valor a eles.

Essas entradas são essenciais para que os web designers e desenvolvedores façam os ajustes necessários. Mantenha o processo de tentativa e erro até executar os corretos que o ajudam a aumentar o dinheiro extra gerado pelo PWA.

Uma introdução simplificada ao desenvolvimento de PWA

Configurando

Crie o diretório do aplicativo e preencha os subdiretórios js, CSS e imagens aqui.

Escrevendo a marcação para a interface do aplicativo

Nesta etapa, o PWA deve poder exibir conteúdo, independentemente de o JavaScript estar desabilitado ou não. Dessa forma, os usuários não enfrentarão uma página em branco perturbadora sempre que a conexão estiver fora ou atrasada.

Em vez disso, todas as interações devem ser responsivas e exibidas corretamente em uma ampla variedade de telas. Isso requer levar em consideração a orientação de compatibilidade com dispositivos móveis.

Testando o aplicativo

Assim que você tiver algo acontecendo no navegador, poderá testá-lo com o Lighthouse do Google para ver o desempenho dele nos padrões do PWA.

Pressione F12 para abrir o painel do desenvolvedor do Chrome em seu site público, encontre a guia de auditorias e clique em Lighthouse.

Um trabalhador de serviço

Sendo um script da Web relativamente independente que é executado em segundo plano, além da interação do usuário, essa capacidade poderosa permite que o PWA intercepte solicitações de rede, habilite o armazenamento em cache local e muito mais.

Um manifesto de aplicativo

Um manifesto de aplicativo é necessário com um service worker para determinar como seu PWA será exibido e se comportará na tela inicial. Você pode configurar o nome, o ícone, a cor do tema e a orientação do aplicativo.

Embrulhar

O código está completo até esta fase, mas você precisa carregar o aplicativo em um servidor web. Isso permitiria que seu PWA operasse sob a segurança de HTTPS.

Desenvolvimento de PWA Premium para comércio eletrônico da Tigren

Nossa experiência

Como um provedor profissional de serviços Magento de uma década, a Tigren é agora uma das principais agências de terceirização do mundo.

Tudo começou com uma pequena equipe de desenvolvedores altamente treinados, habilidosos e dedicados que se esforçam para atingir os objetivos de nossos clientes. Até hoje, executamos mais de 1.000 projetos para mais de 800 SMBs globais.

Com sede no Vietnã, esperamos ajudar o maior número possível de proprietários de empresas aspirantes com os projetos de comércio eletrônico Magento de classe mundial que eles merecem, mas a preços razoáveis ​​e acessíveis, tanto quanto possível.

Nossos serviços

Somos a agência especializada em Magento com o objetivo de trazer soluções de crescimento sustentável para pequenas e médias empresas. Com o PWA, fornecemos 2 serviços premium da seguinte forma:

• Desenvolvimento de aplicativos Web progressivos personalizados
• Modelo de PWA premium do Tigren

Principais conclusões

O PWA é a combinação certa de aplicativos nativos e sites comuns que agregam valor real aos usuários finais.

Especialistas preveem que será a próxima grande novidade no mundo digital, especialmente no comércio eletrônico. Espero que, ao aprender este estudo de caso do Reddit PWA, você tenha uma ideia de como inovar um site que ajude seus clientes e talvez se torne um dos primeiros a adotar o PWA.