Por que você não deve usar lorem Ipsum em seu protótipo

Se você trabalha com UX, design e afins, deve estar familiarizado com o querido lorem ipsum — aquele texto que a gente usa para preencher espaço em um protótipo.

Curiosidade: se você achou que o lorem ipsum era apenas um texto sem sentido, achou errado! É um texto em latim de Cícero do ano 45 A.C.

É por que não é legal usar?

Porque te desvia de pensar no conteúdo

Pode ser tentador preencher tudo com “lorem Ipsum dolor sit amet” e pensar nas caixinhas de texto como pecinhas de Lego. Você monta o protótipo com wireframes, passa para o layout e fica tudo lindo, alinhado e organizado. Afinal, o lorem ipsum não tem restrições e você pode cortar como quiser. Mas assim você acaba limitando o conteúdo sem motivo. E se naquele menu enxuto e bonitinho não couber o rótulo mais adequado? E se a chamada explicativa sobre o produto precisa ser maior? E se ao escrever essa chamada o redator decide que ela deve ser quebrada em duas partes, mas isso não se encaixa no layout já aprovado pelo cliente?

Ao usar lorem ipsum de antemão, você obriga o conteúdo a se adaptar à forma, quando deveria fazer o contrário. O design deve ser uma forma de mostrar o conteúdo. A estrategista de conteúdo Ahava Leibtag defende a ideia do “content first”:

Precisamos começar a pressionar nossos clientes a pensar em seu conteúdo não apenas como uma commodity, mas como o ponto de partida, os tijolinhos de um site. Já é hora é parar de construir a casa sem saber quantos quartos ela vai ter. Por que você sabe como se chama uma coisa que é linda, mas sem função? Inútil. — Ava Leibtag

Porque vai confundir participantes de testes de usabilidade

Lorem ipsum é uma convenção do mundinho de design e afins, mas é só isso. Um participante de teste de usabilidade pode não sacar que aquilo é apenas um texto “fake” e tentar entender de verdade. Afinal, você pediu a ele para realizar tarefas em seu protótipo como se ele fosse um site real. E em um site real, as pessoas leem o conteúdo (ou pelo menos dão uma olhadinha para entender). Daí o lorem ipsum, que era só uma massa de texto para preencher espaço, gera ruído e atrapalha o entendimento.

Historinha baseada em casos reais que aconteceram com a gente no TESTR.

Mas o que fazer, se não temos o conteúdo real para colocar?

• Envolva o cliente e o resto do time no processo. Se é outra pessoa que cuida dos textos, trabalhem dupla para que antes de apresentar ou fazer um teste de usabilidade, você já tenha um conteúdo próximo do final.
• Crie um conteúdo próximo do real, principalmente em títulos, subtítulos e chamadas Você não precisa ser o Camões da redação para criar algo que as pessoas possam entender.
• Para textos longos, pegue conteúdo de sites similares — vale até o do concorrente!

E se tá muito difícil, que tal estudar um pouco sobre UX Writing?

O outro vilão: o placeholder

O placeholder é aquele quadradinho cortado que você coloca no protótipo para indicar que “aqui terá uma imagem”.

Ainda que não seja tão confuso quanto o lorem ipsum, o uso do placeholder também afeta bastante o entendimento do seu protótipo — em vez de dar uma olhada rápida e identificar onde estão as fotos de detalhes do produto, a pessoa vai ter que usar uma certa imaginação e ler as descrições do tipo “aqui vai uma imagem de casas bem bonitas para ilustrar que se trata de uma imobiliária” ou “miniaturas de detalhes do produto”.

E você não precisa parar para fazer um layout completo, se não tiver tempo para isso. Encontre algumas imagens que representem o que você quer passar e pronto. Uma imagem (ainda que emprestada do Google) vale mais que muitas descrições em texto, de verdade.

— -

No TESTR fazemos muitos testes em protótipos e temos algumas recomendações que podem ajudar em testes de usabilidade, principalmente remotos:

• 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.

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.

Leia mais sobre testes de usabilidade em protótipo

Leia mais sobre lorem ipsum, placeholders e afins:

Blog Marvel: Testing real content is better than lorem ipsum
The next web: Why designets should never use fake text
UX Booth — What is UX Writing

Originally published at TESTR Blog.