Você está na página 1de 248

Machine Translated by Google

Machine Translated by Google

Não me faça pensar, revisitado


Uma abordagem de bom senso para a usabilidade da Web

Steve Krug
Machine Translated by Google

Não me faça pensar, revisitado


Uma abordagem de bom senso para a usabilidade da Web

Direitos autorais © 2014 Steve Krug

Novos pilotos
www.newriders.com Para
relatar erros, envie uma nota para errata@peachpit.com New Riders é uma
marca da Peachpit, uma divisão da Pearson Educaon.

Editor: Elisabeth Bayle


Editor do projeto: Nancy Davis
Editora de Produção: Lisa Brazieal
Editor de Texto: Barbara Flanagan
Design de Interiores e Composição: Romney Lange Illustraons
de Mark Matcho e Mimi He Farnham Fontes fornecidas por
The Font Bureau, Inc. (www.fontbureau.com)

Aviso de Direitos

Todos os direitos reservados. Nenhuma parte deste livro pode ser reproduzida ou transmitida
de qualquer forma por qualquer meio, eletrônico, mecânico, fotocópia, gravação ou outro, sem
a permissão prévia por escrito do editor. Para obter informações sobre a permissão do gen
para reimpressões e trechos, entre em contato com permissions@peachpit.com.

Aviso de Responsabilidade

As informações contidas neste livro são distribuídas “como estão”, sem garantia. Embora
todas as precauções tenham sido tomadas na preparação do livro, nem o autor nem a Peachpit
terão qualquer responsabilidade perante qualquer pessoa ou entidade com relação a qualquer
perda ou dano causado ou alegadamente causado direta ou indiretamente pelas instruções
contidas neste livro ou pelos produtos de software e hardware de computador nele descritos.

Marcas registradas

Não é cirurgia de foguete™ é uma marca registrada de Steve Krug.


Muitas das designações usadas por fabricantes e vendedores para distinguir seus produtos
são reivindicadas como marcas registradas. Onde essas designações
Machine Translated by Google

aparecem neste livro, e a Peachpit estava ciente de uma reivindicação de marca


registrada, as designações aparecem conforme solicitado pelo proprietário da marca
registrada. Todos os outros nomes de produtos e serviços identificados ao longo deste livro
são usados apenas de forma editorial e para o benefício de tais empresas, sem intenção
de violação da marca registrada. Nenhum uso desse tipo, ou o uso de qualquer nome
comercial, tem a intenção de transmitir endosso ou outra afiliação a este livro.

ISBN-13: 978-0-321-96551-6
ISBN-10: 0-321-96551-5

987654321

Impresso e encadernado nos Estados Unidos da América


Machine Translated by Google

Primeira edição

Ao meu pai, que sempre quis que eu escrevesse um livro,

Minha mãe, que sempre me fez sentir que podia,

Melanie, que se casou comigo - o maior golpe de sorte da minha vida,

e meu filho, Harry, que com certeza escreverá livros muito mais cerveja do que
este sempre que quiser.

Segunda edição

Ao meu irmão mais velho, Phil, que foi um mensch a vida inteira.

Terceira edição

A todas as pessoas — de todas as partes do mundo — que foram tão gentis


com este livro por quatorze anos. Suas amáveis palavras — pessoalmente, por e-
mail e em seus blogs — foram uma das grandes alegrias da minha vida.

Especialmente a mulher que disse isso a fez rir tanto que o leite saiu de seu nariz.
Machine Translated by Google

Conteúdo

PREFÁCIO Sobre esta edição

INTRODUÇÃO Leia-me primeiro

Limpeza de garganta e isenções de responsabilidade

PRINCÍPIOS ORIENTADORES

CAPÍTULO 1 Não me faça pensar!

A Primeira Lei de Usabilidade de Krug

CAPÍTULO 2 Como realmente usamos a Web

Digitalizando, sasficing e atrapalhando através

CAPÍTULO 3 Design de Outdoor 101

Projetando para escanear, não ler

CAPÍTULO 4 Animal, vegetal ou mineral?

Por que os usuários gostam de escolhas sem sentido

CAPÍTULO 5 Omitir palavras

A arte de não torcer pela Web

COISAS QUE VOCÊ PRECISA FAZER CERTO

CAPÍTULO 6 Placas de rua e migalhas de pão

Projetando a navegação

CAPÍTULO 7 A Teoria do Big Bang do Web Design

A importância de geng pessoas com o pé direito

CERTIFIQUE-SE DE QUE VOCÊ ACERTOU

CAPÍTULO 8 “O agricultor e o vaqueiro devem ser amigos”


Machine Translated by Google

Por que a maioria dos argumentos sobre usabilidade são um desperdício para mim e
como evitá-los

CAPÍTULO 9 Teste de usabilidade com 10 centavos por dia

Mantendo o tesng simples - para que você faça o suficiente

PREOCUPAÇÕES MAIORES E INFLUÊNCIAS EXTERNAS

CAPÍTULO 10 Mobile: não é mais apenas uma cidade no Alabama

Bem-vindo ao século 21. Você pode sentir uma leve sensação de


vergo

CAPÍTULO 11 Usabilidade como cortesia comum

Por que seu site deve ser um mensch

CAPÍTULO 12 Acessibilidade e você

Quando você pensa que acabou, um gato passa flutuando com torradas amarradas
nas costas

CAPÍTULO 13 Guia para os perplexos

Fazendo a usabilidade acontecer onde você mora

Agradecimentos

Índice
Machine Translated by Google

Prefácio: Sobre esta edição

As pessoas vêm e vão tão rápido aqui!

—DOROTHY GALE (JUDY GARLAND) EM O MÁGICO DE OZ (1939)

Eu escrevi a primeira edição de Don't Make Me Think em 2000.

Em 2002, comecei a receber alguns e-mails por ano de leitores perguntando


(muito educadamente) se eu tinha pensado em atualizá-lo. Não reclamando; Apenas
Tentando Ser útil. “Muitos dos exemplos estão desatualizados” era o comentário habitual.
Minha resposta padrão foi apontar que desde que o escrevi bem ao meu redor a bolha
da Internet estourou, muitos dos sites que usei como exemplos já haviam desaparecido
quando foi publicado. Mas não achei que isso tornasse os exemplos menos claros.

Finalmente, em 2006, tive um forte incentivo pessoal para atualizá-lo.1 Mas ao


reler para ver o que deveria mudar, continuei pensando: “Isso tudo ainda é verdade”.
Eu realmente não consegui encontrar muita coisa que eu achasse que deveria ser
mudada.

1 Metade da realeza do livro estava indo para uma empresa que não existia mais, e fazer uma nova edição
significava um novo contrato – e o dobro da realeza – para mim.

Se fosse uma nova edição, porém, algo tinha que ser diferente. Então eu adicionei
três capítulos que eu não tinha para terminar em 2000, apertei o botão da soneca e
alegremente puxei as capas sobre minha cabeça por mais sete
anos.
Machine Translated by Google

2000

2006

(Torcer é muito difícil para mim, e sempre fico feliz em ter uma razão para não fazê-lo. Dê-me um bom
e velho canal sobre torção qualquer dia.)

Então, por que agora, finalmente, uma nova edição? Duas razões.
Machine Translated by Google

#1. Vamos encarar: é velho

Não há dúvida sobre isso neste momento: parece datado. Afinal, tem treze anos, o que
equivale a cem anos na Internet. (Viu? Ninguém mais diz coisas como “na Internet eu”.)

A maioria das páginas da Web que usei como exemplo, como o site da campanha do
senador Orrin Hatch para as eleições de 2000, parecem realmente antiquadas agora.

Os sites hoje em dia tendem a parecer muito mais sofisticados, como você poderia esperar.

www.orrinhatch.com 1999
Machine Translated by Google

www.orrinhatch.com 2012

Recentemente, comecei a me preocupar que o livro finalmente chegaria a um


ponto em que parecia tão datado que deixaria de ser eficaz. Eu sei que ainda
não aconteceu porque ainda está vendendo de forma constante (graças aos
céus), sem qualquer sinal de desaceleração. Até se tornou leitura
obrigatória em muitos cursos, algo que eu nunca esperava.

Novos leitores de todo o mundo continuam a twittar sobre coisas que


aprenderam com ele.
Machine Translated by Google

Ainda continuo ouvindo esta história: “Dei para meu chefe, esperando que ele
finalmente entendesse do que estou falando. Ele realmente leu e comprou para
toda a nossa equipe/departamento/empresa!” (Eu amo essa história.)

As pessoas continuam me dizendo que conseguiram seu emprego graças


em parte à leitura ou que isso influenciou sua escolha de carreira.2

2 Estou muito satisfeito e empolgado, mas tenho que admitir que sempre há uma parte de mim que está
pensando “Caramba! Espero que ela não tenha sido feita para ser uma neurocirurgiã. O que eu fiz?"

Mas eu sei que, eventualmente, o efeito do envelhecimento vai impedir as pessoas de


lê-lo, pela mesma razão que foi tão difícil fazer meu filho assistir filmes em preto e branco
quando ele era jovem, não importa o quão bom eles
nós estamos.

Claramente, sou eu para novos exemplos.

#2. O mundo mudou


Dizer que os computadores e a Internet e a maneira como os usamos mudaram muito
ultimamente é punir levemente. Muito suavemente.
Machine Translated by Google

A paisagem mudou de três maneiras:


A tecnologia colocou as mãos em alguns esteróides. Em 2000,
usávamos a Web em telas relativamente grandes, com mouse ou touchpad
e teclado. E estávamos cantando, muitas vezes em uma mesa, quando o fizemos.
Agora usamos todos os computadores que carregamos comigo, com
câmeras digitais e de vídeo, mapas mágicos que sabem exatamente onde
estamos, e nossas bibliotecas inteiras de livros e músicas embutidas. E
estão sempre conectados à Internet. Ah, e eles também são telefones.
Heck, eu posso usar meu "telefone" para
Machine Translated by Google

...faça uma reserva em um restaurante em segundos


Machine Translated by Google

...ajuste o calor da minha casa de qualquer lugar


Machine Translated by Google

...ou depositar um cheque sem ir a um caixa eletrônico

Não é um carro voador (o que, pensando bem, nos prometeram que teríamos agora),
mas é uma presa impressionante.

A própria Web continuou melhorando. Mesmo quando estou usando meu


computador de mesa para fazer todas as coisas que sempre fiz na Web (comprar
coisas, fazer planos de viagem, me conectar com amigos, ler as notícias e vender
apostas em bares), os sites que uso tendem a ser muito mais poderoso e útil do que
seus antecessores.

Passamos a esperar coisas como autossugestão e autocorreção, e ficamos


aborrecidos quando não podemos pagar um bilhete de estacionamento ou renovar uma
carteira de motorista online.
Machine Translated by Google

A usabilidade se tornou mainstream. Em 2000, poucas pessoas


entendiam a importância da usabilidade.

Agora, graças em grande parte a Steve Jobs (e Jonathan Ive), quase todos
entendem que é importante, mesmo que ainda não tenham certeza do que é. Só
que agora eles costumam chamar de User Experience Design (UXD ou apenas UX), um
termo genérico para qualquer avidade ou profissão que contribua para uma experiência
de cerveja para o usuário.

É ótimo que agora haja muito mais ênfase no design para o usuário, mas todas as
novas descrições de trabalho, subespecialidades e ferramentas que surgiram com
essa evolução deixaram muitas pessoas confusas sobre o que deveriam realmente
fazer a respeito.

Falarei sobre todas essas três mudanças ao longo do livro.

Não me entenda mal...


Esta edição tem novos exemplos, alguns novos princípios e algumas coisas que aprendi ao
longo do caminho, mas ainda é o mesmo livro, com o mesmo propósito: ainda é um livro sobre
como projetar sites ótimos e úteis.

E também é um livro sobre como projetar qualquer coisa com a qual as pessoas precisem
interagir, seja um forno de micro-ondas, um aplicativo móvel ou um caixa eletrônico.

Os princípios básicos são os mesmos, mesmo que o cenário tenha mudado, porque
usabilidade é sobre pessoas e como elas entendem e usam as coisas, não sobre tecnologia. E
enquanto a tecnologia muda rapidamente, as pessoas
3
mudar muito lentamente.

3 Há um maravilhoso vídeo norueguês (com sutilezas) sobre isso que mostra um monge geng ajudando
enquanto ele luta para usar o novo “livro”. (Procure por “helpdesk medieval” no YouTube.)
Machine Translated by Google

Ou como Jakob Nielsen tão bem colocou:

A capacidade do cérebro humano não muda de um ano para o outro, então os


insights do estudo do comportamento humano têm uma vida útil muito longa. O que
era difícil para os usuários vinte anos atrás continua sendo difícil hoje.

Espero que gostem da nova edição. E não se esqueça de acenar daqui a alguns anos quando
você passar por mim em seu carro voador.
STEVE KRUG
NOVEMBRO DE 2013
Machine Translated by Google

Introdução: Leia-me primeiro

LIMPEZA DE GARGANTA E ISENÇÃO DE RESPONSABILIDADE

Não posso dizer nada que você já não saiba. Mas gostaria de esclarecer algumas coisas.

— JOE FERRARA, UM AMIGO MEU DE ESCOLA

Eu tenho um ótimo trabalho. Sou consultor de usabilidade. Aqui está o que eu faço:

As pessoas (“clientes”) me enviam algo em que estão trabalhando.

Podem ser designs para um novo site que eles estão construindo, ou a URL de um site que
eles estão redesenhando, ou um protótipo de um aplicativo.
Machine Translated by Google

Eu tento usar o que eles me enviam, fazendo as coisas que seus usuários precisam
ou querem fazer com isso. Eu observo os lugares onde as pessoas provavelmente
ficarão presas e as coisas que eu acho que as confundirão (uma “revisão de
usabilidade especializada”).
Às vezes, faço com que outras pessoas tentem usá-lo enquanto assisto para
ver onde eles ficam presos e confusos (“tesng de usabilidade”).
Machine Translated by Google

Tenho uma reunião com a equipe do cliente para descrever os problemas que
encontrei que provavelmente causarão sofrimento aos usuários (“problemas de
usabilidade”) e ajudá-los a decidir quais são os mais importantes a serem corrigidos e a
melhor forma de corrigi-los.

Algumas vezes trabalhamos por telefone...


Machine Translated by Google

...e alguns pessoalmente

Eu costumava escrever o que chamava de “grande relatório de buzina” detalhando


minhas descobertas, mas finalmente percebi que não valia a pena o esforço e o esforço.
Uma apresentação ao vivo permite que as pessoas me façam perguntas e expressem
suas preocupações – algo que um relatório escrito não faz. E para equipes que fazem
desenvolvimento Agile ou Lean, não há eu para relatórios escritos
de qualquer forma.

Eles me pagam.

Sendo um consultor, posso trabalhar em projetos interessantes com muitas pessoas legais e
inteligentes. Trabalho em casa a maior parte de mim e não tenho que me sentar em reuniões
entorpecentes todos os dias ou lidar com as políticas do escritório. Eu posso dizer o que penso,
e as pessoas geralmente apreciam isso. E sou bem pago.

Além de tudo isso, recebo muito trabalho sasfacon, porque quando terminamos, as
coisas que eles estão construindo são quase sempre muito mais do que quando
começamos.1

1 Quase sempre. Mesmo quando as pessoas sabem sobre problemas de usabilidade, nem sempre podem corrigi-los
completamente, como explicarei no Capítulo 9.

A má notícia: você provavelmente não tem um profissional de usabilidade


Quase toda equipe de desenvolvimento poderia usar alguém como eu para ajudá-los a construir
usabilidade em seus produtos. Infelizmente, a grande maioria deles não pode se dar ao luxo de
contratar um profissional de usabilidade.
Machine Translated by Google

E mesmo que pudessem, não há o suficiente para todos. Na última contagem, havia
muitos bilhões de sites da Web (e muitos bilhões de aplicativos apenas para o
iPhone2 ) e apenas cerca de 10.000 consultores de usabilidade em todo o mundo. Você
faz as contas.

2 Não sei ao certo por que a Apple se gaba disso. Ter milhares de bons aplicativos para uma plataforma é uma coisa
muito boa. Ter milhões de aplicativos medíocres significa que é muito difícil encontrar o bom
uns.

E mesmo que você tenha um profissional em sua equipe, essa pessoa não pode
olhar para tudo o que a equipe produz.
Nos últimos anos, tornar as coisas mais úteis tornou-se responsabilidade de
quase todos. Designers visuais e desenvolvedores agora se encontram fazendo coisas
como design de interação (decidindo o que acontece a seguir quando o usuário clica, toca
ou desliza) e arquitetura de informações (descobrindo como tudo deve ser organizado).

Escrevi este livro principalmente para pessoas que não podem contratar (ou
alugar) alguém como eu.

Conhecer alguns princípios de usabilidade irá ajudá-lo a ver os problemas por si mesmo
— e a evitar que você os crie em primeiro lugar.
Sem dúvida: se puder, contrate alguém como eu. Mas se você não puder, espero que
este livro permita que você faça isso sozinho (no seu copioso me poupar).

A boa notícia: não é cirurgia de foguete™


Felizmente, muito do que faço é apenas senso comum, e qualquer pessoa com
algum interesse pode aprender a fazê-lo.

Como muito senso comum, no entanto, não é necessariamente óbvio até que alguém
tenha apontado para você.3

3 ...o que é uma das razões pelas quais meu negócio de consultoria se chama Senso Comum Avançado. “Não é
uma cirurgia de foguete” é meu moo corporativo.

Eu gasto muito do meu eu contando às pessoas coisas que elas já sabem, então não se
surpreenda se você se pegar pensando muito “eu sabia disso” nas próximas páginas.
Machine Translated by Google

© 2013. The New Yorker Collecon de cartoonbank.com Todos os direitos reservados.

É um livro fino

Mais boas notícias: trabalhei duro para manter este livro curto — espero que seja curto o
suficiente para que você possa lê-lo em uma longa viagem de avião. Eu fiz isso por dois motivos:

Se for curto, é mais provável que seja realmente usado.4 Estou torcendo pelas
pessoas que estão nas trincheiras - os designers, os desenvolvedores, os produtores
do site, os gerentes de projeto, o pessoal de marketing e os
Machine Translated by Google

pessoas que assinam os cheques - e para as bandas de um homem só que


estão fazendo tudo sozinhas.

4 Há um bom princípio de usabilidade bem aqui: se algo requer um grande investimento de mim – ou
parece que vai – é menos provável que seja usado.

Usabilidade não é o trabalho da sua vida, e você não tem a mim para um
longo livro.

Você não precisa saber tudo. Como em qualquer campo, há muito que você
pode aprender sobre usabilidade. Mas, a menos que você seja um profissional
de usabilidade, há um limite para o quanto é útil para você aprender.5

5 Sempre gostei da passagem de A Study in Scarlet em que o Dr. Watson fica chocado ao saber que
Sherlock Holmes não sabe que a Terra gira em torno do Sol. Dada a capacidade finita do cérebro
humano, explica Holmes, ele não pode se dar ao luxo de ter fatos inúteis eliminando o útil.
uns:

“Que diabos é isso para mim? Você diz que damos a volta ao sol. Se dermos a volta na lua, não faria
um centavo de diferença para mim ou para o meu trabalho.”

Acho que as contribuições mais valiosas que faço para cada projeto sempre vêm de
manter apenas alguns princípios-chave de usabilidade em mente. Eu acho que há muito
mais influência para a maioria das pessoas na compreensão desses princípios do que em
outra lista de coisas a fazer e não fazer. Tentei resumir as poucas coisas que acho que
todos os envolvidos em design deveriam saber sobre usabilidade.

Não está presente em mim da foto

Para que você não desperdice seu tempo procurando por eles, aqui estão algumas
coisas que você não encontrará neste livro: Regras de usabilidade rígidas e rápidas.
Estou nisso há muito tempo, tempo suficiente para saber que não existe uma
resposta “certa” para a maioria das perguntas de usabilidade. O design é um
processo complicado e a resposta real para a maioria das perguntas que as
pessoas me fazem é “Depende”. Mas acho que existem alguns princípios
orientadores úteis que sempre ajuda a ter em mente, e é isso que estou tentando
transmitir.
Predicons sobre o futuro da tecnologia e da Web. Honestamente, seu palpite
é tão bom quanto o meu. A única coisa de que tenho certeza é que (a) a maioria
dos predicons que ouço estão quase certamente errados, e (b) as coisas que se
tornarão importantes virão como uma surpresa, mesmo que em retrospectiva
parecem perfeitamente óbvios.
Machine Translated by Google

Falar mal de sites e aplicativos mal projetados. Se você gosta de pessoas zombando
de coisas com falhas óbvias, você está lendo o livro errado. Projetar, construir e manter
um ótimo site ou aplicativo não é fácil. É como o golfe: um punhado de maneiras de
colocar a bola no buraco, um milhão de maneiras de não fazê-lo. Quem acertar nem
pela metade tem minha admiração.

Como resultado, você descobrirá que os exemplos que uso tendem a ser de
produtos excelentes com pequenas falhas. Eu acho que você pode aprender mais
olhando para os bons projetos do que os ruins.

Agora com Celular!

Um dos dilemas que enfrentei ao atualizar este livro foi que sempre foi um livro sobre como
projetar sites da Web utilizáveis. Embora os princípios se apliquem ao design de qualquer
coisa com a qual as pessoas interajam (incluindo coisas como urnas eletrônicas e cabines
de vong, e até mesmo apresentações em PowerPoint), seu foco estava claramente no design
da Web, e todos os exemplos eram de sites. Até recentemente, isso é o que a maioria das
pessoas estava trabalhando
sobre.

Mas agora há muitas pessoas projetando aplicativos móveis, e mesmo as pessoas que
trabalham em sites da Web precisam criar versões deles que funcionem bem em dispositivos
móveis. Eu sei que eles estão muito interessados em como tudo isso se aplica a eles.

Então fiz três coisas:


Exemplos móveis incluídos onde quer que fizesse sentido
Adicionado um novo capítulo sobre alguns problemas de usabilidade específicos para dispositivos móveis

E o mais importante: Adicionado “and Mobile” ao sutil na capa

E, como você verá, em alguns lugares onde isso tornou as coisas mais claras, em vez de
“site”, escrevi “site ou aplicativo móvel”. Na maioria dos casos, porém, usei o texto centrado
na Web para evitar que as coisas se tornassem complicadas e distraíssem.

Uma última coisa, antes de começarmos

Uma coisa crucial, na verdade: minha definição de usabilidade.


Machine Translated by Google

Você encontrará muitas definições diferentes de usabilidade, muitas vezes dividindo-as


em atributos como

Útil: Faz algo que as pessoas precisam fazer?

Aprendizagem: As pessoas podem descobrir como usá-lo?


Memorável: eles têm que reaprender cada vez que o usam?
Effecve: Faz o trabalho?
Eficiente: Faz isso com uma quantidade razoável de mim e esforço?

Desejável: As pessoas querem? e


recentemente até mesmo Delighul: É

agradável ou até divertido usá-lo?


Eu vou falar sobre isso mais tarde. Mas para mim, a parte importante da definição é presa
simples. Se algo for utilizável - seja um site da Web, um controle remoto ou uma porta
giratória - isso significa que

Uma pessoa de habilidade e experiência média (ou mesmo abaixo da média) pode
descobrir como usar a coisa para realizar algo sem que seja mais problemático do
que vale a pena.

Aceite minha palavra: é realmente tão simples.


Espero que este livro o ajude a construir produtos de cerveja e – se isso permitir que você
pule algumas das discussões intermináveis sobre design – talvez até chegue em casa para
jantar de vez em quando.
Machine Translated by Google

Princípios Orientadores
Machine Translated by Google

Capítulo 1. Não me faça pensar!

A PRIMEIRA LEI DE USABILIDADE DE KRUG

Michael, por que as cortinas estão abertas?

—KAY CORLEONE NO PADRINHO, PARTE II

As pessoas sempre me perguntam:

“Qual é a coisa mais importante que devo fazer se quiser garantir que meu site ou
aplicativo seja fácil de usar?”

A resposta é simples. Não é "Nada importante deve estar a mais de dois cliques de distância" ou
"Fale o idioma do usuário" ou "Seja consistente".
Seu...

“Não me faça pensar!”

Desde que me lembro, venho dizendo às pessoas que esta é minha primeira lei de usabilidade.

É o princípio primordial - o ulmate e disjuntor ao decidir se um projeto funciona ou não. Se


você tem espaço em sua cabeça para apenas uma regra de usabilidade, faça desta.

Por exemplo, isso significa que, tanto quanto é humanamente possível, quando eu olho para
uma página da Web, ela deve ser auto-evidente. Óbvio. Autoexplicativo.

Eu deveria ser capaz de “pegar” – o que é e como usá-lo – sem gastar nenhum esforço
pensando nisso.
Quão evidentes estamos falando?
Bem, evidente o suficiente, por exemplo, que seu vizinho, que não tem interesse no assunto do
seu site e que mal sabe como usar o botão Voltar, pode olhar para sua página inicial e dizer: “Ah,
é uma _____." (Com alguma sorte, ela dirá: “Ah, é um Pense desta maneira: quando estou
olhando para uma página que não me_____.
faz pensar,
Excelente!"
todos osMas
balões
issode
é outro
pensamento
assunto.)
sobre minha

cabeça dizem coisas como “OK, há o _____. E isso é um E há a coisa que eu quero.

_____.
Machine Translated by Google

Sem pensar

Mas quando estou olhando para uma página que me faz pensar, todos os balões de pensamento sobre
minha cabeça têm pontos de interrogação.

Pensamento

Quando você está criando um site, seu trabalho é se livrar dos pontos de interrogação.
Machine Translated by Google

Coisas que nos fazem pensar

Todos os tipos de coisas em uma página da Web podem nos fazer parar e pensar desnecessariamente.
Tome nomes, por exemplo. Os culpados típicos são nomes bonitos ou inteligentes, nomes induzidos por
markeng, nomes específicos da empresa e nomes técnicos desconhecidos.

Por exemplo, suponha que um amigo me diga que a XYZ Corp está procurando contratar alguém com as
minhas qualificações exatas, então eu vou ao site deles. À medida que procuro na página algo para clicar, o
nome que eles escolheram para o segundo da lista de empregos faz a diferença.

Observe que essas coisas estão sempre em um continuum em algum lugar entre “Óbvio para
todos” e “Verdadeiramente obscuro”, e sempre há compensações envolvidas.

Por exemplo, “Jobs” pode soar muito indigno para a XYZ Corp, ou eles podem estar presos em “Job-o-
Rama” por causa de algumas políticas internas complicadas ou porque é assim que sempre foi chamado
1
no boletim de notícias da empresa. O ponto principal é que as compensações geralmente devem ser Meu
mais distorcidas na direção do “óbvio” do que pensamos.

1 Quase sempre há uma razão plausível – e uma boa intenção, ainda que equivocada – por trás de cada falha
de usabilidade.

Outra fonte desnecessária de pontos de interrogação na cabeça das pessoas são os links e botões que
não são obviamente clicáveis. Como usuário, eu nunca deveria ter que dedicar um milésimo de segundo
pensando se as coisas são clicáveis ou não.
Machine Translated by Google

Você pode estar pensando: “Bem, isso realmente não importa muito. Se você clicar ou
tocar nele e nada acontecer, qual é o problema?”
O ponto é que cada ponto de interrogação aumenta nossa carga de trabalho
cognitiva, desviando nosso foco da tarefa em mãos. As distrações podem ser pequenas,
mas elas se somam, especialmente se for algo que fazemos todo o tempo, como
decidir no que clicar.

E como regra, as pessoas não gostam de se perguntar como fazer as coisas. Eles
gostam de quebra-cabeças em seu lugar – quando querem se divertir, se divertir ou
desafiar – mas não quando estão tentando descobrir o que sua lavanderia fecha. O fato
de as pessoas que construíram o site não se importarem o suficiente para tornar as coisas
óbvias – e fáceis – pode minar nossa confiança no site e na organização por trás dele.

Outro exemplo de uma tarefa comum: reservar um voo.


Machine Translated by Google

Com certeza, a maior parte desse “chaer mental” ocorre em um fracon de segundo, mas
você pode ver que é um processo de presa barulhento, com muitos pontos de
interrogação. E então há um erro intrigante no final.
Outro site apenas pega o que eu digito e me dá escolhas que fazem sentido, então é
difícil dar errado.
Machine Translated by Google

Sem marcas de interrogação. Sem chaer mental. E sem erros.


Eu poderia listar dezenas de coisas que os usuários não deveriam gastar seu tempo
pensando, como
Onde estou?

Por onde devo começar?


Onde eles colocaram _____?
Quais são as coisas mais importantes nesta página?

Por que chamaram assim?


Isso é um anúncio ou parte do site?
Mas a última coisa que você precisa é de outra lista de verificação para adicionar à sua pilha
de listas de verificação de design. A coisa mais importante que você pode fazer é entender o
princípio básico de eliminar os pontos de interrogação. Ao fazer isso, você começará a perceber
todas as coisas que o fazem pensar nos sites e aplicativos que usa. E eventualmente você
aprenderá a reconhecê-los e evitá-los nas coisas que você está construindo.
Machine Translated by Google

Você não pode tornar tudo auto-evidente

Seu objetivo deve ser que cada página ou tela seja auto-evidente, para que apenas olhando para
ela o usuário médio2 saiba o que é e como usá-lo. Em outras palavras, eles vão “pegar” sem ter
que pensar nisso.

2 O usuário médio real é mantido em um cofre hermeticamente fechado no International Bureau


of Standards em Genebra. Vamos falar sobre a melhor maneira de pensar sobre o “usuário médio”
eventualmente.

Algumas vezes, porém, principalmente se você está fazendo algo original ou inovador ou
algo que é inerentemente complicado, você tem que selecionar por autoexplicativo. Em uma página
autoexplicativa, é preciso um pouco de pensamento para “entender” – mas apenas um pouco. A
aparência das coisas (como tamanho, cor e layout), seus nomes bem escolhidos e as pequenas
quantidades de texto cuidadosamente criado devem trabalhar juntos para criar uma sensação de
compreensão quase sem esforço.

Aqui está a regra: se você não pode tornar algo auto-evidente, você precisa pelo menos torná-lo
auto-explicativo.

Por que tudo isso é tão importante?


Curiosamente, não pela razão que as pessoas costumam citar:

É verdade que há muito compeon por aí. Especialmente em coisas como aplicativos móveis,
onde há muitas alternativas prontamente disponíveis (e igualmente árduas), e o custo de trocar
de cavalo geralmente é insignificante (99 centavos ou até mesmo “Grátis”).

Mas nem sempre é verdade que as pessoas são inconstantes. Por exemplo:

Eles podem não ter escolha a não ser desistir, se for sua única opção (por exemplo, a intranet
de uma empresa ou o aplicativo móvel de seu banco, ou o único site que vende o raan que
eles estão procurando).

Você ficaria surpreso com o tempo que algumas pessoas vão aguentar em sites que as
frustram, muitas vezes culpando a si mesmas e não ao site. Há também
Machine Translated by Google

o fenômeno “Já esperei dez minutos por este ônibus, então é melhor ficar um pouco
mais”.
Além disso, quem pode dizer que a competição será menos frustrante?

Então por que?


Tornar cada página ou tela auto-evidente é como ter uma boa iluminação em uma loja:
apenas faz tudo parecer cerveja. Usar um site que não nos faz pensar em coisas sem
importância parece fácil, ao passo que ficar intrigado com coisas que não nos dizem respeito
tende a minar nossa energia e entusiasmo — e a mim.
Mas, como você verá no próximo capítulo, quando examinarmos como realmente usamos
a Web, a principal razão pela qual é importante não me fazer pensar é que a maioria das
pessoas gastará muito menos olhando as páginas que projetamos do que gastamos.
gostaria de imaginar.
Como resultado, para que as páginas da Web sejam eficazes, elas precisam fazer a maior
parte de sua mágica de relance. E a melhor maneira de fazer isso é criar páginas que sejam
auto-evidentes, ou pelo menos auto-explicativas.
Machine Translated by Google

Capítulo 2. Como realmente usamos a Web

VARREDURA, SATISFAÇÃO E CONFUSÃO ATRAVÉS

Por que as coisas estão sempre no último lugar que você as procura? Porque você para
de procurar quando encontra!

— ENIGMA PARA CRIANÇAS

Em todo o tempo que passei observando as pessoas usarem a Web, o que mais me
impressionou foi a diferença entre como pensamos que as pessoas usam os sites e como
elas realmente os usam.
Quando criamos sites, agimos como se as pessoas fossem se debruçar sobre cada página,
lendo todo o nosso texto cuidadosamente elaborado, descobrindo como organizamos as
coisas e avaliando suas opções antes de decidir em qual link clicar.

O que eles realmente fazem na maior parte do tempo (se tivermos sorte) é dar uma
olhada em cada nova página, escanear um pouco do texto e clicar no primeiro link que chama
a atenção deles ou lembra vagamente o que eles estão procurando. Quase sempre há grandes
partes da página que eles nem olham.
Estamos pensando em “grande literatura” (ou pelo menos “folheto de produto”), enquanto a
realidade do usuário está muito mais próxima de “outdoor passando a 60 milhas por hora”.
Machine Translated by Google

Como você pode imaginar, é um pouco mais complicado do que isso, e depende do
tipo de página, o que o usuário está tentando fazer, com que pressa ele está, e assim por
diante. Mas essa visão simplista está muito mais próxima da realidade do que a maioria de nós
imagina.

Faz sentido que imaginemos um usuário mais racional e afetivo quando estamos projetando
páginas. É natural supor que todos usam a Web da mesma forma que nós, e — como todo mundo
— tendemos a pensar que nosso próprio comportamento é muito mais ordenado e sensato do que
realmente é.

Se você deseja projetar páginas da Web eficazes, porém, precisa aprender a conviver com três
fatos sobre o uso da Web no mundo real.

FATO DA VIDA #1: Não lemos páginas. Nós os digitalizamos.


Um dos poucos fatos bem documentados sobre o uso da Web é que as pessoas tendem a
gastar muito tempo lendo a maioria das páginas da Web. Em vez disso, nós os examinamos (ou
percorremos) procurando palavras ou frases que chamem nossa atenção.

A exceção, é claro, são as páginas que contêm documentos como notícias, relatórios ou descrições
de produtos, onde as pessoas voltarão a ler – mas, mesmo assim, muitas vezes alternam entre
leitura e digitalização.

Por que digitalizamos?

Geralmente estamos em uma missão. A maior parte do uso da Web envolve


tentar fazer algo, e geralmente feito rapidamente. Como resultado, os usuários da Web tendem a
Machine Translated by Google

agir como tubarões: eles têm que continuar se movendo ou morrerão. Nós
simplesmente não temos o eu para ler mais do que o necessário.
Sabemos que não precisamos ler tudo. Na maioria das páginas, estamos
realmente interessados apenas em um fracon do que está na página. Estamos
apenas procurando as partes que correspondem aos nossos interesses ou à
tarefa em questão, e o resto é irrelevante. A varredura é como encontramos os bits relevantes.
Somos bons nisso. É uma habilidade básica: quando você aprende a ler, você
também aprende a escanear. Esquadrinhamos jornais, revistas e livros — ou se
você tem menos de 25 anos, provavelmente reddit, Tumblr ou Facebook — a vida
inteira para encontrar as partes que nos interessam, e sabemos que funciona.

O efeito líquido é muito parecido com o clássico desenho animado Far Side de Gary
Larson sobre a diferença entre o que dizemos aos cães e o que eles ouvem. No desenho,
o cachorro (chamado Ginger) parece estar ouvindo atentamente enquanto seu dono lhe dá
uma séria conversa sobre ficar fora do lixo. Mas do ponto de vista do cachorro, tudo o que
ele está dizendo é “blá blá GENGIBRE blá blá blá Blá GINGER blá blá blá”.

O que vemos quando olhamos para uma página depende do que temos em mente, e
geralmente é apenas um fracon do que está lá.
Machine Translated by Google

Como Ginger, tendemos a nos concentrar em palavras e frases que parecem


corresponder (a) à tarefa em questão ou (b) aos nossos interesses pessoais atuais ou
em andamento. E, claro, (c) as palavras-chave que estão conectadas ao nosso sistema
nervoso, como “Grátis”, “Venda” e “Sexo”, e nosso próprio nome.

FATO DA VIDA #2: Não fazemos escolhas ótimas. Sacamos.


Quando estamos projetando páginas, tendemos a presumir que os usuários irão
escanear a página, considerar todas as opções disponíveis e escolher a melhor.
Na realidade, porém, na maioria das vezes não escolhemos a melhor opção -
escolhemos a primeira opção razoável, uma estratégia conhecida como sacrifício.1 Assim
que encontramos um link que parece levar ao que estamos procurando, há uma boa
chance de clicarmos nele.

1 O economista Herbert Simon cunhou o termo (um cruzamento entre sasfying e suffing) em Models
of Man: Social and Raonal (Wiley, 1957).

Eu observei esse comportamento por anos, mas seu significado não estava muito claro
para mim até que eu li o livro de Gary Klein Fontes de poder: como as pessoas tomam
decisões.

Klein passou muitos anos estudando a tomada de decisão natural: como pessoas como
bombeiros, pilotos, mestres de xadrez e operadores de usinas nucleares tomam
decisões de alto risco em situações reais com pressão, objetivos vagos, informações
limitadas e condições mutáveis.
Machine Translated by Google

A equipe de observadores de Klein iniciou seu primeiro estudo (de comandantes de


campo em cenas de incêndio) com o modelo geralmente aceito de tomada de decisão
racional: diante de um problema, uma pessoa reúne informações, identifica as possíveis
soluções e escolhe a melhor. Eles começaram com a hipótese de que, devido aos altos
riscos e à extrema pressão de mim, os capitães de bombeiros seriam capazes de
comparar apenas duas opções, uma suposição que eles pensavam ser
conservar.

Como se viu, os comandantes dos bombeiros não compararam nenhuma oposição.


Eles pegaram o primeiro plano razoável que veio à mente e fizeram um teste mental
rápido para possíveis problemas. Se não encontrassem nenhum, tinham seu plano de ação.
Então, por que os usuários da Web não procuram a melhor escolha?

Geralmente estamos com pressa. E, como Klein aponta, “Opmizing é difícil e


demora muito para mim. Sasficing é mais eficiente.”
Machine Translated by Google

Não há muita penalidade por adivinhar errado. Ao contrário do combate a


incêndios, a penalidade por adivinhar errado em um site geralmente é apenas um
ou dois cliques no botão Voltar, tornando o sacrifício uma estratégia eficaz. (Voltar
é o botão mais usado em navegadores da Web.)
Pesar opções pode não melhorar nossas chances. Em sites mal projetados, o
esforço de fazer a melhor escolha não ajuda muito.
Você geralmente está indo bem com seu primeiro palpite e usando o botão Voltar
se não der certo.

Adivinhar é mais divertido. Dá menos trabalho do que pesar as opções e, se


acertar, é mais rápido. E introduz um elemento de chance — a agradável
possibilidade de encontrar algo surpreendente e bom.
Claro, isso não quer dizer que os usuários nunca pesam as opções antes de clicar.
Depende de coisas como o estado de espírito deles, o quanto eles estão
pressionados por mim e quanta confiança eles têm no site.

FATO DA VIDA #3: Não entendemos como as coisas


funcionam. Atravessamos.
Uma das coisas que se torna óbvia assim que você faz qualquer teste de usabilidade
– seja testando sites, softwares ou eletrodomésticos – é até que ponto as pessoas
usam as coisas sem entender como elas funcionam, ou com idéias erradas sobre
como eles funcionam.

Diante de qualquer tipo de tecnologia, pouquíssimas pessoas me levam para ler


instruções. Em vez disso, seguimos em frente e nos atrapalhamos, inventando nossas
próprias histórias vagamente plausíveis sobre o que estamos fazendo e por que funciona.
Isso sempre me lembra a cena no final de O Príncipe e o Mendigo, onde o príncipe
real descobre que o mendigo sósia tem usado o Grande Selo da Inglaterra como um
quebra-nozes em sua ausência. (Faz todo o sentido - para ele, o selo é apenas um
grande e pesado pedaço de metal.)
Machine Translated by Google

O Príncipe e o Mendigo (Clássicos Ilustrados)

E o fato é que fazemos as coisas dessa maneira. Já vi muitas pessoas usarem softwares, sites
da Web e produtos de consumo de maneiras que não são nada parecidas com o que os
designers pretendiam.

Veja o navegador da Web, por exemplo, uma parte crucial do uso da Internet. Para as
pessoas que constroem sites, é um aplicativo que você usa para visualizar páginas da Web.
Mas se você perguntar aos usuários o que é um navegador, uma porcentagem surpreendentemente
grande dirá algo como "É o que eu uso para pesquisar... para encontrar coisas" ou "É o mecanismo
de pesquisa". Experimente você mesmo: pergunte a alguns membros da família o que é um
navegador da Web. Você pode se surpreender.

Muitas pessoas usam a Web extensivamente sem saber que estão usando um navegador. O que
eles sabem é que você digita algo em uma caixa e as coisas aparecem.2 Mas isso não importa para
eles: eles estão se atrapalhando e usando a coisa com sucesso.
Machine Translated by Google

2 Geralmente uma caixa com a palavra “Google” ao lado. Muitas pessoas pensam que o Google é a Internet.

E a confusão não se limita aos iniciantes. Mesmo usuários tecnicamente experientes têm
lacunas surpreendentes em sua compreensão de como as coisas funcionam.
(Eu não ficaria surpreso se até mesmo Mark Zuckerberg e Sergey Brin tivessem alguns bits de
tecnologia em suas vidas que eles usam atrapalhando.)

Por que isso acontece?

Não é importante para nós. Para a maioria de nós, não importa se entendemos
como as coisas funcionam, desde que possamos usá-las.
Não é por falta de inteligência, mas por falta de carinho. Simplesmente não é
importante para nós.3

3 Desenvolvedores da Web muitas vezes têm dificuldade em entender - ou mesmo acreditar - que as pessoas
possam se sentir assim, já que elas mesmas geralmente estão muito interessadas em como as coisas
funcionam.

Se encontrarmos algo que funcione, vamos atrás disso. Uma vez que
encontramos algo que funciona – não importa o quanto – tendemos a não procurar um
jeito de cerveja. Usaremos um caminho de cerveja se nos depararmos com um, mas
raramente procuramos um.

É sempre interessante ver designers e desenvolvedores observarem seu primeiro teste de


usabilidade. A primeira vez que eles veem um usuário clicar em algo completamente
inapropriado, eles ficam surpresos. (Por exemplo, quando o usuário ignora um botão "Soware"
grande e gordo na barra de navegação, dizendo algo como: "Bem, estou procurando por
software, então acho que clicaria aqui em 'Coisas baratas' porque barato é sempre bom.”) O
usuário pode até encontrar o que procura eventualmente, mas a essa altura as pessoas que
assistem não sabem se devem ser felizes ou não.

No segundo em que isso acontece, eles gritam "Basta clicar em 'Soware'!" O terceiro eu,
você pode vê-los pensando: “Por que estamos nos incomodando?”

E é uma boa pergunta: se as pessoas conseguem se atrapalhar tanto, será que realmente
importa se elas “entenderam”? A resposta é que é muito importante porque, embora a
confusão possa funcionar algumas vezes, ela tende a ser ineficiente e sujeita a erros.

Por outro lado, se os usuários “entenderem”:

Há uma grande chance de que eles encontrem o que estão procurando, o que é
bom para eles e para você.
Machine Translated by Google

Há uma boa chance de que eles entendam toda a gama do que seu site tem
a oferecer - não apenas as partes que eles encontram.
Você tem a chance de direcioná-los para as partes do seu site que você
deseja que eles vejam.
Eles se sentirão mais inteligentes e no controle quando estiverem usando seu
site, o que os trará de volta. Você pode se safar com um site no qual as
pessoas se atrapalham apenas até que alguém construa um na rua que as
faça se sentirem inteligentes.

Se a vida te der limões...


A essa altura, você deve estar pensando (dada essa imagem nada rósea do
seu público e de como eles usam a Web): “Por que não consigo um emprego
no 7-Eleven local? Pelo menos lá meus esforços podem ser apreciados.”
Então, o que uma garota deve fazer?

Acho que a resposta é simples: se o seu público vai agir como se você
estivesse projetando outdoors, então projete ótimos outdoors.
Machine Translated by Google

Capítulo 3. Design de Outdoor 101

PROJETO PARA DIGITALIZAÇÃO, NÃO LEITURA

Se você / Não sabe / De quem são os sinais / Estes são Você não pode ter / Dirigido muito
longe / Burma-Shave!

— SEQUÊNCIA DE AVISORES À BEIRA DA ESTRADA PROMOVENDO CREME DE BARBEAR, CIRCA 1935

Diante do fato de que seus usuários estão passando rapidamente, há algumas coisas
importantes que você pode fazer para garantir que eles vejam e entendam o máximo possível do
que precisam saber e do que você deseja que eles saibam:

Aproveite as convenções
Crie hierarquias visuais eficazes

Divida as páginas em áreas claramente definidas


Deixe claro o que é clicável

Elimine distracons

Formate o conteúdo para dar suporte à digitalização

Convenons são seus amigos


Uma das melhores maneiras de tornar quase tudo mais fácil de entender rapidamente é seguir
as convenções existentes - os padrões de design amplamente usados ou padronizados. Por
exemplo: Sinais de parada. Dado o quão crucial é que os motoristas os vejam e os reconheçam

de relance, à distância, em todos os tipos de clima e condições de iluminação, é realmente


bom que todos os sinais de pare sejam iguais.

(Alguns dos detalhes podem variar de país para país, mas no geral são notavelmente
consistentes em todo o mundo.)
Machine Translated by Google

A convenção inclui uma forma disncva, a palavra para “Stop”, uma cor altamente
visível que contrasta com a maioria dos ambientes naturais e tamanho, altura e
localização padronizados.

Controles em carros. Imagine tentar dirigir um carro alugado se o pedal do acelerador


nem sempre estiver à direita do pedal do freio, ou a buzina nem sempre estiver no
volante.

Nos últimos vinte anos, muitas convenções para páginas da Web evoluíram. Como usuários,
passamos a ter muitas expectativas sobre

Onde as coisas serão localizadas em uma página. Por exemplo, os usuários


esperam que o logotipo que identifica o site esteja no canto superior (pelo menos em
países onde a leitura é da esquerda para a direita) e a navegação principal esteja na
parte superior ou inferior do lado esquerdo.

Como as coisas funcionam. Por exemplo, quase todos os sites que vendem produtos
usam a metáfora de um carrinho de compras e uma série muito semelhante de formulários
para especificar coisas como seu método de pagamento, seu endereço de entrega e
assim por diante.

Como as coisas parecem. Muitos elementos têm uma aparência padronizada, como
o ícone que informa que é um link para um vídeo, o ícone de pesquisa e as opções
de compartilhamento de rede social.
Machine Translated by Google

As convenções também evoluíram para diferentes tipos de sites — comércio,


faculdades, blogs, restaurantes, filmes e muitos outros — já que todos os sites de
cada categoria precisam resolver o mesmo conjunto de problemas.
Machine Translated by Google

SomeSlightlyIrregular.com
Machine Translated by Google

cityislandmovie. com

Essas convenções não surgiram do nada: todas começaram a vida como uma ideia
brilhante de alguém. Se uma ideia funciona bem o suficiente, outros sites a imitam e,
eventualmente, pessoas suficientes a viram em lugares suficientes para que ela não
precise de explicação.
Quando bem aplicadas, as convenções da Web facilitam a vida dos usuários porque
eles não precisam descobrir constantemente o que são as coisas e como devem
funcionar conforme vão de um site para outro.
Machine Translated by Google
Machine Translated by Google

Quer uma prova de que convenções ajudam? Veja o quanto você sabe sobre esta
página - mesmo que não consiga entender uma palavra dela - só porque segue
algumas convenções.

Um problema com as convenções, porém: os designers costumam relutar em


aproveitá-las.
Diante da perspectiva de seguir uma convenção, há uma grande tentação
para os designers tentarem reinventar a roda, em grande parte porque sentem
(não incorretamente) que foram contratados para fazer algo novo e diferente, não a
mesma coisa de sempre. Sem mencionar o fato de que elogios de colegas, prêmios e
ofertas de emprego de alto nível raramente são baseados em critérios como “melhor
uso de convenções”.

Ocasionalmente, passei a reinventar a roda resultando em um novo e revolucionário


dispositivo de rolamento. Mas geralmente isso significa apenas que gastei reinventando
a roda.

Se você vai inovar, precisa entender o valor do que está substituindo (ou, como disse
Dylan, “para viver fora da lei, você deve ser honesto”), e é fácil subestimar o valor
convenções proporcionam.
O exemplo clássico são as barras de rolagem personalizadas. Sempre que um
designer decide criar barras de rolagem do zero - geralmente para torná-las mais
bonitas - os resultados quase sempre tornam óbvio que o projetista nunca pensou em
quantas centenas ou milhares de horas de ajuste fino foram necessárias para a evolução
das barras de rolagem padrão do sistema operacional.
Se você não for usar uma convenção da Web existente, você precisa ter certeza de
que o que você está substituindo por (a) é tão claro e autoexplicativo
Machine Translated by Google

que não há curva de aprendizado - então é tão bom quanto a convenção, ou (b)
agrega tanto valor que vale uma pequena curva de aprendizado.
Minha recomendação: inove quando souber que tem uma ideia de cerveja, mas
aproveite as convenções quando não tiver.
Não me entenda mal: não estou tentando de forma alguma desencorajar a criatividade.
Adoro web design inovador e original.
Um dos meus exemplos favoritos é Harlem.org. Todo o site é construído em torno
da famosa foto de Art Kane de 57 músicos de jazz, tirada nos degraus de uma
casa de arenito no Harlem em agosto de 1957. Em vez de links de texto ou menus,
você usa a foto para navegar no site.

Além de ser inovador e divertido, é fácil de entender e usar. E os criadores foram


espertos o suficiente para entender que a diversão pode acabar depois de um
tempo, então eles também incluíram uma navegação baseada em categorias mais
convencional.
Machine Translated by Google

Você também pode navegar pelos músicos por nome, instrumento ou estilo de jazz.

A regra geral é que você pode - e deve - ser tão criativo e inovador quanto quiser,
e adicionar o máximo de apelo estético que puder, contanto que tenha certeza de que
ainda é utilizável.

E, finalmente, uma palavra sobre consistência.


Você pode ouvir a consistência ser citada como um bem absoluto. As pessoas ganham
muitos argumentos de design apenas dizendo “Não podemos fazer isso. Não seria
consistente.”

A consistência é sempre uma boa coisa a se buscar em seu site ou aplicativo. Se sua
navegação está sempre no mesmo lugar, por exemplo, não preciso
Machine Translated by Google

pense nisso ou me desperdice procurando por isso. Mas haverá casos em que as
coisas ficarão mais claras se você as tornar ligeiramente inconsistentes.
Aqui está a regra a ter em mente:

A CLAREZA SUPERA A CONSISTÊNCIA

Se você puder tornar algo significativamente mais claro tornando-o um pouco


inconsistente, escolha a favor da clareza.

Crie hierarquias visuais eficazes

Outra maneira importante de tornar as páginas fáceis de entender rapidamente é


certificar-se de que a aparência das coisas na página - todas as dicas visuais - retrate
com precisão as relações entre as coisas na página: quais coisas são mais importantes,
quais coisas são semelhantes, e quais coisas fazem parte de outras coisas. Em outras
palavras, cada página deve ter uma hierarquia visual clara.

Páginas com uma hierarquia visual clara têm três


características: Quanto mais importante algo é, mais proeminente ele é.
Os elementos mais importantes são maiores, mais ousados, em cores
distintas, destacados por mais espaço em branco ou mais próximos do topo da
página – ou alguma combinação dos itens acima.

Coisas que estão relacionadas logicamente estão relacionadas visualmente.


Por exemplo, você pode mostrar que as coisas são semelhantes agrupando-as sob um
Machine Translated by Google

cabeçalho, exibindo-os no mesmo estilo visual, ou coloque-os todos em


uma área claramente definida.

As coisas são “aninhadas” visualmente para mostrar o que é


parte do quê. Por exemplo, um segundo nome de site (“Computer
Books”) apareceria acima dos títulos dos livros individuais, refletindo o
fato de que os livros fazem parte do segundo. E cada título de livro, por sua
vez, abrangeria todos os elementos que compõem a descrição desse livro.

Não há nada de novo nas hierarquias visuais. Cada página de jornal, por
exemplo, usa proeminência, agrupamento e nesng para nos dar informações
úteis sobre o conteúdo da página antes de lermos uma palavra. Esta imagem
combina com esta história porque ambas são abrangidas por esta manchete.
Esta história é a mais importante porque tem a maior manchete e uma posição
de destaque na página.
Machine Translated by Google

Todos nós analisamos hierarquias visuais todos os dias, mas isso acontece tão rapidamente
que o único eu que temos vagamente cientes de que estamos fazendo isso é quando não
podemos fazê-lo – quando as pistas visuais (ou ausência delas) nos forçam pensar.

Uma boa hierarquia visual nos poupa trabalho ao pré-processar a página para nós,
organizando e priorizando seu conteúdo de uma forma que podemos entender quase
instantaneamente.
Mas quando uma página não tem uma hierarquia visual clara – se tudo parece igualmente
importante, por exemplo – somos reduzidos ao processo muito mais lento de escanear a
página em busca de palavras e frases reveladoras e então tentar formar nosso próprio senso
do que é importante e como as coisas são organizadas. É muito mais trabalho.

Analisar uma página com uma hierarquia visual que é até mesmo um pouco falha – onde um
título abrange coisas que não fazem parte dela, por exemplo – é como ler uma frase
construída descuidadamente (“Bill colocou o gato na mesa por um minuto porque foi um
pouco vacilante”).

Essa hierarquia visual falha sugere que todos os principais segundos do site fazem parte do
subsecon Livros de Computador.
Machine Translated by Google

Pung o título onde ele pertence torna a relação mais clara.

Mesmo que geralmente possamos descobrir o que a frase deveria significar, ela ainda nos
surpreende momentaneamente e nos força a pensar quando não deveríamos.

Divida as páginas em áreas claramente definidas


Idealmente, em qualquer página da Web bem projetada, os usuários podem jogar uma
1
variação do antigo game show de TV $ 25.000
Olhando
Pyramid.
ao redor,
aponte
eles
para
devem
as diferentes
ser capazes
áreas
deda
página e diga: "Coisas que posso fazer neste site!" “Links para as principais notícias de hoje!”
“Produtos que esta empresa vende!” “Coisas que eles estão ansiosos para me vender!”
“Navegação para chegar ao resto do site!”

1 Os competidores tinham que fazer com que seus parceiros adivinhassem uma categoria como “Coisas que um
encanador usa” dando exemplos (“uma chave inglesa, um cachimbo, calças que não param...”).

Dividir a página em áreas claramente definidas é importante porque permite que os usuários
decidam rapidamente em quais áreas da página focar e quais áreas podem ser ignoradas com
segurança. Estudos de rastreamento ocular de varredura de páginas da Web sugerem que os
usuários decidem muito rapidamente em suas primeiras olhadas quais partes da página
provavelmente terão informações úteis e raramente olham para as outras partes - quase como
se não estivessem lá. (A cegueira de banner – a capacidade dos usuários de ignorar
completamente áreas que eles acham que conterão anúncios – é apenas o caso extremo.)

Deixe claro o que é clicável

Como grande parte do que as pessoas estão fazendo na Web é procurar a próxima coisa
a ser clicada, é importante facilitar a identificação do que é clicável.
Machine Translated by Google

À medida que digitalizamos uma página, procuramos uma variedade de dicas visuais
que identificam coisas como clicáveis (ou "tocáveis" em telas sensíveis ao toque) -
coisas como forma (botões, guias etc.), localização (em uma barra de menu, por exemplo)
e formang (cor e sublinhado).2

2 As pessoas também confiam no fato de que o cursor em um navegador da Web muda de uma seta para uma
mão quando você o aponta para um link, mas isso requer mover o cursor deliberadamente, um processo
relativamente lento. Além disso, não funciona em telas sensíveis ao toque porque elas não têm cursor.

Esse processo de procurar pistas na aparência das coisas que nos digam como usá-las não
se limita às páginas da Web. Como Don Norman explica tão agradavelmente em seu
clássico de usabilidade recentemente atualizado, The Design of Everyday Things, estamos
constantemente analisando nosso ambiente (como as maçanetas das portas) para essas
pistas (para decidir se devemos puxar ou empurrar). Leia-o. Você nunca mais vai olhar para
as portas da mesma maneira.
Machine Translated by Google

Identificar facilmente o que é clicável em uma página aumentou e diminuiu como um


problema desde o início da Web.

No entanto, está ressurgindo atualmente como um problema no design móvel, como você
verá no Capítulo 10.

Em geral, você vai ficar bem se apenas usar uma cor para todos os links de texto ou se
certificar de que sua forma e localização os identifiquem como clicáveis. Só não cometa
erros bobos como usar a mesma cor para links e títulos não clicáveis.

Mantenha o ruído baixo para um rugido maçante

Um dos grandes inimigos das páginas fáceis de entender é o ruído visual.

Os usuários têm tolerâncias variadas para complexidade e distrações; algumas pessoas não
têm nenhum problema com páginas barulhentas, mas muitas as acham absolutamente
irritantes. Os usuários são conhecidos por colocar Post-its na tela para encobrir a animação
que os distrai enquanto tentam ler.

Existem realmente três tipos diferentes de ruído:

Shoung. Quando tudo na página está clamando pelo seu convite, o efeito
pode ser esmagador: muitos convites para comprar!
Muitos pontos de exclamação, tipos de letra diferentes e cores brilhantes!
Apresentações de slides automatizadas, animações, pop-ups e a variedade
infindável de novos formatos de anúncios atraentes!

A verdade é que nem tudo pode ser importante. Shoung é geralmente o resultado
de uma falha em tomar decisões difíceis sobre quais elementos são
Machine Translated by Google

realmente o mais importante e, em seguida, criar uma hierarquia visual que


guie os usuários até eles primeiro.
Desorganização. Algumas páginas parecem um quarto que foi saqueado, com
coisas espalhadas por toda parte. Este é um sinal claro de que o designer não
entende a importância de usar grades para alinhar os elementos em uma página.

Mais inteligente. Todos nós já vimos páginas—especialmente páginas iniciais—que


têm coisas demais . O efeito líquido é o mesmo de quando sua caixa de entrada de e-
mail é inundada com coisas como boletins de sites que decidiram que seu único
contato com eles fez de você amigos para a vida toda: é difícil encontrar e se
concentrar nas mensagens com as quais você realmente se importa. Você acaba
com o que os engenheiros chamam de baixa relação sinal-ruído: muito ruído, pouca
informação, e o ruído obscurece as coisas úteis.

Quando você está editando suas páginas da Web, provavelmente é uma boa
ideia começar com a suposição de que tudo é ruído visual (a abordagem
“presumivelmente culpado até provado inocente”) e se livrar de qualquer coisa
que não esteja fazendo uma contribuição real. Diante do eu e do aenon limitados,
tudo o que não faz parte da solução deve ir embora.

Formate o texto para dar suporte à digitalização

Muito do eu — talvez a maior parte do eu — que os usuários gastam em suas páginas


da Web é gasto examinando o texto em busca de algo.
A forma como seu texto é formado pode fazer muito para torná-lo mais fácil para eles.
Machine Translated by Google

Qual você prefere escanear?

Aqui estão as coisas mais importantes que você pode fazer para tornar suas
páginas fáceis de digitalizar: Use muitos títulos. Títulos bem escritos e
ponderados intercalados no texto funcionam como um esboço informal ou
índice para uma página. Eles dizem sobre o que é cada segundo ou, se forem
menos literais, intrigam você. De qualquer forma, eles ajudam você a decidir
quais partes ler, digitalizar ou pular.

Em geral, você vai querer usar mais títulos do que você pensa e me colocar
mais para torcê-los.
Além disso, certifique-se de formatar os títulos corretamente. Duas coisas muito
importantes sobre o estilo de títulos que as pessoas geralmente ignoram: Se você
estiver usando mais de um nível de título, certifique-se de que haja uma disncon
visual óbvia e impossível de perder entre eles. Você pode fazer isso aumentando
cada nível superior ou deixando mais espaço acima dele.
Machine Translated by Google

Mau

Cerveja

Ainda mais importante: não deixe seus títulos flutuarem. Certifique-se de que eles estejam
mais próximos da segunda que introduzem do que da segunda que seguem. Isso faz uma
grande diferença.
Machine Translated by Google

Mau

Cerveja

Mantenha os parágrafos curtos. Longos parágrafos confrontam o leitor


com o que Caroline Jarre e Ginny Redish chamam de “muro de palavras”. Eles
são assustadores, tornam mais difícil para os leitores manterem seu lugar e são
mais difíceis de digitalizar do que uma série de parágrafos mais curtos.
Você pode ter sido ensinado que cada parágrafo tem que ter um tópico frasal,
sentenças detalhadas e uma conclusão, mas ler online é
Machine Translated by Google

diferente. Mesmo parágrafos de uma única frase são bons.


Se você examinar um parágrafo longo, quase sempre descobrirá que há um lugar
razoável para dividi-lo em dois. Habitue-se a fazê-lo.

Use listas com marcadores. Pense desta forma: quase tudo o que pode ser uma
lista com marcadores provavelmente deveria ser. Basta olhar em seus parágrafos
para qualquer série de itens separados por vírgulas ou ponto e vírgula e você
encontrará prováveis candidatos.
E para melhor legibilidade, deve haver uma pequena quantidade de espaço
adicional entre os itens da lista.

Mau

Cerveja
Machine Translated by Google

Destaque os termos-chave. Grande parte da digitalização de páginas consiste em


procurar palavras-chave e frases. Colocar os mais importantes em negrito onde
aparecem pela primeira vez no texto facilita a localização. (Se eles já são links de
texto, você obviamente não precisa.) Não destaque muitas coisas, ou a técnica perderá
sua eficácia.

Se você realmente quer aprender sobre como tornar o conteúdo escaneável (ou sobre
qualquer coisa relacionada a torcer para telas em geral), corra, não caminhe, para um
dispositivo conectado à Internet e peça o livro de Ginny Redish, Leng Go of the Words.

E enquanto você está nisso, peça uma cópia para qualquer pessoa que você conheça que
escreva, edita ou tenha algo a ver com a criação de conteúdo digital. Eles vão acabar
eternamente em dívida com você.
Machine Translated by Google
Machine Translated by Google

Capítulo 4. Animal, Vegetal ou Mineral?

POR QUE OS USUÁRIOS GOSTAM DE ESCOLHAS INTELIGENTES

Não importa quantos cliques eu tenha que clicar, contanto que cada clique seja uma
escolha irracional e inequívoca.

—SEGUNDA LEI DE USABILIDADE DE KRUG

Web designers e profissionais de usabilidade gastaram muito de mim ao longo dos anos
discutindo quantos mes você pode esperar que os usuários cliquem (ou toquem) para
obter o que desejam sem ficar muito frustrado. Alguns sites ainda têm regras de design
que dizem que nunca deve demorar mais do que um número especificado de cliques
(geralmente três, quatro ou cinco) para chegar a qualquer página do site.
Diante disso, “número de cliques para chegar a qualquer lugar” parece uma métrica
útil. Mas acabei pensando que o que realmente conta não é o número de cliques que
preciso para chegar ao que quero (embora haja limites), mas sim o quão difícil é cada
clique - a quantidade de pensamento necessária e o quantidade de incerteza sobre se
estou fazendo a escolha certa.
Em geral, acho que é seguro dizer que os usuários não se importam com muitos cliques ,
desde que cada clique seja indolor e eles tenham confiança contínua de que estão no
1
caminho certo – seguindo o que é comumente chamado de “cheiro de informação”. ”
Links que identificam de forma clara e inequívoca seu alvo emitem um cheiro forte que
garante aos usuários que clicar neles os aproximará de sua “presa”. Links ambíguos
ou mal redigidos não.
1 Este termo vem da pesquisa de “forrageamento de informações” de Peter Pirolli e Stuart Card na Xerox
PARC, na qual eles traçaram paralelos entre pessoas buscando informações (“informadores”) e
animais seguindo o cheiro de suas presas.

Acho que a regra geral pode ser algo como “três cliques sem sentido e
2
inequívocos equivalem a um clique que requer reflexão”.

2 Claro que existem exceções. Por exemplo, se eu tiver que detalhar o mesmo caminho em um site
repetidamente, ou se as páginas demorarem muito para carregar, o valor de menos cliques aumenta.
Machine Translated by Google

A primeira pergunta clássica no jogo de palavras Vinte Perguntas – “Animal, vegetal ou


mineral?” – é um exemplo maravilhoso de uma escolha irracional. Contanto que você aceite
a premissa de que qualquer coisa que não seja uma planta ou um animal – incluindo coisas
tão diversas como pianos, limericks e cheesecake, por exemplo – se enquadra em “mineral”,
quase não requer pensamento para responder à pergunta.
3
pergunta corretamente.

3 Caso você tenha desistido do jogo, há uma versão excelente que você pode jogar em www.20q.net. Criado por Robin
Burgener, ele usa um algoritmo de rede neural e desempenha um papel
jogos.

Infelizmente, muitas opções na Web não são tão claras.

Por exemplo, alguns anos atrás, quando eu estava tentando comprar um produto ou
serviço para usar em meu escritório em casa (como uma impressora, por exemplo), a
maioria dos sites dos fabricantes me pediu para fazer uma escolha de nível superior assim:

Qual deles era eu? Eu tive que pensar sobre isso, e mesmo quando fiz minha escolha,
não estava muito confiante de que era a certa. Na verdade, o que eu tinha que esperar
quando a página de destino finalmente foi carregada era pensar ainda mais para descobrir se
eu estava no lugar certo.

Foi a sensação que tenho quando estou na frente de duas caixas de correio rotuladas como
Stamped Mail e Metered Mail com um cartão de resposta comercial na mão.
O que eles acham que é — carimbado ou medido? E o que acontece se eu deixá-lo cair na
caixa errada?

Aqui está outro exemplo:


Machine Translated by Google

Estou tentando ler um artigo online. A página a que chego dá-me tudo isto
opções:

Agora eu tenho que escanear todo esse texto e descobrir se sou assinante, mas não
membro, ou membro, ou nenhum dos dois. E então terei que desenterrar o número da
conta ou a senha que usei ou decidir se vale a pena entrar.

Neste ponto, a pergunta que estou me fazendo provavelmente está mudando de


"Como respondo a esta pergunta?" para "Até que ponto estou interessado neste
artigo?"

O New York Times faz o mesmo tipo de escolha parecer muito mais fácil ao não
confrontar você com todos os detalhes de uma vez. Fazer uma seleção inicial (para
fazer login ou ver suas opções de inscrição) leva você a outra tela onde você vê apenas
as perguntas ou informações relevantes para essa seleção.
Machine Translated by Google

Esse problema de dar ao usuário escolhas difíceis e perguntas difíceis de


responder acontece a todo momento em formulários. Caroline Jarre tem um
capítulo inteiro sobre isso (“Making Quesons Easy to Answer”) em seu livro
Forms that Work: Designing Web Forms for Used.
Machine Translated by Google

Tal como acontece com o livro de Ginny Redish sobre wring for the Web, qualquer pessoa
que trabalhe em formulários deve ter uma cópia bem gasta em sua mesa.
Machine Translated by Google

Alguma ajuda pode ser necessária


A vida é complicada, porém, e algumas escolhas realmente não são simples.

Quando você não pode evitar me dar uma escolha difícil, você precisa sair do seu caminho para
me dar toda a orientação que eu preciso – mas não mais.

Esta orientação funciona melhor quando é

Resumo: A menor quantidade de informações que me ajudarão

Oportuna: Colocada para que eu a encontre exatamente quando preciso

Inevitável: Formado de forma a garantir que eu perceba

Exemplos são ps adjacentes aos campos de formulário, "O que é isso?" links e até ferramenta
obs.

Meu exemplo favorito desse tipo de orientação “just-in-me” é encontrado nas esquinas de Londres.

É breve (“OLHE PARA A DIREITA” e uma seta apontando para a direita), simples (você vê no
instante em que precisa ser lembrado) e inevitável (você quase sempre olha para baixo quando está
pisando no meio-fio).
Machine Translated by Google

Eu tenho que pensar que salvou a vida de muitos turistas que esperam que o
tráfego venha da outra direção. (Eu sei que salvou o meu uma vez.)
Se você precisa oferecer alguma ajuda ou não, o ponto é que enfrentamos
escolhas todas as vezes na Web e fazer essas escolhas sem pensar é uma das
coisas mais importantes que você pode fazer para tornar um site fácil de usar.
Machine Translated by Google

Capítulo 5. Omitir palavras

A ARTE DE NÃO ESCREVER PARA A WEB

Livre-se de metade das palavras em cada página e, em seguida, livre-se de metade do que resta.

-TERCEIRA LEI DE USABILIDADE DE KRUG

Das cinco ou seis coisas que aprendi na faculdade, a que mais me marcou – e me beneficiou mais – é
a décima sétima regra de EB White em Os Elementos do Estilo:

17. Omita palavras desnecessárias.

Torção vigorosa é concisa. Uma frase não deve conter palavras desnecessárias,
um parágrafo não deve conter frases desnecessárias, pela mesma razão que um desenho
não deve ter linhas desnecessárias e uma máquina não deve ter partes desnecessárias.1

1 William Strunk, Jr., e EB White, The Elements of Style (Allyn e Bacon, 1979).

Quando olho para a maioria das páginas da Web, fico impressionado com o fato de que a maioria
das palavras que vejo estão apenas ocupando espaço, porque ninguém jamais as lerá. E apenas por
estar lá, todas as palavras extras sugerem que você pode realmente precisar lê-las para entender o
que está acontecendo, o que muitas vezes faz as páginas parecerem mais assustadoras do que
realmente são.

Minha Terceira Lei provavelmente soa excessiva, porque foi feita para isso. Remover metade das
palavras é, na verdade, um objetivo realista; Acho que não tenho problemas para me livrar de metade
das palavras na maioria das páginas da Web sem perder nada de valor.
Mas a ideia de remover metade do que é le é apenas a minha maneira de tentar encorajar as
pessoas a serem implacáveis sobre isso.

Geng livrar-se de todas aquelas palavras que ninguém vai ler tem vários efeitos benéficos:

Reduz o nível de ruído da página.

Isso torna o conteúdo útil mais proeminente.


Machine Translated by Google

Isso torna as páginas mais curtas, permitindo que os usuários vejam mais de cada
página rapidamente sem rolar.
Não estou sugerindo que os artigos do WebMD.com ou as matérias do
NYTimes.com sejam mais curtos do que são. Mas certos tipos de torção tendem
a ser particularmente propensos ao excesso.

Conversa feliz deve morrer

Todos nós conhecemos a conversa feliz quando a vemos: é o texto introdutório


que deveria nos dar as boas-vindas ao site e nos dizer o quão bom ele é ou nos
dizer o que estamos prestes a ver no segundo que acabamos de inserir.
Se você não tem certeza se algo é uma conversa feliz, há um teste infalível:
se você ouvir muito atentamente enquanto estiver lendo, você pode realmente
ouvir qualquer voz na parte de trás de sua cabeça dizendo: “Blá blá blá blá blá...”
Muita conversa feliz é o tipo de torção promocional autocongratulatória que
você encontra em folhetos mal escritos. Ao contrário de um bom texto
promocional, ele não transmite informações úteis e se concentra em dizer o
quanto somos bons, em vez de explicar o que nos torna ótimos.
Embora a conversa feliz seja algumas vezes encontrada nas páginas iniciais –
geralmente em parágrafos que começam com as palavras “Bem-vindo a...” – seu habitat
favorito são as primeiras páginas dos segundos de um site (“secon fronts”). Como essas
páginas geralmente são apenas uma lista de links para as páginas do segundo sem
conteúdo real próprio, há uma tentação de preenchê-las com conversa feliz.
Infelizmente, o efeito é como se um editor de livros se sentisse obrigado a
adicionar um parágrafo à página do índice dizendo: “Este livro contém muitos
eles”. _____, e _____. Esperamos que você goste
capítulos interessantes sobre_____,

Conversa feliz é como conversa fiada – sem conteúdo, basicamente apenas uma
maneira de ser sociável. Mas a maioria dos usuários da Web não me quer para conversa
fiada; eles querem ir direto ao ponto. Você pode – e deve – eliminar o máximo de conversa
feliz possível.
Machine Translated by Google

Instrucons devem morrer

Outra fonte importante de palavras desnecessárias são os instrucons. A principal coisa que você
precisa saber sobre instruções é que ninguém vai lê-las – pelo menos não até que tentativas
repetidas de “confusão” tenham falhado.
E mesmo assim, se as instruções forem prolixas, as chances de os usuários encontrarem as
informações de que precisam são baixas.

Seu objetivo deve ser sempre eliminar totalmente as instruções, tornando tudo autoexplicativo, ou o
mais próximo possível. Quando as instruções forem absolutamente necessárias, reduza-as ao mínimo.

Por exemplo, aqui estão as instruções que encontrei no início de um site


pesquisa:

Eu acho que algumas podas agressivas os tornam muito mais úteis:

Antes: 103 palavras


Machine Translated by Google

Aer: 34 palavras

Ajude-nos a melhorar o site, levando de 2 a 3 minutos para responder


a esta pesquisa.

NOTA: Se você tiver comentários ou dúvidas que exijam uma


resposta, não use este formulário. Em vez disso, entre em contato
com o Atendimento ao Cliente.

E agora para algo completamente diferente


Nestes primeiros capítulos, tentei transmitir alguns princípios orientadores que acho
bom ter em mente ao criar um site.
Machine Translated by Google

Agora estamos entrando em dois capítulos que examinam como esses princípios
se aplicam a dois dos maiores e mais importantes desafios do design da Web:
navegação e página inicial.
Você pode querer embalar um almoço. São capítulos muito longos.
Machine Translated by Google

Coisas que você precisa para acertar


Machine Translated by Google

Capítulo 6. Placas de rua e migalhas de pão

PROJETO DE NAVEGAÇÃO

E você pode encontrar-se | em uma bela casa | com uma bela esposa E você pode se
perguntar | Bem... | Como eu cheguei aqui?!

—TALKING HEADS, “UMA VEZ NA VIDA”

É um fato:

As pessoas não usarão seu site se não conseguirem orientá-lo.

Você sabe disso por sua própria experiência como usuário da Web. Se você for a um site
e não conseguir encontrar o que está procurando ou descobrir como o site está
organizado, é provável que não fique muito tempo — ou volte. Então, como você cria a
proverbial navegação “clara, simples e consistente”?

Cena de um shopping

Imagine isto: é sábado à tarde e você está indo ao shopping comprar uma motosserra.

Ao passar pela porta da Sears, você está pensando: “Hmmm. Onde eles guardam
motosserras?” Assim que você entra, você começa a olhar para os nomes dos
departamentos, no alto das paredes. (Eles são grandes o suficiente para que você possa lê-
los de toda a loja.)

“Hmmm”, você pensa, “Ferramentas? Ou Gramado e Jardim?” Pode ser qualquer um, mas
você tem que começar em algum lugar para ir na direção de Ferramentas.
Ao chegar ao departamento de Ferramentas, você começa a olhar as placas no final de
cada corredor.
Machine Translated by Google

Quando você acha que está no corredor certo, começa a olhar para os produtos
individuais.

Se descobrir que você adivinhou errado, você tenta outro corredor ou pode voltar
e começar de novo no departamento de Gramado e Jardim. Por mim, você
terminou, o processo se parece com isso:
Machine Translated by Google

Basicamente, você usa os sistemas de navegação da loja (os letreiros e a


hierarquia organizacional que os letreiros incorporam) e sua capacidade de vasculhar
prateleiras cheias de produtos para encontrar o que está procurando.

Claro, o processo real é um pouco mais complexo. Por um lado, quando você entra pela
porta, geralmente dedica alguns microssegundos a uma decisão crucial: você vai começar
procurando por motosserras por conta própria ou vai perguntar a alguém onde eles estão?
Machine Translated by Google

É uma decisão baseada em uma série de variáveis – o quanto você está familiarizado com a
loja, o quanto você confia na capacidade dela de organizar as coisas com sensatez, o quanto
você está com pressa e até mesmo o quão sociável você é.

Quando levamos em consideração essa decisão, o processo se parece com isso:

Observe que, mesmo que você comece a procurar por conta própria, se as coisas não
derem certo, há uma boa chance de que, eventualmente, você acabe pedindo orientações a
alguém de qualquer maneira.
Machine Translated by Google

Navegação na Web 101

De muitas maneiras, você passa pelo mesmo processo ao entrar em um site.


Você geralmente está tentando encontrar algo. No mundo “real” pode ser a sala
de emergência ou um bolo de ketchup do tamanho de uma família. Na Web, pode
ser um par de fones de ouvido ou o nome do ator de Casablanca que interpretou o
garçom-chefe do Rick's.1

1 SZ “Cuddles” Sakall, nascido Eugene Sakall em Budapeste em 1884. Ironicamente, a maioria dos atores de
personagens que interpretaram os habitantes nazistas do Rick's Café eram na verdade atores europeus
famosos de teatro e cinema que desembarcaram em Hollywood fugindo dos nazistas.

Você decide se quer perguntar primeiro ou navegar primeiro. A diferença é que


em um site não há ninguém por perto que possa lhe dizer onde estão as coisas. O
equivalente na Web de pedir direcons é pesquisar — digitar uma descrição do que
você está procurando em uma caixa de pesquisa e retornar uma lista de links para
lugares onde possa estar.

Algumas pessoas (Jakob Nielsen os chama de usuários “dominantes de pesquisa”)


quase sempre procuram uma caixa de pesquisa assim que entram em um site. (Essas podem
ser as mesmas pessoas que procuram o balconista mais próximo assim que entram em uma
loja.)

Outras pessoas (os usuários “dominantes de links” da Nielsen) quase sempre navegarão
primeiro, pesquisando apenas quando esgotarem os links prováveis para clicar ou quando
estiverem suficientemente frustrados com o site.
Machine Translated by Google

Para todos os outros, a decisão de começar navegando ou pesquisando depende de seu


estado de espírito atual, da pressa em que estão e se o site parece ter uma navegação
navegável decente.
Se você optar por navegar, você percorre uma hierarquia, usando sinais
para guiá-lo. Normalmente, você procura na página inicial uma lista dos principais
segundos do site (como as placas de departamento da loja) e clica no que parece
certo.

Em seguida, você escolherá na lista de subsecons.

Com alguma sorte, depois de mais um ou dois cliques, você terá uma lista do tipo de
coisa que está procurando.

Em seguida, você pode clicar nos links individuais para examiná-los em detalhes,
da mesma forma que tiraria os produtos da prateleira e leria os rótulos.
Eventualmente, se você não encontrar o que está procurando, você irá embora.
Isso é tão verdadeiro em um site quanto na Sears. Você sairá quando estiver
convencido de que eles não conseguiram ou quando estiver frustrado demais para
continuar procurando.
Veja como é o processo:
Machine Translated by Google

A insuportável leveza da navegação


Procurar coisas em um site e procurá-las no mundo “real” tem muitas semelhanças.
Quando estamos explorando a Web, de certa forma, parece que estamos nos
movendo em um espaço físico. Pense nas palavras que usamos para descrever a
experiência, como “cruzeiro”, “navegação” e “surf”. E clicar em um link não “carrega” ou
“exibe” outra página – ele “leva você para” uma página.

Mas a experiência da Web está perdendo muitas das pistas em que confiamos a vida
toda para negociar espaços. Considere estas esquisitices do espaço da Web:
Machine Translated by Google

Sem noção de escala. Mesmo depois de usarmos um site extensivamente, a


menos que seja um site muito pequeno, tendemos a ter uma noção muito pequena de
quão grande ele é (50 páginas? 1.000? 17.000?).2 Pelo que sabemos, pode haver
cantos enormes nunca exploramos. Compare isso com uma revista, um museu ou
uma loja de departamentos, onde você sempre tem pelo menos uma noção aproximada
do que é visto/invisível.

2 Até mesmo as pessoas que gerenciam sites da Web geralmente têm uma ideia muito pequena do tamanho real de seus sites.

O resultado prático é que é muito difícil saber se você viu tudo de seu interesse em
um site, o que significa que é difícil saber quando parar de procurar.3

3 Esta é uma razão pela qual é útil para os links nos quais já clicamos para serem exibidos em uma cor diferente. Isso nos dá
uma pequena noção de quanto terreno cobrimos.

Nenhum senso de direção. Em um site, não há le e right, nem up e down.


Podemos falar sobre subir e descer, mas queremos dizer subir e descer na hierarquia
- para um nível mais geral ou mais específico.

Sem senso de localização. Nos espaços físicos, à medida que nos


deslocamos, acumulamos conhecimento sobre o espaço. Desenvolvemos um senso
de onde as coisas estão e podemos tomar atalhos para chegar até elas.
Podemos chegar às motosserras no primeiro eu seguindo as placas, mas no próximo
eu provavelmente pensaremos:
“Serras? Ah, sim, eu me lembro onde eles estavam: canto traseiro direito,
perto das geladeiras.”

E então vá direto para eles.


Machine Translated by Google

Mas na Web, seus pés nunca tocam o chão; em vez disso, você faz o seu caminho
clicando nos links. Clique em “Power Tools” e de repente você é teletransportado para o
corredor de Power Tools sem atravessar o espaço, sem olhar para as coisas ao longo do
caminho.
Quando queremos retornar a algo em um site da Web, em vez de confiar em um sentido
físico de onde está, temos que lembrar onde está na hierarquia conceitual e refazer nossos
passos.
Esta é uma das razões pelas quais os favoritos – atalhos pessoais armazenados –
são tão importantes, e porque o botão Voltar é o botão mais usado em navegadores
da Web.

Também explica por que o conceito de páginas iniciais é tão importante. As páginas
iniciais são – comparativamente – lugares fixos. Quando você está em um site, a página
inicial é como a Estrela do Norte. Ser capaz de clicar em Home lhe dá um novo começo.
Essa falta de fisicalidade é boa e ruim. No lado positivo, a sensação de ausência de peso
pode ser emocionante e explica em parte por que é tão fácil me perder de vista na web –
o mesmo que acontece quando estamos “perdidos” em um bom livro.

Pelo lado negativo, acho que explica por que usamos o termo “navegação na
Web”, embora nunca falemos sobre “navegação em loja de departamentos” ou “navegação
em biblioteca”. Se você procurar navegação em um diconário, trata-se de fazer duas coisas:
ir de um lugar para outro e descobrir onde você está.

Acho que falamos sobre navegação na Web porque “descobrir onde você está” é um
problema muito mais difundido na Web do que em espaços físicos.
Estamos inerentemente perdidos quando estamos na Web e não podemos espiar pelos
corredores para ver onde estamos. A navegação na web compensa essa falta de senso
de lugar incorporando a hierarquia do site, criando uma sensação de “lá”.

A navegação não é apenas um recurso de um site; é o site, da mesma forma que o


prédio, as prateleiras e as caixas registradoras são da Sears. Sem isso, não há lá.

A moral? A navegação na web tinha cerveja boa.


Machine Translated by Google

Os propósitos negligenciados da navegação

Dois dos propósitos da navegação são bastante óbvios: nos ajudar a encontrar o
que estamos procurando e nos dizer onde estamos.
Mas a navegação tem outras funções igualmente importantes - e facilmente esquecidas:

Ele nos diz o que está aqui. Ao tornar a hierarquia visível, a navegação nos diz o
que o site contém. Navegação revela conteúdo! E revelar o site pode ser ainda mais
importante do que nos orientar ou situar.
Ele nos diz como usar o site. Se a navegação está fazendo seu trabalho, ela lhe
diz implicitamente por onde começar e quais são suas opções. Feito corretamente,
deve ter todas as instruções que você precisa. (O que é bom, já que a maioria dos
usuários ignorará qualquer outra instrução de qualquer maneira.)
Isso nos dá confiança nas pessoas que o construíram. A cada momento que
estamos em um site, estamos mantendo uma contagem mental: “Esses caras sabem
o que estão fazendo?” É um dos principais fatores que usamos para decidir se
devemos sair e decidir se voltamos.
Uma navegação clara e bem pensada é uma das melhores oportunidades que um
site tem para causar uma boa impressão.

Convenções de navegação na web

Espaços físicos como cidades e prédios (e até espaços de informação como livros e
revistas) têm seus próprios sistemas de navegação, com convenções que evoluíram sobre
mim como placas de rua, números de página e títulos de capítulos. As convenções
especificam (vagamente) a aparência e a localização dos elementos de navegação para
que saibamos o que procurar e onde procurar quando precisarmos deles.

Puxá-los em um local padrão nos permite localizá-los rapidamente, com um


mínimo de esforço; padronizar sua aparência torna fácil diferenciá-los de todo o
resto.
Por exemplo, esperamos encontrar placas de rua nas esquinas, esperamos encontrá-las
olhando para cima (não para baixo) e esperamos que pareçam placas de rua (horizontais,
não vercais).
Machine Translated by Google

Também damos como certo que o nome de um edifício estará acima ou ao lado de
sua porta da frente. Em uma mercearia, esperamos encontrar placas perto das
extremidades de cada corredor. Em uma revista, sabemos que haverá um índice em
algum lugar nas primeiras páginas e números de página em algum lugar na margem
de cada página - e que eles se parecerão com um índice e números de página.

Pense em como é frustrante quando uma dessas convenções é quebrada


(quando as revistas não colocam números de página em páginas de anúncios,
por exemplo).
Embora sua aparência possa variar significativamente, estas são as
convenções básicas de navegação para a Web:
Machine Translated by Google

Não olhe agora, mas acho que está nos seguindo


Web designers usam o termo navegação persistente (ou navegação global) para
descrever o conjunto de elementos de navegação que aparecem em cada página de um site.
Machine Translated by Google

Feito corretamente, a navegação persistente deve dizer – de preferência com uma voz
calma e reconfortante:

“A navegação está por aqui. Algumas partes mudarão um pouco dependendo


de onde você estiver, mas sempre estará aqui e sempre funcionará da mesma
maneira.”

O simples fato de a navegação aparecer no mesmo lugar em todas as páginas com uma
aparência consistente lhe dá a confirmação instantânea de que você ainda está no mesmo site
– o que é mais importante do que você imagina. E mantê-lo igual em todo o site significa que
(espero) você só precisa descobrir como funciona uma vez.

A navegação persistente deve incluir os quatro elementos que você mais precisa ter sempre à
mão:

Veremos cada um deles em um minuto. Mas primeiro...

Eu disse cada página?


Eu menti. Há uma exceção à regra “siga-me em todos os lugares”: formulários.

Nas páginas em que um formulário precisa ser preenchido, a navegação persistente pode, às
vezes, ser uma distração desnecessária. Por exemplo, quando estou pagando minhas compras em
um site de comércio eletrônico, você não quer que eu faça nada além de terminar de preencher os
formulários. O mesmo acontece quando estou me registrando, assinando, dando feedback ou
marcando preferências de personalização.
Machine Translated by Google

Para essas páginas, é útil ter uma versão mínima da navegação persistente com
apenas o ID do site, um link para a página inicial e quaisquer Ulies que possam me ajudar a
preencher o formulário.

Agora eu sei que não estamos no Kansas

A ID do Site ou logotipo é como o nome de construção de um site. Na Sears, só preciso ver


o nome no caminho; assim que entro, sei que ainda estou na Sears até sair. Mas na Web –
onde meu principal meio de viagem é o teletransporte – preciso ver isso em todas as páginas.

Da mesma forma que esperamos ver o nome de um prédio na entrada frontal, esperamos ver
o ID do site no topo da página – geralmente no (ou pelo menos próximo) do canto superior
4
esquerdo.
4 ... em páginas da Web escritas para idiomas de leitura da esquerda para a direita.

Por quê? Porque o Site ID representa todo o site, o que significa que é a coisa mais alta na
hierarquia lógica do site.
Esse site
Segundos deste site
Subseguns
Machine Translated by Google

Sub-subseções, etc.
Esta página
Áreas desta página
Itens nesta página
E há duas maneiras de transmitir essa primazia na hierarquia visual da página: ou torná-
la a coisa mais proeminente na página, ou fazê-la enquadrar todo o resto.

Como você não quer que o ID seja o elemento mais proeminente na página (exceto,
talvez, na página inicial), o melhor lugar para ele - o lugar que tem menos probabilidade de
me fazer pensar - é no topo, onde enquadra a página inteira.

Além de estar onde esperávamos, o ID do site também precisa se parecer com um ID


do site. Isso significa que deve ter os atributos que nós
esperaria ver em um logotipo de marca ou na placa fora de uma loja: um tipo de letra
disncvo e um gráfico que é reconhecível em qualquer tamanho, de um botão a um outdoor.

Os segundos

Os segundos — alguns chamados de navegação primária — são os links para os


segundos principais do site: o nível superior da hierarquia do site.
Machine Translated by Google

Em alguns projetos a navegação persistente também incluirá espaço para exibir a


navegação secundária : a lista de subseções na segunda atual.

Em outros, apontar para um segundo nome ou clicar nele revela um menu suspenso. E
em outros, clicar leva você para a primeira página do segundo, onde você encontrará a
navegação secundária.

Os Ulies
Ulies são os links para elementos importantes do site que não fazem parte da hierarquia de
conteúdo.

Essas são coisas que podem me ajudar a usar o site (como Entrar/Registrar, Ajuda, um
Mapa do Site ou um Carrinho de Compras) ou fornecer informações sobre seu editor
(como Sobre Nós e Fale Conosco).
Como as placas para as instalações de uma loja, a lista Ulies deve ser um pouco menos
proeminente do que a Secons.

Ulies irá variar para diferentes tipos de sites. Para um site corporativo ou de comércio
eletrônico, por exemplo, eles podem incluir qualquer um dos seguintes:
Sobre nós
Arquivos
Confira
Machine Translated by Google

Informação da companhia

Contate-nos

Atendimento ao Cliente

Quadros de discussão

Transferências

Diretório

Fóruns

Perguntas frequentes

Ajuda

Casa

Relações com Investidores

Como comprar

Empregos

Meu _______

Notícia

Acompanhamento de pedidos

Comunicados de imprensa

Política de Privacidade

Registro

Procurar

Carrinho de compras

Entrar

Mapa do site

Localizador de lojas

Sua conta

Via de regra, a navegação persistente pode acomodar apenas quatro ou cinco Ulies – aqueles que os

usuários provavelmente mais precisam. Se você tentar espremer mais do que isso, eles tendem a se perder na

multidão. Os leovers usados com menos frequência pertencem ao rodapé: os pequenos links de texto na barra de

cada página.
Machine Translated by Google

Basta bater os calcanhares três vezes e dizer: "Não há lugar como o lar"

Um dos itens mais cruciais na navegação persistente é um botão ou link que me leva à
página inicial do site.
Ter um botão Home à vista o tempo todo oferece a garantia de que, não importa o quão
perdido eu possa ficar, sempre posso começar de novo, como pressionar um botão Reset
ou usar um cartão “Saia da prisão”.
Quase todos os usuários da Web esperam que o ID do site seja um botão que pode levá-
lo à página inicial. Acho que também é uma boa ideia incluir Home com os principais
segundos do site.

Uma forma de pesquisar

Dado o poder da pesquisa e o número de pessoas que preferem pesquisar a


navegar, a menos que um site seja muito pequeno e muito bem organizado, cada
página deve ter uma caixa de pesquisa ou um link para uma página de pesquisa. E, a
menos que haja um motivo muito pequeno para pesquisar em seu site, deve ser uma
caixa de pesquisa.

Lembre-se de que, para uma grande porcentagem de usuários, seu primeiro ato oficial ao
acessar um novo site será verificar a página em busca de algo que corresponda a um
destes três padrões:

É uma fórmula simples: uma caixa, um botão e a palavra “Pesquisar” ou o ícone de lupa
universalmente reconhecido. Não torne isso difícil para eles – vá para a fórmula. Em
particular, evite palavras extravagantes. Eles estarão procurando a palavra "Pesquisar",
então use a palavra Pesquisar, não Encontrar, Pesquisa rápida, Pesquisa rápida
ou Pesquisa por palavra-chave.
(Se você usar “Pesquisar” como o rótulo da caixa, use a palavra “Ir” como o nome
do botão.)

Instruções. Se você seguir a fórmula, qualquer pessoa que tenha usado a


Web por mais de alguns dias saberá o que fazer. Adicionar “Digite uma palavra-
chave” é como dizer “Deixe uma mensagem no bipe” em sua mensagem de correio
de voz: Houve um eu quando foi necessário, mas agora isso faz você parecer sem
noção.
Machine Translated by Google

Ops. Se houver qualquer possibilidade de confusão sobre o escopo da pesquisa (o que está
sendo pesquisado: o site, parte do site ou toda a Web), descreva-o.

Mas pense com muito cuidado antes de me dar opções para limitar o escopo (para pesquisar
apenas o segundo atual do site, por exemplo). E também tenha cuidado ao fornecer opções
sobre como eu especifico o que estou procurando (pesquisar por título ou por autor, por
exemplo, ou pesquisar por número de peça ou por nome de produto).

Raramente vejo um caso em que a recompensa potencial de adicionar opções à caixa de


pesquisa persistente vale o custo de me fazer descobrir quais são as opções e se preciso
usá-las (ou seja, me fazer pensar).

Se você quiser me dar a opção de escopo da pesquisa, dê-me quando for útil - quando
eu chegar à página de resultados da pesquisa e descobrir que pesquisar tudo resultou em
muitos resultados, então eu preciso limitar o escopo.

Secundário, terário, e o que vier aer terário


Aconteceu tantas vezes que eu já esperava por isso: quando designers com quem não
trabalhei antes me enviam designs de página preliminares para que eu possa verificar problemas
de usabilidade, quase inevitavelmente recebo um fluxograma que mostra um site com quatro
níveis de profundidade...

...e páginas de amostra para a página inicial e os dois níveis superiores.


Machine Translated by Google

Casa

Página de segundo nível

Página subsegunda
Machine Translated by Google

Continuo folheando as páginas procurando mais, ou pelo menos o lugar onde rabiscou
“Alguma mágica acontece aqui”, mas nunca encontro nem isso. Acho que esse é um dos
problemas mais comuns em web design (especialmente em sites maiores): deixar de dar à
navegação de nível inferior a mesma atenção que a superior. Em tantos sites, assim que
você passa do segundo nível, a navegação se desfaz e se torna ad hoc. O problema é tão
comum que é difícil encontrar bons exemplos de navegação de terceiro nível.

Por que isso acontece?


Em parte, eu acho, porque uma boa navegação em vários níveis é simplesmente
difícil de projetar – dada a quantidade limitada de espaço na página e o número de
elementos que precisam ser espremidos.
Em parte porque os designers geralmente nem me têm o suficiente para descobrir os dois
primeiros níveis.

Em parte porque simplesmente não parece tão importante. (Afinal, quão importante pode
ser? Não é primário. Não é nem mesmo secundário.) E há uma tendência de pensar que
por mim as pessoas vão tão longe no site, eles vão entender como ele funciona.

E depois há o problema do conteúdo de amostra geng e exemplos de hierarquia


para páginas de nível inferior. Mesmo que os designers perguntem, eles provavelmente
não os receberão, porque as pessoas responsáveis pelo conteúdo geralmente também
não pensaram nas coisas tão longe.
Mas a realidade é que os usuários geralmente acabam gastando tanto comigo em páginas
de nível inferior quanto no topo. E a menos que você tenha trabalhado a navegação de
ponta a ponta desde o início, é muito difícil aprimorá-la mais tarde e chegar a algo
consistente.
A moral? É vital ter páginas de amostra que mostrem a navegação para todos os níveis
de potencial do site antes de começar a discutir sobre o esquema de cores.

Nomes de página, ou Por que eu amo dirigir em LA

Se você já passou por mim em Los Angeles, você entende que não é apenas uma letra
de música – LA é realmente uma grande rodovia. E porque as pessoas em LA levam a
sério a condução, eles têm as melhores placas de rua que eu já vi. Em Los Angeles,
Machine Translated by Google

As placas de rua são grandes. Quando você está parado em um cruzamento, você
pode ler o sinal para a próxima rua transversal.
Eles estão no lugar certo – pendurados na rua em que você está dirigindo, então
tudo que você precisa fazer é olhar para cima.

Agora, admito que sou um otário para esse tipo de tratamento, porque venho de Boston,
onde você se considera sortudo se conseguir ler a placa da rua enquanto ainda tenho tempo
para fazer a curva.

O resultado? Quando estou dirigindo em Los Angeles, dedico menos energia e esforço
para lidar com o local onde estou e mais para o trânsito, conversas e ouvir All Things
Considered. Eu amo dirigir em LA
Os nomes das páginas são os sinais de rua da Web. Assim como com as placas de rua,
quando as coisas estão indo bem, posso não notar os nomes das páginas. Mas assim que
começo a sentir que posso não estar indo na direção certa, preciso ser capaz de identificar
o nome da página sem esforço para poder me orientar.

Há quatro coisas que você precisa saber sobre nomes de páginas:


Cada página precisa de um nome. Assim como cada esquina deve ter uma placa
de rua, cada página deve ter um nome.

Alguns designers pensam: “Bem, nós destacamos o nome da página na navegação.


Isso é bom o suficiente.” É uma ideia tentadora porque
Machine Translated by Google

pode economizar espaço e é um elemento a menos para trabalhar no layout da página, mas
não é suficiente. Você também precisa de um nome de página.

O nome precisa estar no lugar certo. Na hierarquia visual da página, o nome da página
deve parecer enquadrar o conteúdo exclusivo dessa página. (Afinal, é isso que está
nomeando - não a navegação ou os anúncios, que são apenas a infraestrutura.)

O nome precisa ser proeminente. Você quer que a combinação de posição,


tamanho, cor e tipo de letra faça o nome dizer “Este é o título da página inteira”. Na
maioria dos casos, será o maior texto da página.

O nome precisa corresponder ao que eu cliquei. Mesmo que ninguém o mencione,


todo site faz um contrato social implícito com seus visitantes:

O nome da página corresponderá às palavras que cliquei para chegar lá.

Em outras palavras, se eu clicar em um link ou botão que diz “purê de batata quente”,
o site me levará a uma página chamada “purê de batata quente”.

Pode parecer trivial, mas na verdade é um acordo crucial. Cada vez que um site o viola, sou
forçado a pensar, mesmo que apenas por milissegundos: “Por que essas duas coisas são
diferentes?” E se houver uma grande discrepância entre o nome do link e o nome da página ou
muitas pequenas discrepâncias, minha confiança no site – e a competência das pessoas que o
publicam – será diminuída.
Machine Translated by Google

Claro, algumas vezes você tem que se comprometer, geralmente por causa de
limitações de espaço. Se as palavras em que clico e o nome da página não
corresponderem exatamente, o importante é que (a) elas correspondam o mais próximo
possível e (b) a razão para a diferença seja óbvia. Por exemplo, se eu clicar nos botões
“Gis for Him” e “Gis for Her” e receber páginas intituladas “Gis for Men” e “Gis for
Women”, mesmo que as palavras não sejam idênticas, elas parecem tão equivalentes
que eu não vou pensar na diferença.

"Você está aqui"

Uma das maneiras pelas quais a navegação pode neutralizar o sentimento


inerente de “perdido no espaço” da Web é mostrando-me onde estou no esquema
das coisas, da mesma forma que um indicador “Você está aqui” no mapa de um
shopping center – ou um Parque Nacional.
Machine Translated by Google

©2000. The New Yorker Collecon de cartoonbank.com. Todos os direitos reservados.

Na Web, isso é feito destacando minha localização atual em quaisquer barras,


listas ou menus de navegação que apareçam na página.

Neste exemplo, o segundo atual (Bedroom) e o subsecon (Lighng) foram ambos


“marcados”.
Há várias maneiras de destacar a localização atual:

A falha mais comum dos indicadores “Você está aqui” é que eles são muito
sutis. Eles precisam se destacar; se não o fizerem, perdem seu valor como pistas
visuais e acabam apenas adicionando mais ruído à página. Uma forma de garantir
Machine Translated by Google

que eles se destacam é aplicar mais de um contraste visual – por exemplo, uma
cor diferente e um texto em negrito.

Dicas visuais muito sutis são, na verdade, um problema muito comum. Os designers adoram
dicas sutis, porque a sutileza é uma das características do design sofisticado. Mas os usuários
da Web geralmente estão com tanta pressa que muitas vezes perdem pistas sutis.

Em geral, se você é um designer e acha que uma dica visual está saindo como um polegar
dolorido, provavelmente significa que você precisa torná-la duas vezes mais proeminente.

Migalhas de pão

Assim como os indicadores “Você está aqui”, o Breadcrumbs mostra onde você está.

Chamam-se Breadcrumbs porque lembram o rastro de migalhas que Hansel deixou


na floresta para que ele e Gretel pudessem encontrar o caminho de volta para casa.5

5 Na história original, a madrasta de H&G convence seu pai a perdê-los na floresta durante a escassez
de alimentos para que toda a família não tenha que passar fome. O desconfiado e engenhoso H estraga
a trama jogando pedrinhas no caminho e seguindo-os para casa. Mas o próximo eu (!) H é forçado a
usar migalhas de pão, o que prova ser um substituto menos do que adequado, já que os pássaros os
comem antes que H & G possa refazer seus passos. Eventualmente, a história se transforma em
canibalismo tentado, furto e imolação, mas basicamente é uma história sobre como é desagradável
estar perdido.

Breadcrumbs mostram o caminho da página inicial até onde você está e facilitam a volta
para níveis mais altos na hierarquia de um site.
Machine Translated by Google

Para mim, Breadcrumbs era uma raridade, encontrada apenas em sites que eram apenas
bancos de dados enormes com hierarquias muito profundas. Mas hoje em dia eles aparecem
em mais e mais sites, algumas vezes no lugar de uma navegação bem pensada.

Feito corretamente, Breadcrumbs são autoexplicativos, não ocupam muito espaço e


fornecem uma maneira conveniente e consistente de fazer duas das coisas que você
mais precisa fazer: fazer backup de um nível ou ir para casa. Eles são mais úteis em um site
grande com uma hierarquia profunda.

Aqui estão algumas práticas recomendadas para implementá-las:


Coloque-as no topo. As migalhas de pão parecem funcionar melhor se estiverem no
topo da página. Acho que isso provavelmente ocorre porque literalmente os marginaliza
– fazendo com que pareçam um acessório, como números de página em um livro ou
revista.
Use > entre os níveis. Tentativa e erro parecem ter mostrado que o melhor
separador entre os níveis é o caractere “maior que” (>), provavelmente porque
sugere visualmente a lua para a frente através dos níveis.

Negrito o último item. O último item da lista deve ser o nome do


a página atual, e torná-la em negrito dá-lhe o destaque que merece. E porque
é a página em que você está, naturalmente não é um link.

Três razões pelas quais eu ainda amo guias

Eu não fui capaz de provar isso (ainda), mas suspeito fortemente que Leonardo da Vinci
inventou divisórias em algum momento no final do século XV. No que diz respeito aos
dispositivos de interface, eles são claramente um produto de gênio.

As guias são um dos poucos casos em que o uso de uma metáfora física em uma interface
de usuário realmente funciona. Como os divisores de abas em um fichário de três argolas ou
abas em pastas em uma gaveta de arquivos, eles dividem tudo o que estão tirando em
segundos. E eles facilitam a abertura de um segundo acessando sua guia (ou, no caso da
Web, clicando nela).
Acho que são uma excelente e pouco utilizada escolha de navegação. Aqui está porque eu
gosto deles:
Machine Translated by Google

Eles são auto-evidentes. Eu nunca vi ninguém – não importa quão


“analfabeto de computador” – olhar para uma interface com abas e dizer: “Hmmm.
Eu me pergunto o que eles fazem?”

Eles são difíceis de perder. Quando faço testes de usabilidade, fico surpreso com a
forma como muitas pessoas podem ignorar as barras de navegação horizontais no
topo de uma página da Web. Mas as guias são tão visualmente distintas que são
difíceis de ignorar. E como eles são difíceis de confundir com qualquer coisa que não
seja navegação, eles criam o tipo de divisão óbvia que você deseja entre navegação
e conteúdo.

Eles são lisos. Web designers estão sempre lutando para tornar as páginas
visualmente mais interessantes. Se feito corretamente, as guias podem adicionar
polimento e servir a um propósito útil.

No entanto, se você for usar guias, precisará fazê-las corretamente.

Para que as guias funcionem com efeito total, os gráficos precisam criar a ilusão visual de que
a guia ativa está na frente das outras guias. Esta é a principal coisa que faz com que pareçam
guias - ainda mais do que a forma de guia disncva.

Para criar essa ilusão, a aba ativa precisa ter uma cor diferente ou um tom
contrastante e deve se conectar fisicamente com o espaço abaixo dela.
Isso é o que faz a aba acve “pop” para a frente.

Experimente o teste do tronco

Agora que você tem uma noção de todas as partes móveis, você está pronto para tentar meu
teste ácido para uma boa navegação na Web. É assim que acontece: imagine que você foi

vendado e trancado no porta-malas de um carro, depois dirigiu por um tempo e foi jogado em
uma página em algum lugar nas entranhas de um site. Se a página for bem projetada, quando
sua visão clarear, você poderá responder a essas perguntas sem hesitação:
Machine Translated by Google

Que site é esse? (Identificação de site)

Em que página estou? (Nome da página)

Quais são os principais segundos deste site? (Segundos)

Quais são minhas opções neste nível? (Navegação local)

Onde estou no esquema das coisas? (indicadores "Você está aqui")

Como posso pesquisar?

Por que o mof Goodfellas ? Porque é tão fácil esquecer que a experiência na Web é mais como ser

abduzido do que seguir um caminho de jardim.

Quando você está criando páginas, é tentador pensar que as pessoas irão alcançá-las começando na página

inicial e seguindo os caminhos legais e organizados que você definiu. Mas a realidade é que muitas vezes

caímos no meio de um site sem ter ideia de onde estamos porque seguimos um link de um mecanismo de
pesquisa, um site de rede social ou e-mail de um amigo, e nunca vi o esquema de navegação deste site antes.

E a venda? Você quer que sua visão fique um pouco embaçada, porque o verdadeiro teste não é se você pode

descobrir com o suficiente de mim e um escrutínio próximo. O padrão precisa ser que esses elementos saiam

da página com tanta clareza que não importa se você está olhando de perto ou não. Você quer confiar apenas na

aparência geral das coisas, não nos detalhes.

Veja como você executa o teste de tronco:

Passo 1: Escolha uma página em qualquer lugar do site aleatoriamente e imprima-a.

Passo 2: Segure-o no comprimento do braço ou aperte os olhos para que você não possa realmente estudá-lo

de perto.

Etapa 3: o mais rápido possível, tente encontrar e circule cada um desses itens:

Identificação de site

Nome da página

Segundos (navegação primária)

navegação local

Indicador(es) "Você está aqui"

Procurar
Machine Translated by Google

Experimente em seu próprio site e veja como funciona. Em seguida, peça a alguns amigos para
experimentá-lo também. Você pode se surpreender com os resultados.
Machine Translated by Google

Capítulo 7. A Teoria do Big Bang do Web Design

A IMPORTÂNCIA DE FAZER AS PESSOAS COM O PÉ DIREITO

Lucy, você tem algumas explicações para fazer.

—DESI ARNAZ, COMO RICKY RICARDO

Projetar uma página inicial me lembra o clássico programa de TV Beat the Clock.

Cada concorrente ouvia pacientemente enquanto o apresentador Bud Collyer explicava a


“dublê” que ela tinha que realizar. Por exemplo, “Você tem 45 segundos para jogar cinco desses
balões de água no coador amarrado à sua cabeça”.

A façanha sempre parecia complicada, mas factível com um pouco de sorte.

Mas então, assim que o competidor estava pronto para começar, Bud sempre acrescentava:
“Ah, há apenas mais uma coisa: você tem que fazer isso... com os olhos vendados”. Ou
“...debaixo d'água”. Ou “...na dimensão fih.”

Bud Collyer oferece palavras de encorajamento a um competidor corajoso

É assim com a página inicial. Quando você pensa que cobriu todas as bases, sempre há
apenas uma... mais... coisa.

Pense em todas as coisas que a página inicial deve acomodar:


Machine Translated by Google

Identidade e missão do site. Logo de cara, a página inicial tem que me dizer que site é
este e para que serve – e se possível, por que eu deveria estar aqui e não em algum outro
site.

Hierarquia de sites. A página inicial deve fornecer uma visão geral do que o site tem a
oferecer - conteúdo ("O que posso encontrar aqui?") e recursos ("O que posso fazer aqui?")
- e como tudo está organizado. Isso geralmente é tratado pela navegação persistente.

Procurar. A maioria dos sites precisa ter uma caixa de pesquisa exibida em destaque na
página inicial.

Provocações. Como a capa de uma revista, a página inicial precisa me cercar com dicas
das “coisas boas” dentro.

As promoções de conteúdo destacam os conteúdos mais recentes, melhores ou mais


populares, como as principais notícias e ofertas quentes.

Promoções de recursos me convidam a explorar seções adicionais do site ou experimentar


recursos.

Conteúdo oportuno. Se o sucesso do site depende da minha volta, a página inicial


provavelmente precisa ter algum conteúdo que seja atualizado com frequência. E mesmo
um site que não precisa de visitantes regulares precisa de alguns sinais de vida - mesmo
que seja apenas um link para um comunicado de imprensa recente - para me sinalizar que
não está abandonado ou irremediavelmente desatualizado.
Machine Translated by Google
Machine Translated by Google

Ofertas. O espaço da página inicial precisa ser alocado para quaisquer


acordos de publicidade, promoção cruzada e co-branding que tenham sido feitos.
Atalhos. Os conteúdos mais solicitados (atualizações de software, por exemplo)
podem merecer seus próprios links na página inicial para que as pessoas não
precisem procurá-los.
Registro. Se o site usa registro, a página inicial precisa de links ou caixas de
texto para novos usuários se registrarem e usuários antigos para entrar e uma
maneira de me informar que estou conectado (“Bem-vindo de volta, Steve Krug”).
Além dessas necessidades concretas, a página inicial também deve atender a alguns
objetivos abstratos:
Mostre-me o que estou procurando. A página inicial precisa deixar claro
como chegar ao que eu quero – supondo que esteja em algum lugar do site.

...e o que eu não estou procurando. Ao mesmo tempo, a página inicial precisa
me expor a algumas das coisas maravilhosas que o site tem a oferecer e que
podem me interessar - mesmo que eu não esteja procurando ativamente por elas.

Mostre-me por onde começar. Não há nada pior do que encontrar uma nova
página inicial e não ter ideia por onde começar.
Estabelecer credibilidade e confiança. Para alguns visitantes, a página inicial
será a única chance de seu site criar uma boa impressão.

E você tem que fazer isso... de olhos vendados

Como se isso não bastasse, tudo tem que ser feito em condições adversas. Algumas
das restrições usuais:

Todo mundo quer um pedaço dele. Como é provável que seja a página vista por
mais visitantes do que qualquer outra — e a única página que alguns visitantes
verão —, as coisas que são promovidas com destaque na página inicial tendem a
obter um tráfego significativamente maior.
Como resultado, a página inicial é a propriedade à beira-mar da Web: é o imóvel
mais desejável, e há uma oferta muito limitada.
Todo mundo que tem uma participação no site quer uma promoção ou um link para
seu segundo na página inicial, e os fardos de grama para a página inicial
Machine Translated by Google

visibilidade pode ser feroz. Às vezes, quando olho para uma página inicial, sinto-me como
o garoto em O Sexto Sentido: “Eu vejo as partes interessadas”.

“Site da Universidade” | xkcd. com

O resultado do design pelas partes interessadas.

O diagrama de Venn não é totalmente preciso: alguns sites de universidades não têm o nome
completo da escola na página inicial.

E dada a tendência da maioria dos usuários de escanear a página apenas o suficiente para
encontrar um link interessante, a quantidade comparativamente pequena de espaço “acima
da dobra” na página inicial é a propriedade preferida à beira-mar, ainda mais disputada.

Muitos cozinheiros. Como a página inicial é muito importante, é a única página sobre a qual
todos (até mesmo o CEO) têm uma opinião.

Um tamanho serve para todos. Ao contrário das páginas de nível inferior, a página
inicial deve atrair todos que visitam o site, independentemente da diversidade de seus
interesses.
Machine Translated by Google

A primeira vítima da guerra


Dado tudo o que a página inicial precisa realizar, se um site é complexo, mesmo o melhor
design da página inicial não pode fazer tudo. Projetar uma página inicial inevitavelmente
envolve compromisso. E à medida que os compromissos são resolvidos e a pressão
aumenta para espremer apenas mais uma coisa, algumas coisas inevitavelmente se
perdem na confusão.
A única coisa que você não pode perder na confusão – e a coisa que mais se perde
– é transmitir o quadro geral. Sempre que alguém me entrega um design de página
inicial para ver, há uma coisa com a qual quase sempre posso contar: eles não
deixaram claro o suficiente qual é o site.
O mais rápido e claro possível, a página inicial precisa responder às quatro perguntas que
tenho na minha cabeça quando entro em um novo site pela primeira vez:

Eu preciso ser capaz de responder a essas perguntas de relance, corretamente e


sem ambiguidade, com muito pouco esforço.
Se não estiver claro para mim o que estou vendo nos primeiros segundos,
interpretar todo o resto da página é mais difícil, e as chances são maiores de
interpretar algo errado e ficar frustrado.
Mas se eu “entender”, é muito mais provável que interprete corretamente tudo o que
vejo na página, o que aumenta muito minhas chances de ter uma experiência satisfatória
e bem-sucedida.
Isso é o que eu chamo de Teoria do Big Bang do Web Design. Assim como a Teoria
do Big Bang, ela se baseia na ideia de que os primeiros segundos que você passa em um
novo site ou página da Web são críticos.
Machine Translated by Google

Sabemos agora por um experimento muito elegante (procure por “Aenon Web Designers:
você tem 50 milissegundos para causar uma boa primeira impressão!”) que muita coisa
acontece assim que você abre uma página. Por exemplo, você dá uma olhada rápida (em
milissegundos) e forma uma série de impressões gerais: Parece bom? Há muito conteúdo
ou um lile? Existem regiões claras da página? Quais te interpretam?

A coisa mais interessante sobre o experimento foi que eles mostraram que essas impressões
iniciais tendiam a ser muito semelhantes às impressões que as pessoas tinham depois que elas
realmente tinham a chance de me passar na página. Em outras palavras, fazemos julgamentos
rápidos, mas eles tendem a ser um preditor confiável de nossas avaliações mais fundamentadas.

Isso não quer dizer que nossa compreensão inicial das coisas esteja sempre certa. Na
verdade, uma das coisas que mais vi em testes de usabilidade é que as pessoas formam
ideias sobre o que as coisas são e como elas funcionam que são simplesmente erradas.
Então eles usam esses primeiros pedaços de “conhecimento” para ajudar a interpretar tudo
o que veem.

Se suas primeiras suposições estiverem erradas (“Este é um site para ____”), eles começam
a tentar encaixar essa explicação à força em tudo o que encontram. E se estiver errado, eles
acabarão criando mais interpretações errôneas. Se as pessoas estão perdidas quando
começam, elas geralmente continuam geng...loster.

É por isso que é tão crucial que você os coloque com o pé direito, certificando-se de que
eles estejam claros no quadro geral.

Não me entenda mal: todo o resto é importante. Você precisa me impressionar , me cercar,
me direcionar e me expor aos seus negócios. Mas essas coisas não passarão despercebidas;
sempre haverá muitas pessoas – dentro e fora da equipe de desenvolvimento – cuidando para
que eles sejam feitos. Com demasiada frequência, porém, ninguém tem interesse em passar o
ponto principal.

As quatro principais desculpas plausíveis para não explicar o quadro geral no


Pagina inicial
Machine Translated by Google

Mas... a página inicial ? Sério?


Eu sei o que alguns de vocês estão pensando:

“Ninguém mais entra em um site pela página inicial. Isso é tão 2004.”

E você está certo, claro. Em comparação com os primeiros dias da Web, a página inicial
perdeu sua proeminência. Agora, as pessoas têm a mesma probabilidade – ou mais
probabilidade – de entrar em seu site clicando em um link em um e-mail, blog ou algo de
uma rede social que as leve diretamente a uma página profunda em seu site.

Por causa disso, cada página do seu site deve fazer o máximo possível para orientá-los
adequadamente: para dar a eles a ideia certa sobre quem você é, o que faz e o que seu site
tem a oferecer.

O problema é, porém, que não há muito espaço na maioria das páginas para fazer isso bem.
Como resultado, muitos usuários formaram um novo comportamento.

As pessoas se teletransportarão para as profundezas de um site e olharão para a página


para a qual o link as levou. Muito oen, porém, a próxima coisa que eles vão fazer é visitar o Home
Machine Translated by Google

página para se orientar. (Gosto de pensar nisso como mergulhadores subindo à


superfície para ver onde estão.) Se a página que eles visitaram foi interessante, eles
querem ver o que mais está no site. Se contivesse informações nas quais eles
precisam confiar, eles podem querer descobrir quem as publica e quão credível é.

A página inicial ainda é o lugar onde isso acontece, e você precisa fazê-lo bem.

Como passar a mensagem


Tudo na página inicial pode contribuir para nossa compreensão do que é o site. Mas há
três lugares importantes na página onde esperamos encontrar declarações explícitas
sobre o assunto do site.
O slogan. Uma das partes mais valiosas dos imóveis é o espaço ao lado do ID
do site. Quando vemos uma frase visualmente conectada ao ID, sabemos que é
para ser um slogan e, portanto, a lemos como uma descrição de todo o site.
Veremos os slogans em detalhes no próximo segundo.

A sinopse de boas-vindas. A sinopse de boas-vindas é uma descrição concisa


do site, exibida em um bloco de destaque na página inicial, geralmente na parte
superior ou no centro do espaço do conteúdo, por isso é a primeira coisa que
chama sua atenção.
Machine Translated by Google

O “Saiba mais”. Produtos e modelos de negócios inovadores tendem a exigir


uma boa quantidade de explicações, muitas vezes mais do que a maioria das
pessoas tem paciência. Mas as pessoas se acostumaram a assistir a vídeos
curtos em seus computadores e dispositivos móveis. Como resultado, as
pessoas agora esperam um pequeno vídeo explicativo na maioria dos sites e
estão dispostas a assisti-los.
A questão não é que todos usem esses três elementos — ou mesmo que todos os
percebam. A maioria dos usuários provavelmente tentará adivinhar qual é o site
primeiro a partir do conteúdo geral da página inicial. Mas se eles não conseguirem
adivinhar, você quer ter algum lugar na página onde eles possam descobrir.

Aqui estão algumas diretrizes para transmitir a mensagem:


Use tanto espaço quanto necessário. A tentação é não querer usar nenhum
espaço porque (a) você não pode imaginar que alguém não saiba o que é este
site, e (b) todos estão clamando para usar o espaço da página inicial para outros
propósitos.
Veja o Kickstarter.com, por exemplo. Por causa de sua nova proposta, o
Kickstarter tem muitas 'explicações' para fazer, então eles sabiamente usam
muito espaço da página inicial para fazê-lo. Quase todos os elementos da
página ajudam a explicar ou reforçar o assunto do site.
Machine Translated by Google

O Kickstarter pode não ter um slogan (a menos que seja “Traga a criatividade para a
vida”), mas eles colocam uma quantidade admirável de esforço para garantir que as
pessoas entendam o que fazem e como funciona.

“O que é Kickstarter?” é claramente o item de maior destaque na navegação primária.

...mas não use mais espaço do que o necessário. Para a maioria dos
sites, não há necessidade de usar muito espaço para transmitir a proposta básica,
e as mensagens que ocupam toda a página inicial geralmente são demais para
as pessoas se incomodarem em absorver de qualquer maneira. Mantenha-o curto
- apenas o suficiente para passar o ponto, e não mais. Não se sinta obrigado a
mencionar todos os grandes recursos, apenas alguns dos mais importantes.
Machine Translated by Google

Não use uma declaração de missão como uma sinopse de boas-vindas.


Muitos sites preenchem sua página inicial com sua declaração de missão
corporativa que parece ter sido escrita por uma finalista do Miss América. “XYZCorp
oferece soluções de classe mundial no campo florescente de blá blá blá blá blá...”
Ninguém os lê.
É uma das coisas mais importantes para testar. Você não pode confiar em
seu próprio julgamento sobre isso. Você precisa mostrar a página inicial para
pessoas de fora de sua organização para dizer se o design está fazendo este
trabalho porque o “ponto principal” é a única coisa que ninguém dentro da
organização notará que está faltando.

Nada supera um bom slogan!™


Um slogan é uma frase concisa que caracteriza todo o empreendimento, resumindo o que
é e o que o torna ótimo. Os slogans existem há muito tempo em publicidade, entretenimento
e publicação: “Milhares de carros em 1 e “Todos
preços incrivelmente baixos”, “Mais estrelas do que há nos céus”, o News That's
2
Fit to Print, por exemplo.
1 estúdios Metro-Goldwyn-Mayer, nas décadas de 1930 e 1940.

2 The New York Times. Eu tenho que confessar uma preferência pessoal pela versão paródia da revista
Mad : “Todas as notícias que cabem, nós imprimimos”.

Em um site, o slogan aparece logo abaixo, acima ou ao lado do ID do site.


Os slogans são uma maneira muito eficiente de transmitir sua mensagem, porque
são o único lugar na página onde os usuários mais esperam encontrar uma declaração
concisa do objetivo do site.
Alguns atributos para procurar ao escolher um slogan:
Bons slogans são claros e informativos e explicam exatamente o que seu site ou
sua organização faz.
Machine Translated by Google

Bons slogans são longos o suficiente, mas não muito longos. Seis a oito palavras
parecem ser longas o suficiente para transmitir um pensamento completo, mas curtas o
suficiente para serem absorvidas facilmente.

Bons slogans transmitem diferença e um benefício claro. Jakob Nielsen sugeriu que
um slogan realmente bom é aquele que ninguém mais no mundo poderia usar, exceto
você, e acho que é uma excelente maneira de olhar para isso.
Machine Translated by Google

Taglines ruins soam genéricos.

O NaonalGrid provavelmente pode se safar usando um moo em vez de um


slogan diferente, porque eles são uma utilidade pública com um público capve,
então a diferença não é um problema.

Não confunda um slogan com um moo, como “Damos vida às coisas boas”,
“Você está em boas mãos” ou “Para proteger e servir”. Um moo expressa um
princípio orientador, um objetivo ou um ideal, mas um slogan transmite uma
proposta de valor. Mooes são leais e reconfortantes, mas se eu não sei o que é,
um moo não vai me dizer.
Bons slogans são apresentáveis, animados e às vezes inteligentes. Inteligente
é bom, mas apenas se a esperteza ajudar a transmitir – não obscurecer – o
benefício.
Machine Translated by Google

Slogan? Nós não precisamos de nenhum slogan snking

Alguns sites podem sobreviver sem um slogan. Por


exemplo: o punhado relativo de sites que já alcançaram o status de
palavra familiar.
Sites que são muito conhecidos desde suas origens offline.
Pessoalmente, porém, eu diria que mesmo esses sites se beneficiariam de um
slogan. Afinal, não importa o quão conhecido você seja, por que deixar passar
uma chance discreta de dizer às pessoas por que elas estão no seu site? E
mesmo que um site venha de uma marca offline forte, a missão online nunca é
exatamente a mesma e é importante explicar a diferença.

A pergunta fih
Uma vez que eu saiba o que estou vendo, ainda há mais uma pergunta importante
que a página inicial deve responder para mim:
Machine Translated by Google

Quando entro em um novo site, após uma rápida olhada na página inicial, devo ser capaz
de dizer com confiança: Aqui é por onde começar se eu quiser pesquisar.

Aqui é por onde começar se eu quiser navegar.

Aqui é por onde começar se eu quiser provar suas melhores coisas.

Em sites que são construídos em torno de um processo passo a passo (candidatura


a uma hipoteca, por exemplo), o ponto de entrada para o processo deve saltar para mim. E
em sites onde eu tenho que me registrar se for um novo usuário ou fazer login se for um
usuário recorrente, os locais onde eu me registro ou login devem ser destacados.
Infelizmente, a necessidade de promover tudo (ou pelo menos tudo que suporta o modelo
de negócios desta semana) às vezes obscurece esses pontos de entrada. Pode ser difícil
encontrá-los quando a página está cheia de promoções gritando “Comece aqui!” e "Não,
clique em mim primeiro!"

A melhor maneira de evitar que isso aconteça é fazer os pontos de entrada parecerem
pontos de entrada (ou seja, fazer a caixa de pesquisa parecer uma caixa de pesquisa e a lista
de segundos parecer uma lista de segundos). Também ajuda a rotulá-los claramente, com
rótulos como “Pesquisar”, “Procurar por categoria”, “Fazer login” e “Começar aqui” (para um
processo passo a passo).
Machine Translated by Google

Por que Golden Geese faz esses alvos temporários


Há algo na página inicial que parece inspirar um comportamento míope. Quando assisto a
reuniões sobre design de página inicial, muitas vezes encontro a frase “matando o ganso
de ouro” passando pela minha cabeça.3
3 Sempre achei que a frase vinha da história de João e o Pé de Feijão. Na verdade, Jack's Giant tinha uma
gansa que botava ovos de ouro, mas ninguém tentou matá-la. A matança sem sentido ocorre em uma das
fábulas de Esopo, e não há muito a dizer, em termos de enredo: o homem encontra ganso, o homem fica
ganancioso, o homem mata o ganso, o homem não recebe mais ovos. Moral: “A ganância sempre se supera.”

O pior desses comportamentos, é claro, é a tendência de tentar promover tudo.

O problema de promover coisas na página inicial é que funciona muito bem. Qualquer
coisa com um link de página inicial proeminente é praticamente garantido para obter mais
tráfego - geralmente muito mais - levando todos os interessados do site a pensar: "Por
que não tenho um?"
O problema é que as recompensas e os custos de adicionar mais coisas à página
inicial não são compartilhados igualmente. O segundo que está sendo promovido obtém
um enorme ganho de tráfego, enquanto a perda geral de eficácia da página inicial à medida
que fica mais informada é compartilhada por todos os segundos.

É um exemplo perfeito da tragédia dos comuns.4 A premissa é simples:

4 O conceito, originado pelo matemático amador do século XIX William Forster Lloyd, foi popularizado em um
ensaio clássico sobre superpopulação do biólogo Garre Hardin (“The Tragedy of the Commons”, Science,
dezembro de 1968).

Qualquer recurso compartilhado (um “commons”) será inevitavelmente destruído pelo uso excessivo.

Tome um pasto da cidade, por exemplo. Para cada animal que um pastor adiciona ao
pasto comum, ele recebe todos os rendimentos da venda do animal – um benefício positivo
de +1. Mas o impacto negativo de adicionar um animal – sua contribuição para o pastoreio
excessivo – é compartilhado por todos, então o impacto no pastor individual é menor que
–1.

O único caminho sensato para cada pastor é adicionar outro animal ao rebanho. E outra, e
outra — de preferência antes que outra pessoa o faça. E como cada pastor racional chegará
à mesma conclusão, os comuns estão condenados.
Machine Translated by Google

Preservar a página inicial da sobrecarga promocional requer vigilância constante,


pois geralmente acontece gradualmente, com o acréscimo lento e inexorável de
apenas... mais uma... coisa.
Todas as partes interessadas precisam ser informadas sobre o perigo de
sobrecarregar a página inicial e oferecer outros métodos de direcionar o tráfego,
como promoção cruzada de outras páginas populares ou revezar usando o mesmo
espaço na página inicial.
Machine Translated by Google

Certificando-se de que você os acertou


Machine Translated by Google

Capítulo 8. “O agricultor e o vaqueiro devem ser


amigos”

POR QUE A MAIORIA DOS ARGUMENTOS SOBRE USABILIDADE SÃO UMA PERDA DE TEMPO, E
COMO EVITAR ELES

Um homem gosta de empurrar um arado O outro gosta de perseguir uma vaca Mas não é por isso que
eles não podem ser amigos!

—OKLAHOMA!, OSCAR HAMMERSTEIN II

Com seus próprios dispositivos, as equipes da Web não são notoriamente bem-sucedidas em
tomar decisões sobre questões de usabilidade. A maioria das equipes acaba gastando muito meu
precioso tempo refazendo os mesmos problemas repetidamente.
Considere esta cena:
Machine Translated by Google

Eu costumo chamar essas discussões intermináveis de “debates religiosos”, porque


elas têm muito em comum com a maioria das discussões sobre religião e política:
elas consistem em grande parte de pessoas expressando crenças pessoais
fortemente arraigadas sobre coisas que não podem ser provadas – supostamente no
interesse de concordando sobre a melhor maneira de fazer algo importante (seja
alcançar a paz eterna, governar com eficácia ou apenas projetar páginas da Web). E,
como a maioria dos debates religiosos, raramente resultam em alguém envolvido
mudando seu ponto de vista.
Machine Translated by Google

Além de me incomodar, esses argumentos criam tensão e corroem o respeito entre os


membros da equipe e podem muitas vezes impedir que a equipe tome decisões críticas.

Infelizmente, existem várias forças em ação na maioria das equipes da Web que tornam
esses debates quase inevitáveis. Neste capítulo, descreverei essas forças e explicarei o
que considero o melhor andote.

“Todo mundo gosta de ________.”

Todos nós que trabalhamos em sites da Web temos uma coisa em comum: também
somos usuários da Web. E, como todos os usuários da Web, tendemos a ter fortes
sentimentos sobre o que gostamos e o que não gostamos nos sites.

Como indivíduos, adoramos páginas com menus principais na parte superior e


submenus no lado esquerdo porque são familiares e fáceis de usar, ou as odiamos porque
são muito chatas. Adoramos páginas com grandes imagens evocativas porque são
envolventes, ou as odiamos porque só queremos chegar ao conteúdo. Nós realmente
gostamos de usar sites com encontramos ______, ou
______ ser uma dor real.

E quando estamos trabalhando em uma equipe da Web, acaba sendo muito difícil verificar
esses sentimentos na porta.

O resultado é geralmente uma sala cheia de indivíduos com fortes convicções


pessoais sobre o que faz um bom site.

E dada a força desses convicons – e a natureza humana – há uma tendência natural de


projetar esses gostos e desgostos nos usuários em geral: pensar que a maioria dos usuários
gosta das mesmas coisas que nós gostamos. Nós tendemos a pensar que a maioria dos
usuários são como nós.
Machine Translated by Google

Não é que pensamos que todos são como nós. Sabemos que existem algumas
pessoas por aí que odeiam as coisas que amamos – afinal, existem até algumas
delas em nossa própria equipe da Web. Mas não pessoas sensatas . E não são
muitos.

Agricultores vs. vaqueiros

No topo dessa camada de paixão pessoal, há outra camada: paixão profissional.


Como os fazendeiros e os vaqueiros em Oklahoma!, os jogadores de uma equipe da
Web têm perspectivas muito diferentes sobre o que constitui um bom design da Web
com base no que fazem para ganhar a vida.1
1 Na peça, os três agricultores tementes a Deus e orientados para a família estão sempre em desacordo com os
vaqueiros despreocupados e de vida livre. Os agricultores adoram cercas, os vaqueiros adoram o campo aberto.

A página da Web ideal vista por alguém cujo trabalho é...

Sempre me pareceu que essas pessoas provavelmente têm os empregos que fazem
por causa de quem são. Designers, por exemplo, provavelmente se tornaram
designers porque desfrutam de experiências visuais agradáveis. Eles ficam viscerais
Machine Translated by Google

prazer de olhar para páginas cheias de tipos elegantes e sugestões visuais sutis.
Existem endorfinas envolvidas.
E os desenvolvedores tendem a gostar de complexidade. Eles gostam de descobrir como
as coisas funcionam, fazer engenharia reversa em suas cabeças e procurar ideias que
possam usar. Novamente, existem endorfinas em ação.
E porque essas reações estão acontecendo em um nível químico do cérebro, é muito
difícil para eles imaginarem que nem todo mundo se sente exatamente da mesma
maneira.
O resultado é que os designers desejam criar sites com ótima aparência e os
desenvolvedores desejam criar sites com recursos interessantes, originais e engenhosos.
Não tenho certeza de quem é o agricultor e quem é o vaqueiro nesta foto, mas sei que
suas diferenças de perspectiva muitas vezes levam a conflitos - e ressentimentos -
quando se trata de estabelecer prioridades de design.
Ao mesmo tempo, designers e desenvolvedores muitas vezes se encontram juntos em
outro confronto maior entre o que Art Kleiner descreve como as culturas de hype e cra.2

2 Veja “Cultura Corporativa em Tempo de Internet” na revista strategy+business em strategy.com/ press/


arcle/ 10374 .

Enquanto a cultura do hype (gerência superior, marketing e desenvolvimento de


negócios) está focada em fazer quaisquer promessas necessárias para conseguir
capital de risco, negócios geradores de receita e usuários para o site, o ônus de cumprir
essas promessas recai sobre os ombros de os arsans da cultura cra como os designers e
desenvolvedores.
Essa versão moderna de alta tecnologia da luta perene entre arte e comércio (ou talvez
fazendeiros e vaqueiros contra os barões das ferrovias) adiciona outro nível de
complexidade a qualquer discussão sobre questões de usabilidade – geralmente na
forma de decretos aparentemente arbitrários proferidos pelo lado do hype da cerca.3

3 Certa vez, vi um recurso particularmente intrigante na página inicial de um site proeminente - e de outra forma
sensatamente projetado. Quando perguntei sobre isso, me disseram: “Ah, isso. Chegou ao nosso CEO em um
sonho, então tivemos que adicioná-lo.” História verdadeira.
Machine Translated by Google

O mito do usuário médio


A crença de que a maioria dos usuários da Web é como nós é suficiente para produzir um
impasse na reunião média de design da Web. Mas por trás dessa crença está outra, ainda mais
insidiosa: a crença de que a maioria dos usuários da Web é como qualquer coisa.

Assim que o choque de opiniões pessoais e profissionais resulta em um impasse, a


conversa geralmente se volta para encontrar alguma maneira (seja a opinião de um especialista
externo, uma pesquisa publicada, uma pesquisa ou grupos focais) para determinar o que a maioria
dos usuários gosta ou não gosta — descobrir como é realmente o usuário médio da Web. O único
problema é que não há usuário médio.

Na verdade, todo o tempo que passei assistindo as pessoas usarem a Web me levou à conclusão
oposta:

TODOS OS USUÁRIOS DA WEB SÃO ÚNICOS E TODO O USO DA WEB É BASICAMENTE


IDIOSINCRÁTICO

Quanto mais você observa os usuários com atenção e os ouve articular suas intenções,
movimentos e processos de pensamento, mais você percebe que suas reações individuais às
páginas da Web são baseadas em tantas variáveis que tentam descrever os usuários em termos
de gostos unidimensionais e desgostos são abundantes — e contraproducentes.

E a pior coisa sobre o mito do usuário médio é que ele reforça a ideia de que um bom design da
Web é em grande parte uma questão de descobrir do que as pessoas gostam. É um meio-dia
aracve: Qualquer um dos pull-downs é bom (porque
Machine Translated by Google

a maioria das pessoas gosta deles), ou eles são ruins (porque a maioria das pessoas não gosta). As
histórias devem estar em uma única página longa ou devem ser divididas em muitas páginas mais
curtas. Carrosséis de página inicial, mega menus, rollovers, etc. são bons ou ruins, pretos ou brancos.

O problema é que não há respostas “certas” simples para a maioria das questões de design da
Web (pelo menos não para as importantes). O que funciona é um design bom e integrado que
atende a uma necessidade - cuidadosamente pensado, bem executado e testado.

Isso não quer dizer que não há algumas coisas que você nunca deve fazer, e algumas coisas
que você raramente deve fazer. Existem algumas maneiras de projetar páginas da Web que
estão claramente erradas. É só que eles não são as coisas sobre as quais as equipes da Web
costumam discutir.

O adoto para debates religiosos


A questão é que não é produtivo fazer perguntas como “A maioria das pessoas gosta de menus
suspensos?” O tipo certo de pergunta a ser feita é “ Esse menu suspenso, com esses itens e
esse texto neste contexto nesta página, cria uma boa experiência para a maioria das pessoas que
provavelmente usarão este site?”

E há realmente apenas uma maneira de responder a esse tipo de pergunta: tesng. Você tem que
usar a habilidade coletiva, experiência, criatividade e bom senso da equipe para construir alguma
versão da coisa (mesmo uma versão grosseira), então observar algumas pessoas cuidadosamente
enquanto elas tentam descobrir o que é e como usar isto.

Não há substituto para isso.

Onde os debates sobre o que as pessoas gostam me consomem e drenam a energia da equipe,
o teste de usabilidade tende a desarmar a maioria dos argumentos e quebrar impasses,
afastando a discussão do domínio do que é certo ou errado e do que as pessoas gostam ou não,
para o domínio do que funciona ou não funciona. E ao abrir nossos olhos para a variedade de
movimentos, percepções e respostas dos usuários, o tesng torna difícil continuar pensando que
todos os usuários são como nós.

Você pode dizer que eu acho que o teste de usabilidade é uma coisa boa?

O próximo capítulo explica como testar seu próprio site.


Machine Translated by Google

Capítulo 9. Teste de usabilidade em 10 centavos por dia

MANTENDO OS TESTES SIMPLES - PARA QUE VOCÊ FAÇA O SUFICIENTE

Por que não fizemos isso antes?

—O QUE TODOS DIZEM EM ALGUM MOMENTO DURANTE O PRIMEIRO TESTE DE USABILIDADE DE SEU SITE

Eu costumava receber muitos telefonemas como este:

Assim que eu ouvisse “lançamento em duas semanas” (ou mesmo “dois meses”) e “teste de
usabilidade” na mesma frase, eu começaria a ter aquele velho bombeiro indo para a queima-
química- sentimento de fábrica, porque eu tinha uma boa idéia do que estava acontecendo.

Se fossem duas semanas, então era quase certamente um pedido de verificação de desastres.
O lançamento estava se aproximando rapidamente e todos estavam muito nervosos, e alguém
finalmente disse: “Talvez nós façamos algum teste de usabilidade”.

Se fossem dois meses, as chances eram de que o que eles queriam era vender alguns debates
internos em andamento – geralmente sobre algo como estética.
A opinião em torno do escritório foi dividida entre dois projetos diferentes; algumas pessoas
gostaram da sexy, outras gostaram da elegante. Finalmente, alguém com poder suficiente para
autorizar a despesa ficou vermelho com a discussão e disse: “Tudo bem, vamos fazer alguns testes
para resolver isso”.
Machine Translated by Google

E embora o teste de usabilidade algumas vezes venda esses argumentos, a principal coisa que
ele geralmente acaba fazendo é revelar que as coisas sobre as quais eles estavam discutindo
não eram tão importantes. As pessoas costumam testar para decidir quais cortinas de cor são
melhores, apenas para descobrir que esqueceram de colocar janelas no quarto.
Por exemplo, eles podem descobrir que não faz muita diferença se você vai com menus
em cascata ou mega menus se ninguém entender a proposta de valor do seu site.

Não recebo tantas dessas ligações hoje em dia, o que considero um bom sinal de que há
mais consciência da necessidade de tornar a usabilidade parte de todos os projetos desde o
início.

Infelizmente, porém, ainda é assim que muitos testes de usabilidade são feitos: muito pequeno,
muito tarde e por todos os motivos errados.

Repita comigo: grupos de foco não são testes de usabilidade.


Algumas vezes essa ligação inicial é ainda mais assustadora:

Quando a solicitação de última hora é para um grupo de foco, geralmente é um sinal de que a
solicitação foi originada em Markeng. Se o pessoal da Markeng sentir que o site está indo na
direção errada à medida que a data de lançamento se aproxima, eles podem sentir que sua única
esperança de evitar um desastre potencial é apelar para uma autoridade superior: pesquisa de
mercado. E um dos tipos de pesquisa que eles conhecem melhor são os grupos focais. Eu
sempre tive que trabalhar muito para fazer os clientes entenderem que o que eles precisam é de
testes de usabilidade, não de grupos focais - tão frequentemente que finalmente fiz um pequeno
vídeo animado sobre o quão difícil pode ser (someslightlyirregular.com/2011/08 /você-diz-batata).
Machine Translated by Google

Aqui está a diferença em poucas palavras:

Em um grupo de foco, um pequeno grupo de pessoas (geralmente de 5 a 10) senta-se


ao redor de uma mesa e conversa sobre coisas, como suas opiniões sobre produtos,
suas experiências passadas com eles ou suas razões para novos conceitos. Os grupos
de foco são bons para gerar rapidamente uma amostra dos sentimentos e opiniões dos
usuários sobre as coisas.

Os testes de usabilidade consistem em observar uma pessoa de cada vez tentar


usar algo (seja um site, um protótipo ou alguns esboços de um novo design) para
realizar tarefas típicas para que você possa detectar e corrigir as coisas que os
confundem ou frustram.

A principal diferença é que nos testes de usabilidade, você observa as pessoas realmente
usarem as coisas, em vez de apenas ouvi-las falar sobre elas.

Os grupos de foco podem ser ótimos para determinar o que seu público quer, precisa e
gosta – em resumo. Eles são bons para testar se a ideia por trás do seu site faz sentido e se
sua proposta de valor é real, para saber mais sobre como as pessoas atualmente resolvem os
problemas com os quais seu site os ajudará e para descobrir como eles se sentem sobre você
e seus concorrentes .

Mas eles não são bons para saber se seu site funciona e como melhorá-lo.
Machine Translated by Google

Os tipos de coisas que você aprende com os grupos focais – como se você está
construindo o produto certo – são coisas que você deve saber antes de começar a
projetar ou construir qualquer coisa, então os grupos focais são melhor usados nos
estágios de planejamento de um projeto. Testes de usabilidade, por outro lado, devem
ser usados em todo o processo.

Várias coisas verdadeiras sobre o teste de usabilidade

Aqui estão as principais coisas que eu sei sobre testes de


usabilidade: Se você quer um ótimo site, você tem que testar. Depois de
trabalhar em um site por algumas semanas, você não pode mais vê-lo
recentemente. Você sabe muito. A única maneira de descobrir se realmente
funciona é observar outras pessoas tentando usá-lo.
Tesng lembra a você que nem todo mundo pensa como você, sabe o que você
sabe e usa a Web como você.
Costumava dizer que a melhor maneira de pensar sobre o tesng é que é como
viajar: uma experiência ampliada. Isso te lembra como as pessoas são diferentes
– e iguais – e te dá uma nova perspectiva sobre as coisas.1

1 Como diriam o pessoal da startup enxuta, isso tira você do prédio.


Mas eu finalmente percebi que tesng é realmente mais como ter amigos
visitando de fora da cidade. Inevitavelmente, ao fazer as rondas pelos pontos
turísticos locais com eles, você vê coisas sobre sua cidade natal que
normalmente não percebe porque está muito acostumado a elas. E ao mesmo
tempo, você percebe que muitas coisas que você dá como certas não são óbvias
para todos.
Testar um usuário é 100 por cento cerveja do que testar nenhum. O
Tesng sempre funciona, e mesmo o pior teste com o usuário errado mostrará
coisas importantes que você pode fazer para melhorar seu site.
Quando dou workshops, faço questão de sempre fazer um teste de
usabilidade ao vivo no início para que as pessoas vejam que é muito fácil de
fazer e sempre produz insights valiosos.
Peço a um voluntário que tente realizar uma tarefa em um local pertencente a um
dos outros aendes. Esses testes duram menos de quinze minutos, mas nele a
pessoa cujo site está sendo testado costuma rabiscar várias páginas de anotações.
E eles sempre perguntam se podem ter o
Machine Translated by Google

gravação do teste para mostrar à sua equipe em casa. (Uma pessoa me disse que
depois que sua equipe viu a gravação, eles fizeram uma alteração em seu site que,
mais tarde, calculou que resultou em uma economia de US $ 100.000.)

Testar um usuário no início do projeto é cerveja do que testar 50 perto do


final. A maioria das pessoas assume que o tesng precisa ser um grande negócio.
Mas se você fizer disso um grande negócio, você não o fará cedo o suficiente ou o
suficiente para tirar o máximo proveito dele. Um teste simples antecipado — enquanto
você ainda me permite usar o que aprendeu com ele — quase sempre é mais valioso
do que um teste elaborado mais tarde.

Parte da sabedoria convencional sobre o desenvolvimento da Web é que é muito


fácil entrar e fazer alterações. A verdade é que muitas vezes não é tão fácil fazer
alterações - especialmente grandes mudanças - em um site quando ele está em
uso. Alguma porcentagem de usuários resistirá a quase qualquer tipo de mudança, e
mesmo mudanças aparentemente simples acabam tendo efeitos de longo alcance.
Quaisquer erros que você possa corrigir no início do processo evitarão problemas no
futuro.

Teste de usabilidade faça você mesmo

O teste de usabilidade existe há muito tempo, e a ideia básica é simples: se você


quer saber se algo é fácil de usar, observe algumas pessoas enquanto elas tentam usá-
lo e observe onde eles encontram problemas.

No início, porém, o teste de usabilidade era uma proposta muito cara.


Era preciso ter um laboratório de usabilidade com uma sala de observação atrás de um
espelho unidirecional e câmeras de vídeo para registrar as reações dos usuários e a tela.
Você tinha que pagar um profissional de usabilidade para planejar e facilitar os testes para você.
E você teve que recrutar muitos parcipantes2 para que pudesse obter resultados que
fossem estatisticamente significativos. Era Ciência. Custava de US $ 20.000 a US $
50.000 por tiro. Não aconteceu muito.

2 Nós os chamamos de participantes ao invés de “cobaias de teste” para deixar claro que não os estamos
testando; estamos testando o site.

Então, em 1989, Jakob Nielsen escreveu um artigo intitulado “Engenharia de Usabilidade


com Desconto” e apontou que não precisava ser assim. Você não precisava de um
laboratório de usabilidade e poderia obter os mesmos resultados com muito menos
Machine Translated by Google

participantes. O preço caiu para US$ 5.000 a US$ 10.000 por rodada de
teste.
A ideia do teste de usabilidade com desconto foi um grande passo à frente.
O único problema é que todo site (e aplicativo) precisa de teste e US$ 5.000
a US$ 10.000 ainda é muito dinheiro, então isso não acontece o suficiente.
O que vou recomendar a você neste capítulo é algo ainda mais simples
(e muito mais barato): teste de usabilidade faça você mesmo.
Vou explicar como você pode fazer seu próprio teste quando não tem eu e
nem dinheiro.
Não me entenda mal: se você puder contratar um profissional para fazer seu teste, faça-o. As
probabilidades são de que eles serão capazes de fazer um trabalho de cerveja do que você. Mas se
você não pode contratar alguém, faça você mesmo.

Eu acredito tanto no valor desse tipo de teste que escrevi um livro inteiro
sobre como fazê-lo. Chama-se Rocket Surgery Made Easy: O guia faça você
mesmo para encontrar e corrigir problemas de usabilidade.
Machine Translated by Google

Ele cobre os tópicos deste capítulo com muito mais detalhes e fornece
instruções passo a passo para todo o processo.
Machine Translated by Google

Com que frequência você deve testar?

Acho que toda equipe de desenvolvimento Web deveria passar uma manhã por mês
fazendo testes de usabilidade.
Machine Translated by Google

Em uma manhã, você pode testar três usuários e, em seguida, conversar durante o almoço. É isso.
Quando você sair do debriefing, a equipe terá decidido o que você vai consertar antes da próxima
rodada de testes, e você terá terminado o teste do mês.3

3 Se você estiver desenvolvendo Agile, fará testes com mais frequência, mas os princípios ainda
são os mesmos. Por exemplo, você pode estar testando com dois usuários a cada duas
semanas. Criar um horário fixo e segui-lo é o que importa.

Por que uma manhã por mês?

Mantém-lo simples para que você continue fazendo isso. Uma manhã por mês é o que a
maioria das equipes pode gastar fazendo testes. Se for muito complicado ou me consumir, é
muito mais provável que você não me faça quando as coisas ficarem ocupadas.

Dá-lhe o que você precisa. Observando três participantes, você identificará problemas
suficientes para mantê-lo ocupado consertando as coisas para o próximo mês.

Isso libera você de decidir quando testar. Você deve escolher um dia do mês – como a
terceira quinta-feira – e torná-lo seu dia de teste designado.

Isso é muito melhor do que basear seu cronograma de teste em marcos e entregas (“Vamos
testar quando o beta estiver pronto para ser lançado”) porque os cronogramas escorregam e
os testes acompanham eles. Não se preocupe, sempre haverá algo que você pode testar a
cada mês.
Machine Translated by Google

Isso torna mais provável que as pessoas vão acabar. Fazer tudo
em uma manhã em um horário previsível aumenta muito as chances de que
os membros da equipe me façam vir e assistir pelo menos algumas das sessões,
o que é altamente desejável.

De quantos usuários você precisa?


Acho que o número ideal de parcipantes para cada rodada de teste faça você
mesmo é três.
Algumas pessoas vão reclamar que três não são suficientes. Eles dirão que é uma
amostra muito pequena para provar qualquer coisa e que não revelará todos os
problemas. Ambos são verdadeiros, mas eles simplesmente não são importantes, e
aqui está o porquê: O propósito deste tipo de teste não é provar nada.
Provar coisas requer testes quantitativos, com um grande tamanho de amostra,
um protocolo de teste claramente definido e seguido rigorosamente e muita
coleta e análise de dados.
Os testes do-it-yourself são um método qualitavo cujo objetivo é melhorar
o que você está construindo, identificando e corrigindo problemas de
usabilidade. O processo não é nada rigoroso: você dá tarefas a eles, observa
e aprende. O resultado são insights confiáveis, não provas.
Machine Translated by Google

Você não precisa encontrar todos os problemas. Na verdade, você nunca encontrará
todos os problemas em qualquer coisa que testar. E não ajudaria se você o fizesse, por
causa deste fato:

Você pode encontrar mais problemas em meio dia do que pode consertar em um mês.

Você sempre encontrará mais problemas do que tem recursos para corrigir, por isso
é muito importante que você se concentre em corrigir os mais sérios primeiro. E é
muito provável que três usuários encontrem muitos dos problemas mais significativos
relacionados às tarefas que você está testando.

Problemas que você pode encontrar com apenas alguns participantes do teste

Além disso, você fará outra rodada a cada mês. É muito mais importante fazer mais
rodadas de teste do que torcer tudo o que puder de cada rodada.

Como você escolhe os parcipantes?


Quando as pessoas decidem fazer o teste, geralmente passam muito tempo tentando recrutar
usuários que elas acham que refletirão precisamente seu público-alvo – por exemplo,
“contadores do sexo masculino entre 25 e 30 anos com um a três anos de experiência em
computador que sapatos caros comprados recentemente.”

É bom fazer seu teste com parcipantes que são como as pessoas que vão usar seu site,
mas a verdade é que recrutar pessoas que são do seu público-alvo não é tão importante
quanto parece. Para muitos sites, você pode fazer muito do seu teste com quase qualquer
pessoa. E se você está apenas começando
Machine Translated by Google

para fazer tesng, seu site provavelmente tem uma série de falhas de usabilidade que
causarão problemas reais para quase todos que você recrutar.
Recrutar pessoas que se encaixam em um perfil restrito geralmente requer mais
trabalho (para encontrá-las) e mais dinheiro (para seus gastos). Se você tem muito de
mim para gastar em recrutamento ou pode se dar ao luxo de contratar alguém para
fazer isso por você, então seja tão específico quanto quiser. Mas se encontrar os usuários
ideais significa que você fará menos testes, recomendo uma abordagem diferente:

RECRUTAR FLORAMENTE E CLASSIFICAR EM UMA CURVA

Em outras palavras, tente encontrar usuários que reflitam seu público, mas não se
preocupe com isso. Em vez disso, afrouxe seus requisitos e, em seguida, faça
concessões para as diferenças entre seus participantes e seu público. Quando alguém
tiver um problema, pergunte a si mesmo: "Será que nossos usuários têm esse problema
ou foi apenas um problema porque eles não sabem o que nossos usuários sabem?"

Se o uso de seu site requer conhecimento de domínio específico (por exemplo, um


site de câmbio para profissionais de gerenciamento de dinheiro), você precisará recrutar
algumas pessoas com esse conhecimento. Mas nem todos precisam tê-lo, já que muitos
dos problemas de usabilidade mais sérios são coisas que qualquer um encontrará.

Na verdade, sou a favor de sempre usar alguns parcipantes que não são do seu público-
alvo, por três motivos:
Geralmente, não é uma boa ideia criar um site para que apenas seu público-
alvo possa usá-lo. O conhecimento de domínio é uma coisa complicada, e se
você projetar um site para gerentes de dinheiro usando uma terminologia que você
acha que todos os gerentes de dinheiro entenderão, o que você descobrirá é que
um número pequeno, mas não insignificante, deles não saberá o que você está
falando sobre. E, na maioria dos casos, você precisa apoiar tanto os novatos quanto
os especialistas.
Somos todos iniciantes sob a pele. Raspe um especialista e você encontrará
alguém que está se atrapalhando - apenas em um nível mais alto.
Especialistas raramente são insultados por algo que é claro o suficiente
para iniciantes. Todos apreciam a clareza. (Verdadeira clareza, isto é, e não
Machine Translated by Google

apenas algo que foi "emburrecido".) Se "quase qualquer pessoa" puder usá-lo, seus
especialistas também poderão usá-lo.

Como encontrar parcipantes?


Existem muitos lugares e maneiras de recrutar participantes de teste, como grupos de
usuários, feiras, Craigslist, Facebook, Twier, fóruns de clientes, um pop-up em seu site ou até
mesmo perguntar a amigos e vizinhos.

Se você for fazer seu próprio recrutamento, recomendo que você baixe o relatório gratuito de
147 páginas do Nielsen Norman Group, How to Recruit
Participantes de Estudos de Usabilidade. 4 Você não precisa ler tudo, mas é um
excelente fonte de conselhos.

4 ...em nngroup.com/ reports/ ps/ recruing. É de 2003, mas se você considerar 20% de inflação para os valores
em dólares, tudo ainda é válido. E eu mencionei que é grátis?

Os incentivos parcipantes típicos para uma sessão de teste de uma hora variam de US$ 50 a
US$ 100 para usuários “médios” da Web a várias centenas de dólares para profissionais
ocupados e bem pagos, como cardiologistas, por exemplo.

Eu gosto de oferecer às pessoas um pouco mais do que a taxa atual, já que deixa claro que eu
valorizo o seu eu e aumenta as chances de que elas apareçam.
Lembre-se de que, mesmo que a sessão seja de apenas uma hora, as pessoas geralmente
precisam passar mais uma hora viajando.

Onde você testa?


Para realizar o teste, você precisa de um espaço tranquilo onde não seja interrompido (geralmente
um escritório ou uma sala de conferências) com uma mesa ou escrivaninha e duas cadeiras. E
você precisará de um computador com acesso à Internet, um mouse, um teclado e um microfone.

Você usará um software de compartilhamento de tela (como GoToMeeng ou WebEx) para


permitir que os membros da equipe, as partes interessadas e qualquer outra pessoa interessada
observem os testes de outra sala.
Machine Translated by Google

Você também deve executar um software de gravação de tela (como o Camtasia


da Techsmith) para capturar um registro do que acontece na tela e o que o facilitador e o
parcipante dizem. Você pode nunca se referir a ele, mas é bom tê-lo caso queira verificar
algo ou usar alguns clipes breves como parte de uma apresentação.

Quem deve fazer o teste?


A pessoa que se senta com o parcipante e o conduz através do teste é chamada de
facilitador. Quase qualquer pessoa pode facilitar um teste de usabilidade; tudo o que
realmente é preciso é a coragem de experimentá-lo e, com pouca prática, a maioria das
pessoas pode ficar muito boa nisso.
Suponho que você mesmo vai facilitar os testes, mas se não for, tente escolher alguém
que tende a ser paciente, calmo, empático e um bom ouvinte. Não escolha alguém que
você descreveria como “definitivamente não uma pessoa do povo” ou “o excêntrico do
escritório”.

Além de manter os participantes confortáveis e focados na execução das tarefas, o


principal trabalho do facilitador é incentivá-los a pensar em voz alta o máximo possível. A
combinação de ver o que os parcipantes fazem e ouvir o que eles estão pensando
enquanto o fazem é o que permite que os observadores vejam o site pelos olhos de outra
pessoa e entendam porque algumas coisas que são óbvias para eles são confusas ou
frustrantes para os usuários.
Machine Translated by Google

Quem deve observar?


O maior número de pessoas possível!

Uma das coisas mais valiosas sobre fazer testes de usabilidade é o efeito que pode ter nos
observadores. Para muitas pessoas, é uma experiência transformadora que muda radicalmente a
maneira como eles pensam sobre os usuários: eles de repente “entendem” que os usuários não são
todos como eles.

Você deve tentar fazer o que puder para incentivar todos – membros da equipe, partes
interessadas, gerentes e até executivos – a assistir às sessões de teste. Na verdade, se você
tiver algum dinheiro para o tesng, recomendo usá-lo para comprar os melhores lanches que
puder para atrair as pessoas.
(Os croissants de chocolate parecem funcionar muito bem.)

Você precisará de uma sala de observação (geralmente uma sala de conferência), um computador
com acesso à Internet e software de compartilhamento de tela e uma tela grande
Machine Translated by Google

monitor ou projetor e um par de alto-falantes externos para que todos possam


ver e ouvir o que está acontecendo na sala de teste.
Durante o intervalo após cada sessão de teste, os observadores precisam anotar
os três problemas de usabilidade mais sérios que perceberam durante a sessão
para que possam compartilhá-los no debriefing. Você pode fazer download de um
formulário que criei para esse fim em meu site. Eles podem fazer quantas anotações
quiserem, mas é importante que façam essa pequena lista porque, como você verá,
o objetivo do debriefing é identificar os problemas mais sérios para que sejam
corrigidos primeiro.
Machine Translated by Google
Machine Translated by Google

O que você testa, e quando você testa?


Como qualquer profissional de usabilidade lhe dirá, é importante começar o teste o mais cedo possível
e mantê-lo durante todo o desenvolvimento
processo.

Na verdade, nunca é cedo demais para começar. Mesmo antes de começar a projetar seu site, por
exemplo, é uma boa ideia fazer um teste de sites competitivos. Eles podem ser concorrentes reais ou
podem ser apenas sites que têm o mesmo estilo, organização ou recursos que você planeja usar. Traga
três participantes e observe-os tentando fazer algumas tarefas típicas em um ou dois sites de competição
e você aprenderá muito sobre o que funciona e o que não funciona sem ter que projetar ou construir nada.

Se você estiver redesenhando um site existente, também deverá testá-lo antes de começar, para
saber o que não está funcionando (e precisa ser alterado) e o que está funcionando (para que você
não o quebre).

Então, ao longo do projeto, continue testando tudo o que a equipe produz, começando com
seus primeiros esboços e continuando com wireframes, composições de páginas, protótipos e,
finalmente, páginas reais.

Como você escolhe as tarefas para testar?


Para cada rodada de testes, você precisa criar tarefas: as coisas que os participantes tentarão fazer.

As tarefas que você testar em uma determinada rodada dependerão em parte do que você tem
disponível para testar. Se tudo o que você tem é um rascunho, por exemplo, a tarefa pode consistir
simplesmente em pedir que olhem para ele e digam o que acham que é.

Se você tiver mais do que um esboço para mostrar a eles, comece fazendo uma lista das tarefas que as
pessoas precisam fazer com o que você estiver testando. Por exemplo, se você estiver testando um
protótipo de um processo de login, as tarefas podem ser
Crie a sua conta aqui

Faça login usando um nome de usuário e senha existentes

Recuperar uma senha esquecida

Recuperar um nome de usuário esquecido

Alterar resposta a uma pergunta de segurança


Machine Translated by Google

Escolha tarefas suficientes para preencher o tempo disponível (cerca de 35 minutos em um


teste de uma hora), tendo em mente que algumas pessoas irão terminá-las mais rápido do
que o esperado.

Em seguida, escreva cada tarefa com cuidado, para que os participantes entendam
exatamente o que você quer que eles façam. Inclua qualquer informação que eles precisem,
mas não tenham, como informações de login se você estiver fazendo com que eles usem
uma conta demo. Por exemplo:

Você tem uma conta existente com o nome de usuário delphi21 e a senha
correcthorsebaerystaple. Você sempre usou as mesmas respostas para perguntas
de segurança em todos os sites e acabou de ler que isso é uma má ideia. Altere sua
resposta para esta conta.

Você pode obter resultados mais reveladores se permitir que os participantes escolham
alguns detalhes da tarefa. É muita cerveja, por exemplo, dizer “Encontre um livro que você quer
comprar, ou um livro que você comprou recentemente” do que “Encontre um livro de receitas
por menos de US$ 14”. Aumenta seu investimento emocional e permite que eles usem mais
seu conhecimento pessoal do conteúdo.

O que acontece durante o teste?


Você pode baixar o script que eu uso para sites tesng (ou a versão ligeiramente diferente para
aplicativos tesng) em rocketsurgerymadeeasy.com. Eu recomendo que você leia suas “linhas”
exatamente como escritas, já que as palavras foram cuidadosamente escolhidas.

Um teste típico de uma hora seria dividido assim:

Bem- vindo (4 minutos). Você começa explicando como o teste funcionará para que o
participante saiba o que esperar.

As perguntas (2 minutos). Em seguida, você faz algumas perguntas ao


parcipante sobre si mesmo. Isso ajuda a deixá-los à vontade e dá uma ideia de como
eles são experientes em computadores e na Web.

O tour da página inicial (3 minutos). Então você abre a página inicial do site que está
testando e pede ao parcipante que olhe ao redor e diga o que eles acham disso. Isso
lhe dará uma ideia de como é fácil entender sua Home Page e o quanto o parcipante já
conhece seu domínio.
Machine Translated by Google

As tarefas (35 minutos). Este é o coração do teste: observar o parcipante


tentar realizar uma série de tarefas (ou, em alguns casos, apenas uma tarefa
longa). Novamente, seu trabalho é garantir que o parcipante permaneça focado
nas tarefas e continue pensando em voz alta.
Se o parcipante parar de dizer o que está pensando, estimule-o dizendo – espere
por isso – “O que você está pensando?” (Para variar, você também pode dizer
coisas como “O que você está olhando?” e “O que você está fazendo agora?”)

Durante esta parte do teste, é crucial que você os deixe trabalhar por conta própria
e não faça ou diga nada para influenciá-los. Não lhes faça perguntas indutoras e
não lhes dê nenhuma pista ou assistência, a menos que estejam irremediavelmente
presos ou extremamente frustrados. Se eles pedirem ajuda, diga algo como “O
que você faria se eu não estivesse aqui?”
Sondagem (5 minutos). Após as tarefas, você pode fazer perguntas aos
parcipantes sobre qualquer coisa que tenha acontecido durante a prova e
quaisquer perguntas que as pessoas na sala de observação gostariam que você
fizesse.

Conclusão (5 minutos). Finalmente, você agradece a ajuda, paga e mostra a


porta.

Um exemplo de sessão de teste

Aqui está um trecho anotado de uma sessão de teste típica, mas imaginária.
A parcipante se chama Janice e tem cerca de 25 anos.
Machine Translated by Google

Introdução

Olá, Janice. Meu nome é Steve Krug, e vou orientá-lo nesta sessão. Antes de
começarmos, tenho algumas informações para você, e vou lê-las para ter certeza
de cobrir tudo.

Você provavelmente já tem uma boa ideia do motivo pelo qual lhe pedimos para
vir aqui hoje, mas deixe-me recapitular brevemente. Estamos testando um site em
que estamos trabalhando para que possamos ver como é para as pessoas usá-lo. A
sessão deve durar cerca de uma hora.

Quero deixar claro imediatamente que estamos testando o site, não você.
Você não pode fazer nada de errado aqui. Na verdade, este é provavelmente o
único lugar hoje onde você não precisa se preocupar em cometer erros.

Queremos ouvir exatamente o que você pensa, então, por favor, não se preocupe
se você vai ferir nossos sentimentos. Queremos melhorá-lo, por isso precisamos
saber honestamente o que você pensa.

À medida que avançamos, vou pedir-lhe para pensar em voz alta, para me dizer
o que está passando pela sua mente. Isso vai nos ajudar.

Estou lendo o script que uso quando faço testes de usabilidade.

Você pode baixar este script em rocketsurgerymadeeasy.com.

Se tiver dúvidas, é só perguntar. Talvez eu não consiga respondê-las


imediatamente, pois estamos interessados em saber como as pessoas se comportam
quando não têm alguém cantando ao lado delas para ajudar, mas tentarei responder
a quaisquer perguntas que você ainda tiver quando terminarmos .

E se você precisar fazer uma pausa a qualquer momento, é só me avisar.

É importante mencionar isso, porque parecerá rude não responder às


perguntas deles à medida que você avança. Você tem que deixar claro
antes de começar que (a) não é nada pessoal e (b) você tentará responder
no final se eles ainda quiserem saber.
Machine Translated by Google

Você pode ter notado o microfone. Com sua permissão, vamos gravar o que acontece na
tela e o que você diz. A gravação será usada apenas para nos ajudar a descobrir como
melhorar o site, e não será vista por ninguém, exceto pelas pessoas que trabalham no
projeto. Também me ajuda, porque não preciso fazer tantas anotações.

Além disso, há algumas pessoas da equipe de web design observando a sessão em outra
sala. (Eles não podem nos ver, apenas a tela.)

Nesse ponto, a maioria das pessoas dirá algo como: “Eu não vou acabar nos
vídeos caseiros mais engraçados da América, vou?”

Se quiser, vou pedir que assine um formulário de permissão simples para nós. Diz
apenas que temos sua permissão para gravá-lo, mas que só será visto pelas pessoas
que trabalham no projeto.

Você tem alguma dúvida antes de começarmos?

Não, eu não penso assim.

Dê a eles o formulário de permissão de gravação para assinar.

Você encontrará um formulário de amostra e alguns outros formulários e listas


de verificação úteis em rocketsurgerymadeeasy.com.
Machine Translated by Google

Perguntas básicas Antes de

examinarmos o site, gostaria de fazer algumas perguntas rápidas. Primeiro,


qual é a sua ocupação? O que você faz o dia todo?
Eu sou um roteador.

Eu nunca ouvi falar disso antes. O que um roteador faz, exatamente?

Eu recebo os pedidos quando eles chegam e os envio para o escritório certo.


Somos uma grande empresa multinacional, então há muito o que resolver.

OK. Agora, aproximadamente quantas horas por semana você diria que gasta usando a
Internet, incluindo navegação na Web e e- mail? Apenas uma estimativa aproximada.

Acho bom começar com algumas perguntas para ter uma ideia de quem eles
são e como usam a Internet. Isso lhes dá a chance de relaxar um pouco e dá
a você a chance de mostrar que vai ouvir atentamente o que eles dizem — e
que não há respostas certas ou erradas.

Não hesite em admitir sua ignorância sobre qualquer coisa. Seu papel aqui
não é parecer um especialista, mas um bom ouvinte.

Ah, eu não sei. Provavelmente quatro horas por dia no trabalho e talvez oito horas
por semana em casa. Principalmente que é no fim de semana. Estou muito vermelho à
noite para me incomodar. Mas eu gosto de jogar algumas vezes.

Qual é a divisão entre e-mail e navegação — uma porcentagem aproximada?

Bem, no escritório eu passo a maior parte do meu tempo verificando e-mails. Eu


recebo muitos e-mails, e muitos deles são lixo, mas eu tenho que passar por isso de
qualquer maneira. Talvez dois terços do meu eu esteja no e-mail e um terço esteja
navegando.
Machine Translated by Google

Noce que ela não tem certeza de quanto de mim ela realmente gasta
na Internet. A maioria das pessoas não são. Não se preocupe.
Respostas precisas não são importantes aqui. O ponto principal aqui é
apenas fazê-la falar e pensar sobre como ela usa a Internet e dar a você
a chance de avaliar que tipo de usuário ela é.

Que tipos de sites você está vendo quando navega na Web?

No trabalho, principalmente nossa intranet corporativa. E sites de alguns


concorrentes. Em casa, sites de jogos e algumas compras.
Você tem algum site favorito?

Bem, Google, é claro. Eu uso tudo em mim. E algo chamado Snakes.com,


porque tenho uma cobra de estimação.

Sério? Que tipo de cobra?


Uma píton. Ele tem cerca de um metro e meio de comprimento, mas deve chegar aos oito
ou nove quando estiver totalmente crescido.

OK ótimo. Terminamos as perguntas e podemos começar a olhar para as coisas.

OK eu acho.

Não tenha medo de divagar e descobrir um pouco mais sobre o usuário,


contanto que você volte ao tópico em breve.
Machine Translated by Google

O tour pela página inicial


Em primeiro lugar, vou pedir-lhe que olhe para esta página e diga-me o que
pensa dela: o que lhe chama a atenção, de quem é o site que pensa que é, o
que pode fazer aqui e para que serve. Basta olhar ao redor e fazer uma
pequena narrave.

Você pode rolar se quiser, mas não clique em nada ainda.

Até agora, o navegador foi aberto para o Google, então não há nada
para se distrair.
Neste ponto, eu alcanço e abro uma aba com o site que estamos
testando e entrego o mouse para o participante.
Machine Translated by Google

Bem, acho que a primeira coisa que noto é que gosto da cor. Gosto
do tom de laranja e gosto da foto lile do sol [no topo da página, no
logotipo do eLance].
Vamos ver. [Lê.] "O mercado global de serviços." “Onde o mundo
compete para fazer o seu trabalho.”
Machine Translated by Google

Em um teste médio, é igualmente provável que o próximo usuário diga que


odeia esse tom de laranja e que o desenho é muito simplista. Não fique
muito animado por razões individuais para a estética do site.

Eu não sei o que isso significa. Eu não faço ideia.

“Anime seu logotipo: grátis.” [Olhando para o segundo Cool Stuff na página.]
“Mercado de design gráfico.” “Visualize o mercado de RFP.” “mercados eLance”.

Tem muita coisa acontecendo aqui. Mas não faço ideia do que seja.

Se você tivesse que dar um palpite, o que você acha que poderia ser?

Bem, parece ter algo a ver com compra e venda... alguma coisa.

[Olha ao redor da página novamente.] Agora que olho para a lista aqui
embaixo [a lista de categorias no meio da página], acho que talvez sejam
serviços. Legal, financeiro, criativo... todos soam como serviços.
Machine Translated by Google

Este usuário tem feito um bom trabalho pensando em voz alta por conta
própria. Se ela não estivesse, é aqui que eu começaria a perguntar a ela:
“O que você está pensando?”

Então eu acho que é isso. Serviços de compra e venda.

OK. Agora, se você estivesse em casa, o que você clicaria primeiro?

Acho que clicaria nessa coisa de design gráfico. Estou interessado em


design gráfico.
Machine Translated by Google

As tarefas

OK, agora vamos tentar fazer algumas tarefas específicas.

E novamente, tanto quanto possível, nos ajudará se você puder tentar pensar
em voz alta enquanto avança.

Você pode pensar em algum serviço que você precisa que você poderia usar
este site para obter ajuda?
Hum. Deixe-me pensar. Acho que vi “Home Improvement” em algum
lugar. Estamos pensando em construir um deck. Talvez eu possa encontrar
alguém para fazer isso.

Então, se você fosse procurar alguém para construir seu deck, o que faria
primeiro?

Acho que clicaria em uma das categorias aqui embaixo. Acho que vi
melhorias em casa. [Olha.] Aí está, em “Família e Família”.

Então, o que você faria?

Bem, eu clicaria... [Hesita, olhando para os dois links em “Família e Família.”]

Agora, dou a ela uma tarefa para que possamos ver se ela pode usar
o site para o propósito pretendido.

Sempre que possível, é bom deixar o usuário ter alguma opinião na


escolha da tarefa.

Bem, agora eu não sei o que fazer. Não consigo clicar em Home
Improvement, então parece que tenho que clicar em “RFPs” ou “Fixed-
Price”. Mas não sei qual é a diferença.

Preço fixo eu meio que entendo; eles vão me dar uma cotação, e então eles
têm que sck para ela. Mas não tenho certeza do que é RFPs.
Machine Translated by Google

Como se vê, ela está enganada. Preço fixo (neste caso) significa
serviços disponíveis por uma taxa horária fixa, enquanto uma RFP (ou
Solicitação de Proposta) é realmente a escolha que lhe dará o tipo de
cotação que ela está procurando. Este é o tipo de mal-entendido que
muitas vezes surpreende as pessoas que construíram o site.

Bem, em qual você acha que clicaria?

Preço fixo, eu acho.


Por que você não vai em frente e faz isso?

Daqui em diante, apenas observo enquanto ela tenta postar um projeto,


prolongando-a até que (a) ela termine a tarefa, (b) ela fique realmente
frustrada ou (c) não estejamos aprendendo nada de novo observando-
a tente passar por cima.

Eu daria a ela mais três ou quatro tarefas para fazer, o que não deveria
levar mais de 45 minutos no total.
Machine Translated by Google

Sondagem
Agora que terminamos as tarefas, tenho algumas perguntas.

E essas fotos perto do topo da página — aquelas com os números? O que você
achou deles?

Enquanto a parcipante está fazendo as tarefas, tomo cuidado para não fazer
perguntas indutoras porque não quero influenciá-la.

Mas eu sempre guardo um pouco de mim no final especificamente


para fazer perguntas de sondagem para que eu possa entender mais
sobre o que aconteceu e por que aconteceu.

Eu os notei, mas eu realmente não tentei entendê-los. Acho que pensei que eles
estavam me dizendo quais seriam as etapas do processo.

Alguma razão pela qual você não pagou muito aenon a eles?

Não. Acho que ainda não estava pronto para iniciar o processo. Ainda não
sabia se queria usar. Eu só queria olhar ao redor primeiro.
OK. Excelente.

Nesse caso, faço essa pergunta porque os designers do site acham que
a maioria dos usuários vai começar clicando nas fotos dos cinco passos e
que todos vão pelo menos olhar para elas.

Isso é realmente tudo o que há para isso.

Se você quiser ver um teste mais completo, encontrará um vídeo de vinte minutos no meu
site. Basta acessar rocketsurgerymadeeasy.com e clique em “Teste de demonstração
Machine Translated by Google

vídeo."

Problemas típicos
Aqui estão alguns dos tipos de problemas que você verá com mais frequência:
Os usuários não estão claros sobre o conceito. Eles simplesmente não entendem.
Eles olham para o site ou para uma página e não sabem o que fazer com isso ou
pensam que sabem, mas estão errados.
As palavras que eles estão procurando não estão lá. Isso geralmente significa
que você falhou em antecipar o que eles estariam procurando ou as palavras que
você está usando para descrever as coisas não são as palavras que eles usariam.

Tem muita coisa acontecendo. Algumas vezes o que eles estão procurando
está bem ali na página, mas eles simplesmente não estão vendo. Nesse caso, você
precisa reduzir o ruído geral na página ou aumentar o volume das coisas que eles
precisam ver para que eles “saiam” mais da hierarquia visual.

O debriefing: Decidindo o que consertar


Após cada rodada de testes, você deve me chamar o mais rápido possível para que a equipe
compartilhe suas observações e decida quais problemas corrigir e o que você fará para
corrigi-los.

Eu recomendo que você faça um debrief durante o almoço logo após fazer os testes,
enquanto tudo ainda está fresco na mente dos observadores. (Peça a pizza realmente boa
da pizzaria cara para incentivar o comparecimento.)
Sempre que você testar, quase sempre encontrará alguns problemas sérios de
usabilidade. Infelizmente, nem sempre são eles que são consertados. Oen, por
exemplo, as pessoas dirão: “Sim, isso é um problema real. Mas essa funcionalidade vai
mudar em breve, e podemos viver com isso até lá.” Ou diante de uma escolha entre tentar
consertar um problema sério ou muitos problemas simples, eles optam pelo fruto mais fácil.

Esta é uma das razões pelas quais você pode ter sérios problemas de usabilidade mesmo
em sites grandes e bem financiados, e é por isso que uma das minhas máximas em Rocket
Surgery é

FOCAR IMPECÁVEL EM RESOLVER OS PROBLEMAS MAIS SÉRIOS PRIMEIRO


Machine Translated by Google

Aqui está o método que gosto de usar para garantir que isso aconteça, mas você pode fazer da
maneira que funcionar para sua equipe:

Faça uma lista coletiva. Percorra a sala dando a todos a chance de dizer o que eles
acharam que foram os três problemas mais sérios que observaram (dos nove que eles
escreveram; três para cada sessão). Anote-os em um quadro branco ou em folhas de papel
para cavalete. Normalmente, muitas pessoas dirão “eu também” para alguns deles, que você
pode acompanhar adicionando marcas de seleção.

Não há discussão neste momento; você está apenas listando os problemas.


E eles têm que ser problemas observados ; coisas que realmente aconteceram
durante uma das sessões de teste.

Escolha os dez problemas mais sérios. Você pode fazer o vong informal, mas geralmente
pode começar com aqueles que obtiveram mais marcas de seleção.

Avalie-os. Numere-os de 1 a 10, sendo 1 o pior. Em seguida, copie-os para uma nova lista
com os piores no topo, deixando algum espaço entre eles.

Crie uma lista ordenada. Começando no topo, anote uma ideia aproximada de como você
vai consertar cada um no próximo mês, quem vai fazer isso e quaisquer recursos que serão
necessários.

Você não precisa corrigir cada problema perfeitamente ou completamente. Você só precisa
fazer algo – geralmente apenas um ajuste – que o tire da categoria de “problema sério”.

Quando você sentir que alocou todos os recursos e recursos disponíveis no próximo mês
para corrigir problemas de usabilidade, PARE.
Você tem o que veio buscar. O grupo decidiu agora o que precisa ser consertado e se
comprometeu a consertá-lo.

Aqui estão algumas dicas sobre como decidir o que consertar – e o que não consertar.

Mantenha uma lista separada de frutas mais fáceis. Você também pode manter uma
lista de coisas que não são problemas sérios, mas são muito fáceis de corrigir. E por muito
fácil quero dizer coisas que uma pessoa pode consertar em menos de uma hora, sem a
permissão do geng de qualquer pessoa que não esteja no interrogatório.

Resista ao impulso de adicionar coisas. Quando é óbvio ao testar que os usuários


não estão fazendo algo, a primeira reação da equipe geralmente é adicionar algo, como
uma explicação ou algumas instruções. Mas muito
Machine Translated by Google

Geralmente a solução certa é retirar algo (ou algumas coisas) que estão
obscurecendo o significado, em vez de acrescentar mais uma distração.

Aceite solicitações de “novos recursos” com um grão de sal. Os


participantes costumam dizer: “Gostaria de cerveja se pudesse fazer x”. Vale a
pena desconfiar desses pedidos de novos recursos. Acho que se você pedir a eles
que descrevam como esse recurso funcionaria - durante a sondagem no final do
teste - quase sempre acontece que, quando eles terminam de descrevê-lo, dizem
algo como "Mas agora que penso em isso, eu provavelmente não usaria isso.” Os
participantes não são designers. Eles podem ocasionalmente ter uma ótima ideia,
mas quando o fizerem, você saberá imediatamente, porque seu primeiro pensamento
será “Por que não pensamos nisso?!”

Ignore problemas de “caiaque”. Em qualquer teste, é provável que você veja


vários casos em que os usuários se desviem momentaneamente, mas consigam
voltar aos trilhos quase imediatamente sem qualquer ajuda. É como rolar em um
caiaque; contanto que o caiaque se endireita rápido o suficiente, tudo faz parte da
chamada diversão. Em termos de basquete, nenhum dano, nenhuma falta.
Desde que (a) todos que tenham o problema percebam que não estão mais indo
na direção certa rapidamente, e (b) eles consigam se recuperar sem ajuda, e (c)
isso não pareça incomodá-los, você pode ignorar o problema. Em geral, se o
segundo palpite do usuário sobre onde encontrar as coisas estiver sempre certo,
isso é bom o suficiente.

Estilos de vida alternativos

Aqui estão duas outras maneiras de fazer tesng que têm vantagens distintas:
Teste remoto. A diferença aqui é que, em vez de ir ao seu consultório, os
parcipantes fazem o teste no conforto de sua casa ou escritório, usando o
compartilhamento de tela. Eliminar a necessidade de viajar pode tornar muito mais
fácil recrutar pessoas ocupadas e, ainda mais significativamente, expandir seu pool
de recrutamento de “pessoas que moram perto de seu escritório” para “quase
qualquer pessoa”. Tudo o que eles precisam é de acesso à Internet de alta
velocidade e um microfone.
Teste remoto não moderado. Serviços como UserTesng.com fornecem pessoas
que se gravarão fazendo um teste de usabilidade. Você simplesmente
Machine Translated by Google

envie suas tarefas e um link para seu site, protótipo ou aplicativo móvel.
Dentro de uma hora (em média), você pode assistir a um vídeo de alguém
fazendo suas tarefas enquanto pensa em voz alta. da sua parte. Tudo o
que você precisa fazer é assistir ao vídeo.

5 Divulgação completa: Recebo alguma compensação do UserTesng.com por eles usarem meu
nome. Mas só faço isso porque sempre achei que eles têm um ótimo produto – e é por isso que
os estou mencionando aqui.

Experimente, você vai gostar

Seja qual for o método que você usa, tente fazê-lo. Eu quase posso garantir que se você fizer
isso, você vai querer continuar fazendo isso.

Aqui estão algumas sugestões para se defender de quaisquer objecons que você
possa encontrar:

As cinco principais razões plausíveis para não sites da Tesng


Machine Translated by Google
Machine Translated by Google

Preocupações maiores e externas


Influências
Machine Translated by Google

Capítulo 10. Celular: não é mais apenas uma cidade


no Alabama

BEM-VINDO AO SÉCULO 21 - VOCÊ PODE EXPERIMENTAR UM LEVE


SENSAÇÃO DE VERTIGEM

[shoung] PODERES CÓSMICOS FENOMENALS! [soly] Iy-biy espaço vivo!

— ROBIN WILLIAMS COMO O GÊNIO DE ALADDIN, COMENTANDO SOBRE O PONTO DE GRAÇA E DE BAIXO DE
O ESTILO DE VIDA DO GÊNIO

Ah, o smartphone.

Os telefones foram ficando cada vez mais inteligentes por anos, reunindo-se em gavetas
de escrivaninhas e dividindo-se entre si. Mas não foi até o Grande Salto 1 Adiante
que eles finalmente alcançaram a consciência.
1
Introdução do iPhone Junho de 2007.

Eu, por exemplo, fiquei feliz em receber nossos novos senhores. Eu sei que havia um eu
quando eu não tinha um computador touch screen poderoso com acesso à Internet no meu bolso,
mas é cada vez mais difícil lembrar como era a vida naquela época.

E é claro que foi sobre esse mesmo eu que a Web Móvel finalmente se destacou. Já havia
navegadores da Web em telefones antes, mas eles — para usar o termo técnico — eram uma
droga.

O problema sempre foi — como o Gênio bem colocou — o espaço de vida iy-biy. Dispositivos
móveis significavam dispositivos apertados, espremendo páginas da Web do tamanho de uma
folha de papel em uma tela do tamanho de um selo postal. Houve várias tentativas de soluções,
até mesmo algumas versões “móveis” de sites profundamente degradadas (lembra-se de
pressionar números para selecionar itens de menu numerados?) e, como sempre, os primeiros
adeptos e as pessoas que realmente precisavam dos dados confusos.

Mas a Apple casou mais potência de computador (em um pacote estético, fino e emocionalmente
agradável — por que os relógios finos são tão desejáveis?) com uma interface de navegador
cuidadosamente elaborada. Uma das grandes invenções da Apple foi
Machine Translated by Google

a capacidade de rolar (deslizando para cima e para baixo) e zoom in e out (beliscar e... descompactar)
muito rapidamente. (Foi a parte muito rápida - a capacidade de resposta do hardware - que
finalmente o tornou útil.)

Para o primeiro eu, a Web era divertida de usar em um dispositivo que você poderia carregar com
você em todos os momentos. Com um baery que durou o dia todo. Você poderia procurar qualquer
coisa em qualquer lugar em qualquer lugar.

É difícil superestimar a mudança radical que foi essa.

Claro, não era apenas sobre a Web. Basta pensar em quantas coisas o smartphone permitia que você
carregasse no bolso ou na bolsa a todo momento: uma câmera (sll e vídeo, e, para muitas pessoas, a
melhor que já tiveram), um GPS com mapas de toda a mundo, um relógio, um despertador, todas as
suas fotos e músicas, etc., etc.

É verdade: a melhor câmera realmente é aquela que você tem com você.

E pense no fato de que, para a maioria das pessoas nos países emergentes, da mesma forma que
contornaram os telefones fixos e foram direto para os celulares, o smartphone é seu primeiro – e único
– computador.

Não há como negar que os dispositivos móveis são a onda do futuro, exceto para coisas em que
você precisa de uma enorme potência (edição de vídeo profissional, por exemplo, pelo menos por
enquanto) ou uma grande superfície de jogo (Photoshop ou CAD).
Machine Translated by Google

Qual é a diferença?

Então, o que há de diferente na usabilidade quando você está projetando para uso em
um dispositivo móvel?

Em certo sentido, a resposta é: Não muito. Os princípios básicos ainda são os mesmos.
Se alguma coisa, as pessoas estão se movendo mais rápido e lendo ainda menos em pequenas
telas.

Mas existem algumas diferenças significativas sobre o celular que criam novos problemas
de usabilidade desafiadores.

Enquanto escrevo isso, o design da Web e de aplicativos para dispositivos móveis ainda está em
seus dias de “Oeste Selvagem” de várias maneiras. Vai levar mais alguns anos para as coisas
se mexerem, provavelmente só em mim por inovações que forçarão todo o ciclo a recomeçar.

Não vou falar muito sobre melhores práticas específicas porque muitas das idéias brilhantes de
design de interface que eventualmente se tornarão as convenções predominantes provavelmente
ainda não surgiram. E é claro que a tecnologia vai continuar mudando sob nossos pés mais
rápido do que podemos correr.
Machine Translated by Google

“Aplicativo” | xkcd. com

O que vou fazer é contar algumas coisas que tenho certeza que continuarão sendo verdade.
E o primeiro é...

É tudo sobre trocas

Uma maneira de olhar para o design - qualquer tipo de design - é essencialmente sobre restrições
(coisas que você tem que fazer e coisas que você não pode fazer) e compensações (as escolhas
menos do que ideais que você faz para viver dentro das restrições) .
Machine Translated by Google

Parafraseando Lincoln, o melhor que você pode fazer é agradar a algumas pessoas e
a mim.2

2 ... se, de fato, ele realmente dissesse: “Você pode enganar algumas pessoas por mim, e
todas as pessoas por mim, mas você não pode enganar todas as pessoas por mim”. Uma das
coisas que aprendi na Internet é que quando se trata de frases memoráveis atribuídas a
pessoas famosas, 92% das pessoas nunca as disseram. Veja en.wikiquote.org/wiki/Abraham_Lincoln.

Há um meme bem estabelecido que sugere que, em vez de ser a força negativa que
eles costumam sentir, as restrições na verdade facilitam o design e promovem a
inovação.

E é verdade que as restrições são muitas vezes úteis. Se um sofá tem que caber
neste espaço e combinar com este esquema de cores, às vezes é mais fácil encontrar um
do que se você for comprar qualquer sofá. Ter algo preso pode ter um efeito de foco, onde
uma tela em branco com suas opções ilimitadas – embora pareça libertadora – pode ter
um efeito paralisante.
Você pode não comprar a ideia de que restrições são uma influência positiva, mas na
verdade não importa: sempre que você está projetando, você está lidando com
restrições. E onde há restrições, há compensações a serem feitas.

Na minha experiência, muitos – se não a maioria – problemas sérios de usabilidade


são o resultado de uma má decisão sobre uma troca.
Por exemplo, eu não uso o CBS News no meu iPhone.
Aprendi comigo que suas histórias são divididas em pedaços muito pequenos (para
mim), e cada um demora muito para carregar. (Se as páginas carregarem mais rápido,
talvez eu não me importe.) E para adicionar insulto à injúria, em cada nova página você
tem que rolar a mesma foto para baixo para chegar ao próximo pedaço de texto.

Veja como é a experiência:


Machine Translated by Google

Toque para abrir a história e aguarde. E espere. E espere.


Machine Translated by Google

Quando a página finalmente carregar, deslize para rolar para baixo até a foto.
Machine Translated by Google

Leia os dois parágrafos do texto, toque em Avançar e aguarde. E espere.


Machine Translated by Google

Repita 8 mes para ler toda a história.

É tão irritante que quando estou escaneando o Google News (o que faço várias vezes
por dia) e percebo que a história que estou prestes a tocar está vinculada à CBS
Notícias, sempre clico no link "Mais histórias" do Google para escolher outro
fonte.

Quando me deparo com um problema como esse, sei que não existe porque as pessoas
que o projetaram não pensaram nisso. Na verdade, tenho certeza de que foi objeto de
um intenso debate que resultou em um acordo.
Machine Translated by Google

Não sei quais restrições estavam em jogo nessa troca particular. Como há anúncios nas
páginas, pode ter sido necessário gerar mais visualizações de página. Ou pode ter algo a ver
com a forma como o conteúdo é segmentado para outros fins em seu sistema de gerenciamento
de conteúdo. Eu não faço ideia. Tudo o que sei é que a escolha que eles fizeram não colocou
peso suficiente em criar uma boa experiência para o usuário.

A maioria dos desafios para criar uma boa usabilidade móvel se resume a fazer boas
compensações.

A tirania do espaço vital iy-biy


A coisa mais óbvia sobre as telas móveis é que elas são pequenas. Por décadas,
projetamos para telas que, embora possam parecer pequenas para os web designers, eram
luxuosas para os padrões atuais.
E mesmo assim, os designers estavam trabalhando em cima de mim tentando
espremer tudo à vista.
Mas se você achava que o espaço da página inicial era precioso antes, tente
realizar as mesmas coisas em um site móvel. Portanto, há definitivamente muitas novas
trocas a serem feitas.

Uma maneira de lidar com um espaço menor é deixar as coisas de fora: crie um site para
celular que seja um subconjunto do site completo. O que, é claro, levanta uma questão
complicada: quais partes você deixa de fora?
Uma abordagem foi o Mobile First. Em vez de projetar uma versão completa (e talvez
inchada) do seu site primeiro e depois reduzi-la para criar a versão móvel, você projeta a
versão móvel primeiro com base nos recursos e no conteúdo que são mais importantes para
seus usuários. Em seguida, você adiciona mais recursos e conteúdo para criar a versão
desktop/completa.
Foi uma ótima ideia. Por um lado, o Mobile First significava que você trabalharia duro para
determinar o que era realmente essencial, o que as pessoas mais precisavam.
Sempre uma boa coisa a fazer.

Mas algumas pessoas interpretaram isso como significando que você deve escolher o
que incluir com base no que as pessoas querem fazer quando estiverem em dispositivos
móveis. Isso supunha que, quando as pessoas acessavam a versão móvel, elas estavam
“em movimento”, não cantando em suas mesas, então precisariam apenas dos tipos de
recursos que você usaria em movimento. Por exemplo, você pode querer verificar seu banco
Machine Translated by Google

saldos durante as compras, mas você provavelmente não reconciliaria seu talão de
cheques ou configuraria uma nova conta.
Claro, descobriu-se que isso estava errado. As pessoas têm a mesma probabilidade de usar
seus dispositivos móveis enquanto cantam no sofá em casa e querem (e esperam) poder
fazer tudo. Ou pelo menos, todo mundo quer fazer algumas coisas, e se você somar tudo
isso dá tudo.

Se você vai incluir tudo, você tem que pagar ainda mais aenon para priorizar.

Coisas que eu quero usar com pressa ou com frequência devem estar à mão.
Todo o resto pode estar a alguns toques de distância, mas deve haver um caminho óbvio
para chegar até eles.

Em alguns casos, a falta de espaço em cada tela significa que os sites móveis se tornam
muito mais profundos do que seus primos em tamanho real, então você pode ter que tocar
em três, quatro ou cinco “níveis” para acessar alguns recursos ou conteúdo.
Isso significa que as pessoas vão tocar mais, mas tudo bem. Com telas pequenas é
inevitável: para ver a mesma quantidade de informações, você vai tocar ou rolar muito mais.
Enquanto o usuário continuar a se sentir confiante de que o que deseja está mais abaixo na
tela ou atrás desse link ou botão, ele continuará.

Aqui está a principal coisa a lembrar, no entanto:

A GESTÃO DOS DESAFIOS IMOBILIÁRIOS NÃO DEVE SER FEITA A CUSTO


DE USABILIDADE3

3 Agradecimentos a Manikandan Baluchamy por esta máxima.


Machine Translated by Google

Criação de camaleões
O canto da sereia de um design que serve para todos os tamanhos de tela tem uma longa história de
esperanças brilhantes, promessas quebradas e designers e desenvolvedores cansados.

Se há duas coisas que posso dizer sobre design escalável (também conhecido como
layout dinâmico, design fluido, design adaptável e design responsivo), são estas: tende a
ser muito trabalhoso.

É muito difícil fazê-lo bem.


No passado, o design escalável - criar uma versão de um site que ficasse bem em telas
de vários tamanhos - era opcional. Parecia uma boa ideia, mas poucas pessoas realmente
se importavam com isso . Agora que as telas pequenas estão tomando conta, todo
mundo se importa: se você tem um site na Web, precisa torná-lo utilizável em qualquer
tamanho de tela.
Os desenvolvedores aprenderam há muito tempo que tentar criar versões separadas
de qualquer coisa – manter dois conjuntos de livros, por assim dizer – é um caminho
infalível para a loucura. Ele dobra o esforço (pelo menos) e garante que as coisas não
serão atualizadas com tanta frequência ou as versões ficarão fora de sincronia.
Ainda está tudo resolvido. Este eu, o problema tem implicações reais de receita,
então haverá soluções técnicas, mas vai me levar.
Enquanto isso, aqui estão três sugestões:
Permitir zoom. Se você não tem recursos para “mobilizar” seu site e não está
usando um design responsivo, você deve pelo menos certificar-se de que seu site
não resista aos esforços para visualizá-lo em um dispositivo móvel.
Há poucas coisas mais irritantes do que abrir um site em seu telefone e descobrir
que você não pode ampliar o texto ny.
(Bem, tudo bem. Na verdade, há muitas coisas mais irritantes. Mas é uma presa
irritante.)
Não me deixe parado na porta da frente. Outro incômodo real: você clica em
um link em um e-mail ou em um site de mídia social e, em vez de levá-lo ao arc
em questão, ele o leva à página inicial do celular, deixando você caçar a coisa
por conta própria.
Machine Translated by Google

Sempre forneça um link para o site “completo”. Por mais fabuloso e completo que
seja seu site mobile, você precisa dar aos usuários a opção de visualizar a versão
não mobile, principalmente se ele tiver recursos e informações que não estão
disponíveis em sua versão mobile. (A convenção atual é colocar uma alternância de
site móvel/site completo na barra de cada página.)

Há muitas situações em que as pessoas estarão dispostas a aumentar e diminuir o


zoom através da pequena janela de visualização de um dispositivo móvel em troca
de acesso em movimento a recursos que estão acostumados a usar ou de que
precisam naquele momento. Além disso, algumas pessoas preferem ver as páginas
da área de trabalho ao usar tablets de 7ÿ com telas de alta resolução no modo
paisagem.

Não esconda suas affordances debaixo de um alqueire

Affordances são pistas visuais no design de um objeto que sugerem como podemos usá-
lo. (Eu os mencionei no Capítulo 3. Lembra das maçanetas e do livro de Don Norman? Ele
popularizou o termo na primeira edição de The Design of Everyday Things em 1988 e o
mundo do design rapidamente o adotou.4 )

4 Infelizmente, a maneira como eles o usaram não foi exatamente o que ele pretendia. Ele esclareceu
isso na nova edição de Everyday Things propondo chamar as pistas de “significantes”, mas pode ser
tarde demais para colocar esse gênio de volta no tronco. Com desculpas a Don, vou continuar
chamando-os de affordances aqui porque (a) ainda é o uso predominante e (b) faz minha cabeça doer
muito de outra forma.

Affordances são a carne e as batatas de uma interface de usuário visual. Por


exemplo, o estilo tridimensional de alguns botões deixa claro que eles devem ser clicados.
Da mesma forma que com o cheiro de informações para links, quanto mais claras as pistas
visuais, mais inequívoco é o sinal.
Machine Translated by Google

Da mesma forma, uma caixa retangular com uma borda ao redor sugere que você
pode clicar nela e digitar algo. Se você tivesse uma caixa de texto editável sem borda,
o usuário poderia clicar nela e digitá-la se soubesse que ela estava lá. Mas é a
affordance — a fronteira — que torna clara sua função.

Para que as affordances funcionem, elas precisam ser perceptíveis, e


algumas características dos dispositivos móveis os tornaram menos perceptíveis ou, pior,
invisíveis. E por definição, affordances são a última coisa que você deve esconder.
Isso não quer dizer que todas as affordances precisam atingir você na cara. Eles só
precisam ser visíveis o suficiente para que as pessoas percebam o que precisam para
realizar suas tarefas.

Sem cursor = sem foco = sem pista

Antes da chegada das telas sensíveis ao toque, o design da Web dependia fortemente
de um recurso chamado hover - a capacidade dos elementos da tela mudarem de alguma
forma quando o usuário aponta o cursor para eles sem clicar.
Mas uma tela de toque capacitiva (usada em quase todos os dispositivos móveis)
não pode detectar com precisão que um dedo está pairando sobre o vidro, apenas
5
quando o dedo o tocou. É por isso que eles não têm um cursor.
5 Você já notou que o cursor estava faltando? Tenho que admitir que usei meu primeiro iPhone por vários
meses antes de me dar conta de que não havia cursor.

Como resultado, muitos recursos úteis da interface que dependiam do foco não estão
mais disponíveis, como ferramentas ps, botões que mudam de forma ou cor para indicar
que são clicáveis e menus que descem para revelar seu conteúdo sem forçá-lo a fazer
uma escolha.
Como designer, você precisa estar ciente de que esses elementos não existem para
usuários móveis e tentar encontrar maneiras de substituí-los.
Machine Translated by Google

Design plano: amigo ou inimigo?

Affordances requerem disncons visuais. Mas a tendência recente no design de


interface (que pode ter diminuído pelo que você leu) mudou exatamente na direção
oposta: removendo disncons visuais e “flaening” a aparência dos elementos da interface.

Parece muito bom (para algumas pessoas, pelo menos) e pode tornar as telas menos
atraentes. Mas a que preço?
Neste caso, a compensação é entre um visual limpo e despojado de um lado e fornecer
informações visuais suficientes para que as pessoas possam perceber as affordances
do outro.

Infelizmente, o Flat design tende a levar consigo não apenas a decoração potencialmente
distrativa, mas também as informações úteis que os elementos mais texturizados
estavam transmitindo.

As disncons exigidas para desenhar um aenon para uma affordance geralmente


precisam ser multidimensionais: é a posição de algo (por exemplo, na barra de
navegação) e sua forma (por exemplo, tipo invertido, todas em maiúsculas) que dizem
que é um item de menu.

Ao remover vários desses disncons da paleta de design, o Flat design torna mais
difícil diferenciar as coisas.
O design plano sugou o ar da sala. Isso me lembra o mundo pré-colorido no meu
desenho/quadrinho/tirinha favorito de Calvin e Hobbes .
(O resto do desenho está no final do Capítulo 13.)
Machine Translated by Google

CALVIN E HOBBES © 1989 Waerson. Reimpresso com permissão da UNIVERSAL UCLICK. Todos os direitos
reservados.

Você pode fazer todo o design plano que quiser (pode ser necessário, pode ser forçado a
você), mas certifique-se de usar todas as dimensões restantes para compensar o que você
perde.

Você realmente pode ser muito rico ou muito magro

...mas os computadores nunca podem ser rápidos demais. Parcularmente em


dispositivos móveis, a velocidade faz tudo parecer cerveja. Desempenho lento significa
frustração para os usuários e perda de boa vontade para os editores.

Por exemplo, eu prezo os alertas de notícias de última hora do aplicativo móvel da AP


(Associated Press). Eles são sempre a primeira dica que recebo de grandes notícias.
Infelizmente para a AP, porém, sempre que toco em um de seus alertas, o aplicativo insiste
em carregar uma grande quantidade de fotos para todas as outras notícias atuais antes de
me mostrar qualquer detalhe sobre o alerta.

Como resultado, criei um novo hábito: quando chega um alerta de AP, abro imediatamente o
site do New York Times ou o Google News para ver se eles pegaram
Machine Translated by Google

a história ainda.

Estamos todos acostumados a conexões muito rápidas hoje em dia, mas temos que
lembrar que as velocidades de download em dispositivos móveis não são confiáveis. Se as
pessoas estão em casa ou cantam na Starbucks, as velocidades de download provavelmente são
boas, mas quando saem do conforto do Wi-Fi e voltam para 4G ou 3G ou pior, o desempenho pode
variar muito.

Tenha cuidado para que suas soluções de design responsivo não carreguem páginas com
grandes quantidades de código e imagens maiores do que o necessário para a tela do usuário.

Aplicativos móveis, atributos de usabilidade de

Você deve se lembrar que, lá na página 9 , mencionei que falaria mais tarde sobre atributos que
algumas pessoas incluem em suas definições de usabilidade: útil, apreensível, memorável, eficaz,
eficiente, desejável e agradável.
Bem, esse eu chegou.

Pessoalmente, meu foco sempre foi nos três que são centrais para minha definição de
usabilidade:

Uma pessoa de habilidade e experiência média (ou mesmo abaixo da média) pode
descobrir como usar a coisa [isto é, é aprendível] para realizar algo [efevo] sem que seja
mais problemático do que valha a pena [eficiente].

Eu não gasto muito pensando se as coisas são úteis porque me parece mais uma questão de
marketing, algo que deve ser estabelecido antes de qualquer projeto começar, usando métodos
como entrevistas, grupos focais e pesquisas. Se algo é desejável também parece uma questão de
markeng, e terei mais a dizer sobre isso no capítulo final.

Por enquanto, vamos falar sobre prazer, capacidade de aprendizado e memorização e como
eles se aplicam a aplicativos móveis.

Delighul é o novo preto


O que é essa coisa de “delícia”, afinal?

O prazer é um pouco difícil de definir; é mais uma daquelas coisas do tipo “eu saberei quando
sentir”. Em vez de uma definição, provavelmente é mais fácil
Machine Translated by Google

idenfifique algumas das palavras que as pessoas usam ao descrever os produtos da delighul: divertido,

surpreendente, impressionante, capvang, inteligente e até mágico.6

6 Meu padrão pessoal para um aplicativo delighul tende a ser “faz algo que você teria sido queimado
na fogueira por algumas centenas de anos atrás”.

Os aplicativos Delighul geralmente vêm do casamento de uma ideia sobre algo que as pessoas
realmente gostariam de poder fazer, mas que não imaginam que seja possível, com uma ideia brilhante
sobre como usar alguma nova tecnologia para realizá-lo.

SoundHound é um exemplo perfeito.

Ele não apenas pode identificar aquela música que você ouve tocando onde quer que esteja, mas
também pode exibir as letras e percorrê-las em sincronia com o
música.

E o Paper não é o seu aplicativo de desenho comum. Em vez de dezenas de ferramentas com milhares de
opções, você obtém cinco ferramentas sem opções. E cada um é otimizado para criar coisas que parecem
boas.
Machine Translated by Google

Construir prazer em aplicativos móveis tornou-se cada vez mais importante porque o
mercado de aplicativos é muito competitivo. Apenas fazer algo bem feito não é bom o
suficiente para criar um sucesso; você tem que fazer algo incrivelmente bem.
O deleite é como a atribuição de crédito extra do design da experiência do usuário.

Tornar seu aplicativo delighul é um bom objetivo. Só não se concentre tanto nele a ponto
de esquecer de torná-lo utilizável também.

Os aplicativos precisam ser aprendidos

Um dos maiores problemas com aplicativos é que, se eles tiverem mais do que alguns recursos,
podem não ser muito fáceis de aprender.

Tome Claro, por exemplo. É um aplicativo para fazer listas, como listas de tarefas. É
brilhante, inovador, bonito, útil e divertido de usar, com uma interface limpa e minimalista.
Todas as interações são elegantemente animadas, com efeitos sonoros sofisticados. Um
revisor disse: “É quase como se eu estivesse jogando uma máquina de pinball enquanto me
mantenho produtivo”.

O problema é que uma razão pela qual é tão divertido de usar é que eles criaram interações,
gestos e navegação inovadores, mas há muito o que aprender.

Com a maioria dos aplicativos, se você receber instruções, geralmente são uma ou duas
telas quando você inicia o aplicativo pela primeira vez que fornecem algumas dicas essenciais
sobre como a coisa funciona. Mas muitas vezes é difícil ou impossível encontrá-los novamente
para ler mais tarde.

E se existe ajuda (e você pode encontrá-la), é uma pequena página de texto ou um link para o
site do desenvolvedor sem ajuda a ser encontrada ou uma página de suporte ao cliente que
fornece o endereço de e-mail para onde você pode enviar seu perguntas.

Isso pode funcionar para aplicativos que estão fazendo apenas algumas coisas, mas assim que
você tenta criar algo que tenha muita funcionalidade - e particularmente qualquer função que
não siga convenções familiares ou diretrizes de interface - geralmente não é suficiente.

As pessoas que criaram o Clear realmente fizeram um trabalho muito bom com
treinamento em comparação com a maioria dos aplicativos. A primeira vez que você o usa, você
abre caminho através de um tour rápido de dez telas bem ilustrado dos principais recursos.
Machine Translated by Google

Isso é seguido por um tutorial engenhoso que na verdade é apenas uma de suas listas.

Cada item da lista lhe diz algo para tentar, e pelo que você terminou, você praticou usando quase
todos os recursos.

Mas quando eu o usei para fazer testes de usabilidade de demonstração durante minhas apresentações,
ele não se saiu tão bem.

Eu dou ao parcipante/voluntário a chance de aprender sobre o aplicativo lendo a descrição na loja de


aplicativos, visualizando o tour rápido e experimentando os acons do tutorial. Em seguida, peço a eles
que façam o tipo de tarefa principal para a qual o aplicativo foi projetado: crie uma nova lista chamada
“Viagem a Chicago” com três itens – Reservar hotel, Alugar carro e Escolher voo.

Até agora, ninguém conseguiu.

Mesmo que seja mostrado na apresentação de slides na entrada, as pessoas parecem não entender
o conceito de que existem níveis: o nível das listas, o nível dos itens nas listas e o nível dos sengs. E
mesmo que eles se lembrem de vê-lo, eles
Machine Translated by Google

sll não consigo descobrir como navegar entre os níveis. E se você não conseguir descobrir
isso, não poderá acessar as telas de Ajuda. Captura-22.

Isso não quer dizer que ninguém no mundo real aprenda a usá-lo. Ele recebe ótimas críticas
e é consistentemente um best-seller. Mas fico imaginando quantas pessoas que compraram
nunca o dominaram, ou quantas vendas a mais poderiam fazer se fosse mais fácil de aprender.

E esta é uma empresa que se esforçou muito em treinar e ajudar. A maioria não.

Você precisa fazer cerveja do que a maioria, e o teste de usabilidade o ajudará a descobrir
como.

Os aplicativos também precisam ser memoráveis

Há mais um atributo importante: a memorização. Depois de descobrir como usar um


aplicativo, você se lembrará de como usá-lo na próxima vez que tentar ou terá que começar
do zero?

Não costumo falar muito sobre memorização porque acho que a melhor maneira de tornar as
coisas fáceis de reaprender é torná-las incrivelmente claras e fáceis de aprender em primeiro
lugar. Se é fácil aprender o primeiro eu, é fácil aprender o segundo eu.

Mas certamente é um problema sério com alguns aplicativos.

Um dos meus aplicativos de desenho favoritos é o ASketch. Eu amo este aplicativo


porque não importa o que você tenta desenhar e quão grosseiramente você desenha, acaba
parecendo interessante.

Mas durante meses, cada vez que eu abria, não conseguia me lembrar de como começar um
novo desenho.
Machine Translated by Google

Na verdade, eu não conseguia me lembrar de como chegar a nenhum dos controles. Para
maximizar o espaço de desenho, não havia ícones na tela.

Eu tentaria todos os suspeitos de sempre: toque duplo, toque triplo, toque perto do meio na
parte superior ou boom da tela, vários toques e toques com vários dedos e, finalmente, eu bati
nele. Mas na próxima vez que fui usá-lo, já havia esquecido qual era o truque novamente.

A memorização pode ser um grande fator para que as pessoas adotem um aplicativo
para uso regular. Normalmente, quando você compra um, estará disposto a gastar um pouco de
mim imediatamente descobrindo como usá-lo. Mas se você tiver que investir o mesmo esforço
na próxima vez, é improvável que pareça uma experiência satisfatória.
A menos que você esteja muito impressionado com o que ele faz, há uma boa chance de você
abandoná-lo – que é o destino da maioria dos aplicativos.

A vida é barata (99 centavos) em dispositivos móveis.


Machine Translated by Google

Teste de usabilidade em dispositivos móveis

Na maior parte, fazer testes de usabilidade em dispositivos móveis é exatamente o mesmo


que o teste que descrevi no Capítulo 9.

Você ainda está inventando tarefas para as pessoas fazerem e vendo-as tentar fazê-las.
Você os levará a dizer o que estão pensando enquanto trabalham.
Você ainda precisa ficar quieto a maior parte de mim e guardar suas perguntas de
sondagem para o final. E você ainda deve tentar fazer com que o maior número possível de
interessados venha e observe os testes pessoalmente.

Quase tudo que é diferente quando você está fazendo testes móveis não é sobre o processo;
é sobre logística.

A logística do mobile tesng

Quando você está testando em um computador pessoal, a configuração é simples: o


facilitador olha para a mesma tela que o participante.

O software de compartilhamento de tela permite que os observadores vejam o que


está acontecendo.

O software de gravação de tela cria um vídeo da sessão.

Mas se você já tentou fazer testes em dispositivos móveis, sabe que a configuração pode
ficar muito complicada: documentar câmeras, webcams, processadores de sinal de hardware,
restrições físicas (bem, talvez não restrições físicas, mas “Não mova o dispositivo além deste
ponto” para manter o participante à vista de uma câmera), e até coisas chamadas trenós e
goosenecks.

Aqui estão alguns dos problemas com os quais você precisa

lidar: Você precisa deixar os parcipantes usarem seus próprios dispositivos?

Eles precisam segurar o dispositivo naturalmente, ou ele pode ser cantado em


uma mesa ou apoiado em um suporte?

O que os observadores precisam ver (por exemplo, apenas a tela, ou tanto a tela
quanto os dedos do parcipante para que possam ver seus gestos)?
E como você exibe isso na sala de observação?

Como você cria uma gravação?


Machine Translated by Google

Uma das principais razões pelas quais o tesng móvel é complicado é que algumas das
ferramentas nas quais confiamos para o tesng de desktop ainda não existem para dispositivos móveis.
A partir desta torção, aplicativos robustos de gravação de tela móvel e compartilhamento de
tela não estão disponíveis, principalmente porque os sistemas operacionais móveis tendem a
proibir processos em segundo plano. E os dispositivos realmente não têm potência suficiente
para executá-los de qualquer maneira.

Espero que isso mude em breve. Com tantos sites e aplicativos mobile para testar, já existem
muitas empresas tentando encontrar soluções.

Minhas recomendações
Até que as soluções baseadas em tecnologia de cerveja apareçam, aqui está o que eu
gostaria:

Use uma câmera apontada para a tela em vez de espelhar. O espelhamento é o


mesmo que o compartilhamento de tela: exibe o que está na tela. Você pode fazer isso
com software (como o Airplay da Apple) ou hardware (usando o mesmo tipo de cabo que
você usa para reproduzir um vídeo do seu telefone ou tablet em um monitor ou TV).

Mas o espelhamento não é uma boa maneira de assistir a testes feitos em dispositivos
touch screen, pois você não consegue ver os gestos e toques que o parcipante está
fazendo. Assistir a uma prova sem ver os dedos do parcipante é como assistir a um piano:
ele se move muito rápido e pode ser difícil de acompanhar. Ver a mão e a tela é muito
mais envolvente.

Se você vai capturar dedos, haverá uma câmera envolvida. (Alguns softwares
de espelhamento mostrarão pontos e listras na tela, mas não é a mesma coisa.)

Conecte a câmera ao dispositivo para que o usuário possa segurá-la naturalmente.


Em algumas configurações, o dispositivo fica em uma mesa ou escrivaninha e não pode
ser movido. Em outros, o parcipante pode segurar o aparelho, mas é orientado a guardá-
lo dentro de uma área marcada com fita adesiva. A única razão para restringir o
movimento do dispositivo é tornar mais fácil apontar uma câmera para ele e mantê-lo à
vista.

Se você conectar a câmera ao dispositivo, o parcipante poderá movê-la livremente


e a tela permanecerá visível e em foco.
Machine Translated by Google

Não se preocupe com a câmera apontada para o parcipante. Eu realmente


não sou um fã da câmera de rosto. Alguns observadores gostam de ver o rosto
do parcipante, mas acho que na verdade é uma distração. Eu prefiro que os
observadores se concentrem no que está acontecendo na tela, e eles quase
sempre podem dizer o que o usuário está sentindo pelo tom de voz.

Adicionar uma segunda câmera inevitavelmente torna a configuração muito mais


complicada, e não acho que valha a complexidade extra. Claro, se seu chefe insiste
em ver rostos, mostre rostos.

Prova de conceito: Minha câmera Brundleyfly7

7 Brundlefly é a palavra que o personagem de Jeff Goldblum (Seth Brundle) em The Fly usa para se descrever após
seu experimento com um dispositivo de teletransporte acidentalmente fundir seu DNA com o de uma mosca.

Por curiosidade, eu construí um equipamento de câmera mesclando um clipe de


uma luz de livro com uma webcam. Ele não pesa quase nada e captura o áudio com
seu microfone embutido. O meu custou cerca de US $ 30 em peças e levou cerca de
uma hora para ser feito. Tenho certeza de que alguém vai fabricar algo semelhante —
só muita cerveja — em breve. Vou colocar instruções para construir um você mesmo
online em rocketsurgerymadeeasy.com.

Webcam leve + braçadeira leve e gooseneck = Brundlefly

Anexar uma câmera ao dispositivo cria uma visão muito fácil de seguir. Os
observadores obtêm uma visão estável da tela, mesmo que o participante esteja
acenando.

Acho que resolve a maioria dos objecons de outras soluções de câmera montada:
elas são pesadas e desajeitadas. Ele não pesa quase nada e quase não
muda a sensação do telefone em sua mão.
Machine Translated by Google

Eles estão se distraindo. É bem pequeno (menor do que parece na foto) e está
posicionado fora do campo de visão do parcipante, que está focado no telefone.

Ninguém quer aach nada para seu telefone. Os trenós geralmente são fixados
nos telefones com velcro ou fita dupla-face. Isso usa um grampo acolchoado que
não pode arranhar ou estragar nada, mas ainda segura o dispositivo com firmeza.

Uma limitação desse tipo de solução é que ela é conectada: requer um cabo de
extensão USB que vai da câmera ao seu laptop. Mas você pode comprar uma
extensão longa de forma barata.
O resto da configuração é muito simples:
Conecte o Brundlefly ao laptop do facilitador via USB.

Abra algo como AmCap (em um PC) ou QuickTime Player (em um Mac) para exibir a
visualização do Brundlefly. O facilitador observará essa visão.

Compartilhe a tela do laptop com os observadores usando o compartilhamento


de tela (GoToMeeng, WebEx, etc.)
Execute um gravador de tela (por exemplo, Camtasia) no computador na sala
de observação. Isso reduz a carga no laptop do facilitador.
É isso.

Finalmente...

De uma forma ou de outra, parece claro que o celular é onde vamos viver no futuro e oferece
enormes oportunidades para criar ótimas experiências de usuário e coisas utilizáveis. Novas
tecnologias e fatores de forma serão introduzidos a todo o momento, alguns deles envolvendo
formas dramaticamente diferentes de interação.8

8 Pessoalmente, acho que falar com seu computador será uma das próximas grandes coisas. A precisão
do reconhecimento já é incrível; só precisamos encontrar maneiras de as pessoas falarem com seus
dispositivos sem parecer, parecer e se sentir tolas. Alguém que está trabalhando seriamente nos
problemas deveria me ligar; Eu uso o software de reconhecimento de fala há 15 anos e tenho muitos
pensamentos sobre por que ele não pegou.

Apenas certifique-se de que a usabilidade não está sendo perdida no shuffle. E a melhor
maneira de fazer isso é por tesng.
Machine Translated by Google

Capítulo 11. Usabilidade como cortesia comum

POR QUE SEU SITE DEVE SER UM MENSCH1

1 Mensch: uma palavra iídiche de origem alemã que originalmente significa “ser humano”. Uma pessoa de integridade e
honra; “um cara de pé”; alguém que faz a coisa certa.

Sinceridade: essa é a parte difícil. Se você pode fingir isso, o resto é fácil.

— ANTIGA PIADA SOBRE UM AGENTE DE HOLLYWOOD

Alguns de mim atrás, eu estava reservado em um vôo para Denver. Acontece que a data
do meu voo também acabou sendo o prazo para negociação coletiva entre a companhia
aérea em que eu estava reservado e um de seus sindicatos.

Preocupado, fiz o que qualquer um faria: (a) começar a verificar o Google News a cada hora
para ver se um acordo havia sido alcançado e (b) visitar o site da companhia aérea para ver o
que eles estavam dizendo sobre isso.

Fiquei chocado ao descobrir que não apenas não havia nada sobre a greve iminente
na página inicial da companhia aérea, mas também não havia uma palavra sobre isso
em qualquer lugar do site. Eu pesquisei. eu naveguei. Eu percorri todas as suas listas de
perguntas frequentes. Nada além de negócios como de costume.
"Ataque? Que greve?”

Agora, na manhã de uma possível greve das companhias aéreas, você precisa saber que
há realmente apenas uma pergunta frequente relacionada ao site, e está sendo feita por
centenas de milhares de pessoas que possuem ingressos para a próxima semana: O que
vai acontecer para mim?

Eu poderia esperar encontrar uma lista completa de perguntas frequentes dedicada ao tópico:

Haverá realmente uma greve?


Qual é o status atual das negociações?

Se houver uma greve, o que acontecerá?

Como poderei remarcar meu voo?

O que você vai fazer para me ajudar?

Nada.
Machine Translated by Google

O que eu deveria tirar disso?


Ou (a) a companhia aérea não tinha nenhum procedimento para atualizar sua página
inicial para circunstâncias especiais, (b) por algum motivo legal ou comercial eles não
queriam admitir que poderia haver uma greve, (c) não ocorreu a eles que as pessoas
podem estar interessadas, ou (d) eles simplesmente não poderiam ser incomodados.

Não importa qual tenha sido o motivo real, eles fizeram um excelente trabalho ao
esgotar minha boa vontade tanto para com a companhia aérea quanto para seu site. A
marca deles – que eles gastam centenas de milhões de dólares por ano para polir –
definitivamente havia perdido um pouco de seu brilho para mim.
A maior parte deste livro trata da construção de clareza nos sites da Web: certificando-
se de que os usuários possam entender o que estão vendo - e como usá-lo - sem esforço
indevido. Está claro para as pessoas? Eles “entendem”?
Mas há outro componente importante para a usabilidade: fazer a coisa certa – ser
atencioso com o usuário. Além de “Meu site está claro?” você também precisa perguntar:
“Meu site se comporta como um mensch?”

O reservatório de boa vontade


Sempre achei útil imaginar que cada vez que entramos em um site, começamos com um
reservatório de boa vontade. Cada problema que encontramos no local diminui o nível
desse reservatório. Aqui está, por exemplo, como pode ter sido minha visita ao site da
companhia aérea:

entro no site.

Minha boa vontade está um pouco baixa, porque não estou feliz que suas negociações
possam me incomodar seriamente.

Eu olho ao redor da página inicial.


Machine Translated by Google

Parece bem organizado, então relaxo um pouco. Estou confiante de que se a


informação estiver aqui, poderei encontrá-la.

Não há menção da greve na página inicial.

Eu não gosto do fato de que parece um negócio como de costume.

Há uma lista de cinco links para notícias na página inicial, mas nenhum é relevante.

Clico no link Press Releases no topo da lista.

O último comunicado de imprensa tem cinco dias.

Eu vou para a página Sobre nós.

Nenhum link promissor, mas muitas promoções, o que é muito chato. Por que eles estão
tentando me vender mais bilhetes quando eu não tenho certeza de que eles vão me levar de
avião amanhã?

Procuro por “greve” e encontro dois comunicados de imprensa sobre uma greve de um ano
atrás e páginas da história corporativa sobre uma greve na década de 1950.
Machine Translated by Google

Neste ponto, eu gostaria de sair, mas eles são a única fonte para esta informação.

Eu olho através de suas listas de perguntas frequentes, então saio.

O reservatório é limitado, e se você tratar os usuários mal o suficiente e esgotá-lo, há uma boa
chance de que eles saiam. Mas sair não é o único resultado negativo possível; eles podem não
estar tão ansiosos para usar seu site no futuro, ou podem pensar menos em sua organização
e atacar você no Facebook ou Twier. Para aqueles de vocês no mercado, seu NPS (Net
Promoter Score) provavelmente diminui.

Há algumas coisas que não valem a pena sobre este reservatório:

É idiossincrático. Algumas pessoas têm um grande reservatório, outras pequenas.


Algumas pessoas são mais desconfiadas por natureza, ou mais mal-humoradas; outros
são inerentemente mais pacientes, confiáveis ou opmisc. A questão é que você não
pode contar com uma reserva muito grande.

É situacional. Se estou com muita pressa, ou acabei de sair de uma experiência ruim
em outro site, minha boa vontade descartável já pode estar baixa quando entro no seu
site, mesmo que eu tenha naturalmente uma grande reserva.

Você pode recarregá-lo. Mesmo que você tenha cometido erros que tenham diminuído
minha boa vontade, você pode reabastecê-la fazendo coisas que me fazem sentir
como se estivesse cuidando dos meus melhores interesses.

Somemes um único erro pode esvaziá-lo. Por exemplo, apenas abrir um formulário
de cadastro com toneladas de campos pode ser suficiente para causar
Machine Translated by Google

reserva de algumas pessoas para mergulhar instantaneamente a zero.

Coisas que diminuem a boa vontade

Aqui estão algumas das coisas que tendem a fazer os usuários sentirem que as pessoas que publicam
um site não têm seus melhores interesses em mente:

Escondendo informações que eu quero. As coisas mais comuns para esconder

são números de telefone de suporte ao cliente, taxas de envio e preços.

O objetivo de ocultar os números de telefone de suporte é tentar impedir que os usuários


liguem, porque cada chamada custa dinheiro. O efeito usual é diminuir a boa vontade e garantir que
eles fiquem ainda mais irritados quando encontrarem o número e ligarem. Por outro lado, se o
número 800 estiver à vista – talvez até em todas as páginas – saber de alguma forma que eles
podem ligar se quiserem é suficiente para manter as pessoas procurando as informações no site por
mais tempo, aumentando as chances de que eles resolverão o problema sozinhos.

Alguns sites ocultam informações de preços na esperança de que os usuários do geng estejam tão
avançados no processo que eles se sintam investidos neles quando experimentarem o choque do
scker. Meu exemplo favorito são os sites da Web para acesso sem fio em locais públicos como
aeroportos. Tendo visto um “Acesso sem fio disponível!” assina e sabendo que é gratuito em alguns
aeroportos, você abre seu laptop, encontra um sinal e tenta se conectar. Mas então você precisa
escanear, ler e clicar em três páginas, seguindo links como “Acesso sem fio” e “Clique aqui para se
conectar” antes de chegar a uma página que até sugere o quanto isso pode custar. Parece uma
velha tática de vendas por telefone: se eles puderem mantê-lo na linha por tempo suficiente e
continuar jogando mais de seu discurso de marketing em você, talvez eles possam convencê-lo ao
longo do caminho.
Machine Translated by Google

Me punindo por não fazer as coisas do seu jeito. eu nunca deveria ter que

pense em formar dados: se devo ou não colocar traços no meu CPF, espaços no número do
meu cartão de crédito ou parênteses no meu número de telefone. Muitos sites insistem
perversamente em não haver espaços em números de cartão de crédito, quando os espaços
realmente facilitam muito a digitação correta do número. Não me faça pular por aros só porque
você não quer escrever um pouco de código.

Me pedindo informações que você realmente não precisa. A maioria dos usuários são

muito cético em relação a pedidos de informações pessoais e acha chato se um site pede mais
do que o necessário para a tarefa em questão.

Chupando e brincando comigo. Estamos sempre à procura de falsos

sinceridade, e tentativas dissimuladas de me convencer de que você se importa comigo


podem ser particularmente irritantes. Pense no que passa pela sua cabeça a cada vez que você
ouve “Sua ligação é importante para nós”.

Pung chia no meu caminho. Ter que percorrer páginas inchadas

com fotos de marca de bem-estar deixa claro que você não entende - ou se importa
- que estou com pressa.

Seu site parece amador. Você pode perder boa vontade se seu site parecer

desleixado, desorganizado ou pouco profissional, como se nenhum esforço tivesse sido


feito para torná-lo apresentável.
Machine Translated by Google

Observe que, embora as pessoas gostem de fazer comentários sobre a aparência dos sites -
especialmente sobre se gostam das cores - quase ninguém vai sair de um site só porque não
parece ótimo. (Eu digo às pessoas para ignorar todos os comentários que os usuários fazem
sobre cores durante um teste de usuário, a menos que três em cada quatro pessoas usem uma
palavra como “vomitar” para descrever o esquema de cores. Então vale a pena repensar.2 )

2 Isso realmente aconteceu uma vez durante uma rodada de testes que eu facilitei. Mudamos a cor.

Pode haver alguns momentos em que você optará por fazer com que seu site faça algumas dessas
coisas hostis ao usuário deliberadamente. Às vezes, faz sentido comercial não fazer exatamente o
que o cliente deseja. Por exemplo, pop-ups não convidados quase sempre incomodam as pessoas
até certo ponto. Mas se seus stascs mostrarem que você pode obter 10% a mais de receita usando
pop-ups e achar que vale a pena incomodar seus usuários, você pode fazê-lo. É uma decisão de
negócios. Apenas certifique-se de fazê-lo de maneira informada, e não inadvertidamente.

Coisas que aumentam a boa vontade

A boa notícia é que mesmo que você cometa erros, é possível restaurar minha boa vontade
fazendo coisas que me convençam de que você tem meus interesses no coração. A maioria
deles é apenas o outro lado da outra lista:

Conheça as principais coisas que as pessoas querem fazer em seu site e

torná-los óbvios e fáceis. Geralmente não é difícil descobrir o que as pessoas querem fazer
em um determinado site. Acho que mesmo as pessoas que discordam sobre tudo o mais
sobre o site de sua organização quase sempre me dão a mesma resposta quando pergunto:
“Quais são as três principais coisas que seus usuários querem fazer?” O problema é que facilitar
essas coisas nem sempre se torna a principal prioridade que deveria ser. (Se a maioria das
pessoas estiver acessando seu site para solicitar uma hipoteca, nada deve impedir que seja
muito fácil solicitar uma hipoteca.)

Diga-me o que eu quero saber. Seja franco sobre coisas como frete

custos, taxas diárias de estacionamento do hotel, interrupções de serviço - qualquer coisa que
você preferiria não ser antecipado. Você pode perder pontos se suas taxas de envio forem
Machine Translated by Google

mais alto do que eu gostaria, mas você pode ganhar pontos suficientes por franqueza e por
tornar mais fácil para mim compensar a diferença de preço.

Salve-me passos sempre que puder. Por exemplo, em vez de me dar

o número de rastreamento da empresa de transporte para minha compra, coloque um link no


meu recibo de e-mail que abre o site deles e envia meu número de rastreamento quando eu
clico nele. (Como sempre, a Amazon foi o primeiro site a fazer isso por mim.)

Coloque esforço nisso. Meu exemplo favorito é o suporte técnico da HP

site, onde parece que uma enorme quantidade de trabalho foi dedicada a (a) gerar as
informações de que preciso para resolver meus problemas, (b) garantir que sejam precisas e
úteis, (c) apresentá-las com clareza e (d) organizar para que eu possa encontrá-lo. Já tive
muitas impressoras HP e, em quase todos os casos em que tive um problema, consegui
resolvê-lo sozinho. Como resultado, continuo comprando impressoras HP.

Saiba quais perguntas eu provavelmente terei e responda-as.

As listas de Perguntas Frequentes são extremamente valiosas, especialmente se elas

realmente forem FAQs, e não argumentos de marketing disfarçados de FAQs (também


conhecidas como QWWPWAs: Perguntas que desejamos que as pessoas perguntem).

Você os mantém atualizados. O Atendimento ao Cliente e o Suporte Técnico


podem fornecer facilmente uma lista das cinco perguntas mais frequentes
desta semana. Eu sempre colocaria essa lista no topo da página de suporte de
qualquer site.

Eles são sinceros. Muitas pessoas estão procurando nas Perguntas Frequentes
a resposta para uma pergunta que você preferiria que não tivessem perguntado. A
franqueza nessas situações contribui muito para aumentar a boa vontade.

Forneça-me confortos como páginas amigáveis para impressão.

Algumas pessoas adoram poder imprimir histórias que abrangem várias páginas com um
único clique, e o CSS torna relativamente fácil criar
Machine Translated by Google

páginas amigáveis com um pequeno esforço adicional. Largue os anúncios (a


possibilidade de um banner ter algum impacto além de irritante é ainda maior quando
está apenas ocupando espaço no papel), mas não largue as ilustrações, fotos e figuras.

Facilite a recuperação de erros. Se você realmente fizer usuário suficiente

tesng, você poderá me poupar de muitos erros antes que eles aconteçam. Mas
onde o potencial para erros é inevitável, sempre forneça uma maneira graciosa e
óbvia para eu me recuperar.

Na dúvida, peça desculpas. Algumas vezes você não pode evitar: você apenas

não tem a capacidade ou os recursos para fazer o que o usuário deseja (por
exemplo, o sistema de biblioteca de sua universidade exige senhas separadas para
cada um dos bancos de dados do catálogo, portanto, você não pode fornecer aos
usuários o login único que eles desejam). Se você não pode fazer o que eles querem,
pelo menos deixe-os saber que você sabe que os está incomodando.
Machine Translated by Google

Capítulo 12. Acessibilidade e você

QUANDO VOCÊ ACHA QUE ACABOU, UM GATO FLUTUA COM MANTEIGA


BRINDE LIGADO ÀS SUAS COSTAS

Quando um gato é derrubado, ele sempre cai de pé, e quando uma torrada é
derrubada, ele sempre cai com o lado enterrado voltado para baixo. Proponho amarrar
torradas nas costas de um gato; os dois vão pairar, girando, centímetros acima do solo. Com
uma matriz gigantesca, um monotrilho de alta velocidade poderia facilmente ligar Nova
York a Chicago.

—JOHN FRAZEE, NO REVISTA DE RESULTADOS IRREPRODUTÍVEIS

Algumas pessoas me perguntam: “E a acessibilidade? Isso não faz parte da


usabilidade?”
E eles estão certos, é claro. A menos que você tome uma decisão geral de que pessoas
com deficiência não fazem parte do seu público, você realmente não pode dizer que seu site
é utilizável a menos que seja acessível.

A essa altura, todos os envolvidos no design da Web sabem pelo menos um pouco
sobre acessibilidade na Web. E, no entanto, quase todos os sites que visito falham no meu
teste de acessibilidade de três segundos, aumentando o tamanho do tipo.1
1 Se você estiver prestes a me enviar um e-mail lembrando que o Zoom substituiu o Tamanho do Texto na
maioria dos navegadores, obrigado, mas você pode salvar essas teclas. Todo site fica maior se você usar o Zoom, mas
apenas sites que ultrapassaram as fontes de tamanho fixo (geralmente um bom indicador de esforço para tornar as
coisas acessíveis) respondem ao Tamanho do Texto.
Machine Translated by Google
Machine Translated by Google

Aer (sem diferença)

Por que é que?

O que desenvolvedores e designers ouvem

Na maioria das organizações, as pessoas que acabam sendo responsáveis por fazer algo
sobre acessibilidade são as pessoas que realmente constroem a coisa: os designers e os
desenvolvedores.

Quando eles tentam aprender sobre o que devem fazer, quaisquer livros ou artigos
que pegarem inevitavelmente listam o mesmo conjunto de razões pelas quais eles precisam
tornar seus sites acessíveis:

Há muita verdade em tudo isso. Infelizmente, também há muita coisa que dificilmente
convencerá desenvolvedores e designers de 22 anos de que deveriam estar “fazendo
acessibilidade”. Dois argumentos em particular tendem a torná-los céticos: ___% da
população tem deficiência. Como o mundo deles consiste em grande parte de jovens de
22 anos de idade, é muito difícil para eles acreditarem que uma grande porcentagem
da população realmente precisa de ajuda para acessar a Web. Eles estão dispostos
a descartar isso como o tipo de exagero que as pessoas fazem quando defendem
uma causa nobre, mas também há uma inclinação natural para pensar: “Se uma de
suas alegações é tão claramente falsa, estou ser cético sobre o resto.”

Tornar as coisas mais acessíveis beneficia a todos. Eles sabem que algumas
adaptações fazem, como no exemplo clássico, a caponagem fechada, o que
2
muitas vezes é útil para pessoas que podem ouvir. Mas desde
Machine Translated by Google

este sempre parece ser o único exemplo citado, parece um pouco como
argumentar que o programa espacial valeu a pena porque nos deu Tang.3 É muito
mais fácil para desenvolvedores e designers imaginar casos em que adaptações de
acessibilidade provavelmente tornarão as coisas piores para “ todos os outros.”

2 Melanie e eu costumamos usá-lo quando assistimos a filmes britânicos, por exemplo.

3 Uma bebida de café da manhã em pó com sabor de laranja, inventada para os astronautas (veja também: comida
liofilizada).

A pior coisa sobre esse ceticismo é que ele obscurece o fato de que há realmente apenas
uma razão que é importante: é a coisa certa a fazer. E não apenas a coisa certa; é
profundamente a coisa certa a fazer, porque o único argumento a favor da
acessibilidade que não é suficientemente aberto é o quão extraordinariamente cerveja
ela torna a vida de algumas pessoas. Pessoalmente, não acho que alguém deva
precisar de mais do que este exemplo: pessoas cegas com acesso a um computador
agora podem ler quase qualquer jornal ou revista por conta própria. Imagine isso.

Quantas oportunidades temos para melhorar drasticamente a vida das pessoas apenas
fazendo nosso trabalho com uma cerveja leve?
E para aqueles de vocês que não acham este argumento convincente, estejam cientes
de que, mesmo que ainda não o tenham encontrado, mais cedo ou mais tarde haverá um
sck legislativo. Conte com isso.

O que designers e desenvolvedores temem

À medida que aprendem mais sobre acessibilidade, dois medos tendem a surgir:
Mais trabalho. Para os desenvolvedores em particular, a acessibilidade pode
parecer apenas mais uma coisa nova e complicada para se encaixar em um
cronograma de projeto já impossível. Na pior das hipóteses, ele é transmitido como
uma “iniciativa” de cima, completa com relatórios, revisões e reuniões de força-tarefa
que me consomem.
Projeto comprometido. O que os designers mais temem é o que chamo de gatos
buered: lugares onde o bom design para pessoas com deficiência e o bom design
para todos os outros estarão em oposição direta. Eles estão preocupados que serão
forçados a projetar
Machine Translated by Google

sites que são menos atraentes – e menos úteis – para a maioria de seu
público.
Em um mundo ideal, a acessibilidade funcionaria como uma placa que vi na
traseira de um táxi de Chicago. A princípio, parecia um sinal comum. Mas algo na
maneira como ele captava a luz me fez olhar mais de perto e, quando o fiz, percebi
que era engenhoso.

A placa estava coberta com um pedaço fino de Plexiglas, e a mensagem estava


gravada em Braille no Plexiglas. Normalmente, tanto a impressão quanto o
Braille teriam metade do tamanho para que ambos pudessem caber no letreiro,
mas com esse design cada público obteve a melhor experiência possível. Era
uma solução elegante.
Acho que para alguns designers, no entanto, a acessibilidade evoca uma
imagem parecida com o conto de Vonnegut, onde o governo cria igualdade ao
prejudicar todos.4
4 Em “Harrison Bergeron”, o personagem principal, cuja inteligência está “muito acima do normal”, é
obrigado por lei a usar um “rádio para deficientes mentais” em seu ouvido que emite vários ruídos altos
a cada 20 segundos “para evitar que pessoas como George tirando vantagem injusta de seus cérebros.”

A verdade é que pode ser complicado


Quando as pessoas começam a ler sobre acessibilidade, geralmente se deparam
com um conselho que parece muito promissor:
Machine Translated by Google

O problema é que, quando eles executam o site por meio de um validador, ele se
parece mais com um corretor gramatical do que com um corretor ortográfico. Sim, ele
encontra alguns erros óbvios e descuidos que são fáceis de corrigir, como texto
alternativo ausente.5 Mas também inevitavelmente gera uma série de avisos vagos de
que você pode estar fazendo algo errado e uma longa lista de recomendações de
coisas para você para verificar se ele admite pode não haver problemas.
5 O texto alternativo fornece uma descrição textual de uma imagem (“Foto de dois homens em um veleiro”, por
exemplo), essencial para pessoas que usam leitores de tela ou navegam com as imagens desligadas.

Isso pode ser muito desencorajador para pessoas que estão apenas aprendendo
sobre acessibilidade, porque as longas listas e conselhos ambíguos sugerem que
há muito a aprender.

E a verdade é que é muito mais difícil do que deveria ser tornar um site
acessível.

Afinal, a maioria dos designers e desenvolvedores não se tornará


especialistas em acessibilidade. Se a acessibilidade da Web se tornar onipresente,
terá que ser mais fácil de fazer. Leitores de tela e outras tecnologias adaptáveis
precisam ficar mais inteligentes, as ferramentas para construção de sites (como o
Dreamweaver) precisam facilitar a codificação correta para acessibilidade e nossos
processos de design precisam ser atualizados para incluir o pensamento sobre
acessibilidade desde o início.

As quatro coisas que você pode fazer agora

O fato de que não é um mundo perfeito no momento não deixa nenhum de nós fora do
gancho, no entanto.
Mesmo com a tecnologia e os padrões atuais, é possível tornar qualquer site muito
acessível sem muito esforço, concentrando-se em algumas coisas
Machine Translated by Google

que terá o maior impacto. E eles não envolvem geng nem perto de um gato morto.

#1. Corrija os problemas de usabilidade que confundem a todos

Uma das coisas que eu acho irritante sobre o argumento Tang (“tornar sites
acessíveis os torna mais úteis para todos”) é que ele obscurece o fato de que o inverso
é realmente verdadeiro: tornar os sites mais úteis para “o resto de nós” é uma das
formas mais eficazes de torná-los mais eficazes para pessoas com deficiência.

Se algo confunde a maioria das pessoas que usam seu site, é quase certo que
confundirá os usuários que têm problemas de acessibilidade. (Afinal, as pessoas não
se tornam de repente notavelmente mais inteligentes só porque têm uma deficiência.)
E é muito provável que eles tenham mais dificuldade para me recuperar de sua confusão.

Por exemplo, pense na última vez em que você teve problemas para usar um
site (encontrando uma mensagem de erro confusa ao enviar um formulário, por
exemplo). Agora imagine tentar resolver esse problema sem conseguir ver a página.

A melhor coisa que você pode fazer para melhorar a acessibilidade do seu site é testá-lo
continuamente e suavizar continuamente as partes que confundem a todos. Na verdade,
se você não fizer isso primeiro, por mais rigorosamente que você aplique as diretrizes
de acessibilidade, as pessoas com deficiência ainda não poderão usar seu site. Se não
estiver claro para começar, apenas corrigir problemas de código é como [insira sua
metáfora favorita de pung-lipsck-on-a-pig aqui].

#2. Leia um artigo

Como espero que você já tenha visto, a melhor maneira de aprender como tornar algo
mais útil é observar as pessoas realmente tentando usá-lo. Mas a maioria de nós não
tem experiência em usar a tecnologia adaptável, muito menos observar outras pessoas
usá-la.

Se você tem o eu e o movimento, eu recomendo localizar um ou dois usuários cegos


da Web e passar algumas horas com eles observando como eles realmente usam seu
software de leitura de tela.
Felizmente, alguém mentiu pesadamente por você. Mary Theofanos e Janice (Ginny)
Redish observaram 16 usuários cegos usando leitores de tela para fazer
Machine Translated by Google

uma série de tarefas em vários sites e relataram o que observaram em um artigo intitulado
“Diretrizes para sites acessíveis e utilizáveis: observando 6 usuários que trabalham com leitores
de tela”.

6 Publicado na revista ACM Interacons (novembro-dezembro de 2003). Com permissão da


ACM, Ginny o disponibilizou para uso pessoal em redish.net/ images/ stories/ PDF/
InteraconsPaperAuthorsVer.pdf. Sim, tem dez anos, mas ainda é relevante.

Como acontece com qualquer tipo de teste de usuário, ele produziu insights inestimáveis. Aqui
está um exemplo dos tipos de coisas que eles aprenderam:

Os usuários de leitores de tela digitalizam com os ouvidos. A maioria dos usuários


cegos é tão impaciente quanto a maioria dos usuários com visão. Eles querem obter
as informações de que precisam o mais rápido possível. Eles não ouvem todas as
palavras da página – assim como os usuários com visão não leem todas as palavras.
Eles “examinam com os ouvidos”, ouvindo apenas o suficiente para decidir se querem
ouvir mais. Muitos definem a voz para falar a uma velocidade surpreendentemente
rápida.

Eles ouvem as primeiras palavras de um link ou linha de texto. Se não parecer


relevante, eles se movem rapidamente para o próximo link, próxima linha, próximo
título, próximo parágrafo. Onde um usuário com visão pode encontrar uma palavra-
chave examinando toda a página, um usuário cego pode não ouvir essa palavra-
chave se não estiver no início de um link ou de uma linha de texto.

Eu recomendo que você leia este artigo antes de ler qualquer outra coisa sobre acessibilidade.
Em 20 minutos, ele lhe dará uma apreciação pelos problemas que você está tentando resolver e
que você não obterá em nenhum outro argo ou livro.

#3. Leia um livro


Depois de ler o artigo de Gina e Maria, você está pronto para passar um fim de semana
lendo um livro sobre acessibilidade na Web. Estes dois são particularmente bons:

Uma Web para todos: projetando experiências de usuário acessíveis por Sarah Horton
e Whitney Quesenbery. (Sua abordagem: “Boa UX é igual a boa acessibilidade. Veja
como fazer as duas coisas.”)
Machine Translated by Google

Acessibilidade Web: Padrões Web e Conformidade Regulatória por Jim Thatcher et al.
(“Aqui estão as leis e regulamentos, e nós o ajudaremos a entender como cumpri-los.”)

Esses livros cobrem muito terreno, então não se preocupe em absorver tudo.
Por enquanto, você só precisa ter uma visão geral.

#4. Vá para a fruta mais baixa


Agora você está pronto para fazer o que a maioria das pessoas considera acessibilidade na
Web: implementar mudanças específicas em suas páginas.

A partir de agora, estas são provavelmente as coisas mais importantes a fazer:

Adicione o texto alternativo apropriado a cada imagem. Adicione um atributo alternativo


vazio (ou “nulo”) (<alt="">) para imagens que os leitores de tela devem ignorar e adicione
texto descritivo útil para o restante.

Para aprender a escrever um bom texto alternativo – e, de fato, aprender a fazer qualquer uma
das coisas nesta lista – acesse webaim.org. O pessoal da WebAIM escreveu excelentes artigos
práticos cobrindo os detalhes práticos de quase todas as técnicas de acessibilidade.
Machine Translated by Google

Use os títulos corretamente. Os elementos de cabeçalho HTML padrão transmitem


informações úteis sobre a organização lógica do seu conteúdo para as pessoas que
usam leitores de tela e facilitam a navegação pelo teclado. Use <h1> para o título
da página ou título de conteúdo principal, <h2> para os principais títulos de segundo,
<h3> para subtítulos e assim por diante e, em seguida, use CSS para redefinir a
aparência visual de cada nível.

Faça seus formulários funcionarem com leitores de tela. Isso se resume em


grande parte ao uso do elemento HTML <label> para associar os campos aos
seus rótulos de texto, para que as pessoas saibam o que devem inserir.
Coloque um link “Pular para o conteúdo principal” no início de cada página.
Imagine ter que gastar 20 segundos (ou um minuto, ou dois) ouvindo a navegação
global no topo de cada página antes de poder ver o conteúdo, e você entenderá por
que isso é importante.
Torne todo o conteúdo acessível pelo teclado. Lembre-se, nem todos
pode usar um mouse.

Crie um contraste significativo entre o texto e o plano de fundo. Nunca use


texto cinza claro em um fundo cinza escuro, por exemplo.
Use um modelo acessível. Se você estiver usando o WordPress, por exemplo,
certifique-se de que o tema escolhido foi projetado para ser acessível.

É isso. Você provavelmente aprenderá a fazer muito mais à medida que avança, mas
mesmo que faça apenas o que abordei aqui, terá feito um bom começo.

Quando escrevi este capítulo sete anos atrás, ele terminou assim:

Espero que em cinco anos eu possa remover este capítulo e usar o espaço
para outra coisa, porque as ferramentas do desenvolvedor, navegadores,
leitores de tela e diretrizes estarão todos amadurecidos e integrados ao ponto
em que as pessoas possam construir sites acessíveis sem pensar nisso.

Suspirar.

Espero que tenhamos sorte na cerveja.


Machine Translated by Google

1 Capítulo 13. Guia para os perplexos

1 O Guia para os Perplexos (o verdadeiro) é um comentário seminal sobre o significado do Talmud


escrito no século XII pelo rabino Moshe ben Maimon (cerveja conhecida como Maimônides).
Eu sempre pensei que era o melhor tle que eu já ouvi.

FAZENDO A USABILIDADE ACONTECER ONDE VOCÊ VIVE

Eu sou o Lorax. Eu falo pelas árvores.

— O LORAX, DR. SEUSS

Recebo muitos e-mails de pessoas me perguntando alguma variação dessa pergunta:

Ok, eu entendi. Esse material de usabilidade é importante, e eu realmente quero


trabalhar nisso sozinho. Como convenço meu chefe – e o chefe dele – de que eles
deveriam levar os usuários a sério e permitir que eu me gaste fazendo isso
acontecer?

O que você pode fazer se estiver em um ambiente onde seu desejo de “fazer usabilidade” não
é suportado?

Ya goa conhece o território


Primeiro, um pequeno histórico sobre como o lugar da usabilidade no mundo mudou.

No final da década de 1990, Usabilidade e Design Centrado no Usuário (UCD) eram os termos
que a maioria das pessoas usava para descrever qualquer esforço para projetar com o usuário
em mente. E havia essencialmente duas “profissões” que se concentravam em tornar os sites
da Web mais usáveis: Usabilidade (certificando-se de que as coisas são projetadas de uma
maneira que permita que as pessoas as usem com sucesso) e Arquitetura da Informação
(certificando-se de que o conteúdo seja organizado de uma maneira que permita pessoas para
encontrar o que precisam).

Agora, o termo que você mais ouve é User Experience Design, ou apenas User Experience
(UXD ou UX, para abreviar), e provavelmente há uma dúzia de especialidades envolvidas,
como Interacon Design, Interface Design, Visual Design,
Machine Translated by Google

e Gerenciamento de Conteúdo—e, claro, Usabilidade e Arquitetura de Informação


—tudo sob o guarda-chuva de UX.

Uma diferença entre o design centrado no usuário e o design da experiência do usuário


é o escopo. A UCD se concentrou em projetar o produto certo e garantir que fosse
utilizável. A UX vê seu papel como levar em consideração as necessidades dos usuários
em todas as etapas do ciclo de vida do produto, desde o momento em que eles veem um
anúncio na TV, passando pela compra e acompanhamento de sua entrega on-line, até
devolvê-lo a uma filial local.

A boa notícia é que há muito mais consciência agora sobre a importância de focar no
usuário. Steve Jobs (e Jonathan Ive) fizeram um caso de negócios muito convincente
para UX e, como resultado, a usabilidade é uma venda mais fácil do que era há alguns
anos.
A má notícia é que, onde a usabilidade costumava ser o padrão para o design
amigável, agora há muitos irmãos procurando assentos à mesa, cada um convencido
de que seu conjunto de ferramentas é o melhor para o trabalho.
A pior notícia é que muitas pessoas não entendem as diferenças entre as
especialidades ou as contribuições únicas que podem fazer.
Este é o campo em que você está jogando. Então, quando alguém lhe disser: “Estou em
UX” ou “Usabilidade é tão 2002 – é tudo UX agora”, sorria graciosamente e faça algumas
perguntas sobre como eles estão aprendendo sobre os usuários, como eles estão testando
se as pessoas podem usar o que estão construindo e como fazem as mudanças
acontecerem. Se eles não fazem nenhuma dessas coisas, eles precisam de sua ajuda.
Se o fizerem, aprenda com eles. Não é como nos chamamos que importa, é a atitude que
trazemos e as habilidades que podemos contribuir.

O conselho habitual

Aqui estão as duas sugestões que sempre ouvi para convencer a gerência a apoiar (e
financiar) o trabalho de usabilidade:
Demonstrar ROI. Nessa abordagem, você coleta e analisa dados para provar
que uma mudança de usabilidade que você fez resultou em economia de custos
ou receita adicional (“Mudar o rótulo deste botão aumentou as vendas em 0,25%”).
Há um livro excelente sobre isso: Cost-jusfying Clothing: An Update for the Internet
Age, editado por Randolph Bias e Deborah Mayhew.
Machine Translated by Google

Fale a língua deles. Em vez de falar sobre os benefícios para os usuários, aprenda quais
são os problemas corporativos atuais e descreva seus esforços de uma forma que deixe
claro que eles são parte da solução: fale sobre coisas como pontos problemáticos, pontos
de contato, KPIs e CSI, ou quaisquer palavras-chave de gestão que sejam tendência em
sua organização.

Essas são boas ideias e valem a pena se você conseguir gerenciá-las. Mas fazer um caso de ROI
baseado em custos e receitas pode dar muito trabalho e, a menos que seja implementado com
rigor, sempre haverá alguém que alegará que o valor agregado foi causado por outra coisa. E
aprender a falar “negócios” também pode ser um desafio. É para isso que servem os MBAs.

Se eu fosse Você...

...Eu duraria cerca de uma semana no seu trabalho. Toda vez que vou ao escritório de um cliente,
passo a maior parte do tempo me maravilhando com o fato de que tantas pessoas podem
sobreviver no mundo corporativo. Eu simplesmente não estou preparado para lidar com as
políticas do escritório em uma organização grande (ou seja, mais de duas pessoas) e cantar em
reuniões o dia todo.

Mas passei uma boa parte de mim visitando escritórios corporativos e gerentes de geng para
levar a usabilidade a sério. Então, eu tenho algumas idéias sobre táticas que funcionam, e as
pessoas que as experimentaram me disseram que tiveram algum sucesso. Então aqui está o que
eu faria se fosse você:

Faça com que seu chefe (e o chefe dela) assista a um teste de usabilidade. A tática
que eu acho que funciona melhor é atrair pessoas de alto nível na cadeia alimentar para
vir e observar até mesmo um teste de usabilidade. Diga a eles que você vai fazer alguns
testes e seria ótimo para o moral da equipe da Web se eles pudessem colocar a cabeça
por alguns minutos.

Na minha experiência, os executivos muitas vezes ficam fascinados e ficam mais tempo
do que o planejado, porque é a primeira vez que eles veem alguém tentar usar o site da
empresa e muitas vezes não é uma imagem tão predatória quanto eles imaginavam.

É importante levá-los a vir pessoalmente. A diferença entre assistir a um teste de


usabilidade ao vivo e ouvir uma apresentação sobre ele é como a diferença entre assistir a
um evento esportivo enquanto ele está acontecendo
Machine Translated by Google

versus ouvir uma recapitulação no noticiário da noite. Jogos ao vivo criam


experiências memoráveis; o noticiário da noite nem tanto.
Se você não conseguir que eles venham, então selecione o segundo melhor:
inclua clipes de destaques de testes em suas apresentações. Se você não conseguir
fazer uma apresentação, poste um clipe curto (menos de 3 minutos) em sua intranet
e envie um e-mail com uma descrição intrigante e um link para o vídeo. Até execuve
gosta de assistir vídeos curtos.

Faça o primeiro por conta própria. Quando você fizer seu primeiro teste, não peça
permissão; basta mantê-lo incrivelmente simples e informal, e encontrar voluntários
para os parcipantes para que não custe nada.
E tente garantir que algo melhore como resultado. Escolha um alvo fácil para
testar – algo que você sabe que tem pelo menos um problema sério de usabilidade
que pode ser corrigido rapidamente sem ter que fazer muitas pessoas aprovarem a
mudança – renomear um botão mal rotulado, por exemplo. Em seguida, teste-o,
corrija-o e divulgue-o.
Se você puder encontrar uma maneira simples de medir a melhoria, faça isso. Por
exemplo, você pode testar algo que está causando muitas chamadas de suporte e,
em seguida, mostrar o quanto as chamadas sobre esse problema diminuíram
depois que você corrigiu o problema.

Faça um teste do compeon. Mencionei no Capítulo 9 que é uma boa ideia


testar alguns sites competitivos no início de qualquer projeto.
Mas também é uma ótima maneira de obter suporte para o tesng. Todo mundo
adora aprender sobre o compeon e, como não é o seu site que está sendo
testado, ninguém tem nada pessoalmente em jogo. Faz um grande evento de
almoço de saco marrom.
Empatia com a gestão. Alguns anos atrás, na conferência anual da UXPA, olhei
em volta e pensei: “Que grupo legal de pessoas!” Então me dei conta: é claro
que eles são legais. A empatia é praticamente um requisito profissional para o
trabalho de usabilidade. E se você estiver interessado em fazê-lo, provavelmente
também é empático. Eu recomendo que você aplique essa empatia aos seus
chefes. Não do jeito “como posso descobrir o que move essas pessoas para que
eu possa fazer com que elas façam o que eu quero”, mas mais do jeito “entender a
posição em que se encontram”, tendo uma empatia real e emocional por elas. Você
pode se surpreender com o efeito.
Machine Translated by Google

Conheça o seu lugar no grande esquema das coisas. Pessoalmente, na situação


em que você se encontra, acho que um pouco de humildade ajuda bastante. A
realidade é que no mundo dos negócios quase todo mundo é apenas uma pequena
engrenagem em um enorme conjunto de engrenagens.2
2 Desculpe. Tente não levar para o pessoal. Faça um bom trabalho. Aproveite sua vida em casa. Seja feliz.

Você quer que seu entusiasmo pela usabilidade seja infeccioso, mas simplesmente
não funciona continuar com a atitude de que você está trazendo a verdade – sobre
usabilidade, ou qualquer outra coisa – para as massas sujas.
Seu papel principal deve ser compartilhar o que você sabe, não dizer às pessoas
como as coisas devem ser feitas.

Eu também recomendaria dois livros que podem ajudar.

Primeiro, há a pesquisa de Tomer Sharon: É nossa pesquisa: Geng Stakeholder Buy-In para
projetos de pesquisa de experiência do usuário. Tomer é pesquisador de UX no Google e
nunca o ouvi dizer nada que não fosse verdade, conciso e razoável.
Machine Translated by Google

Qualquer livro com títulos como “Torne-se a voz da razão” e “Aceite o fato de
que pode não funcionar e que está tudo bem” obviamente vale a pena ser lido.
Machine Translated by Google

The User Experience Team of One: A Research and Design Survival Guide de
Leah Buley foi escrito especificamente para pessoas que são “a única pessoa em sua
empresa praticando (ou aspirando a praticar) design centrado no usuário” ou que
“trabalham regularmente em uma equipe onde você são a única pessoa de UX.”
Os capítulos 3 (Construindo suporte para seu trabalho) e 4 (Crescendo a si mesmo
e sua carreira) estão repletos de bons conselhos e recursos úteis.
Machine Translated by Google
Machine Translated by Google

Resista às forças das trevas

A usabilidade é, em sua essência, um trabalho de defesa do usuário: como o Lorax, você


fala pelas árvores. Bem, os usuários, na verdade. Usabilidade é servir cerveja às pessoas
construindo produtos de cerveja.
Mas há uma tendência – que notei pela primeira vez há cerca de cinco anos – para
algumas pessoas3 tentarem obter praticantes de usabilidade para ajudá-las a descobrir
como manipular os usuários em vez de atender às suas necessidades.4
3 [tosse] markeng [tosse]

4 Existe até um livro chamado Evil by Design: Interacon Design to Lead Us into Temptaon , de Chris Nodder, que
explica como uma compreensão das fragilidades humanas pode orientar suas decisões de design.
Cada capítulo trata de um dos Sete Pecados Capitais (Gluônia, Orgulho, Preguiça e assim por diante).

Não tenho nenhum problema com a ideia de pessoas pedindo nossa ajuda influenciando
usuários.

Se você quer saber como influenciar as pessoas, basta ler o livro clássico de Robert
Cialdini sobre o assunto, Influence: The Psychology of Persuasion. É brilhante e eficaz,
cheio de ideias comprovadas por mim.

Ou leia qualquer um dos livros de Susan Weinschenk sobre as lições úteis que a
pesquisa em neuropsicologia pode nos ensinar sobre a movimentação humana e a
tomada de decisões.
Machine Translated by Google

Também não tenho problema em ajudar a persuadir as pessoas a fazer coisas, desde que
não seja enganoso. O protocolo de pensamento em voz alta em testes de usabilidade pode
produzir insights valiosos sobre por que as tentativas de persuasão são bem-sucedidas ou
fracassam.

Mas fico ansioso sempre que ouço as pessoas falarem sobre o uso de testes de usabilidade
para ajudar a determinar se algo é desejável, porque não é algo que os testes de usabilidade
sejam bons para medir. Você pode sentir durante uma sessão de teste que o parcipante
acha algo desejável, mas é apenas isso: uma sensação. Se algo é desejável é uma questão
de pesquisa de mercado, melhor respondida usando ferramentas e instrumentos de pesquisa
de mercado.
O verdadeiro problema é que essas pessoas muitas vezes não estão realmente pedindo
nossa ajuda para determinar se algo é desejável, ou mesmo para descobrir como tornar o
que produzem mais desejável. Em vez disso, eles procuram a usabilidade para lhes dizer
como fazer as pessoas pensarem que é desejável, ou seja, manipulá-las.
Machine Translated by Google

Algumas vezes, a manipulação pretendida é relativamente benigna, como usar uma


caixa de seleção levemente oculta marcada por padrão para inscrevê-lo automaticamente em
um boletim informativo.

Às vezes, ele se aproxima da escuridão, fazendo coisas como enganar as pessoas para que
instalem uma barra de ferramentas indesejada do navegador5 e alterando sua pesquisa padrão
e as mensagens da página inicial enquanto não estão olhando. Todos nós já fomos vítimas
desse tipo de engano.

5 [tosse] Yahoo [tosse]

Você clica em um link para baixar algum software gratuito.


Machine Translated by Google

Isso abre uma tela com três grandes links “Iniciar download”.

Sem perceber as instruções quase invisíveis, quando nada acontece você


clica em uma delas para iniciar o download.
Machine Translated by Google

Uma nova página aparece com outro link “Iniciar Download”, então você clica nele... e
acaba baixando algum software que você não quer.

No seu extremo, porém, ele pode cruzar a linha de práticas de black hat verdadeiras, como
phishing, scamming e identidade.

Esteja ciente de que, se as pessoas lhe pedirem para fazer isso, não faz parte do seu trabalho.

Os usuários estão contando com você.

Algumas respostas definitivas

Antes de terminar, um pequeno bônus por aguentar até aqui.

Quase tudo neste livro foi sobre o quanto a resposta às perguntas de usabilidade depende
do contexto e que a resposta para a maioria das perguntas de usabilidade é “Depende”.

Mas eu sei que todos nós gostamos de ter respostas definitivas, então aqui está uma
coleção de coisas que você deve sempre fazer ou nunca fazer.

Não use tipos pequenos e de baixo contraste. Você pode usar o tipo grande e de
baixo contraste ou o tipo pequeno (bem, pequeno) de alto contraste. Mas nunca use pequeno,
Machine Translated by Google

tipo de baixo contraste. (E tente ficar longe dos outros dois também.)
A menos que você esteja projetando seu próprio site de porolio de design, e você realmente,
realmente não se importa se alguém pode ler o texto ou não.

Não coloque rótulos dentro de campos de formulário. Sim, pode ser muito
tempng, especialmente em telas móveis apertadas. Mas não faça isso a menos que
tudo isso seja verdade: o formulário é excepcionalmente simples, os rótulos desaparecem
quando você começa a digitar e reaparecem se você esvaziar o campo, os rótulos nunca
podem ser confundidos com respostas e não há possibilidade de você Acabará enviando
os rótulos junto com o que você digita (“Job TiAssistant Managertle”). E você se certificou
de que eles são completamente acessíveis.

Se você não concordar, antes de me enviar um e-mail, procure por “Não coloque etiquetas
dentro de caixas de texto (a menos que você seja Luke W)” e leia.

Preserve a desconexão entre links de texto visitados e não visitados. Por padrão, os
navegadores da Web exibem links para páginas que você já abriu em uma cor diferente para
que você possa ver quais opções já tentou. Isso acaba sendo uma informação muito útil,
especialmente porque é rastreada pela URL, não pelo texto do link. Portanto, se você clicou
em Reservar uma viagem, quando vir Reservar um voo mais tarde, saberá que isso o levaria
para a mesma página.

Você pode escolher as cores que quiser, desde que sejam notavelmente diferentes.

Não flutue títulos entre parágrafos. Os títulos devem estar mais próximos do texto que os
segue do que do texto que os precede. (Sim, eu sei que mencionei que este é o Capítulo 3,
mas é tão importante que vale a pena repetir.)

Isso é tudo, pessoal.

Como Bob e Ray costumavam dizer: “Segure seus polegares e escreva se você conseguir
trabalho”.

Espero que você faça check-in no meu site stevekrug.com de mim para mim, e sinta-se sempre à
vontade para me enviar um e-mail para stevekrug@gmail.com. Posso prometer-lhe que o lerei e o
apreciarei, mesmo que nem sempre consiga encontrar-me o suficiente para responder.
Machine Translated by Google

Mas acima de tudo, tenha bom ânimo. Como eu disse no início, construir um
ótimo site ou aplicativo é um enorme desafio, e qualquer um que acertar nem pela
metade tem minha admiração.
E, por favor, não tome nada do que eu disse como sendo contra quebrar “as
regras” – ou pelo menos quebrá-las. Eu sei que existem até sites onde você quer
que a interface faça as pessoas pensarem, para confundi-las ou desafiá-las.
Apenas certifique-se de saber quais regras você está dobrando e que pelo menos
você acha que tem uma boa razão para dobrá-las.
Ah, a propósito, aqui está o resto de Calvin e Hobbes.

CALVIN E HOBBES © 1989 Waerson. Reimpresso com permissão da UNIVERSAL UCLICK. Todos os direitos
reservados.
Machine Translated by Google

Agradecimentos

...E TUDO O QUE RECEBI FOI ESSA T-SHIRT RUIM

...e os homens do USS Forrestal, sem cuja cooperação este filme nunca teria sido feito.

— RECONHECIMENTO DE FILME CONVENCIONAL

[Insira alguma variação do meme “É preciso uma vila” aqui.]


Mas é verdade. Não só eu não poderia ter feito isso sozinho, eu não gostaria. Mais uma
vez, tive a sorte de conseguir reunir os suspeitos de sempre que me ajudaram nas edições
anteriores e na Rocket Surgery.

Confiei profundamente em sua bondade e sua extraordinária boa vontade em face de


meus hábitos tortuosos.
Como sempre, minha relação peculiar comigo tornou a vida difícil para todos os
envolvidos. (Você já ouviu a expressão “Se não fosse o último minuto, eu não faria nada”?)
Sinceramente, é que alguém fica adiantando meu relógio toda vez que eu não estou
olhando.
Os agradecimentos — e na maioria dos casos as desculpas

— são devidos a Elisabeth Bayle, que tem sido minha interlocutora, caixa de ressonância e
amiga há alguns anos e — embora ela não queira admitir — editora desta edição. Se você
for escrever um livro, meu melhor conselho é encontrar alguém que seja inteligente, engraçado
e saiba tanto sobre o assunto quanto você, e então convencê-los a passar longas horas
ouvindo, fazendo ótimas sugestões e endo seu trabalho.

Não é tanto que este livro não teria acontecido sem ela (embora não fosse). É que
eu não teria considerado fazer isso a menos que soubesse que ela estaria envolvida. Meus
agradecimentos também vão para Ellio por sempre renovar seu ânimo depois que outro
longo dia de trabalho comigo o esgotou.

Barbara Flanagan, editora de texto e querida velha amiga. Parafraseando uma velha
piada, “Barbara nunca se enganou sobre um ponto de gramática em sua vida.
Machine Translated by Google

Bem, houve aquele eu quando ela pensou que estava errada, mas ela não estava.
Antes de me escrever sobre algum erro de uso, saiba que Barbara há muito
tempo o superou e depois disse: “Mas é a sua voz. Seu livro. Sua chamada." Isso
é generosidade de espírito.
Nancy Davis, editora-chefe da Peachpit, que se afastou daquela mesa o suficiente
para ser minha consigliere e campeã. Ela é uma daquelas raras pessoas cujo elogio
significa cerca de dez vezes mais do que um elogio normal. Vou sentir muita falta
de ter uma desculpa para conversar com ela sobre seus garotos apaixonados por
ornitologia.
Nancy Ruenzel, Lisa Brazieal, Romney Lange, Mimi He, Aren Straiger,
Glenn Bisignani e todas as outras pessoas espertas, simpáticas, talentosas e
trabalhadoras da Peachpit que têm dado tanto apoio (muitas vezes enquanto
mordem a língua, tenho certeza).
Meus revisores – Caroline Jarre e Whitney Quesenbery – que
ofereceram parte de seu precioso eu para evitar que eu parecesse tolo. Em
outro eu, a descrição certa para eles seria “companheiros de viagem”. Nós
concordamos em muitas coisas, e eu sou superficial o suficiente para desfrutar da
companhia de pessoas que concordam comigo. Para proteger os inocentes, porém,
sinto-me compelido a observar que a inclusão nesta lista não implica concordância
com tudo neste livro.
Randall Munroe por sua generosa atude sobre a reimpressão de seu trabalho, e
por dar ao meu filho e a mim muito do que rir ao longo dos anos no xkcd.com. 1

1 Se você não “pegar” alguns deles, há uma indústria de sites que vão explicá-los para você, da
mesma forma que Rex Parker faz com as palavras cruzadas de cada dia no The New York Times.
Colegas inteligentes e engraçados como Ginny Redish, Randolph Bias,
Carol Barnum, Jennifer McGinn, Nicole Burden, Heather O'Neill, Bruno
Figuereido e Luca Salvino.
Pessoas que contribuíram com partes específicas de seu conhecimento, como
Hal Shubin, Joshua Porter, Wayne Pau, Jacqueline Ritacco e o pessoal do
Bayard Instute em Copenhague.
Lou Rosenfeld pelo apoio moral, bons conselhos e por ser apenas Lou.
Karen Whitehouse e Roger Black, a madrinha espiritual e padrinho do
livro, que me colocaram nessa confusão em primeiro lugar, dando-me a
oportunidade de escrever a primeira edição há 14 anos.
Machine Translated by Google

A grande comunidade de profissionais de usabilidade, que tendem a ser um grupo muito legal de
pessoas. Vá a uma conferência anual da UXPA e descubra por si mesmo.

Os simpáticos baristas do Puerham Circle Starbucks, geralmente as únicas pessoas que vejo
durante o dia além da minha esposa. (Não é culpa deles que, quando a empresa redesenhou o
local recentemente, eles decidiram que uma boa iluminação não era algo que as pessoas realmente
precisavam.)

Meu filho, Harry, agora terminando sua graduação na RPI, cuja empresa eu prezo mais do que ele
sabe. Eu esgoto sua paciência regularmente pedindo que ele me explique apenas mais uma vez a
diferença entre um meme e um tropo.

Se alguém tiver uma vaga de emprego para um especialista em Ciências Cognitivas com
especialização em Design de Jogos, ficarei feliz em passar adiante.
Machine Translated by Google

E, finalmente, Melanie, que tem apenas uma falha conhecida: uma falta herdada de
superfilho que a leva a dizer coisas como “Bem, eu não tive um resfriado durante
todo o inverno”. Além disso, estou, como sempre digo, entre os maridos mais
afortunados.

Se você quer que sua vida seja boa, case-se bem.


Machine Translated by Google

Índice

$ 25.000 Pirâmide, 36

UMA

acessibilidade, 173–81
affordances, 151–53
Desenvolvimento ágil, 4, 118
Animal, vegetal ou mineral?, 42–47 Apple,
143 apps, mobile, 155-59 usuário médio, 9
mitos, 18, 108

Vença o relógio, 85
Big Bang Theory of Web Design, 89 big
buzina report, 4, 117
Pão ralado, 79-80
Brin, Sergey, 26

usuários com navegação dominante,


59 navegadores

o que os usuários dizem que

é, 26 navegando, 60–62
Brundlefly, 162
Birmânia-Shave, 29

Calvino e Hobbes, 153, 191


Camtasia, 122, 163
Cascading Style Sheets (CSS) e
acessibilidade, 181
Machine Translated by Google

uso mais antigo de, 37

e usabilidade, 171
clicabilidade, 15, 37

Collyer, Bud, 85
convenções, 29–33, 64 choque
cultural, 107 cursor, 37, 152

D–E

deleite, 155–56
designando
convenções e, 29–33 Home

page, 84 navegação, 54 e
saficing, 24–25 Web sites,

intenção vs. realidade, 21, 23

teste de usabilidade faça você mesmo, 115

Elements of Style, The, revisão de

usabilidade de 49 especialistas, 3

Lista de perguntas frequentes, 165, 171

“O Agricultor e o Vaqueiro Devem Ser Amigos, O”, 102

Design plano, 152–53

grupos focais, tamanho de


fonte 112–13 , no navegador, 173
formulários, 46–47, 67

ganso dourado, tentação de matar, 99–100 reservatório

de boa vontade, 166–71

H
Machine Translated by Google

Hansel e Gretel, 79 happy


talk, eliminando, 50 Hatch, Sen.
Orrin, site, viii Holmes, Sherlock, 7
Home page com dicas, 39 design, 84
happy talk on, 50 link to, 70 hover, 152

I–K
instrucoes, eliminando, 51-52
Ive, Jonathan, x, 184
Jarre, Caroline, 40, 46, 194
Jobs, Steve, x, 184
problemas de “caiaque”, 139
Klein, Gary, 24-25
Kleiner, Arte, 107
Leis de usabilidade de Krug, 10-11, 43, 49

eu

Larson, Gary, 23 ,
startup enxuta, 4, 114
Lincoln, Abraham, 145
usuários com links
dominantes, 59 links, visitados versus
não visitados, 190 logo. Ver ID do site

M
memorização, 159
mensch, 164 escolhas
irracionais, 42–47
Machine Translated by Google

espelhamento, 161

declaração de missão, 95 móveis

aplicativos,

155 testes de usabilidade, 160

Mobile First, 147–49

atrapalhando , 25–27

nomes, importância de, 14 convenções

de navegação, 64 de design, 58 de

nível inferior, 72 persistentes, 66

conteúdo revelador, 63 palavras

desnecessárias, oming, 48–52

solicitações de novos recursos,

139 Nielsen, Jakob, xi, 54, 58–59,

96, 115, 121 ruído. Ver ruído visual

Norman, Don, 151

P
nome da página

importância de, 74–76

correspondendo ao que o usuário clicou, 76

posição na página, 75 navegação persistente,

66 navegação primária. Veja Secons Prince and

the Pauper, The, 26 páginas para impressão, 171

promoções
Machine Translated by Google

promoções de conteúdo,
86 promoções de
recursos, 86 menus suspensos, limitações de, 108–09

recrutando participantes do teste, 120–21


Redish, Janice (Ginny), 40, 41, 46, 179, 194 inscrições,
87, 99 reinventando a roda, 31 debates religiosos,
103, 104, 109 reservatório de boa vontade, 166–71
design responsivo, 149, 150 “certo” maneira de
projetar sites, 7

Rosenfeld, Louis, 194

sasficing, 24–25
páginas de digitalização, 22–
23 cheiro de informação, 43,
script para teste de usabilidade, 125, 127–36
caixa de pesquisa, 16–17, 30, 58, 71–72, 86, 99
na página inicial, 86 opções, 71 redação, 71

usuários dominantes de pesquisa,


58 navegação secundária. Veja subsecons
segunda frentes, 50 segundos, 69–70
significantes, 151 ID do site, 67–68 chiado, 169
páginas de carregamento lento, 59
Machine Translated by Google

sinais de parada,
29 placas de rua, 64,
74 subsecons, 68–69

T
guias, 80–81
codificação de
cores, 81 importância de desenhar corretamente, 81
slogan, 93, 95-98
Talking Heads, 55
teletransporte, 62, 67, 92
Theofanos, Mary, 179
tradeoffs, 145-47 tragédia
dos comuns, 100 trunk test, 82-83

você

atributos
de usabilidade de,
155 definidos, 9
laboratórios de
usabilidade, 115 testes de
usabilidade, 3, 110 faça
você mesmo, 115 vs. grupos
focais, 112–13 de dispositivos
móveis, 160–63 número de usuários
para testar, 119 observadores, 124
recrutando parcipantes, 120–21
remotos, 140 revisando resultados,
137–39 sessões de amostra, 127 não
moderados, 140
Machine Translated by Google

valor de começar cedo, 115


o que testar, 124 User
Experience Design (UXD, UX), x, 183
UserTesng.com, 140 Ulies, 65, 69–70

V–Z
validador, acessibilidade, 177
hierarquia visual, 33–36 ruído
visual, 38 sinopse de boas-
vindas, 93 branco, EB, 49
xkcd, 194 Zuckerberg, Mark,
26
Machine Translated by Google

Também disponível

Sabe-se há anos que o teste de usabilidade pode melhorar drasticamente os


produtos. Mas com um preço típico de US$ 5.000 a US$ 10.000 para um consultor
de usabilidade conduzir cada rodada de testes, isso raramente acontece.
Neste guia de instruções de Don't Make Me Think: A Common Sense Approach
to Web Useability, Steve Krug descreve uma abordagem simplificada para testes
de usabilidade que qualquer pessoa pode aplicar facilmente em seu próprio site,
aplicativo ou outro produto. (Como ele disse em Don't Make Me Think, “Não é uma
cirurgia de foguete”.)
Machine Translated by Google

Usando conselhos práticos, muitas ilustrações e seu humor de marca registrada,


Steve explica como: • Testar

qualquer design, desde um esboço em um guardanapo até um site ou aplicativo totalmente


funcional

• Mantenha seu foco em encontrar os problemas mais importantes (porque ninguém tem o eu
ou recursos para corrigi-los todos)

• Corrija os problemas que você encontrar, usando sua abordagem "O mínimo que
você pode fazer"
Machine Translated by Google

Ao reduzir o processo de teste e corrigir os produtos ao essencial (“Uma manhã por


mês, é tudo o que pedimos”), a Rocket Surgery torna real para as equipes testarem
cedo e sempre, detectando problemas enquanto ainda é fácil corrigi-los. Rocket
Surgery Made Easy usa a mesma mistura comprovada de torção clara, exemplos
de antes e depois, ilustrações inteligentes e conselhos práticos que fizeram de Don't
Make Me Think um clássico instantâneo.

Steve Krug (pronuncia-se “kroog”) é mais conhecido como o autor de Don't


Make Me Think: A Common Sense Approach to Web Clothing, agora em sua
terceira edição com mais de 350.000 cópias impressas. Dez anos depois, ele
finalmente reuniu energia suficiente para escrever outro: o manual do teste de
usabilidade Rocket Surgery Made Easy. Os livros foram baseados nos mais de 20
anos que ele passou como consultor de usabilidade para uma ampla variedade de
clientes como Apple, Bloomberg.com, Lexus.com, NPR, Fundo Monetário Internacional
e muitos outros.
Sua empresa de consultoria, Advanced Common Sense, está sediada em
Chestnut Hill, MA. Steve atualmente passa a maior parte de seu tempo dando
workshops de usabilidade, consultoria e assistindo a filmes em preto e branco dos anos 30 e 40.

Cirurgia de foguete facilitada: o guia faça você mesmo para encontrar e corrigir
problemas de usabilidade Steve Krug, ISBN:
9780321657299 www.newriders.com
Machine Translated by Google

Você também pode gostar