Teste de usabilidade em protótipo: como testar e o que você descobre em cada etapa

Você já deve ter ouvido falar que é importante testar a experiência do usuário (UX) em seu site, aplicativo ou produto. E você não precisa esperar ele estar pronto para testar. Pelo contrário: o quanto antes testar, melhor! Assim você descobre logo o que está errado e tem a chance de corrigir – antes de perder tempo e dinheiro.´


Ao longo do desenvolvimento de um projeto, a quantidade de mudanças diminui, mas o custo das mudanças aumenta. No começo, você tem um protótipo que montou rapidinho – pode ser algo no papel, que não custa quase nada (apenas o seu tempo para desenhá-lo). Ao final, você já envolveu designer, desenvolvedor, custos de servidor, gerente de projeto… e as mudanças pesam no bolso. Se é para errar, erre no começo.

Para cada $1 gasto para resolver um problema durante a fase de design, $10 seriam gastos para resolver o mesmo problema durante o desenvolvimento, e $100 ou mais após o lançamento.

– PRESSMAN, Robert. Software Engineering: A Practitioner’s Approach, 1982.

Existem protótipos e protótipos. O que varia é a fidelidade: um protótipo de baixa fidelidade é mais próximo de um rascunho, menos refinado e mais propenso a grandes mudanças. Um protótipo de alta fidelidade já pode conter layout, conteúdo final (ou próximo do final) e mais detalhes. Se for um protótipo de um site ou aplicativo, a versão de alta fidelidade já tem links e interações definidas.

Veja exemplos de protótipos de diferentes estágios (em inglês)


Dá para testar um protótipo ainda em fase bem inicial?

SIM! Você não precisa ser o mestre do design / desenvolvimento para prototipar uma versão palpável do seu produto. Use o que você tiver à disposição! Se é um aplicativo ou um site, você pode desenhar as telas no papel e pedir para as pessoas usarem a imaginação. Se você quer prototipar um produto, como um novo celular, vale usar papelão, EVA, massinha de modelar. O importante é tirar a ideia da cabeça e colocar no mundo de alguma forma. Muitas vezes só o fato de você criar um protótipo e olhar para ele já te mostra como a sua ideia pode ser melhorada.



Exemplos de teste de protótipos

E como testar? Segue uma versão bem resumida:

  1. Crie o protótipo
  2. Encontre 3 a 5 pessoas que têm o perfil do seu público-alvo; peça para usarem o protótipo e observe
  3. Volte para o escritório, reflita sobre as descobertas
  4. Melhore o seu protótipo
  5. Teste de novo
  6. Repita até não aguentar mais estar satisfeito e confiante com o resultado.

É importante explicar pra pessoa que se trata de um protótipo – e pedir para que ela tenha um pouquinho de imaginação. A introdução que costumamos utilizar aqui no TESTR é mais ou menos assim:

Hoje você vai nos ajudar a testar um protótipo, que é um site em desenvolvimento. Ele não está pronto ainda, então pode ser que nem todos os links funcionem perfeitamente. Mas por isso mesmo queremos a sua opinião: você vai nos ajudar a descobrir como o site pode ser melhorado antes de ser lançado.

Vantagem de testar com um protótipo bem inicial: ao levar para as pessoas algo “inacabado”, você estimula a colaboração. É bem mais fácil dar opinião em alguns desenhos no papel sulfite do que em um layout maravilhoso no celular.
Desvantagem: exige um pouco mais de imaginação das pessoas. Mesmo a gente explicando que não tá pronto e ainda vai ter layout, já ouvimos muitas vezes o participante ao final do teste reclamar que achou “meio feio e cinza”.


E se eu eu quiser testar já com interação, um protótipo navegável?

Ótimo! Existem muitas ferramentas para te ajudar com isso e algumas até gratuitas. Aqui usamos o Axure, mas existem muitas outras (compare aqui). Criando um protótipo navegável você consegue testar mais coisas: a navegação entre uma página e outra, a percepção sobre o layout e as transições de página e até o entendimento de animações, se for o caso. E além do teste presencial, você pode experimentar com um teste remoto e não moderado.



Exemplo de protótipo navegável criado no axure
Um exemplo de protótipo navegável que criamos para um teste do TESTR, usando o Axure. Na hora de testar, é bom tirar a lista de páginas.

Vantagem de testar com um protótipo navegável: Mais próximo do real, o participante consegue entender melhor como funciona e levar mais a sério.
Desvantagem: Vai ter dar um pouco mais de trabalho para fazer – mas vai ser muito útil, de qualquer forma. ;]

Dicas para criar protótipos para testes de usabilidade:

  • Se puder, evite um wireframe com 50 tons de cinza. Coloque um pouco de cor, pelo menos quando for relevante para indicar hierarquia e pontos de atenção na página.
  • Evite Lorem Ipsum. Cuidado com texto que não faz sentido ou valores de produto que mudam de uma página para outra. Se você pede que as pessoas simulem uma situação real, é bom que pareça real, mesmo. O mesmo vale para imagens: troque o placeholder por uma imagem de verdade. Não precisa ser a imagem final, toda trabalhada no photoshop – o importante é passar a mensagem.
  • Em testes desktop, se não conseguir fazer todos os links funcionando, marque como se fossem área de clique. Se não o teste pode virar uma gincana para encontrar a “mãozinha do mouse”.
  • Para não deixar a pessoa com links sem saída, você pode sinalizar com uma mensagem quando a pessoa acessar algo que não estava pronto ainda.



GIF mostrando um protótipo navegável com mensagem explicativa

Ah, importante: mesmo sendo um protótipo mais próximo do produto final, vale o disclaimer inicial explicando ao participante que se trata de um protótipo. Afinal, você não vai desenhar todas as telas do seu site, né? E é importante prever o que fazer caso a pessoa insista em acessar aquele único link que não está pronto. Veja mais sobre isso em nosso case de teste de protótipo com a Saraiva.


Dá para testar uma ideia, quando ainda não tenho protótipo nenhum?

Também pode! Em pesquisa de mercado, existe o teste de conceito. Você descreve o seu produto / ideia e apresenta para as pessoas, para ter feedback.

Por exemplo: imagine que eu quero desenvolver um aplicativo de empregos para garçons. Já fiz um benchmark de aplicativos e sites da área e descobri um nicho que pode ser explorado. Mas ainda não sei se as pessoas querem um aplicativo como este.

Como testar: você tem que descobrir se o seu problema é real e se a sua ideia vai resolver esse problema. Para isso, encontre pessoas com o perfil que você definiu: garçons. Converse para entender como é um processo de mudança de emprego. Como encontram vagas? Como chegaram ao emprego atual? Ao final, apresente o seu conceito. Pode ser por escrito mesmo, algo mais ou menos assim:

Para pessoas que estão procurando trabalho em restaurantes, um aplicativo que mostra as ofertas em um raio de 10Km de casa.

O importante é deixar claro que não está pronto e você quer a ajuda da pessoa para montar o melhor produto possível. E evite perguntar “Você usaria?”, diretamente. A tendência das pessoas é responder sempre “sim”, para te agradar. Em vez disso, pergunte “Em que situação você usaria?” ou “Me conte uma situação em que este aplicativo teria sido útil para você”.

Este é um teste que pode ser feito com entrevistas individuais, mas funciona bem com grupos de discussão também.


E como eu decido qual é o melhor momento de testar?

Em um mundo ideal, você testaria sempre, em todas as etapas. Mas cada etapa traz descobertas diferentes e você pode decidir o momento ideal de acordo com o que você quer investigar. A forma de testar também varia de acordo com o tipo de protótipo que você tem – como mostramos na tabela abaixo.


Como testar protótipos em cada etapa e o que você descobre

Dica: de acordo com as habilidade do seu time, descubra qual é melhor protótipo que vocês conseguem fazer sem gastar muito tempo e dinheiro. Se você ainda não tem uma equipe de desenvolvimento, é bem útil testar antes de começar a programar – vai te economizar um bom orçamento. Mas se seu time é composto de desenvolvedores, vocês já podem criar um protótipo com código que será aproveitado no final – desde que não fiquem apegados e estejam dispostos a refazer tudo depois das descobertas do teste. ;]


Baixe o material completo

Este post foi criado com base em uma palestra na Globant, em maio de 2017. Se você curtiu, pode baixar o material completo.

BAIXE O MATERIAL COMPLETO

Para ler mais:
Case apresentando no Interaction South America 2016: teste de usabilidade remoto com protótipo – a nossa experiência com a Saraiva
Jeff Sauro @ MeasuringU – Does the fidelity of a prototype affect results?
Blog Marvel App – Why testing with real content is better than Lorem Ipsum
Aaron Brako: Prototyping
Vídeo: The ROI of User Experience, por Susan Weinschenk

Imagem do topo: Aaron Brako.


Also published on Medium.