A agenda da HOTSAUCE está no ar! Junte-se a nós em Nova York de 2 a 3/11. Ingressos com 50% de desconto usando o código 2HOT

Aprender / Guias / O que é UX Design

Voltar aos guias

7 problemas de UX design com os quais aprendemos em 2024 (e como corrigir essas falhas através da Hotjar)

Quando você está continuamente iterando o seu produto, é provável que você cometa alguns erros durante o processo. Na Hotjar, temos a sorte de ter um conjunto próprio de ferramentas incríveis que nos ajudam a reverter problemas de UX design. Este artigo compartilha sete dos maiores (e piores) momentos da nossa equipe este ano—além de como descobrimos, como os corrigimos, e o mais importante: como aprendemos com eles.

Resumo

Aqui estão os sete maiores erros de UX que nossa equipe já cometeu. Clique ou continue rolando a tela para descobrir como esses erros foram vistos em ação (e como os corrigimos).

  1. Redesenhar um botão, tornando-o invisível para os usuários: pensamos que um ícone de botão brilhante atrairia a atenção dos usuários, mas os dados obtidos pelas próprias ferramentas da Hotjar revelaram que ninguém o entendia

  2. Complicação excessiva de uma interface: as gravações do Mixpanel e da Hotjar revelaram que nossas pesquisas tinham muitos campos de formulário, o que causava um atrito extra para o usuário

  3. Convidar os usuários a escrever, mas não dar-lhes espaço suficiente para fazê-lo: os usuários tentaram escrever prompts para o gerador de pesquisas com inteligência artificial, mas os dados da Hotjar mostraram que o campo do formulário era muito curto

  4. Ocultar acidentalmente os resultados da pesquisa dos usuários: mudamos a forma como os resultados e as respostas da pesquisa apareciam, mas os usuários nos enviaram feedback afirmando que não estavam conseguindo encontrar seus dados

  5. Gerar três vezes mais perguntas de pesquisa do que os usuários precisavam: nossa ferramenta de pesquisa com inteligência artificial gerava três perguntas por padrão, mas os dados da Hotjar mostraram que a maioria dos usuários só precisava de uma pergunta

  6. Lançamento de um pop over em cima de outro pop over: lançamos acidentalmente um guia de onboarding a um produto por cima de uma pesquisa, e os dados obtidos pelas ferramentas da Hotjar mostraram que os usuários acabaram fechando ambos

  7. Esconder um ingrediente de configuração vital dos novos usuários durante o processo de onboarding: nós acidentamente tornamos extremamente difícil para que os novos usuários encontrassem seu código de rastreamento, causando dificuldades para concluir a configuração da Hotjar em seus sites

7 falhas e problemas de UX que causamos este ano (e como a Hotjar ajudou a corrigi-los)

Esperamos que, ao ver nossas falhas, você também possa aprender com elas. Aqui estão sete de nossos maiores erros até o momento.

1. Redesenhar um botão, tornando-o invisível para os usuários

🤦‍ O que aconteceu?

Há pouco tempo, a Hotjar lançou um novo recurso—o Hotjar AI nosso gerador de perguntas de pesquisa com base em inteligência artificial. Ao criar uma pesquisa, basta informar ao Hotjar AI suas metas de pesquisa, e ele escreverá perguntas especificamente direcionadas e personalizadas para o seu caso. Inteligente, não é?

Bem, tentamos ser um pouco inteligentes demais ao iterar o recurso.

Com o objetivo de otimizar a interface do usuário, alteramos nosso texto original de "Adicionar pergunta" para "Adicionar perguntas'. Também substituímos o ícone "+" ao lado do texto por nosso ícone brilhante de IA.

#Our new text looked pretty, but would it serve its purpose? Short answer: no—read on to see why
Our new text looked pretty, but would it serve its purpose? Short answer: no—read on to see why

Naturalmente, achamos que nossos usuários veriam o ícone e entenderiam o que ele significava. Mas ninguém viu. Na verdade, quase nenhum usuário clicou no botão depois que o alteramos.

🕵️‍ Como descobrimos essa falha de UX

Ferramentas e recursos usados:

  • Surveys

  • Interviews

  • Eventos na Hotjar

Como fazemos ao aplicar qualquer modificação na Hotjar, seja ela grande ou pequena, queríamos obter feedback do usuário ao lançar o novo botão.

Usamos a ferramenta Events na Hotjar para configurar uma pesquisa popover que era iniciada sempre que um usuário clicava no botão "Adicionar pergunta".

Normalmente, conseguimos obter centenas de respostas à pesquisas em apenas alguns dias. Mas, dessa vez, depois de quase duas semanas, tivemos um total de...

Duas!

#Two responses? Something was definitely amiss.
Two responses? Something was definitely amiss.

Imediatamente soubemos que precisávamos falar com os nossos usuários, então marcamos entrevistas usando a ferramenta Hotjar Engage.

No total, entrevistamos seis usuários—três que haviam usado a ferramenta e três que não haviam usado. Essas conversas revelaram que eles não conseguiam encontrar o botão "Adicionar perguntas", a menos que fosse solicitado que o fizessem.

Levamos nosso botão de volta à prancheta de desenho:

O novo botão "Adicionar pergunta" é muito mais claro e visível—e como bônus, não tivemos que nos separar do nosso querido ícone brilhante

📝 O que aprendemos com isso

Nosso principal aprendizado aqui é não confiar em suposições. Nesse caso, presumimos que os usuários entenderiam exatamente o que o nosso novo botão os instruía a fazer. Sempre que possível, teste os protótipos antes do lançamento para validar as suposições e descobrir se os seus designs estão sendo bem aceitos pelos usuários.

Nossa segunda lição foi descobrir a necessidade de monitorar as métricas que nos permitem saber quando algo não está funcionando. Identificamos esse problema porque estávamos monitorando o número de usuários que clicavam no botão e, por consequência, acionavam as pesquisas. No final, a coleta proativa de feedback desde o início nos permitiu identificar e resolver o problema, antes que ele afetasse seriamente o engajamento do usuário.

Uma conclusão final:

A segmentação de pesquisas em eventos é realmente incrível.

Jess Ashworth
Designer de conteúdo sênior na Hotjar

💡 Dica avançada: deseja rastrear pesquisas "acionadas" da mesma forma que nós fizemos? Configure eventos personalizados para disparar pesquisas quando os usuários concluírem ações específicas. Você pode até mesmo dar um passo adiante, usando a ferramenta Trends para traçar um gráfico das ações concluídas—depois, é só fixá-lo em seu Dashboard para facilitar o acesso.

A ferramenta Trends da Hotjar permite criar visualizações práticas de ações específicas, como quando os usuários clicam em um botão ou preenchem uma pesquisa

2. Complicação excessiva de uma interface

🤦‍♀️ O que aconteceu?

Ao projetar a interface da nossa ferramenta Surveys, queríamos ajudar os usuários a evitar erros, como publicar acidentalmente o questionário em todas as suas páginas. Por isso, adicionamos alguns campos obrigatórios que os usuários tinham de preencher antes de iniciar um questionário.

Os campos extras complicavam demais o processo de configuração da pesquisa. Os usuários ficavam confusos, alternando entre as telas e salvando pesquisas sem concluí-las.

🕵️‍Como descobrimos esse problema de UX

Ferramentas usadas:

  • Recordings

  • Interviews

  • Mixpanel

Felizmente, avaliamos regularmente nossas páginas para detectar problemas como esse. Ao analisar as gravações das sessões por meio da ferramenta Hotjar Recordings e da realização de testes de usabilidade através do Hotjar Engage, notamos uma tendência: os usuários frequentemente iam e voltavam entre as diferentes telas na interface da pesquisa.

Também analisamos nossos dados do Mixpanel para ver quantos usuários converteram ao configurar pesquisas do zero, e comparamos isso com a taxa de conversão de nossos modelos de pesquisa que preenchem previamente as configurações, para que os usuários tenham menos campos de formulário a serem preenchidos.

Os dados revelaram que os modelos tinham taxas de conversão muito melhores. Esse foi um sinal claro de que nosso processo de pesquisa estava muito complexo, e que precisávamos preencher previamente os campos em todas as pesquisas.

📝 O que aprendemos com isso

Uma das regras da criação de uma excelente experiência para o usuário é manter as coisas o mais simples possível. Portanto, se estiver adicionando mais etapas a um processo, certifique-se de que seja absolutamente necessário fazer isso. Além disso, lembre-se de priorizar a coleta de insights sobre seus usuários.

Ao obter insights avançados sobre o comportamento e as preferências do usuário, é possível criar soluções centradas no usuário que estão em sinergia com o seu público.

Martina Pérez
Designer de produtos da equipe da Hotjar

💡Dica avançada: deseja executar seus próprios testes de usabilidade? Experimente a Engage, nossa ferramenta de entrevistas com usuários, para recrutar personas do nosso grupo global que já conta com mais de 200.000 participantes—ou convide participantes da sua própria rede. Organize as suas sessões de teste diretamente no Engage para gravar a chamada, e obter na sequência uma transcrição instantânea com tecnologia de IA.

3. Convidar os usuários a escrever, mas não lhes dar espaço suficiente

🤦‍ O que aconteceu?

Se você já experimentou a ferramenta Hotjar Surveys, provavelmente notou que nosso gerador de pesquisas com IA inclui um campo para os usuários escreverem. A ideia por trás da criação desse campo era que os usuários inserissem uma descrição rápida de seu objetivo de pesquisa, e a ferramenta geraria perguntas de pesquisa para eles com base em seu objetivo.

O recurso estava funcionando muito bem—mas rapidamente descobrimos que os usuários queriam escrever descrições de seus objetivos que eram muito mais longas do que o previsto. Tornamos o campo do formulário muito curto e, depois de inserir algumas palavras, os usuários não conseguiam mais ver o que haviam escrito anteriormente.

Nosso campo de formulário não permitia que os usuários escrevessem os prompts detalhados que desejavam

Isso tornava a ferramenta difícil de usar para a maioria dos usuários—o que não era exatamente ideal para um recurso novo e brilhante que estávamos ansiosos para lançar!

Feedback recebido por meio do nosso canal dedicado no Slack, de um usuário sugerindo um campo de formulário maior

🕵️‍♂️ Como descobrimos essa falha de UX

Ferramentas e recursos usados:

  • Feedback

  • Recordings

  • Interviews

  • Integração com o Mixpanel

  • Integração com o Slack

Os dados do Mixpanel revelaram que os usuários estavam inserindo objetivos mais longos do que havíamos previsto.

Para investigar mais a fundo, visualizamos as gravações das sessões na Hotjar e pudemos observar que o campo de formulário curto limitava a visão que os usuários tinham de seu próprio texto. Em seguida, fizemos entrevistas no Engage para saber por que os usuários adicionavam objetivos mais longos, e o que esperavam alcançar com isso.

Embora esse erro tenha sido um grande contratempo, acabamos obtendo insights valiosos sobre as necessidades e sobre os objetivos dos usuários.

📝 O que aprendemos com isso

Como em um de nossos exemplos anteriores, a lição é clara:

Confiar em suposições ao invés de validá-las antecipadamente pode resultar em vários erros de usabilidade.

Martina Pérez
Designer de produtos da equipe da Hotjar

Ao mesmo tempo, também aprendemos o valor incrível de investigar um pouco mais a fundo, para que possamos aprender mais. Com a realização de entrevistas, descobrimos o que os usuários realmente queriam obter da nossa ferramenta, e ficamos mais bem posicionados para oferecer isso a eles.

💡 Dica avançada: você provavelmente já percebeu que adoramos usar a Hotjar e o Mixpanel juntos. Deseja replicar nossos resultados? Configure a integração da Hotjar com o Mixpanel para visualizar imediatamente as gravações de sessão de qualquer evento que você esteja rastreando no Mixpanel. As gravações mostram uma reprodução em vídeo da jornada de um usuário individual, para que você possa ver tudo o que ele vivenciou durante a navegação no seu site.

#Recordings show every click, scroll, and tap users made in real time

As gravações mostram cada clique, rolagem e toque dos usuários em tempo real

4. Ocultação acidental dos resultados da pesquisa para os usuários

🤦‍ O que aconteceu?

Recentemente, realizamos um experimento para mesclar dois aspectos da nossa ferramenta Surveys:respostas e resultados.

As respostas são respostas individuais que os usuários dão às perguntas, enquanto os resultados são pontuações de dados agregados, como o total de pontuações do NPS que os usuários geram.

O controle do experimento (parte superior), com guias individuais para "respostas" e "resultados" vs. a variante do experimento (parte inferior), que as mescla em uma única guia "resultados"

No layout original do dashboard da pesquisa, os usuários podiam encontrar facilmente seus resultados e respostas. No entanto, experimentamos um novo layout que acreditávamos que melhoraria a jornada do usuário—nessa versão, os usuários precisavam usar um menu seletor de perguntas para conseguirem visualizar seus resultados.

No final das contas, os usuários simplesmente não viam o seletor de perguntas, o que significava que os resultados da pesquisa estavam efetivamente ocultos para eles.

🕵️‍Como descobrimos essa falha de UX

Ferramentas e recursos usados:

  • Feedback

  • Integração com o Slack

  • Recordings

Depois de lançar a nova variante, os usuários começaram a entrar em contato conosco por meio do nosso botão de feedback (é esse pequeno botão vermelho à direita da sua tela 👉). Alguns ficaram irritados por não conseguirem encontrar os dados quantitativos que estavam tentando coletar com a ferramenta.

Para fazer o acompanhamento, assistimos a gravações de usuários navegando na ferramenta Surveys. Essas sessões demonstraram que os usuários estavam confusos e frustrados por não conseguirem ver os dados que antes estavam bem na frente deles.

No final, corrigimos nosso erro introduzindo uma dica de ferramenta do Appcues que destacava as alterações para os usuários. Deu certo—paramos imediatamente de receber feedback negativo dos usuários.

Nossa dica de ferramenta (Appcues) deu aos usuários a explicação que precisavam

💡Dica avançada: antes que um problema fique fora de controle, dê aos usuários a oportunidade de informá-lo sobre ele. Feedback é um widget que está sempre ativo, e que permite que os usuários compartilhem seus sentimentos sobre cada página do seu site e, em seguida, adicionem comentários opcionais ou capturas de tela para fornecer mais contexto ao problema que estão enfrentando.

Se você estiver usando nossa integração da Hotjar com o Microsoft Teams ou nossa integração com o Slacka Hotjar envia respostas de feedback diretamente ao seu canal preferido, para que você possa identificar problemas mais rapidamente.

O botão de feedback está sempre disponível no seu site, o que ajuda a obter insights do usuário 24 horas por dia, 7 dias por semana

📝 O que aprendemos com isso

Esteja ciente de que quebrar um design ou uma estrutura familiar pode ser arriscado. A maioria dos sites e aplicativos é estruturada de uma maneira específica porque os usuários estão familiarizados com determinados "arquétipos" de design, e por isso, os utilizam intuitivamente.

Os usuários, às vezes, são determinados, com modelos mentais predefinidos, e maneiras de usar suas ferramentas que já lhe são familiares.

Jess Ashworth
Designer de conteúdo sênior na Hotjar

Sempre que você se desviar dos designs estabelecidos, certifique-se de que você tem um bom motivo para isso, e de que está sinalizando aos usuários as alterações que está implementando.

Tome decisões de UX design mais inteligentes

Use a Hotjar para identificar tendências, realizar entrevistas e obter feedback dos seus usuários—tudo isso em um único conjunto de ferramentas.

5. Gerar 3 vezes mais perguntas de pesquisa do que os usuários precisavam

🤦‍O que aconteceu?

Quando lançamos o Hotjar AI, estávamos tão empolgados quanto uma criança em uma loja de doces. Assim, ao projetar a interface, adicionamos um botão—"Adicionar perguntas"—e isso gerava três perguntas de uma vez. Quanto mais, melhor, pensamos.

Acontece que a maioria dos usuários quer manter as suas pesquisas curtas e agradáveis; três perguntas eram demais. Também descobrimos que a ferramenta às vezes repetia uma pergunta, o que certamente nenhum usuário queria.

Por fim, quando os usuários clicavam no botão "Adicionar perguntas", nem sempre ficava claro quais novas perguntas haviam sido geradas pela ferramenta.

🕵️‍Como descobrimos essa falha de UX

Ferramenta usada:

  • Interviews

Ao executar testes de usabilidade na ferramenta Hotjar Engage, observamos que os usuários tinham dificuldade para identificar as novas perguntas que estavam sendo adicionadas às suas pesquisas.

#A product manager at Hotjar running a usability test for Hotjar AI
A product manager at Hotjar running a usability test for Hotjar AI

Além disso, nossas métricas de uso revelaram que esse botão tinha uma taxa de uso inferior a 1%. Em outras palavras, os usuários não gostavam dele.

Rapidamente, priorizamos a atualização do recurso para que ele adicionasse apenas uma pergunta de cada vez.

Nosso novo botão "Adicionar pergunta" introduz novas perguntas, uma de cada vez, facilitando o controle do processo de criação de pesquisas por parte dos usuários

📝 O que aprendemos com isso

Analise os dados antes de lançar novos recursos. O que tornou essa falha um pouco mais embaraçosa foi o fato de já sabermos que nossos usuários preferem pesquisas curtas.

Sabemos que, em geral, nossos usuários gostam de criar pesquisas curtas. Portanto, se tivéssemos tido isso em mente desde o início, nunca teríamos pensado em adicionar três perguntas de cada vez.

Jess Ashworth
Designer sênior de conteúdo na Hotjar

Moral da história? Acima de tudo, tome decisões baseadas no usuário. Mesmo quando estiver empolgado com uma nova ferramenta ou recurso, concentre-se no que seu público realmente precisa e deseja, e não no que você quer dar a ele. 😬

6. Lançamento de um popover em cima de outro popover

🤦‍O que aconteceu?

A integração é um processo vital para qualquer empresa de software—se seus usuários não conseguirem aprender rapidamente a usar suas ferramentas, eles não ficarão muito tempo por aqui. Com isso em mente, lançamos o que chamamos de "guia de introdução", que aparece quando os usuários acessam a Hotjar pela primeira vez, apresentando-lhes as principais ferramentas e recursos.

#Our ‘getting started guide’ pops up on the right-hand side of every new user’s screen when they sign in to Hotjar for the first time
Our ‘getting started guide’ pops up on the right-hand side of every new user’s screen when they sign in to Hotjar for the first time

Inicialmente, projetamos o guia como um popover que apareceria na parte superior da interface do usuário do Hotjar, chamando imediatamente a atenção dos usuários. No entanto, não nos demos conta de que também havíamos configurado uma pesquisa popover para ser exibida no mesmo horário e local.

O problema significava que os usuários viam popovers duplos ao mesmo tempo, e um estava se sobrepondo sobre o outro—o que não resultava em uma boa primeira impressão. Obviamente, isso ia totalmente contra os princípios de UX design, que enfatizam a simplificação das tarefas e a facilitação da tomada de decisões por parte dos usuários, sem sobrecarregá-los com distrações.

🕵️‍Como descobrimos esse problema de UX

Ferramentas usadas:

  • Feedback

  • Recordings

Felizmente, os usuários entraram em contato por meio da ferramenta Hotjar Feedback para nos alertar sobre o problema. Alguns usaram o recurso de captura de tela para nos enviar imagens dos popovers duplos em ação, para que pudéssemos visualizar claramente o problema.

Para investigar melhor, assistimos a gravações de jornadas de usuários para ver as reações deles. Essas sessões nos mostraram que os usuários fechavam uma (ou ambas) as janelas antes de continuarem suas jornadas.

As principais métricas também revelaram que os popovers duplos reduziram as respostas da pesquisa e o número de usuários que se envolveram com o guia. Sabíamos que o menor envolvimento com o guia acabaria deixando mais usuários com dificuldades para começar a usar a Hotjar.

Como uma empresa que tem como um de seus principais valores "Colocar nossos clientes no centro de tudo", isso definitivamente não é o que queremos.

💡Dica avançada: quer mais contexto sobre os comentários de um usuário individual? Com a Hotjar, você pode reduzir o zoom para encontrar gravações de sessões relacionadas a qualquer pesquisa individual ou resposta obtida através de feedback do usuário.

Amplie as gravações de sessões relevantes que revelam exatamente o que aconteceu antes de os usuários enviarem seus comentários—basta clicar no botão "Reproduzir gravação".

📝 O que aprendemos com isso

Não permita que suas equipes trabalhem em silos. Mesmo na Hotjar, onde a colaboração multifuncional faz parte de nossa cultura, erros como esse ainda acontecem.

É fácil mergulhar no caos caso as suas equipes (ou subequipes) de UX design e de marketing não estiverem se comunicando umas com as outras.

Quando esse problema foi resolvido, observamos um aumento de 10% no número de usuários que se converteram para um plano pago. Também recebemos mais feedback dos usuários por meio da pesquisa de popover ajustada, e descobrimos onde os usuários estão precisando de mais ajuda. Portanto, nossa segunda lição é que a solução de problemas como esse pode fazer uma enorme diferença, tanto na experiência do usuário quanto nos resultados comerciais.

7. Ocultar um ingrediente de configuração vital dos novos usuários durante a integração

A configuração da Hotjar não é difícil, mas ainda assim envolve tarefas que as pessoas sem muito conhecimento técnico não realizam com frequência. Por exemplo, os usuários precisam copiar o código de rastreamento da Hotjar e colá-lo em seu painel de análise, o que pode parecer um pouco complicado.

Otimizamos o fluxo de configuração que orienta os usuários durante o processo, para tornar as coisas mais fáceis e menos assustadoras para os nossos usuários. Ao longo de vários pulos evolucionários de design, fizemos melhorias em grande escala e micro-melhorias no fluxo de configuração, mas deixamos de lado uma questão crucial.

Embora tenhamos apresentado o código de rastreamento do usuário no fluxo de inscrição, juntamente com um botão bem visível de "copiar", não criamos uma maneira fácil para os usuários retornarem à página do código posteriormente. Agora, os novos usuários levam mais tempo para configurar a Hotjar , o que resulta numa maior necessidade de buscarem ajuda através da nossa equipe de suporte.

Feedback deixado por um dos muitos usuários que estão com dificuldades para localizar o seu código de rastreamento

🕵️‍Como descobrimos essa falha de UX

Ferramentas usadas:

  • Feedback

  • Interviews

  • Recordings

Ficamos sabendo disso por meio de uma combinação de entrevistas com usuários e respostas obtidas através de feedback. E, ao analisar as gravações, vimos usuários clicando freneticamente, tentando encontrar o código de instalação.

Também podemos observar vários tickets de suporte criados por pessoas que estavam tentando encontrar o código de rastreamento.

Para solucionar o problema, adicionamos novas formas altamente visíveis para os usuários encontrarem o código de rastreamento em seu dashboard. As gravações de sessões nos mostraram que os usuários frequentemente pesquisavam a página "Sites & Organizações" ao procurar o código, então o adicionamos a essa página— e pronto!

📝 O que aprendemos com isso

Esse fracasso nos lembrou de uma lição crítica de UX:

Dê às pessoas o que elas realmente desejam: atalhos.

Kaysie Garza
Líder de Design de Conteúdo da Hotjar

Isso é particularmente importante para uma tarefa do tipo copiar o código de rastreamento, que é absolutamente vital para a jornada do usuário com o nosso produto.

Além disso, lembre-se de que os usuários nem sempre navegarão pelo seu site ou produto da maneira que você espera que eles façam. Planeje todos os cenários para que eles possam concluir tarefas importantes de qualquer ponto de partida possível.

👉 Obtenha mais conselhos sobre como evitar erros comuns em nosso Guia de pesquisa de UX

Os dados corretos transformam suas falhas e problemas de UX em vitórias

Nós já fazemos isso há muito tempo, e a nossa equipe é formada por designers fantásticos, mas ainda assim cometemos erros. Isso mostra que a experiência do usuário é algo complicado, e você nem sempre acerta tudo logo na primeira tentativa.

A boa notícia é que erros como esses geralmente levam a um design de produto melhor a longo prazo. Desde que esteja aprendendo mais sobre os seus usuários, você pode aproveitar o pensamento de design centrado nas pessoas para promover melhorias contínuas.

E, ao usar um pacote de ferramentas como a Hotjar, você terá acesso a tudo o que precisa saber sobre as preferências, as necessidades e os comportamentos de seus usuários—e conseguirá transformar essas falhas em grandes vitórias.

Detecte problemas no seu site com mais rapidez

Conheça os problemas de UX (e as suas soluções) através de insights aprofundados obtidos a partir de pesquisas, feedbacks, gravações, entrevistas e muito mais, com as ferramentas da Hotjar.

Perguntas frequentes sobre falhas e problemas de UX