![](https://web.dev/static/images/case-studies-header.png?authuser=8&%3Bhl=pt-br&hl=pt-br)
Estudos de caso
Como tornar a meta de referência acionável com dados reais do usuário
Como a RUMvision incorporou informações de referência aos dados da RUM.
Liberando o poder das consultas de contêiner do CSS: lições da equipe da Netflix
Este estudo de caso explica os benefícios da adoção de consultas de contêiner na Netflix.
Como a Tokyu conseguiu fazer login 12 vezes mais rápido com chaves de acesso
Descubra como a Tóquiu, uma empresa ferroviária do Japão, conseguiu fazer login 12 vezes mais rápido com chaves de acesso, ajudando milhares de pessoas todos os dias.
Por que o app Planilhas Google transferiu o worker de cálculo de JavaScript para o WasmGC?
Os cálculos no Planilhas Google eram inicialmente feitos no servidor, depois no cliente em JavaScript e agora no cliente na coleta de lixo do WebAssembly. Este estudo de caso explica como e por quê.
Menos atrito e mais controle: como o Google Meet melhorou as permissões de áudio e vídeo
Este estudo de caso descreve como a equipe do Google Meet melhorou as permissões e o impacto disso nos usuários. a satisfação dos clientes.
BILIBILI usa a solução de IA da Web no dispositivo da MediaPipe para melhorar a UX do stream de vídeo e aumentar a duração da sessão em 30%
Saiba como a Web viabilizou experiências 3D imersivas para ajudar os clientes a entender e conhecer os produtos físicos.
Como o Disney+ Hotstar aumentou as visualizações semanais de cards em 100% nos dispositivos de sala de estar reduzindo o INP em 61%
Descubra como o Disney+ Hotstar, um aplicativo para smart TVs e conversores, aumentou significativamente o envolvimento dos espectadores com os esforços para reduzir o INP.
3D interativo na Web com hardware do Google: experiências educativas de produtos de última geração
Saiba como a Web viabilizou experiências 3D imersivas para ajudar os clientes a entender e conhecer os produtos físicos.
Como a plataforma de gestão de consentimento da PubTech's reduziu o INP nos sites dos clientes em até 64% e aumentou a visibilidade dos anúncios em até 1,5%
Como a plataforma de gestão de consentimento da PubTech's reduziu o INP nos sites dos clientes em até 64% e aumentou a visibilidade dos anúncios em até 1,5%
Boas notas em todos os lugares
Nos últimos dois anos, a equipe de engenharia da Goodnotes tem trabalhado em um projeto para levar o bem-sucedido aplicativo de anotações para iPad a outras plataformas. Este estudo de caso mostra como o app do ano para iPad de 2022 chegou à Web, ao ChromeOS, ao Android e ao Windows com tecnologia da Web e o WebAssembly reutilizando o mesmo código Swift em que a equipe trabalha há mais de dez anos.
Como o provedor de recomendações de conteúdo Taboola usou o LoAF para melhorar o INP em até 36% para os sites parceiros editores.
Como o provedor de recomendações de conteúdo Taboola usou o LoAF para melhorar o INP em até 36% para os sites parceiros editores.
CapCut aumenta o tráfego orgânico em 83% criando um app da Web totalmente funcional com WebAssembly e WebCodecs
Como um dos apps de edição de vídeo mais conhecidos disponíveis para dispositivos móveis criou uma versão da Web totalmente funcional.
O poder da Web para ilustradores: como o Pixiv usa tecnologias da Web no app de desenho
O pixiv é um serviço de comunidade on-line para ilustradores e entusiastas de ilustração se comunicarem entre si por meio do conteúdo. Ele permite que as pessoas postem as próprias ilustrações. A plataforma tem mais de 84 milhões de usuários em todo
Como a Tokopedia reduziu os custos operacionais ao melhorar o app da Web do vendedor usando o machine learning
Esta postagem descreve como a Mitra Tokopedia reduziu os custos operacionais ao melhorar o app da Web do vendedor usando o machine learning.
Como a Trendyol reduziu o INP em 50%, resultando em um aumento de 1% na taxa de cliques
Este estudo de caso descreve um fluxo de trabalho passo a passo de depuração e melhoria de INP no React usado pela Trendyol aproveitando ferramentas do Google como PageSpeed Insights (PSI), Chrome DevTools e a API scheduler.yield.
Como o Kiwix PWA permite que os usuários armazenem gigabytes de dados da Internet para uso off-line
Este estudo de caso explora como a Kiwix, uma organização sem fins lucrativos, usa a tecnologia Progressive Web App e a API File System Access para permitir que os usuários façam o download e armazenem grandes arquivos da Internet para uso off-line.
Como o Yahoo! Japão aumentou a adoção de chaves de acesso para 11% e reduziu os custos de OTP por SMS
Saiba mais sobre o Yahoo! Japan para melhorar a adoção de chaves de acesso e a experiência do usuário.
Como a pré-busca ajudou a Terra a aumentar a taxa de cliques dos anúncios em 30% e acelerar a Maior exibição de conteúdo.
A pré-busca é uma técnica usada para acelerar o carregamento de página baixando recursos ou até mesmo páginas inteiras que provavelmente serão necessárias em um futuro próximo. Pesquisas demonstram que tempos de carregamento mais rápidos resultam em taxas de conversão mais altas e melhores experiências do usuário.
Como o cache de avanço e retorno ajudou o Yahoo! JAPAN News aumenta a receita em 9% em dispositivos móveis
A autenticação sem senha do Yahoo! JAPAN News, uma das plataformas de notícias mais famosas do Japão, fez um esforço conjunto para melhorar a taxa de acerto do bfcache e conseguiu uma experiência do usuário significativa e melhorias nos negócios como resultado. Especificamente, os resultados do teste A/B mostraram que as páginas que usam o bfcache tiveram um aumento de 9% na receita de publicidade.
Em busca da correção do INP
Reduzir o TBT em 30 vezes e migrar para o Next.js ajudou o The Ecomonic Times a reduzir o INP quase quatro vezes, levando a uma redução de 50% na taxa de rejeição e um aumento de 43% nas visualizações de página.
Como a redBus melhorou a interação do site com a próxima pintura (INP) e aumentou as vendas em 7%
As otimizações de INP ajudaram a redBus a aumentar as vendas em cerca de 7%
Como esse jogo intriga jogadores e desenvolvedores, destacando os recursos surpreendentes do 3D no navegador
Descubra o potencial do WebGL com o cenário infinito gerado por processos deste jogo casual de direção. O Slow Roads é um jogo de direção casual com ênfase em cenários gerados de maneira infinita e processual, todos hospedados no navegador como um
Como criar uma Web melhor: um YouTube mais rápido
Esta é a Parte 1 da nossa nova série sobre como melhorar o YouTube na Web.
Como o investimento da Rakuten 24 nas Principais métricas da Web aumentou a receita por visitante em 53,37% e a taxa de conversão em 33,13%
Ao medir as Métricas da Web de usuários reais, a Rakuten 24 também descobriu que uma boa Maior exibição de conteúdo (LCP) pode levar a um aumento de 61,13% na taxa de conversão.
Como o serviço de marketing e sites da GoDaddy melhorou as Principais métricas da Web em 75%
Um estudo de caso das alterações que o GoDaddy implementou para melhorar o desempenho de milhões de sites, ajudando a alcançar boas pontuações no PageSpeed Insights e nas Principais métricas da Web.
Varejista de luxo Farfetch tem taxas de conversão mais altas para melhorar as Core Web Vitals
Como o investimento da varejista de luxo Farfetch para melhorar as Principais métricas da Web levou a melhores resultados de negócios.
A autenticação sem senha do Yahoo! JAPAN's autenticação sem senha reduziu as consultas em 25% e acelerou o tempo de login em 2,6 vezes
A autenticação sem senha do Yahoo! Japan a ter um sistema de identidade sem senha. Aprenda a abordagem e as consequências do esforço.
Como a RebelMouse aumentou a fidelidade e o engajamento otimizando as Principais métricas da Web
Um estudo de caso que mede o impacto total e os benefícios de pontuações altas de desempenho nas Principais métricas da Web.
Uma experiência moderna da Web no Adobe Experience Manager com o WorkBox
Os Progressive Web Apps aproveitam o que a Web moderna pode fazer. A Adobe usou o Workbox para levar esses recursos ao Adobe Experience Manager.
O PWA do MishiPay aumenta as transações em 10 vezes e economiza 2,5 anos de filas
Saiba como o PWA da MishiPay aumenta as transações em 10 vezes e economiza 2,5 anos de filas.
Como o The Economic Times ultrapassou os limites das Principais métricas da Web e melhorou a taxa de rejeição em 43%
A otimização das Principais métricas da Web no site do The Economic Times melhorou significativamente a experiência do usuário e reduziu substancialmente a taxa de rejeição em todo o site.
Como a Terra melhorou o engajamento dos usuários graças ao modo escuro
Neste artigo, vamos analisar a jornada da Terra, desde a identificação do tamanho da coorte no "modo escuro", a aplicação de um tema escuro personalizado e a medição do impacto dessa implementação nos principais KPIs.
Como a QuintoAndar aumentou as taxas de conversão e as páginas por sessão ao melhorar o desempenho
Um projeto com foco na otimização das Principais métricas da Web e na migração para o Next.js resultou em um aumento de 5% nas taxas de conversão e de 87% nas páginas por sessão.
Kapwing: edição avançada de vídeos para a Web
Empresas como a Kapwing permitem criar todo esse conteúdo de vídeo na Web usando APIs poderosas (como IndexedDB e WebCodecs) e ferramentas de performance.
SVGcode: um PWA para converter imagens rasterizadas em gráficos vetoriais SVG
Converta imagens de bitmap coloridas ou monocromáticas (PNG, JPG, JPEG, WEBP, AVIF, GIF,...) em imagens vetoriais monocromáticas ou coloridas (SVG).
Melhorias nas Principais métricas da Web na página inicial do Mail.ru resultaram em um aumento médio de 10% nas taxas de conversão
Vários meses de trabalho para melhorar as Principais métricas da Web na página inicial do Mail.ru resultaram em um aumento de 60% no 75o percentil na Mudança de layout cumulativa (CLS), impulsionando o tempo médio da sessão em 2,7% e as taxas de conversão dessas seções em mais de 10%.
Como a Renault melhorou as taxas de rejeição e conversão medindo e otimizando a Maior exibição de conteúdo
Esta postagem explica como a Renault e 55 parceiros de dados globais abordaram a medição e otimização das Principais métricas da Web. A equipe analisou dados de 10 milhões de visitas às páginas de destino, encontrou uma forte correlação entre a Maior exibição de conteúdo e as conversões e dobrou o esforço de otimização. Vamos analisar esses pontos de dados e entender como as equipes se organizaram para as otimizações.
Como a Swappie aumentou a receita de dispositivos móveis em 42% ao focar nas Principais métricas da Web
Este estudo de caso explica como a equipe da Swappie aumentou as conversões e a receita otimizando o app da Web para as Principais métricas da Web.
O impacto comercial das Principais métricas da Web
Neste artigo, mostraremos exemplos de empresas que já tiveram impacto positivo para os usuários e os negócios e entender como as Principais métricas da Web se relacionam com as principais métricas de negócios.
Como o compromisso com as Principais métricas da Web aumentou as receitas de publicidade da Netzwelt em 18%
Saiba como a empresa de notícias alemã Netzwelt otimizou as Principais métricas da Web para melhorar a experiência do usuário e as receitas de publicidade.
O PWA da Blibli's gera 10 vezes mais receita por usuário do que o site móvel anterior da empresa.
Como a Blibli reduziu a taxa de rejeição em 42%, aumentou em 8 vezes a taxa de conversão em dispositivos móveis e aumentou em 2, 5 vezes o número de páginas por sessão.
Melhoria da mudança de layout cumulativa no Telegraph Media Group
Como o Telegraph, o principal site de notícias do Reino Unido, conseguiu melhorar a CLS no 75o percentil em 250% de 0,25 para 0,1 em alguns meses.
Laranja: o novo PWA converte 52% melhor em dispositivos móveis
O novo PWA também tem um tempo médio de carregamento 30% mais rápido do que o site antigo e tem uma taxa de rejeição melhor em 12% e uma profundidade de sessão 18%.
Mainline Menswear implementa PWA e tem aumento de 55% na taxa de conversão
A Mainline Menswear implementa um Progressive Web App (PWA) e tem um aumento de 55% na taxa de conversão para usuários que instalaram o app com recursos de armazenamento em cache e off-line.
Como a Zalando reduziu o tempo de feedback de desempenho de 1 para 15 minutos com o Lighthouse CI
A equipe da Web da Zalando descobriu que a integração do Lighthouse CI permitiu uma abordagem proativa de desempenho, com verificações de status automatizadas capazes de comparar a confirmação atual com a ramificação principal para evitar regressões de desempenho.
O site da Lowe's está entre os sites de e-commerce com desempenho mais rápido
Ao criar um sistema automatizado de teste e monitoramento de desempenho, a Equipe de velocidade do site da Lowe's testa as solicitações pull em relação aos orçamentos de desempenho e evita regressões de desempenho na produção.
Vodafone: uma melhoria de 31% no LCP aumentou as vendas em 8%
Ao executar um teste A/B especificamente focado na otimização das Métricas da Web, a Vodafone descobriu que uma melhoria de 31% no LCP levou a um aumento de 8% nas vendas, uma melhoria de 15% na taxa de visitas de leads e de 11% no carrinho de visitas.
Como o Wix melhorou o desempenho do site desenvolvendo a infraestrutura
Um estudo de caso sobre algumas mudanças importantes introduzidas no Wix para melhorar o desempenho de carregamento de milhões de sites, limpando o caminho para que eles recebam boas pontuações do PageSpeed Insights e das Principais métricas da Web.
Como as otimizações da CLS aumentaram o Yahoo! Japan News's visualizações de página por sessão em 15%
Usando o Search Console e o Lighthouse para monitorar as Principais métricas da Web, eles descobriram oportunidades de otimizar a pontuação de CLS em 0,2, o que levou a um aumento de 15% nas visualizações de página por sessão, uma duração da sessão 13% mais longa e uma queda de 1,72 ponto percentual na taxa de rejeição.
Agrofy: melhoria de 70% no LCP correlacionada com uma redução de 76% no abandono no carregamento
Saiba como a Agrofy melhorou a taxa de desativação de carga ao focar nas Principais métricas da Web.
Suspensão do uso do Excalidraw Electron em favor da versão da Web
O Excalidraw é uma lousa colaborativa virtual que permite esboçar diagramas com facilidade, parecerem desenhados à mão. No projeto Excalidraw, decidimos descontinuar o Excalidraw Desktop, um wrapper Electron para o Excalidraw, em favor da versão da Web que você pode (e sempre pode) encontrar em excalidraw.com. Após uma análise cuidadosa, decidimos que o Progressive Web App (PWA) é o futuro que queremos desenvolver.
Os usuários do PWA têm 2,5 vezes mais chances de comprar o Gravit Designer PRO.
Os usuários dos PWAs também são 24% mais ativos do que todos os outros tipos de instalação, se tornam usuários recorrentes 31% mais do que todas as outras plataformas e muito mais.
As instalações do PWA do editor de vídeos da Clipchamp têm um crescimento mensal de 97%
Como PWAs, WebAssembly e ChromeOS ajudam um editor de vídeos baseado na Web a melhorar o desempenho e a experiência para 12 milhões de usuários.
JD.ID melhora a taxa de conversão em dispositivos móveis em 53% com estratégias de armazenamento em cache, instalação e notificações push
Como a JD.ID aumentou a taxa de conversão geral em dispositivos móveis (mCVR) em 53%, a mCVR para usuários instalados em 200% e os usuários ativos por dia em 26%.
Investimento da Rakuten 24 em PWAs aumenta a retenção de usuários em 450%
Possibilitar a instalação do app da Web resultou em aumento do tráfego, retenção de visitantes, vendas por cliente e conversões.
A NDTV alcançou uma melhoria de 55% no LCP ao otimizar para as Principais métricas da Web
Usando ferramentas como o PageSpeed Insights , web.dev/measure e WebPageTest, a equipe da NDTV analisou as áreas de melhoria em potencial e investiu nas Principais métricas da Web para alcançar o sucesso nos negócios.
Como o foco no desempenho da Web melhorou a taxa de cliques da Tokopedia em 35%
Criar um painel de desempenho na Web e otimizar o JavaScript, os recursos e a página inicial para alcançar o sucesso nos negócios.
Como a ZDF criou um PWA de vídeo com modo off-line e escuro
Saiba como a ZDF criou um Progressive Web App (PWA) com recursos modernos, como suporte off-line, facilidade de instalação e modo escuro.
Como o PWA da Goibibo aumentou as conversões em 60%
Saiba como a Goibibo, a maior empresa de viagens on-line da Índia, conseguiu um aumento de 60% nas conversões ao criar experiências do usuário confiáveis entre os apps PWA e iOS/Android.
Como o Mercado Livre otimizou as Métricas da Web (TBT/FID)
Resumo do trabalho feito pela equipe de arquitetura de front-end do Mercado Livre para otimizar a FID, usando o TBT como uma métrica de proxy.
Milissegundos, ganhe milhões
Uma melhoria de 0,1 segundo nas métricas de 4 velocidade pode melhorar as taxas de progressão em todo o funil de compra.
Estudo de caso da API Wake Lock: aumento de 300% nos indicadores de intenção de compra no site BettyCrocker.com
Estudo de caso das experiências do site de culinária BettyCrocker.com com a implementação da API Wake Lock.
Como o Google melhorou a performance dos anúncios com o recurso obsoleto durante a revalidação
Neste estudo de caso, explicamos como o Google melhorou as principais métricas de negócios de anúncios otimizando a performance do script de anúncios de terceiros com o recurso obsoleto durante a revalidação.
Compre velocidade no eBay.com
Este estudo de caso explica como o eBay aumentou as principais métricas de negócios otimizando o desempenho das experiências na Web e no app.
OYO Lite: um TWA com o melhor dos apps Android e da Web
Como uma startup de hotelaria criou um app Android que depende do conteúdo da Web para aumentar muito o engajamento do usuário e manter o tamanho do arquivo baixo.
Cinco maneiras pelas quais o AirSHIFT melhorou o desempenho do ambiente de execução do app React
Como a equipe do AirSHIFT usou virtualização de tabelas, dados RUM, carregamento lento, Web workers, orçamentos de desempenho e hackathons para otimizar o desempenho do ambiente de execução do app React.
Como a Truebil transformou a Web no canal de crescimento
Este estudo de caso explica como a equipe da Truebil aumentou as conversões e o engajamento otimizando o app da Web para velocidade e confiabilidade.
Como a OpenSooq aumentou o engajamento investindo na Web
Saiba como a equipe da OpenSooq usou as práticas recomendadas para criar um Progressive Web App de mercado confiável e atraente.
Como estamos disponibilizando o Google Earth na Web
Melhorar o acesso do Google Earth entre navegadores com o WebAssembly
Como levar os service workers à Pesquisa Google
Pesquise praticamente qualquer assunto no Google e você vai encontrar uma página de resultados relevantes e significativos. O que você provavelmente não percebeu é que essa página de resultados de pesquisa pode ser atendida por uma poderosa tecnologia da Web chamada de service worker.
Nikkei alcança um novo nível de qualidade e desempenho com seu PWA de várias páginas
Com um histórico de publicações de mais de 140 anos, Nikkei é uma das empresas de mídia mais confiáveis do Japão. Para melhorar a experiência do usuário e acelerar os negócios na Web, a Nikkei lançou um Progressive Web App em novembro de 2017 e está tendo resultados incríveis com a nova plataforma.
George.com aprimora a experiência do cliente em dispositivos móveis com o novo Progressive Web App
George.com é uma marca líder de roupas no Reino Unido, parte da ASDA Walmart. Depois de fazer upgrade do site para um Progressive Web App (PWA), a marca teve um aumento de 31% na conversão em dispositivos móveis. Com as expectativas dos consumidores
O novo Progressive Web App do BookMyShow aumenta as conversões em 80%
A BookMyShow é a maior empresa de venda de ingressos da Índia, com 50 milhões de visitantes mensais. Eles desenvolveram uma versão aprimorada do site móvel usando um Progressive Web App (PWA), otimizando a velocidade e removendo restrições de dados, o que resultou em um aumento de 80% nas conversões.
Ele.me melhora o tempo de carregamento da performance com um Progressive Web App de várias páginas
A Ele.me é a maior empresa de entrega e pedidos de comida na China continental. A empresa criou o Progressive Web App (PWA) como um app de várias páginas para melhorar a experiência na Web para dispositivos móveis, tornando-o mais rápido e confiável em conexões lentas, ao mesmo tempo em que acomoda as necessidades operacionais para atender melhor os clientes.
Tonite de dança na WebVR
Dance Tonite é uma colaboração de realidade virtual que está sempre mudando com a banda LCD Soundsystem. Criado com a WebVR, o projeto funciona em várias plataformas (com e sem RV), oferecendo aos usuários um papel diferente na experiência, dependendo do dispositivo. As decisões criativas e as técnicas avançadas de otimização dos criadores do projeto Jonathan Puckey, da Moniker e da Equipe de artes de dados do Google permitiram um desempenho de alta qualidade (cerca de 60 QPS para 3DoF e 90 QPS para 6DoF) e uma experiência do usuário atraente em todas as plataformas usando uma única base de código.
Ola impulsiona a mobilidade para um bilhão de indianos com o Progressive Web App
A Ola é a principal agregadora de táxis na Índia, com a missão incansável de impulsionar a mobilidade de um bilhão de indianos. A empresa alcança mais de 100 cidades indianas com uma rede de cerca de 600 mil motoristas parceiros. Como uma das
O novo PWA da MakeMyTrip.com triplica as taxas de conversão
Após o lançamento de um Progressive Web App, a taxa de conversão da MakeMyTrip.com na Web para dispositivos móveis triplicou, e a velocidade de carregamento da página aumentou em 38%.
0hH1
0h h1 é um jogo divertido e viciante que funciona bem em dispositivos móveis. Sempre amei as possibilidades infinitas da tecnologia da Web e me considero sortudo por tê-la adotado há tantos anos, porque nos últimos anos houve melhorias incríveis que
Infobae aumenta o tempo gasto no site móvel com um Progressive Web App
A Infobae aproveitou o service worker para oferecer um desempenho confiável em redes não confiáveis. O melhor PWA da empresa conseguiu uma pontuação de desempenho de 93/100 no Lighthouse, uma ferramenta automatizada para medir a qualidade da página da Web.
Jumia tem aumento de 33% na taxa de conversão, 12 vezes mais usuários no PWA
O tráfego para o PWA do Jumia superou o do app nativo em mais de 12 vezes e ainda está crescendo. O Jumia também teve uma queda de 50% na taxa de rejeição
Lancôme recria site móvel como PWA e aumenta conversões em 17%
Para gerar tráfego e reengajamento, a marca de cosméticos de luxo Lancôme lançou um Progressive Web App (PWA) para oferecer uma experiência rápida e semelhante a um app na Web para dispositivos móveis
Mynet quadruplicou a experiência na Web para dispositivos móveis, aumentando a receita em 25% com o PWA baseado em AMP
Todos os meses, a Mynet oferece mais de 34 milhões de visitantes ao site com conteúdo e serviços de notícias, vídeos, jogos, financeiros, informativos e de entretenimento. Depois de lançar um Progressive Web App (PWA) que usa Accelerated Mobile Pages
OLX aumenta o reengajamento na Web para dispositivos móveis em 250% com um Progressive Web App
Para a OLX, a criação de um Progressive Web App aumentou o engajamento em 250% e reduziu o tempo de interação da página em 23%
O Twitter Lite PWA aumenta significativamente o engajamento e reduz o uso de dados
O Progressive Web App do Twitter Lite combina o melhor da Web moderna e dos recursos nativos para oferecer uma experiência mais robusta, com metas explícitas de carregamento instantâneo, engajamento do usuário e menor consumo de dados
Progressive Web App na Voot
A Voot.com lançou seu Progressive Web App na Índia. Alguns dias após a implementação, o tempo da sessão por usuário aumentou em 39% e as visualizações diárias por usuário em 15%. O Voot é um dos principais produtos de vídeo sob demanda da Índia,
Siga o Papai Noel como um PWA
Acessar o site O Siga o Papai Noel foi rapidamente atualizado para um Progressive Web App off-line nas festas de fim de ano de 2016, em parte graças ao nosso design de cenário atual. O Siga o Papai Noel é uma tradição de fim de ano aqui no
Matterport VR para WebVR
Ver o site Ao adicionar compatibilidade com a WebVR, a Matterport facilita a exploração de lugares do mundo real em uma realidade virtual imersiva. Sem apps para download, a WebVR reduzirá as desistências e permitirá que os parceiros retenham o
Urso 71 e WebVR
Confira o documentário A WebVR é uma API integrada a navegadores que combina renderização estéreo com rastreamento da cabeça em tempo real, possibilitando uma maneira rápida e fácil de aproveitar o conteúdo de RV on-line. Com a WebVR, os criadores de
Renderização de texto na WebVR
Ela tem uma plataforma para contar histórias em realidade virtual em qualquer lugar, incluindo a Web. Aproveitando a WebVR, os espectadores podem acessar um site, clicar em um link e assistir imediatamente os filmes da material em realidade virtual imersiva, incluindo telas de última geração. Durante o processo de desenvolvimento, a equipe descobriu que renderizar texto é difícil nesse novo ambiente e criou um exemplo com sombreadores para facilitar o processo.
Principais interações no laboratório da WebVR
Confira o laboratório Os designers de sites estão familiarizados com a ideia de design responsivo, criando um site para funcionar em diferentes dispositivos, como celulares, tablets e computadores, além de diferentes resoluções de tela e proporções
Linhas terrestres
O Land Lines é um experimento que permite explorar imagens de satélite do Google Earth por gestos. Usando uma combinação de aprendizado de máquina, algoritmos otimizados e capacidade da placa de vídeo, o experimento pode ser executado de forma eficiente no navegador da Web do seu smartphone sem a necessidade de servidores de back-end. Esta é uma análise do nosso processo de desenvolvimento e das várias abordagens que tentamos nos levar ao resultado final.
Linha de cruzeiro Carnival
A Carnival Cruise Line oferece um serviço de comunicação personalizado e envolvente para seus clientes com notificações push. Faça o download do estudo de caso em PDF A Carnival Cruise Line, uma das maiores empresas de viagens de lazer do mundo,
The Weather Channel
A The Weather Company, uma IBM Business, atende em média 40 bilhões de solicitações de previsão todos os dias, ajudando as pessoas a planejar suas vidas diárias e tomar melhores decisões com base no clima.
Smart Lock para o guardião
Faça o download do estudo de caso em PDF O Guardian News & Media (GNM) publica o theguardian.com (em inglês), um dos maiores sites de notícias com qualidade em inglês do mundo. Desde o lançamento das edições digitais dos EUA e da Austrália em
Smart Lock para AliExpress
Faça o download do estudo de caso em PDF Lançado em abril de 2010, o AliExpress é um mercado de varejo global voltado a consumidores em todo o mundo. Ela permite que consumidores de todo o mundo comprem diretamente de atacadistas e fabricantes da
Housing.com aumenta as conversões e reduz a taxa de rejeição em 40% com o novo PWA
Faça o download do estudo de caso em PDF A Housing.com é uma das principais startups da Índia. A caminho de receber 50 milhões de visitas este ano, ela se tornou uma das principais plataformas imobiliárias on-line na Índia. Depois de criar o Housing
Como medir o impacto do desempenho no mundo real dos service workers
Como medir o impacto do desempenho no mundo real dos service workers
The Washington Post
AMP ajuda o Washington Post a aumentar o número de usuários recorrentes da pesquisa em dispositivos móveis em 23% Faça o download do estudo de caso em PDF Com quase 55% do tráfego proveniente de dispositivos móveis, o The Washington Post sabe que
Como criar o Progressive Web App do Google I/O 2016
Como criar o PWA do Google I/O 2016 usando componentes da Web
Eletrônicos eXtra
A United eXtra Electronics aumenta as vendas de e-commerce em 100% com as notificações push da Web Faça o download do estudo de caso em PDF A eXtra é a maior varejista de eletrônicos e eletrodomésticos da Arábia Saudita com o crescimento mais rápido.
Jumia
As notificações push ajudam o Jumia a reverter o abandono do carrinho e aumentar 9 vezes as conversões Faça o download do estudo de caso em PDF A Jumia é um dos principais sites de comércio eletrônico na África. A maioria dos clientes usa
BaBe
O Progressive Web App da BaBe para vários navegadores rivaliza com o desempenho do aplicativo nativo. Faça o download do estudo de caso em PDF Lançado em 2013, o BaBe é o maior app agregador de notícias da Indonésia. Ele já foi salvo por mais de um
Konga
Konga reduz o uso de dados em 92% com o novo Progressive Web App Faça o download do estudo de caso em PDF Lançada em 2012, a Konga é um site líder de comércio eletrônico na Nigéria, vendendo de tudo, de livros a geladeiras e celulares. Os
8 milhas
A 5miles diminui a taxa de rejeição em 50% e aumenta as conversões em 60% com o novo Progressive Web App Faça o download do estudo de caso em PDF "Venda o que você tem e compre o que quiser!" é o lema da 8 milhas, um mercado para dispositivos móveis
Suumo
O principal site imobiliário do Japão turbina novas listagens com notificações push na Web e tem uma taxa de abertura de 31% nas notificações. Faça o download do estudo de caso em PDF A SUUMO é o principal site imobiliário do Japão, atendendo a quase
Sessões virtuais de arte
Seis artistas foram convidados a pintar, projetar e esculpir em RV.
Portador Net-A
Net-A-Porter economiza tempo de desenvolvimento com a biblioteca Polymer do Google A NET-A-PORTER implementou um design baseado em componentes nas propriedades on-line usando a biblioteca Polymer do Google. O resultado foi uma grande economia de
Flipkart triplica tempo no site com Progressive Web App
Em 2015, a Flipkart, o maior site de comércio eletrônico da Índia, adotou uma estratégia apenas para aplicativos e encerrou temporariamente o site móvel. A empresa descobriu que era cada vez mais difícil fornecer uma experiência do usuário tão rápida e envolvente quanto a do app para dispositivos móveis. No entanto, depois, a Flipkart decidiu repensar a abordagem de desenvolvimento. Eles foram atraídos de volta para a Web para dispositivos móveis pela introdução de recursos que fizeram a Web para dispositivos móveis funcionar instantaneamente, trabalhar off-line e reengajar os usuários.
Criar um sabre de luz com o Polymer
Como configurar um projeto WebGL com QPS alto com o Polymer.
Google+
Atingimos nosso objetivo de nunca fazer o download de mais de 60 mil HTML, 60 mil JavaScript e 60 mil CSS por vez.
Além da prateleira
A Beyond the Rack reengaja os usuários na Web para dispositivos móveis, aumentando a receita por visita em 26% com as notificações push.
AirHorner.com
O AirHorner é um Progressive Web App simples, mas poderoso, que mostra o poder dos service workers e da API Web Audio para oferecer a você sua própria buzina de ar. Use-o para irritar amigos ou colegas de trabalho, não importa se você está on-line, off-line ou em uma rede 2G instável.
Service Workers em produção
Saiba como usamos bibliotecas de service workers para tornar o app da Web da Google I/O 2015 rápido e com foco no modo off-line. O app da Web do Google I/O 2015 deste ano foi escrito pela equipe de relações com desenvolvedores do Google com base em
Biblioteca Beija-flor
Biblioteca Hummingbird: um front-end incrivelmente novo para o Hummingbird, um site famoso de descoberta e relógio de animes. Fãs de anime (como eu, a contagem de visualizações na captura de tela é real) são obcecados por monitorar o que assistem. Os
Máquina de Aventura Madeon
Madeon Adventure Machine é uma promoção inteligente para o novo álbum do Madeon, uma bateria divertida. O Adventure Machine é um app muito simples, mas faz seu trabalho muito bem. Utilizando o Web Audio e, opcionalmente, o Web Midi (sim, você pode
Adsy.me
O Adsy.me é uma maneira muito rápida e fácil de criar microsites para dispositivos móveis. O Adsy.me é uma ferramenta que permite a qualquer pessoa criar um site móvel (micro) e eles ganharam minha confiança imediatamente ao comer seu próprio
Little Alchemy
Little Alchem: um jogo de combinação divertido e compatível com dispositivos móveis inspirado pelo irmão maior Alchemy. O Little Alchemy é um excelente exemplo de como usar todas as capacidades mais recentes da plataforma da Web ao máximo. Ele usa o
Leitor de notícias Hacker
Hacker News Reader: um leitor otimizado incrível para a Hacker News. Uma experiência de leitura bonita e altamente otimizada para a Hacker News, esse app funciona bem e tem uma ótima aparência em dispositivos móveis, tablets e computadores. Ele é
Chrome Dev Summit 2014
O site do Chrome Dev Summit 2014 foi desenvolvido internamente pelo nosso próprio Paul Lewis, e o site do CDS mostrou como criar uma ótima experiência da Web para dispositivos móveis para visitantes da conferência.
Feliz Pixmas
Merry Pixmas: diversão de Natal com transformações do CSS em 3D. Uma boa demonstração com tema de Natal que funciona bem em computadores e dispositivos móveis. Ele também oferece suporte a novas cores de tema e um manifesto da Web para uma
SVGOM
SVGOMG: um front-end bonito, material e responsivo para SVGO. Criado pelo nosso próprio Jake Archibald, o SVGOMG é um exemplo quase perfeito de uma ferramenta totalmente responsiva e capacitada, desenvolvida com tecnologias da Web. Ele tem uma bela
Filtro da Web
Filtros da Web: filtros de câmera rápidos, rápidos e sujos. Um app de câmera incrível baseado na Web que permite aplicar filtros em tempo real. A imagem é salva automaticamente no dispositivo local, o que significa que ela geralmente é sincronizada
A Experiência do Hobbit 2014
Como adicionar a jogabilidade do WebRTC à experiência do Hobbit A tempo para o novo filme do Hobbit "O Hobbit: A Batalha dos Cinco Exércitos", trabalhamos para ampliar o experimento do Google Chrome do ano passado, Uma Viagem pela Terra-média, com
Crie com o Chrome
Como levar os blocos LEGO® para a Web multidispositivo O Build with Chrome, um experimento divertido para usuários do Chrome para computador lançado originalmente na Austrália, foi relançado em 2014 com disponibilidade global, parcerias com o filme O
O front-end da Terra-média
Um tutorial de desenvolvimento multidispositivo No nosso primeiro artigo sobre o desenvolvimento do Experimento do Chrome Viagem pela Terra-média, focamos no desenvolvimento do WebGL para dispositivos móveis. Neste artigo, discutimos os desafios,
A Experiência do Hobbit
Como dar vida à Terra-média com o WebGL para dispositivos móveis Historicamente, trazer experiências interativas, baseadas na Web e com muitos recursos multimídia para dispositivos móveis e tablets tem sido um desafio. As principais restrições foram
Estudo de caso - Building Racer
O Racer é um experimento do Chrome para dispositivos móveis baseado na Web desenvolvido pela Active Theory. Até cinco amigos podem conectar os smartphones ou tablets para competir em todas as telas. Com o conceito, o design e o protótipo do Google
Estudo de caso: The Sounds of Racer
O Racer é um experimento do Chrome para vários jogadores e dispositivos. Um jogo de corrida de carros retrô em várias telas. Em smartphones ou tablets Android ou iOS. Qualquer pessoa pode participar. Nenhum app. Nenhum download. Somente a Web para
Estudo de caso: Inside World Wide Maze
World Wide Maze é um jogo em que você usa seu smartphone para guiar uma bola por labirintos 3D criados a partir de sites para tentar alcançar os pontos de meta. O jogo usa muitos recursos de HTML5. Por exemplo, o evento DeviceOrientation recupera
Criando o Roll-It
Roll It é um experimento do Chrome que recria um jogo clássico de tabuleiro usando apenas o navegador no smartphone e no computador. O navegador do smartphone permite mirar e rolar a bola com um movimento do pulso, enquanto o navegador do computador
Layout da Web de última geração: National Geographic Forest Giant
Usar as ferramentas do CSS e do layout do navegador pode permitir visualizações incríveis para conteúdo da Web. O uso de recursos da Web, como filtros CSS, WebGL, vídeo HTML5, SVG, canvas e tecnologias futuras em evolução, como regiões CSS, formas
Estudo de caso: redimensionamento automático de jogos HTML5
No verão de 2010, criamos o Sand Trap, um jogo que inscrevemos em uma competição de jogos HTML5 para smartphones. No entanto, a maioria dos smartphones mostrava apenas parte do jogo ou o deixava muito pequeno, o que tornava impossível jogar. Por
Estudo de caso: Google I/O 2013 Experiment
Para despertar o interesse dos desenvolvedores no site da Google I/O 2013 antes da abertura das inscrições para a conferência, desenvolvemos uma série de experimentos e jogos com foco em dispositivos móveis, com foco em interações por toque, áudio
Estudo de caso: Encontre seu caminho até Oz
"Find Your Way to Oz" é um novo experimento do Google Chrome que a Disney trouxe para a Web. Ele permite que você faça uma viagem interativa por um circo do Kansas, que leva você à Terra de Oz depois de ser varrido por uma tempestade enorme. Nosso
Estudo de caso: JAM com Chrome
Como fizemos a interface ser incrível O JAM with Chrome é um projeto musical criado pelo Google. O JAM with Chrome permite que pessoas de todo o mundo formem uma banda e JAM em tempo real no navegador. O DinahMoe ultrapassou os limites do que era
Fazendo 100.000 estrelas
Olá! Meu nome é Michael Chang, e trabalho com a equipe de artes de dados do Google. Recentemente, concluímos o 100.000 Stars, um Chrome Experiment que mostra estrelas próximas. O projeto foi criado com THREE.js e CSS3D. Neste estudo de caso, vou
Estudo de caso: JAM com Chrome
Como fizemos o áudio ser incrível O JAM with Chrome é um projeto musical criado pelo Google. O JAM with Chrome permite que pessoas de todo o mundo formem uma banda e toquem em tempo real no navegador. Nós, da DinahMoe, tivemos o prazer de participar
Movi Kanti Revo - Parte 1: Construindo o mundo 3D
Movi.Kanti.Revo é um novo experimento sensorial do Chrome criado pelo Cirque du Soleil e desenvolvido pela Subatomic Systems, que traz a magia do Cirque du Soleil para a Web usando tecnologias modernas da Web. O experimento foi criado usando apenas
Estudo de caso: SONAR, desenvolvimento de jogos HTML5
No verão passado, trabalhei como líder técnico em um jogo comercial da WebGL chamado SONAR. O projeto levou cerca de três meses para ser concluído e foi feito do zero em JavaScript. Durante o desenvolvimento do SONAR, tivemos que encontrar soluções
Estudo de caso: criação do Technitone.com
O Technitone.com é uma fusão de WebGL, Canvas, Web Sockets, CSS3, Javascript, Flash e a nova API Web Audio no Chrome. Este artigo aborda todos os aspectos da produção: o plano, o servidor, os sons, os recursos visuais e alguns dos fluxos de trabalho
Estudo de caso: Bouncy Mouse
Depois de publicar o Bouncy Mouse para iOS e Android no final do ano passado, aprendi algumas lições muito importantes. O principal deles é que é difícil entrar em um mercado já estabelecido. No mercado de iPhones, que é muito saturado, foi muito
Estudo de caso: HTML5 MathBoard
O MathBoard no iPad, um aplicativo da PalaSoftware, é um aplicativo altamente refinado com muitas animações sutis, mas naturais, e uma aparência realista única. O objetivo era fazer a porta de maior fidelidade do aplicativo para iPad em HTML5. A
Estudo de caso: criação do doodle Stanisław Lem do Google
A página inicial do Google é um ambiente fascinante para programar. Ela tem muitas restrições desafiadoras: foco particular na velocidade e latência, ter que atender a todos os tipos de navegadores e trabalho em várias circunstâncias e... sim,
Estudo de caso: atualizações em tempo real no Stream Congress
Com WebSockets e EventSource, o HTML5 permite que os desenvolvedores criem apps da Web que se comuniquem em tempo real com um servidor. O Stream Congress (disponível na Chrome Web Store ) oferece atualizações ao vivo sobre o funcionamento do
Estudo de caso - Conversão do Wordico de Flash para HTML5
Quando convertemos nosso jogo de palavras cruzadas Wordico do Flash para HTML5, nossa primeira tarefa foi esquecer tudo o que sabíamos sobre a criação de uma experiência de usuário rica no navegador. Enquanto o Flash oferecia uma API única e
Estudo de caso - Onslaught! Arena
Em junho de 2010, soubemos que a publicação local "zine" Boing Boing estava fazendo uma competição de desenvolvimento de jogos. Isso foi uma ótima desculpa para criar um jogo rápido e simples em JavaScript e <canvas>, então começamos a
Estudo de caso - Efeito Page Flip do 20thingsilearned.com
Em 2010, o F-i.com e a equipe do Google Chrome colaboraram em um app da Web educacional baseado em HTML5 chamado 20 Things I Learned about Browsers and the Web ( www.20thingsilearned.com ). Uma das principais ideias por trás desse projeto era que ele
Estudo de caso: como usar o HTML5 Canvas
Na primavera do ano passado (2010), me interessei pelo suporte cada vez maior para HTML5 e tecnologias relacionadas. Na época, um amigo e eu estávamos nos desafiando em competições de desenvolvimento de jogos de duas semanas para aperfeiçoar nossas
Estudo de caso - HTML5 no deviantART muro
No dia 7 de agosto de 2010, o deviantART completou 10 anos. Comemoramos nosso aniversário com o lançamento de uma ferramenta de desenho HTML5 chamada deviantART muro. A ferramenta pode ser usada como um aplicativo da Web independente e uma ferramenta
Estudo de caso - Download por arrastar e soltar no Chrome
O recurso de arrastar e soltar (DnD, na sigla em inglês) é um dos muitos recursos excelentes do HTML 5 e é compatível com o Firefox 3.5, o Safari, o Chrome e o IE. Recentemente, o Google lançou um novo recurso que permite que os usuários do Google
How Ray-Ban doubled conversion rate and reduced exit rate by 13% through prerendering using the Speculation Rules API
Learn how Ray-Ban improved LCP by using the Speculation Rules API, and how it improved Ray-Ban's ecommerce platform's business performance.
How QuintoAndar reduced INP by 80%, increasing conversions by 36%
QuintoAndar significantly improved its web performance by reducing its Interaction to Next Paint (INP) by 80%, leading to a 36% increase in conversions year-over-year.
How YouTube improved video performance with the Media Capabilities API
Using the Media Capabilities API lets you better target video codecs, frame rates, and resolutions based on the capabilities of your users' devices.
Forbes
Forbes is re-defining modern web development with Progressive Web App technology.
Wego
There's a new way to deliver amazing user experiences on the web. Travel company Wego has built a successful AMP based Progressive Web App (PWA).
Alibaba
Alibaba.com is the world’s largest online business-to-business (B2B) trading platform, serving 200+ countries and regions. After upgrading their site to a Progressive Web App (PWA), they saw a 76 percent increase in total conversions across browsers.
AliExpress
AliExpress increases conversion rate for new users by 104% with new Progressive Web App Download PDF Case study "Smarter shopping, better living!" is the motto of AliExpress, a website where shoppers can buy everything from baby clothes to