Como criar um painel CrUX no Looker Studio

O Looker Studio (antigo Data Studio) é uma ferramenta avançada de visualização de dados que permite criar painéis com base em fontes de Big Data, como o Chrome UX Report (CrUX). Neste guia, você vai aprender a criar seu próprio painel CrUX personalizado para rastrear as tendências de experiência do usuário de uma origem.

Captura de tela do painel do CrUX mostrando gráficos de barras de pilha que mudam ao longo de vários meses.
Painel CrUX

O painel CrUX foi criado com um recurso do Looker Studio chamado Conectores da comunidade. Esse conector é um vínculo pré-estabelecido entre os dados brutos do CrUX no BigQuery e as visualizações do Looker Studio. Isso elimina a necessidade dos usuários do painel escreverem consultas ou gerarem gráficos. Tudo é construído para você: basta informar uma origem, e um painel personalizado será gerado.

O painel CrUX padrão

O CrUX tem um painel padrão, que é mantido pela equipe dele. Novas métricas (por exemplo, INP) são adicionadas pela equipe e ficam disponíveis na próxima vez que o painel é carregado.

Criar um painel personalizado

Talvez alguns usuários queiram personalizar o painel. Nesse caso, é possível criar sua própria cópia do painel padrão e alterá-la conforme necessário.

Para criar um painel personalizado, acesse g.co/chromeuxdash. Isso vai levar você à página do conector da comunidade do CrUX, onde é possível informar a origem para gerar o painel. Novos usuários talvez precisem preencher as solicitações de permissão ou preferência de marketing.

Captura da tela de configuração do conector do painel do CrUX com um campo para inserir o URL de origem e uma caixa de seleção para permitir que esse campo seja modificado nos relatórios.
O conector do painel CrUX

O campo de entrada de texto só aceita origens, não URLs completos. Por exemplo:

Origem (compatível)
https://developer.chrome.com
URL (indisponível)
https://developer.chrome.com/docs/crux/guides/looker-studio-dashboard

Se você omitir o protocolo, o HTTPS será usado. Os subdomínios são importantes. Por exemplo, https://developers.google.com e https://www.google.com são considerados origens diferentes.

Alguns problemas comuns com origens são fornecer o protocolo errado (por exemplo, http:// em vez de https://) e omitir o subdomínio quando necessário. Alguns sites incluem redirecionamentos. Portanto, se http://example.com redirecionar para https://www.example.com, use o segundo, que é a versão canônica da origem. Como regra geral, use a origem que os usuários encontrarem na barra de endereço.

Quando a caixa de seleção é marcada, a origem é incluída no URL do painel, o que permite que o mesmo painel seja usado para origens diferentes alterando esse parâmetro de URL no futuro. Por isso, é recomendável marcá-la.

Clique no botão Conectar. Se você tiver marcado a caixa de seleção, receberá uma solicitação para confirmar isso.

Caso sua origem não esteja incluída no conjunto de dados CrUX, talvez você receba uma mensagem de erro como a mostrada no próximo diagrama. Há mais de 15 milhões de origens no conjunto de dados, mas a que você quer pode não ter dados suficientes para ser incluída.

Captura de tela de uma mensagem de erro pop-up que diz, entre outras mensagens de erro, "Há mais de 15 milhões de origens neste conjunto de dados, mas https://doesnotexist.origin não é um deles"
Mensagem de erro do conector da comunidade do CrUX quando não existe uma origem

Se a origem existir, você vai acessar a página do esquema do painel. Isso mostra todos os campos incluídos: cada tipo de conexão efetiva, cada formato, o mês de lançamento do conjunto de dados, a distribuição de desempenho de cada métrica e, claro, o nome da origem. Você não precisa fazer nem alterar nada nessa página. Basta clicar em Criar relatório para continuar.

Captura de tela do editor de esquema do painel do CrUX com vários campos, tipos, agregação e descrições com a possibilidade de alterá-los ou adicionar novos campos.
Esquema do painel CrUX

Usar o painel

Cada painel vem com três tipos de página:

  1. Visão geral das Core Web Vitals
  2. Desempenho métrico
  3. Informações demográficas do usuário

Cada página inclui um gráfico que mostra as distribuições ao longo do tempo para cada versão mensal disponível. À medida que novos conjuntos de dados são lançados, é possível atualizar o painel para acessar os dados mais recentes.

Os conjuntos de dados mensais são lançados na segunda terça-feira de cada mês. Por exemplo, o conjunto de dados que consiste em dados de experiência do usuário do mês de maio é lançado na segunda terça-feira de junho.

Visão geral das Core Web Vitals

A primeira página é uma visão geral do desempenho mensal das Core Web Vitals da origem. Essas são as métricas de UX mais importantes nas quais o Google recomenda que você se concentre.

Captura de tela da visão geral das Core Web Vitals do painel do CrUX mostrando informações de métricas de LCP, INP e CLS.
Visão geral das Core Web Vitals do painel do CrUX

Use a página Core Web Vitals para entender como os usuários de computadores e smartphones veem a origem. Por padrão, o mês mais recente no momento em que você criou o painel é selecionado. Para alternar entre versões mensais mais antigas ou mais recentes, use o filtro Mês na parte de cima da página.

O tablet é omitido nesses gráficos por padrão, mas, se necessário, você pode remover o filtro Sem tablet na configuração do gráfico de barras:

Captura de tela da edição da opção "Filtro" no Looker Studio.
Edição do painel do CrUX para mostrar tablets na página Core Web Vitals

Desempenho métrico

Depois dessa página, você vai encontrar páginas independentes para todas as métricas no conjunto de dados do CrUX.

Captura de tela da página LCP do painel do CrUX mostrando vários gráficos de barras de pilha que mudam ao longo de vários meses.
Página de LCP do painel do CrUX

Acima de cada página fica o filtro Dispositivo, que pode ser usado para restringir os formatos incluídos nos dados da experiência. Por exemplo, você pode detalhar especificamente as experiências em smartphones. Essa configuração persiste em todas as páginas.

As principais visualizações nessas páginas são as distribuições mensais de experiências categorizadas como "Boa", "Precisa melhorar" e "Ruim". A legenda codificada por cores abaixo do gráfico indica a variedade de experiências incluídas na categoria. Por exemplo, na captura de tela anterior, é possível ver a porcentagem de clientes "bons" A Largest Contentful Paint (LCP) apresenta flutuação e piora um pouco nos últimos meses.

As porcentagens de "bom" do mês mais recente e "ruim" As experiências são mostradas acima do gráfico com um indicador da diferença percentual em relação ao mês anterior. Para esta origem, "bom" As experiências de LCP caíram 3,2% para 56,04% mês a mês.

Além disso, para métricas como LCP e outras Core Web Vitals que fornecem recomendações explícitas de percentis, você encontrará "P75" métrica entre o valor "bom" e "ruim" porcentagens. Esse valor corresponde ao 75o percentil das experiências do usuário da origem. Em outras palavras, 75% das experiências são melhores do que esse valor. Vale ressaltar que isso se aplica à distribuição geral em todos os dispositivos na origem. Alternar dispositivos específicos com o filtro Dispositivo não recalcula o percentil.

Advertências técnicas sobre percentis

As métricas de percentil são baseadas nos dados de histograma do BigQuery.Portanto, a granularidade será aproximada: 100 ms para LCP, 25 ms para INP e 0, 05 para CLS. Em outras palavras, uma LCP P75 de 3.800 ms indica que o 75o percentil verdadeiro está em algum lugar entre 3.800 ms e 3.900 ms.

Além disso, o conjunto de dados do BigQuery usa uma técnica chamada "espalhamento por classes" em que as densidades de experiências do usuário são intrinsecamente agrupadas em agrupamentos muito grosseiros de granularidade decrescente. Isso nos permite incluir densidades de minutos na cauda da distribuição sem precisar exceder quatro dígitos de precisão. Por exemplo, os valores de LCP com menos de 3 segundos são agrupados em agrupamentos com 200 ms de largura. Entre 3 e 10 segundos, os agrupamentos têm 500 ms de largura. Após 10 segundos, os agrupamentos têm 5.000 ms de largura... Em vez de ter agrupamentos de larguras variadas, a distribuição por agrupamentos garante que todos os agrupamentos tenham uma largura constante de 100 ms (o maior divisor comum) e que a distribuição seja interpolada linearmente em cada agrupamento.

Os valores P75 correspondentes em ferramentas como o PageSpeed Insights não são baseados no conjunto de dados público do BigQuery e podem fornecer valores de precisão de milissegundos.

Informações demográficas do usuário

Há duas dimensões incluídas nas páginas de informações demográficas dos usuários: dispositivos e tipos de conexão efetiva (ECTs, na sigla em inglês). Essas páginas ilustram a distribuição de visualizações de página por toda a origem para usuários em cada grupo demográfico.

A página de distribuição de dispositivos mostra o detalhamento de usuários de smartphone, computador e tablet ao longo do tempo. Muitas origens tendem a ter poucos ou nenhum dado sobre tablets, então você verá "0%" com frequência fora da borda do gráfico.

Captura de tela da página do dispositivo CrUX Dashboard mostrando como o detalhamento do dispositivo muda mês a mês.
Página do dispositivo CrUX Dashboard

Da mesma forma, a página de distribuição do ECT mostra o detalhamento de experiências 4G, 3G, 2G, 2G lento e off-line.

As distribuições dessas dimensões são calculadas usando segmentos do Dados do histograma de First Contentful Paint (FCP).

Perguntas frequentes

Confira algumas perguntas frequentes sobre a criação de painéis do CrUX no Looker Studio:

Quando devo usar o painel CrUX em vez de outras ferramentas?

O painel CrUX é baseado nos mesmos dados disponíveis no BigQuery, mas você não precisa escrever nenhuma linha de SQL para extrair os dados nem se preocupar em exceder cotas sem custo financeiro. Configurar um painel é mais rápido e fácil do que visualizar a consulta dos dados subjacentes. Todas as visualizações são geradas para você e você tem o controle para compartilhá-las com quem quiser.

Há alguma limitação no uso do painel CrUX?

Ser baseado no BigQuery significa que o painel CrUX também herda todas as suas limitações. Ela é restrita a dados no nível da origem em granularidade mensal.

O painel CrUX também troca parte da versatilidade dos dados brutos no BigQuery por simplicidade e praticidade. Por exemplo, as distribuições de métricas são fornecidas apenas como "bom", "precisa de melhorias" e "ruim", ao contrário dos histogramas completos. O painel CrUX também fornece dados em nível global, enquanto o conjunto de dados do BigQuery permite ampliar o zoom em países específicos.

Onde encontro mais informações sobre o Looker Studio?

Confira a página de recursos do Looker Studio para mais informações.