Design Orientado por Dados: Como Criar uma UX Personalizada

Discover how to lead product teams and build better products. Create a Free Account

A arte ao encontro da ciência. Este guia passo a passo explica exatamente como combinar o poder dos dados com o design criativo para conquistar os seus utilizadores.

data driven design featured image

Vivemos na era dos grandes volumes de dados e da análise de dados, e parece que esta disciplina surgiu em quase todo o lado, incluindo nas vendas, no marketing, na gestão de produtos e, naturalmente, no design de UX.

Há uma boa razão para a análise de dados se ter tornado uma parte essencial do fluxo de trabalho de design nos dias de hoje. Ao analisar o comportamento dos seus utilizadores, consegue melhorar significativamente a qualidade dos seus designs.

Por isso, vamos compreender como as equipas de design podem tirar partido do design orientado por dados e garantir que os seus utilizadores se encontram num estado de absoluta satisfação ao interagirem com o seu produto.

O que é o design orientado por dados (e por que razão utilizar dados no seu processo de design de UX?)

O design orientado por dados é o processo de incorporar o acompanhamento de dados e a análise de dados no seu fluxo de trabalho, para o ajudar a tomar melhores decisões de design com base nos conhecimentos obtidos através das suas ferramentas de análise de dados.

Os designers utilizam diversas ferramentas de investigação de utilizadores e de análise de dados para acompanhar jornadas críticas dos utilizadores e KPIs que representam a facilidade de utilização geral do seu produto. Para isso, recorrem a processos como testes A/B, análise de diferentes tipos de dados (por exemplo, dados quantitativos e qualitativos), testes com utilizadores, entrevistas a grupos focais, criação de páginas de destino e protótipos monitorizáveis, entre outros.

Como resultado, conseguem identificar rapidamente problemas de usabilidade, encontrar o problema central que os causa e resolvê-lo.

Além disso, as equipas de design utilizam ativamente a análise de dados para medir o impacto dos seus designs mais recentes na experiência do utilizador e utilizam as conclusões para criar novas versões melhoradas.

Exemplos de design baseado em dados

A disciplina de implementar soluções de design de UX com base em dados empíricos é muito mais popular do que poderia imaginar. A maioria das empresas de produtos bem-sucedidas utiliza ativamente este processo para garantir que as decisões de design tomadas têm provavelmente um impacto positivo no seu produto.

Eis três exemplos destes produtos.

Reprodução automática do YouTube

Lembra-se das versões mais antigas do YouTube, quando tinha de clicar num novo vídeo depois de o atual terminar? Não era irritante?

Bem, esta “funcionalidade” levou a uma redução significativa na taxa de interação dos utilizadores do YouTube (número de vídeos reproduzidos por dia), e a equipa de design decidiu fazer algo a esse respeito.

Analisaram os dados e obtiveram duas conclusões interessantes:

  • As pessoas tendem a ver vários vídeos seguidos. Algumas gostam de ligar música no YouTube como som de fundo enquanto cozinham ou limpam. Outras (como eu) gostam de adormecer com algum vídeo a ser reproduzido em segundo plano.
  • Muitos utilizadores não clicavam na miniatura de outro vídeo depois de a reprodução terminar. Para muitos utilizadores, era inconveniente clicar constantemente nas miniaturas dos vídeos.

Com base nestas conclusões, decidiram adicionar a famosa funcionalidade de “reprodução automática”, que mudaria automaticamente para um vídeo relacionado sugerido pela plataforma ou para o vídeo seguinte da lista de reprodução.

reprodução automática do youtube

Como resultado, o YouTube registou um enorme aumento nas suas métricas de interação.

Get Free Access to the Product Vault
We’ve collected the goods — AI prompts, exclusive deals, and a library of resources for product leaders. Unlock your account for access.
Get Free Access

Have an account? Log In

Fluxo de avaliações da Airbnb centrado no utilizador

Se alguma vez ficou alojado numa propriedade da Airbnb, é muito provável que tenha avaliado o local através do fluxo de comentários da plataforma.

Se lhe perguntar se deixar uma avaliação foi complicado, a maioria provavelmente diria que o formulário não era curto, mas que não foi doloroso preenchê-lo.

Bem, isso deve-se ao facto de não ter tido oportunidade de experimentar a agonia de preencher o formulário interminável que a Airbnb utilizava anteriormente para as suas avaliações.

A equipa da Airbnb tinha dois problemas:

  • Poucas pessoas preenchiam os seus formulários de avaliação.
  • As respostas nos seus formulários eram muito genéricas e pouco úteis.

Para encontrar uma solução para estes problemas, a equipa de design começou a analisar os dados de desempenho do formulário e percebeu que a grande maioria dos utilizadores simplesmente o abandonava a meio.

Com base nestes conhecimentos, a equipa começou a realizar testes de usabilidade e percebeu que:

  • O tamanho do formulário era excessivo para os utilizadores. Ninguém queria responder a tantas perguntas.
  • As pessoas deixavam comentários genéricos porque não queriam gastar o seu precioso tempo a escrever avaliações detalhadas.

Agora que a origem do problema estava clara, a equipa da Airbnb iniciou uma grande reformulação da experiência de avaliação. Em vez de um único formulário longo, criou várias páginas com formulários mais curtos para evitar sobrecarregar os utilizadores.

Também começaram a utilizar botões com respostas predefinidas em vez de campos de texto, o que os ajudou a evitar respostas genéricas. Além disso, a equipa podia executar análises de dados sobre as respostas dos utilizadores e otimizá-las ainda mais, uma vez que havia respostas estruturadas em vez de texto.

captura de ecrã do Airbnb
Fonte: Airbnb

Como provavelmente já calculou, o formulário reformulado foi um enorme sucesso! 

Navegação pelos comentários do Reddit

O Reddit não é simplesmente outro fórum. Tornou-se um fenómeno cultural e o local onde toda a Internet se reúne para discutir diversos assuntos.

Contudo, a popularidade do Reddit tinha um inconveniente interessante. As pessoas estavam a adicionar tantos comentários aos tópicos publicados no site que se estava a tornar impossível ler a discussão. Era particularmente irritante navegar quando havia dezenas de respostas a um único comentário e era necessário percorrer a página durante algum tempo para chegar ao comentário seguinte.

A equipa do Reddit conhecia este problema. Chegou mesmo a desenvolver vários conceitos para reformular a secção de comentários e facilitar a navegação.

Para escolher o melhor conceito, começaram a realizar testes de usabilidade e a tirar partido de outros métodos de investigação para recolher dados sobre a interação dos utilizadores, extrair métricas importantes e comparar os seus conceitos utilizando essas métricas.

Havia uma solução de design que superava claramente as restantes: permitir que os utilizadores expandissem e recolhessem as respostas.

captura de ecrã do Reddit

Desta forma, se não quisesse ler a interminável sequência de respostas a um determinado comentário, podia simplesmente recolhê-la e avançar para o comentário seguinte da lista.

Como pode ver, o processo de design orientado por dados está no centro dos fluxos de trabalho de muitos produtos de sucesso.

E sei que também quer tomar as suas decisões de design com base em dados (caso contrário, porque estaria aqui?).

Por isso, apresento de seguida uma explicação passo a passo sobre como incorporar o design orientado por dados no processo de desenvolvimento do seu produto.

6 passos para permitir decisões baseadas em dados para o seu produto

Vamos adotar aqui uma abordagem mais prática. Em vez de falarmos simplesmente sobre o que deveria ser feito em teoria, veremos também exemplos para cada passo utilizando ferramentas reais. A principal ferramenta que escolherei hoje será o Amplitude, uma vez que é a ferramenta de análise de produtos orientada por eventos que utilizo no trabalho todos os dias.

Agora, vamos começar pelo primeiro passo: a definição da estratégia.

Passo 1: Criar uma estratégia de análise de dados com as partes interessadas

Pode esquecer a obtenção de resultados valiosos através dos seus esforços de análise de dados se não tiver uma estratégia sólida para isso.

Uma estratégia típica de análise de dados inclui as duas secções seguintes:

Secção 1: Objetivos

Deve definir claramente a razão pela qual está a implementar a análise em primeiro lugar. Sem objetivos claros, corre o risco de acompanhar e medir dados dos utilizadores que não contêm informações valiosas.

Agora, imagine que está responsável pelo Spotify e veja como seria um conjunto típico de objetivos para si.

objetivos e metas

Eu sei, estes objetivos parecem um pouco óbvios. Mas acredite em mim: sem os definir claramente, acabará por criar uma verdadeira confusão analítica.

Secção 2: KPIs

Assim que os seus objetivos estiverem definidos, irá utilizá-los para determinar as métricas importantes que pretende medir. A palavra-chave aqui é “determinar”. Isto significa que melhorar as suas métricas deverá aproximá-lo da concretização dos seus objetivos.

Por exemplo, se o seu objetivo for um crescimento sustentável dos utilizadores, deverá considerar medir a retenção, a taxa de ativação e a taxa de registo. Por outro lado, escolher o MRR como métrica principal seria uma má ideia, pois pode aumentar as suas receitas a curto prazo, mas perder a maior parte delas a longo prazo. Neste caso, o seu crescimento não será sustentável e não conseguirá alcançar o seu objetivo.

Eis o aspeto que terá uma lista de KPIs para o primeiro objetivo do nosso exemplo anterior: “Melhorar a experiência do utilizador”:

exemplo de KPIs

Todos estes são indicadores de uma experiência de utilizador positiva. Se as taxas acima estiverem a aumentar, podemos afirmar com confiança que os utilizadores estão a apreciar o nosso produto.

Passo 2: Integrar uma ferramenta de análise de dados

Agora que tem uma compreensão clara do que pretende medir, está na altura de pensar em como o irá medir. Em particular, trata-se de selecionar a ferramenta de análise que acabará por utilizar para encontrar informações relevantes nos seus dados.

Existe uma vasta gama de ferramentas que pode considerar para este efeito, dependendo da categoria de análise que lhe interessa (por exemplo, mapas de calor, dados demográficos, comportamento dos utilizadores, etc.), das funcionalidades disponíveis (coortes, funis, etc.) e, naturalmente, do seu orçamento.

Melhores ferramentas de análise de produtos para equipas de produto

Eis algumas opções que pode considerar para cada tipo:

  • Mapas de calor (incluindo testes A/B e multivariados): Hotjar, Mouseflow, Clarity.
  • Dados demográficos e análise do site (por exemplo, taxa de rejeição): Google Analytics, Matomo, Yandex Metrica.
  • Análise orientada por eventos (para taxas de conversão, funis, etc.): Amplitude, Mixpanel.
  • Informação empresarial (para métricas de impacto financeiro, etc.): Looker Studio, Tableau, PowerBI.

A minha configuração atual consiste numa combinação de GA4, Hotjar, Amplitude e Looker Studio.

Hoje, no entanto, quero concentrar-me no Amplitude e mostrar-lhe como o integrar.

Vamos utilizar o Google Tag Manager (GTM) para manter as coisas simples e evitar envolver a sua equipa de engenharia na configuração.

Começaremos por abrir o GTM, clicar em “Etiquetas” na barra lateral esquerda para abrir a nossa lista de etiquetas e clicar em “Novo” para abrir a barra lateral de criação de etiquetas.

captura de ecrã do gestor de tags

Para evitar configurar manualmente uma tag para o Amplitude, a empresa criou um modelo para utilizarmos. Para utilizar esse modelo, clicaremos no cartão “Configuração da etiqueta” para abrir a galeria de modelos.

captura de ecrã

Aqui, temos de clicar em “Descobrir mais tipos de etiquetas na Galeria de modelos da comunidade”, procurar “Amplitude” e clicar em “SDK do navegador do Amplitude Analytics”.

captura de ecrã

Estamos quase a terminar. Primeiro, temos de adicionar a nossa chave de API do Amplitude ao campo correspondente.

captura de ecrã da configuração da tag

Em seguida, adicionamos um acionador clicando no cartão do acionador no ecrã e selecionando “Inicialização—Todas as páginas”.

Por fim, atribuímos um nome à nossa tag (por exemplo, “Inicialização do Amplitude”), guardamo-la e publicamos uma nova versão no GTM. E já está! Da próxima vez que alguém abrir o seu produto, o SDK do Amplitude será inicializado e começará a funcionar em segundo plano.

Passo 3: Documentar o seu processo de recolha de dados quantitativos

A execução do Amplitude é apenas o início da configuração. Uma vez que se trata de uma ferramenta de análise orientada por eventos, terá de configurar manualmente os eventos no seu produto e acioná-los utilizando o SDK do Amplitude, que acabámos de adicionar ao seu produto através do GTM.

Mas, antes de adicionar eventos, teremos primeiro de os documentar. Um documento de recolha de dados é normalmente uma folha de cálculo onde lista os eventos que o SDK irá acionar, as ações dos utilizadores que servirão de acionador para esses eventos e os diferentes parâmetros que pretende enviar para o Amplitude juntamente com o evento.

Eis o aspeto de uma versão simplificada desta folha de cálculo para acompanhar as interações dos utilizadores no formulário de avaliação do Airbnb.

exemplo de folha de cálculo

Depois de documentarmos os eventos que precisamos de acompanhar, pediremos à nossa equipa de engenharia que adicione acionadores para cada um deles no nosso código frontend, utilizando o SDK da Amplitude. Quando concluírem esta tarefa, o nosso produto acionará automaticamente estes eventos e enviará os dados necessários para a Amplitude, para que os possamos analisar.

Passo 4: Criar relatórios e painéis para as suas principais métricas de UX

Nesta fase, já tem tudo o que precisa para começar a realizar a análise propriamente dita e determinar se a experiência do utilizador está a corresponder às suas expectativas.

O seu caminho para a visualização de dados começará pela criação de gráficos para as principais métricas de usabilidade que identificou e documentou anteriormente, utilizando a ferramenta de análise da sua escolha. Deixe-me mostrar-lhe como fazê-lo utilizando a Amplitude como exemplo. A taxa de adoção das listas de reprodução parece ser uma excelente métrica para começar.

Vamos criar um novo gráfico de segmentação (ou seja, um gráfico normal) na Amplitude, clicando no botão “Novo” e escolhendo “Segmentação” na barra lateral que é apresentada.

captura de ecrã de exemplo

Depois, precisamos de selecionar os eventos que nos ajudarão a medir a adoção. No nosso caso, será “Seguir lista de reprodução”.

captura de ecrã dos eventos

Em seguida, precisamos de garantir que os números apresentados no gráfico representam a percentagem de utilizadores ativos que realizam esta ação. Assim, selecionaremos a opção “% ativos” no menu “Medido como”.

captura de ecrã de exemplo

Eis o aspeto que terá o nosso gráfico. Este mostra que cerca de 70% dos nossos utilizadores ativos diários seguem listas de reprodução todos os dias. Honestamente, parece ser um resultado bastante bom.

captura de ecrã de exemplo

Por fim, guardaremos o nosso gráfico e trabalharemos nas métricas restantes.

Pode criar um painel para ter uma vista única de todas as suas principais métricas. Para isso, clicaremos novamente no botão “Novo”, escolheremos “Relatório” e, em seguida, “Painel”.

Como resultado, veremos um painel vazio, ao qual teremos de atribuir um nome e preencher com os gráficos que criámos anteriormente.

captura de ecrã do painel

Vamos chamar-lhe “Principais métricas de usabilidade” e adicionar os nossos gráficos, clicando em “Adicionar conteúdo”, depois em “Gráfico existente” e escolhendo os gráficos que criámos.

captura de ecrã das principais métricas de exemplo


Parabéns! Agora tem uma visão geral de todas as suas principais métricas!

More Articles

Passo 5: Rever e analisar constantemente os seus relatórios

Os resultados que vê no seu painel da Amplitude estão “vivos”. Aumentarão ou diminuirão consoante as alterações que tenha feito à sua UX. Por isso, deve rever constantemente estas métricas para:

  • Verificar se os seus esforços tiveram um impacto positivo na usabilidade do seu produto.
  • Identificar as métricas com um desempenho fraco e tentar descobrir a razão.

Sugiro que organize reuniões de revisão semanais ou quinzenais com as partes interessadas, para discutir as alterações dos KPI e debater possíveis razões para as métricas que não apresentam um bom desempenho.

O resultado destas reuniões deverá ser uma lista de hipóteses sobre como melhorar as suas métricas e de problemas potenciais que causam um desempenho fraco.

De seguida, realizará um processo de investigação de design de UX para validar ou rejeitar estas hipóteses e começar a desenvolver soluções que possam fazer a diferença.

Eis um estudo de caso do mundo real baseado na minha experiência.

Um dos produtos em que trabalhei era uma plataforma de marketing para websites, que lhes permitia enviar notificações push ao seu público. Depois de se registarem, os proprietários dos websites tinham de configurar o nosso SDK nos respetivos websites para ativar as notificações push.

Criámos um gráfico de funil que apresentava todos os principais passos que os proprietários de websites tinham de configurar. Quando analisámos o funil pela primeira vez, reparámos em algo estranho. Havia uma queda enorme de 70% entre o passo de instalação do SDK e o envio da primeira notificação push.

Após uma sessão de geração de ideias, formulámos a hipótese de que a razão por detrás desta queda era a ausência de um “modo de teste”, no qual os utilizadores pudessem verificar se as notificações push estavam a funcionar corretamente.

Realizámos vários testes de usabilidade e entrevistas com utilizadores para validar esta hipótese. Afinal, os proprietários de websites não se sentiam confortáveis a utilizar qualquer tecnologia nova sem a testarem primeiro neles próprios.

Por isso, concebemos e desenvolvemos um percurso de teste que os utilizadores fariam imediatamente após instalarem o SDK. O resultado foi impressionante. Conseguimos responder bastante bem às necessidades e aos pontos problemáticos dos utilizadores. No espaço de algumas semanas, a queda de 70% passou a ser de apenas 15%!

Passo 6: Integre as aprendizagens nos seus projetos

O passo final da sua abordagem orientada por dados é também o mais importante. As suas análises e hipóteses não terão impacto no seu produto a menos que aja com base nelas.

A forma como geríamos este processo num dos produtos que eu liderava era bastante simples. Assim que validávamos uma hipótese, criávamos uma tarefa de conceção de produto na nossa ferramenta de gestão de tarefas, definíamos a sua prioridade e atribuíamo-la a um dos nossos designers.

Assim que a conceção estivesse concluída, realizávamos testes de usabilidade moderados ou não moderados sobre a mesma, iterávamos com base nos comentários dos utilizadores e preparávamos o novo projeto para o aperfeiçoamento da lista de pendências.

Independentemente de seguir o processo que acabei de descrever ou de criar o seu próprio processo — certifique-se de que age com base nas aprendizagens!

Melhore o seu trabalho de conceção com dados

A análise de dados é uma ferramenta fantástica nas mãos de uma equipa de conceção. Ao monitorizar e resolver constantemente os problemas relacionados com as suas principais métricas de usabilidade, pode melhorar significativamente a sua tomada de decisões e criar experiências de utilização que deixarão os seus utilizadores maravilhados.

Não se esqueça de subscrever o nosso boletim informativo para obter mais recursos e guias sobre gestão de produtos, bem como os podcasts, as entrevistas e outros conhecimentos mais recentes de líderes e especialistas do setor.

Suren Karapetyan
Suren Karapetyan, MBA, is a principal product manager focused on AI-driven SaaS products. He thrives in the fast-paced world of early stage startups and finds the product-market fit for them. His portfolio is quite diverse, ranging from background noise cancellation tools for work-from-home folks to customs clearance software for government agencies.
Follow the author:

You may also like