Você está na página 1de 289

Machine Translated by Google

Machine Translated by Google

UM GUIA DE PROJETO PARA

Experiência do usuário

PROJETO
PARA DESIGNERS DE EXPERIÊNCIA DO USUÁRIO
NO CAMPO OU NA FABRICAÇÃO

RUSS UNGER E CAROLYN CHANDLER

IMPRENSA DE PEACHPIT
Machine Translated by Google

Um guia de projeto para design UX:


Para designers de experiência do usuário em campo ou em desenvolvimento
Russ Unger e Carolyn Chandler

Novos pilotos
Rua Oitava, 1249
Berkeley, CA 94710
(510) 524-2178
(510) 524-2221 (fax)

Encontre-nos na Web em: www.newriders.com


Para relatar erros, envie uma nota para errata@peachpit.com

New Riders é uma marca da Peachpit, uma divisão da Pearson Education.

Copyright © 2009 por Russ Unger e Carolyn Chandler

Editor de aquisição: Michael J. Nolan


Editor do projeto: Becca Freed
Editor de produção: Tracey Croom
Editora de Desenvolvimento: Linda Laflamme
Editor de texto: Leslie Tilley
Revisora: Suzie Nasol
Compositora: Danielle Foster
Indexadora: Valerie Perry
Design da capa: Mimi Heft
Produção da capa: Andreas deDanaan
Design de interiores: Mimi Heft

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 como obter permissão 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 os autores nem a Peachpit terão qualquer
responsabilidade perante qualquer pessoa ou entidade com relação a qualquer perda ou dano causado ou
supostamente causado direta ou indiretamente pelas instruções contidas neste livro. ou pelos produtos de software
e hardware de computador nele descritos.

Marcas registradas
Muitas das designações utilizadas pelos fabricantes e vendedores para distinguir os seus produtos são
reivindicadas como marcas comerciais. Quando essas designações 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 tal uso, 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-60737-9
ISBN-100-321-60737-6

987654321

Impresso e encadernado nos Estados Unidos da América


Machine Translated by Google

Elogios por um guia de projeto para design UX


Se Russ Unger e Carolyn Chandler fossem mágicos, a Aliança estaria atrás deles por
revelarem seus melhores segredos. Felizmente para você, eles não são.
Russ e Carolyn reuniram sabedoria anteriormente conhecida apenas pelos líderes de
projetos de UX mais experientes e a codificaram para que todos possam ver. Agora você pode
aprender os segredos necessários para executar ótimos projetos de experiência do usuário.

Jared M. Spool, CEO e diretor fundador da User Interface Engineering

Existe algum livro que possa contar tudo o que você precisa saber sobre como projetar
experiências do usuário? Não. Existe algum livro que o leve até lá?
Existe agora. Carolyn e Russ estabeleceram uma base sólida para planejar e gerenciar
projetos de design. Este é um manual essencial para qualquer pessoa envolvida em
metodologias concorrentes, reuniões intermináveis e todas as partes móveis do design da
experiência do usuário.

Dan Brown, autor de Comunicando Design

Este livro é uma introdução fantástica sobre como projetar ótimos produtos para pessoas
reais. Mas abrange muito mais do que apenas design – inclui também todas as coisas
relacionadas ao design: gerenciamento de projetos, trabalho com pessoas e comunicação de
ideias. Um ótimo polivalente.

Donna Spencer, autora de “Classificação de cartões: projetando categorias utilizáveis”

Este é um guia prático, acessível e muito humano para uma atividade muito humana: trabalhar
em conjunto com pessoas para fazer grandes coisas para outras pessoas.

Steve Portigal, Portigal Consulting

Se você já ouviu falar de Wil Wheaton, o autor, entende por que tenho Russ Unger em tão
alta consideração. A experiência e orientação de Russ foram fundamentais para a construção
e design da Monolith Press, e ele tem sido um dos colaboradores mais valiosos com quem
já trabalhei.

Wil Wheaton, autor de Dancing Barefoot, Just a Geek e The Happiest Days of Our Lives

iii
Machine Translated by Google

Agradecimentos
Russ Unger
Este livro nunca teria chegado perto de ser concluído sem o apoio de minha família,
amigos, colegas e uma série de pessoas que eram completamente desconhecidas
para mim antes de digitar as primeiras teclas.

Minha linda esposa, Nicolle, que se casou voluntária e conscientemente com um nerd
com um vírus superdotado, conseguiu dobrar os deveres parentais durante a maior
parte da escrita deste livro. Nossas filhas, Sydney e Avery, muitas vezes cutucavam e
cutucavam seu pai quase em coma para fazê-lo dançar, cantar e tocar Spore.
Inconscientemente pensei que escrever um livro com um recém-nascido em casa não
seria um desafio tão grande. Rapidamente aprendi o contrário.
E Nicolle se apresentou para rebater, uma e outra vez, para me resgatar e permitir que
eu tivesse o foco que precisava para concluir este projeto. Ela é a heroína em quem
mais confio; ela mantém nossa casa em ordem em meio ao caos. Ela é o centro do
nosso mundo aqui e nos deixa fora de perigo com muita facilidade.
Nicolle, junto com Sydney e Avery, conseguem me fazer parecer um ótimo pai, e sou
grata por isso. Moro em uma casa com três meninas e não consigo imaginar amar
nenhuma delas com menos do que tenho para dar.

Carolyn me manteve no caminho certo. Houve momentos em que parecia que este projeto
nunca iria começar ou terminar. Ela sempre manteve as coisas em movimento, explorou
ideias e nos moveu na direção certa. A colaboração tem sido ótima e aprendi muito
com isso! Ela é definitivamente uma ótima UX yin para minha UX yang.

Michael Nolan foi nosso editor de aquisições e foi o guia perfeito.


Michael é honesto e gentil e realmente ajudou a manter as coisas funcionando
perfeitamente. Rebecca Freed tem sido a malabarista, gerenciando todos os aspectos do
livro, mantendo-nos concentrados nas tarefas e, muitas vezes, enviando-nos e-mails tarde da noite.
Infelizmente, ela muitas vezes recebia respostas quase imediatas de mim! Linda
Laflamme foi nossa editora de desenvolvimento e assim que me acostumei com sua
Red Pen of Doom, ficou bem claro que ela estava me guiando na direção certa, não
importa o quanto eu tentasse afogá-la em pensamentos incompletos e frases repetidas.
Leslie Tilley deu um polimento final às palavras; Tracey Croom reuniu produção, layout e
elementos gráficos; e um livro de verdade apareceu.

Steve “Doc” Baty leu cada capítulo antes mesmo de ver a luz do dia nos escritórios
do Peachpit. Eu costumava enviar capítulos para Steve por volta das 2 da manhã, e ele

4 AGRADECIMENTOS
Machine Translated by Google

enviaria seu feedback às 5 da manhã, o que não é pouca coisa. Veja bem, Steve está na
Austrália, mas mesmo assim é impressionante. Sem a disposição constante de Steve
em ajudar e seus rápidos retornos, é difícil acreditar que este livro teria chegado à estante.

Brad Simpson (www.i-rradiate.com) pegou todos os gráficos que joguei para ele e os
transformou em lindas imagens prontas para impressão, muitas vezes enquanto conciliava
sua própria vida com dois filhos adolescentes e uma agenda de trabalho lotada. Teria
sido fácil para Brad ir embora a qualquer momento, mas ele é um verdadeiro amigo que
se interessou pelo projeto e quis me apoiar. Não tenho certeza se haverá jantares de filé
suficientes para compensar esse esforço, mas vou trabalhar duro para chegar lá.
Obrigado, Brad, por abrir mão de muitos de seus dias de folga e madrugadas para
apoiar isso.

Mark Brooks me encontrou em pânico algumas vezes enquanto eu tentava transmitir


mensagens que exigiam um componente visual além do meu tempo e/ou capacidade. Mark
interveio e salvou o dia em mais de uma ocasião e estou grato por isso. Talentoso e
extremamente dedicado, Mark é o tipo de pessoa que aspiro ser.

Jonathan Ashton escreveu o capítulo inteiro sobre otimização de mecanismos de pesquisa


para nós. Após 5 minutos conversando com Jonathan, eu sabia que ele era a pessoa certa
para o trabalho. Seu capítulo por si só é um ótimo motivo para comprar este livro, e tem
sido ótimo tê-lo a bordo.

Jono Kane interveio no último minuto e a qualquer momento. Jono é desenvolvedor


Web, designer de interação e prototipador no Yahoo e foi inestimável em seu apoio e
assistência na criação do Capítulo 12.

Lou Rosenfeld realmente ajudou a fazer a bola rolar. Além de ser coautor do famoso
“Livro do Urso Polar” ( Arquitetura de Informação para a World Wide Web de O'Reilly), Lou
é brilhante, gentil, acessível e está sempre disposto a ajudar outras pessoas em nossa
área. Será difícil encontrar muitas pessoas tão generosas
eu mesmo como Lou é.

Christina Wodtke ajudou a fazer apresentações e conexões para mim. Sem Christina, não
tenho certeza de onde estaríamos hoje, mas provavelmente não estaria “publicado”.
Além de ser uma “autora que você deveria ler”, é alguém que sempre esteve disponível
para dar conselhos e dar insights. Muitos na área de design UX devem muito do que
sabem aos esforços incansáveis de Christina para expandir nossos horizontes inovando
constantemente.

em
AGRADECIMENTOS
Machine Translated by Google

Will Evans e Todd Zaki Warfel forneceram generosamente resultados de alta


qualidade que você pode usar como modelos para seus próprios resultados. Eles
eram verdadeiros irmãos e deram seu tempo e talentos sem questionar ou se
preocupar, muitas vezes a qualquer momento. Eles são grandes membros da nossa comunidade UX—
aqueles que você deseja conhecer e trabalhar - e sou abençoado por ser amigo
deles. Certamente não posso fazer justiça à dívida de gratidão que tenho com estes dois.

David Armano, Chris Miller, Kurt Karlenzig, Livia Labate, Matthew Milan, Michael
Leis, Mario Bourque, Troy Lucht, Ross Kimbarovsky (e a turma do crowdSPRING) e
Wil Wheaton me serviram bem como bons amigos e verdadeiros apoiadores e
crentes. Tenho a sorte de poder digitar esses nomes juntos como uma lista de
pessoas que conheço e sou um grande fã de tudo o que eles fazem. O apoio deles
tem sido um benefício imensurável para mim em tudo o que faço.

Essas pessoas excelentes se esforçaram para me ajudar, contribuindo


generosamente com informações, anedotas e acesso aos seus recursos, e agradeço-
lhes de todo o coração: Tonia M. Bartz (www.toniambartz.com), capítulo 7; Steve
“Doc” Baty, (www.meld.com.au), capítulos 3, 11, 14 e “Um breve guia para
reuniões”; Mark Brooks (www.markpbrooks.com), capítulos 3 e 11; Leah Buley (www.
adaptivepath.com), capítulo 11; Dave Carlson (www.deech.com), capítulo 11; Will
Evans (www.semanticfoundry.com), capítulos 7, 10 e 11; Christopher Fahey
(www.behaviordesign.com), capítulo 14; Nick Finck (www.nickfinck.
com), capítulo 10; Jesse James Garrett (www.adaptivepath.com), capítulo 10; Austin
Govella (www.grafofini.com), capítulo 11; Jon Hadden (www.jonhadden.
com), capítulo 12; Whitney Hess (www.whitneyhess.com), capítulo 11; Andrew Hinton
(www.inkblurt.com), capítulo 10; Gabby Hon (www.staywiththegroup.
com), capítulos 3 e 11; Kaleem Khan (www.uxjournal.com), “Um breve guia para
reuniões”; Ross Kimbarovsky (www.crowdspring.com), capítulo 14; Livia Labate
(www.livlab.com), capítulo 7; Michael Leis (www.michaelleis.com), capítulo 11; Troy
Lucht (www.ascendrealtysolutions.com), capítulo 14; James Melzer (www.
jamesmelzer.com), capítulo 10; Matthew Milan (www.normativethinking.com), capítulo
7; Chris Miller (www.hundredfathom.com/blog), “Um breve guia para reuniões”;
Maciej Piwowarczyk (www.linkedin.com/pub/3/a74/a66), capítulo 11; Stephanie
Sansoucie (www.linkedin.com/in/smsansoucie), capítulo 11; Kit Seeborg
(www.seeborg.com), capítulos 3, 11 e “Um breve guia para reuniões”; Josh Seiden
(www.joshuaseiden.com), capítulo 7; Jonathan Snook (www.
snook.ca), capítulo 12; Joe Sokohl (www.sokohl.com), capítulo 12 e “Um breve guia
para reuniões”; Samantha Soma (www.sisoma.com), “Um breve guia para

nós AGRADECIMENTOS
Machine Translated by Google

Encontros"; Donna Spencer (www.maadmob.net), capítulo 7; Jared M. Spool


(www.uie.com), capítulo 7; Keith Tatum (www.slingthought.com), capítulo 12; Todd
Zaki Warfel (www.messagefirst.com), capítulos 7, 12 e 14.

Também gostaria de agradecer a Andrew Boyd, Dan Brown, Tim Bruns, Christian
Crumlish, Bill DeRouchey, Brian Duttlinger, Jean Marc Favreau, Hugh Forrest do SXSW,
Peter Ina, Alec Kalner, Jonathan Knoll, Christine Mortensen, Steve Porti-gal, Dirk M.
Shaw e Paula Thornton - bem como o pessoal da Manifest Digital e todos da Draftfcb.

É inevitável que eu tenha sentido falta de alguém e espero que isso não seja levado para o lado pessoal.
Há uma abundância de pessoas na “multidão” que foram adquiridas e tentei acompanhar
todos. Se senti sua falta, me avise e encontrarei uma maneira de consertar!

Finalmente, é importante notar que sem organizações como o Information Architecture


Institute, a Interaction Design Association e outras, teria sido impossível para mim
estabelecer conexões com muitas das pessoas mencionadas. Se você está
curioso sobre o campo do design UX, explore essas organizações, junte-se a elas
e envolva-se!

Carolyn Chandler
Muitos de nós sonhamos em escrever um livro em algum momento de nossas vidas.
Sem Russ, não sei se algum dia teria tido motivação para entrar em ação e fazer isso.
Sua energia e entusiasmo nos ajudaram a encontrar as pessoas certas no momento
certo, desde a equipe do Peachpit até líderes da indústria de UX, todos os quais
tiveram um enorme impacto no que você vê nestas páginas. Ele é realmente um
dos grandes conectores em nossa área e prospera em unir as pessoas dia e noite.
Além disso, acho que ele posta mais tweets em um único dia do que eu desde que
entrei no Twitter!

Russ agradeceu a muitas das pessoas que nos ajudaram imensamente. Não
vou repetir todos esses nomes, exceto o de Steve Baty, que leu todos os nossos
capítulos em qualquer forma crua que pudéssemos lançar para ele e ainda
assim conseguiu parecer entusiasmado às 2 da manhã (horário dele). John Geletka
também forneceu feedback atencioso e discussões intrigantes com uma centelha e
uma perspectiva que atravessa diversas disciplinas. E claro, a equipe Peachpit;
Nunca esquecerei de receber meu primeiro capítulo de Linda Laflamme. Não foi
nada bonito (embora ela tenha dado as sugestões com muito tato). Ela pacientemente

AGRADECIMENTOS vii
Machine Translated by Google

me conduziu pelas edições e me ajudou a melhorar meu fluxo, que originalmente era mais
adequado para escrever white papers únicos do que um livro completo.
Agora, até me pego adicionando transições em minhas conversas casuais com colegas! Falando
nisso …

Christine Mortensen, também conhecida como Morty, foi minha parceira no crime no que diz
respeito aos elementos visuais. Os ícones e diagramas que você vê em meus capítulos são
resultado de seu trabalho árduo — e eu sei o quanto, porque ela e eu estávamos trabalhando
em muitos dos mesmos projetos de clientes ao mesmo tempo em que tentávamos cumprir os
prazos dos capítulos. Morty é um daqueles designers visuais que consegue se firmar tanto no
design visual quanto no de interação, colaborando alegremente com todos no projeto e dando
vida aos conceitos.
Ela tem uma integridade e um foco na qualidade que fazem com que seja um prazer trabalhar
com ela, e é uma honra tê-la como parceira nisso.

Muito obrigado também a todo o pessoal da Manifest Digital, que tem dado tanto apoio durante
os últimos meses. Jim Jacoby trouxe uma mistura especial de conhecimento de negócios e
perspectiva UX, com sua marca registrada de calma zen, que me ajudou a superar alguns
momentos estressantes. Jason Ulaszek é uma das pessoas mais entusiasmadas que conheço
na área de UX e possui um conhecimento infinito de ferramentas e técnicas; Não tenho ideia de
onde ele abre espaço para tudo isso! Além disso, Brett Gilbert e Jen O'Brien forneceram
informações valiosas para algumas das muitas funções que colaboram com designers de UX.

Também gostaria de agradecer aos membros da equipe Manifest UX, que me forneceram
inspiração e que foram tão pacientes com minhas constantes referências ao progresso no “livro”:
Brian Henkel, Chris Ina, Haley Ebeling, Jenn Ber -zansky, Meredith Payne e Santiago Ruiz. É
uma alegria constante trabalhar com você. Todos os dias aprecio seu humor e visão.

Aos meus colegas membros da Interaction Design Association, obrigado por compartilharem
suas experiências e por serem membros ativos da comunidade UX que adoro. Em particular,
gostaria de agradecer a Janna Hicks DeVylder e Nick Iozzo, que foram fundamentais no
desenvolvimento do capítulo de Chicago e que continuam a encontrar novas maneiras de
desenvolver uma rede vibrante de pessoas inteligentes.

Por último, mas não menos importante, quero agradecer à minha família, aos meus amigos e
ao Anthony, que suportaram pacientemente o meu desaparecimento e continuaram a verificar
se eu ainda estava vivo. Você tem muitos cheques para lucrar, e eu olho
ansioso para gastá-los com você!

viii AGRADECIMENTOS
Machine Translated by Google

Conteúdo
INTRODUÇÃO . . . . . . . . ......... ......... . . . . . . . . . . . . . . . . . . . . . . . . . . . xv

CAPÍTULO 1: O Tao do UXD ........................................... 1

O que é design de experiência do usuário? ................................ 3


A definição ampla ................................................ ...3

Não se esqueça do tangível......................................... ..4


Nosso foco ................................................ ...........5

Sobre designers de UX .......................................... 6


Onde vivem os designers de UX. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .7
Vamos começar!.............................................. 8

CAPÍTULO 2: O Ecossistema do Projeto....................................9

Identifique o tipo de site. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10


Presença da marca. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .11

Campanha de Marketing . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14
Origem do conteúdo . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 16

Aplicativos baseados em tarefas. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18


Sites de comércio eletrônico. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19

Aplicativos de e-learning. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20

Aplicativos de redes sociais. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20

Escolha seus chapéus. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .21


Arquiteto de Informação. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 22

Designer de interação. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23
Pesquisador de usuários. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23

Outras funções que você pode desempenhar ou precisar. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 26

Construindo uma rede de defesa do usuário. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 32

Entenda a cultura da empresa. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 33

História . . . ........ . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 34

Hierarquia . ........ . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 36

Logística. . ........ . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 37

Juntando tudo. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 38

CAPÍTULO 3: Propostas para Consultores e Freelancers . . . . . . . . . . . . . . . . . . 39

Propostas. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 40

Criando a proposta. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 41

CONTEÚDO ix
Machine Translated by Google

Folha de rosto. . . . . . . . . ........ ........ ........ ........ ........ ........ . . 42

Histórico de Revisão . . . ........ ........ ........ ........ ........ ........ . . 44

Visão Geral do Projeto . . ........ ........ ........ ........ ........ ........ . . 44

Abordagem do projeto . . ........ ........ ........ ........ ........ ........ . . 45

Escopo do Trabalho. . . . ........ ........ ........ ........ ........ ........ . . 47

Premissas . . . . . . ........ ........ ........ ........ ........ ........ . . 47

Entregáveis. . . . . . . ........ ........ ........ ........ ........ ........ . . 48

Propriedade e Direitos. . . . . . ........ ........ ........ ........ ........ . . 49

Custos e taxas adicionais. . . ........ ........ ........ ........ ........ . . 50

Preços do projeto. . . . . ........ ........ ........ ........ ........ ........ . . 51

Agenda de pagamentos . ........ ........ ........ ........ ........ ........ . . 52

Reconhecimento e Assinatura . . . . . . ........ ........ ........ ........ . . 53

Declarações de Trabalho. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 54

CAPÍTULO 4: Objetivos e abordagem do projeto . . . . . . . . . ......... . . . . . . . . 56

Solidificar os objetivos do projeto. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 57

Como um designer UX pode ajudar? . . . . . . ........ ........ ........ ........ . . 60

Entenda a abordagem do projeto. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 62

Abordagem em cascata. . . . . . . . . ........ ........ ........ ........ ........ . . 63

Abordagens Ágeis. . ........ ........ ........ ........ ........ ........ . . 63

Abordagens modificadas. . . . . . . ........ ........ ........ ........ ........ . . 64

Como a abordagem me afeta? . ........ ........ ........ ........ . . 66

CAPÍTULO 5: Requisitos de Negócios . . . . . . . . . ......... ......... . . . . . . . . 67


Entenda o estado atual. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 70

Análise Heurística. . ........ ........ ........ ........ ........ ........ . . 70

Reúna ideias das partes interessadas. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 74

Descrever responsabilidades. . . . . ........ ........ ........ ........ ........ . . 75

Reúna as partes interessadas certas. . . . . . . ........ ........ ........ ........ . . 76

Crie um plano para as reuniões. . . . . . . ........ ........ ........ ........ . . 78

Vendas: Reunião de Levantamento de Requisitos. . . . . . . ........ ........ ........ . . 78

Execute as reuniões de forma eficaz. . . . . . . . . ........ ........ ........ ........ . . 80

Requisitos de coalescência. . . ........ ........ ........ ........ ........ . . 82

x CONTEÚDO
Machine Translated by Google

CAPÍTULO 6: Pesquisa do usuário . . . . . . . ......... . . . . . . . . . . . . . . . . . . . . . . . . . . . 85

Etapas básicas da pesquisa do usuário. . . ..... . ..... . ..... . ..... . . ..... . 86

Defina seus grupos de usuários. . . . . . . ..... . ..... . ..... . ..... . . ..... . 86


Crie uma lista de atributos. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 87

Priorize e defina. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 89

Escolhendo Técnicas de Pesquisa. .... . . ..... . ..... . ..... . . .... . . 91

Quantas atividades de pesquisa posso incluir? . . . . . . . . . . . . . . . . . . . . . . . . . . . . 93


Entrevistas com usuários. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 95

Investigação Contextual. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 98

Pesquisas. . . ........ . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 101

Grupos de foco . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 104

Classificação de cartões. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 107

Testando usabilidade . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 110

Depois da Pesquisa. . . . . . ..... . . .... . . ..... . ..... . ..... . . .... . . 111

CAPÍTULO 7: Personagens . . . ......... ......... ......... . . . . . . . . . . . . . . . . . 112

O que são personas? . . . . ..... . . .... . . ..... . ..... . ..... . . .... . .113

Por que eu criaria personas? . .... . . ..... . ..... . ..... . . .... . .113

Encontrando informações para Personas . . . . . . ..... . ..... . ..... . . .... . .114

Criando Personagens. . . . . . ..... . . .... . . ..... . ..... . ..... . . .... . .114

Requisitos Mínimos de Conteúdo . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .117

Conteúdo opcional. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .119

Personagens Avançados. . . . . ..... . . .... . . ..... . ..... . ..... . . .... . 122

Considerações finais sobre Personas. . . . .... . . ..... . ..... . ..... . . .... . 125

CAPÍTULO 8: Design de experiência do usuário e otimização de mecanismos de pesquisa. . . . 126

Introdução ao SEO. . . . ..... . . .... . . ..... . ..... . ..... . . .... . .127

Por que o SEO é importante? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 127

Recursos básicos importantes. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 129

Tecnologia, design e infraestrutura do local . . . ..... . ..... . . .... . 129

Flash, Ajax, JavaScript e outros conteúdos com script . . . . . . . . . . . . . . . . . . . . . . 130

Sistemas de gerenciamento de conteúdo . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 133

Domínios, diretório e estrutura de URL são importantes. . . . . . . . . . . . . . . . . . . . . . . . 134

Conteúdo: O Rei Antigo (e Atual) e Futuro. . . ..... . . .... . 135

Convenções de nomenclatura e a batalha contra o jargão. . . . . . . . . . . . . . . . . . . . . 136

Metadados, cabeçalhos e palavras-chave. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 136

CONTEÚDO XI
Machine Translated by Google

Divida os cabelos. . . . . ........ ........ ........ ........ ........ ........ . 137

Use mapas do site. . . . . ........ ........ ........ ........ ........ ........ . 138

Mantenha o conteúdo atualizado. . . . . . . . . . . . . . . . ........ ........ ........ ........ . 138

Outros problemas de conteúdo. . . . . . . ........ ........ ........ ........ ........ . 138

Popularidade do link explicada. . . . . . . ..... . ..... . ..... . . ..... . . . . . . 139

Distribuição típica de popularidade de links. . . ........ ........ ........ ........ . 139

Links de rodapé. . . . . . . ........ ........ ........ ........ ........ ........ . 140

Links cruzados no conteúdo . . . ........ ........ ........ ........ ........ . .141

Jogando com o sistema. . . . . . ..... . ..... . ..... . . .... . . ..... . . . . . . .141

Chapéu Branco versus Chapéu Preto. . ........ ........ ........ ........ ........ . .141

Spam com meta palavras-chave. . . . . . ........ ........ ........ ........ . 142

Clonagem e páginas de entrada. . . . . . . . ........ ........ ........ ........ . 142

Spam de links. . . . ........ ........ ........ ........ ........ ........ . 143

Algumas considerações finais. . . . . . . . . . ..... . ..... . . .... . . ..... . . . . . . 143

CAPÍTULO 9: Transição: da definição ao design . . . . ......... . . . . . . . 144

Idear e visualizar recursos. . . ..... . ..... . ..... . . ..... . . . . . . 146

O processo básico de storyboard. . ........ ........ ........ ........ . 147

Facilite o processo de priorização. . . . . ..... . ..... . . ..... . . . . . . 150

Mantenha uma boa tensão. ..... . ..... . ..... . ..... . . ..... . . . . . . 154

O Defensor do Desenvolvimento. . . . . . . . ........ ........ ........ ........ . 156

Gerenciando conflitos durante a priorização. . . . . . . ........ ........ ........ . 158

Planeje suas atividades e documentação. . . . . . ..... . . ..... . . . . . . 162

CAPÍTULO 10: Mapas do site e fluxos de tarefas. . . . . . . ......... ......... . . . . . . . 165

O que é um mapa do site? . . . . . . ..... . ..... . ..... . . .... . . ..... . . . . . . 166

O que é um fluxo de tarefas? . . . . . . . . . . . ..... . ..... . . .... . . ..... . . . . . . 166

Ferramentas do comércio. . . . . . . . . . . . . ..... . ..... . . .... . . ..... . . . . . . 167

Elementos básicos de mapas do site e fluxos de tarefas. . . . .... . . ..... . . . . . . 168

Página . . . . . . . . . . . . . ........ ........ ........ ........ ........ ........ . 168

Pilha de páginas . . . . . . . . ........ ........ ........ ........ ........ ........ . 169

Ponto decisivo. . . . . ........ ........ ........ ........ ........ ........ . 169

Conectores e setas . . . . ........ ........ ........ ........ ........ . 170

Condições. . . . . . . . ........ ........ ........ ........ ........ ........ . 170

Erros comuns . . . . . . ..... . ..... . ..... . . .... . . ..... . . . . . . .171

Conexões desleixadas. . . . . . . . ........ ........ ........ ........ ........ . .171

xii CONTEÚDO
Machine Translated by Google

Objetos desalinhados e com espaçamento desigual . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 172


Texto mal colocado. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 172

Falta de numeração de páginas. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 173


O mapa do site simples. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 174

Mapas avançados do site. . . . ..... . . .... . . ..... . ..... . ..... . . .... . 0,175

Quebrando o molde do mapa do site. . . . . .... . . ..... . ..... . ..... . . .... . .177

Fluxos de tarefas. . . . . . ..... . ..... . . .... . . ..... . ..... . ..... . . .... . 178

Levando os fluxos de tarefas para o próximo nível. . . . ..... . ..... . ..... . . .... . .181

Fluxo de processo . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .181

Raias. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 182

CAPÍTULO 11: Wireframes e anotações. . . . . . . . . . . . . . . . . . . . . . . . . .185


...

O que é um wireframe? . . . ..... . . .... . . ..... . ..... . ..... . . .... . 186

O que são anotações? . ..... . . .... . . ..... . ..... . ..... . . .... . 187

Quem usa wireframes? . ..... . . .... . . ..... . ..... . ..... . . .... . 188

Criando Wireframes. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 189


Ferramentas do comércio. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 189

Comece de forma simples: projete um wireframe básico. ..... . ..... . ..... . . .... . .191

Começando . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 192
Os wireframes e anotações. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 193

Um exercício: crie um wireframe de página inicial. ..... . ..... . . .... . 195

Requisitos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 195
Os resultados: crie um wireframe de página inicial. . . . . . . . . . . . . . . . . . . . . . . . . . . 197
Design visual: quando os wireframes crescem e encontram seu próprio caminho
no mundo. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 200

Acompanhamento do exercício de design: qual design é o correto? . . . . . . . . . . . . . . . . . . . . . . 201

Uma nota final sobre a apresentação de wireframes. . 202 ..... . ..... . ..... . . ....

CAPÍTULO 12: Prototipagem. . . . . . . . . ......... . . . . . . . . . . . . . . . . . . . . . . . . . .204

O que é prototipagem? . . . ..... . . ..... . ..... . ..... . ..... . . . . . . . 205

Quanto protótipo eu preciso? . . . . . ..... . ..... . ..... . . . . . . . 205

Prototipagem de Papel. . . . . . ..... . . ..... . ..... . ..... . ..... . . . . . . . 206

Prototipagem Digital. . . . . ..... . . ..... . ..... . ..... . ..... . . . . . . . 207

Wireframe vs. Protótipos Realistas. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 207


Editores HTML vs. WYSIWYG . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 209

Ferramentas adicionais para prototipagem. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 214

CONTEÚDO xiii
Machine Translated by Google

Trabalhando com um desenvolvedor. . . . . . . . . . . ........ ........ ........ ........ . 217

Exemplos de protótipos. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .217

O que acontece após a prototipagem? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 219

CAPÍTULO 13: Teste de Design com Usuários . . . . . . ......... ......... . . . . . . 0,220

Exploração de conceito. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 221

Dicas sobre como explorar modelos de design visual. . . . ........ ........ ........ . 224

Testando usabilidade. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 225


Escolhendo uma abordagem. . . . . ........ ........ ........ ........ ........ . 227

Planejando a Pesquisa. . . . . . ........ ........ ........ ........ ........ . 229

Recrutamento e Logística. . . . ........ ........ ........ ........ ........ . 233

Escrevendo guias de discussão. . . ........ ........ ........ ........ ........ . 239

Facilitando. . . . . . . . ........ ........ ........ ........ ........ ........ . 242

Análise e apresentação de resultados. . . . . ........ ........ ........ ........ . 243

Criação de recomendações. . . . . . . . . ........ ........ ........ ........ . 245

CAPÍTULO 14: Transição: Do Design ao Desenvolvimento e Além . . . . . . 247


Este é o fim…. . . . . . . 248. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

Design visual, desenvolvimento e garantia de qualidade. . . . . . . . . . . . . 248

Teste de design com usuários (de novo). . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 251

10, 9, 8, 7, 6, 5, 4, 3, 2, 1… Lançamento!. . . . . . . . . . . . . . . . . . . . . . . . . . . . . 251

Vantagem Pessoal. . . . . . . ........ ........ ........ ........ ........ . 252

Apoiar . . . . . . . . . . ........ ........ ........ ........ ........ ........ . 252

Opinião da Rede. . ........ ........ ........ ........ ........ ........ . 253

Atividades pós-lançamento. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 253

Análise pós-lançamento. . . . . . . ........ ........ ........ ........ ........ . 254

Teste de design pós-lançamento com usuários (de novo, de novo) . . . . ........ ........ . 255

Tudo feito, certo? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 255

Assim como começar de novo…. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 255

ÍNDICE . . . . . . . . ......... ......... ......... ......... ......... . . . . . . . 257

XIV CONTEÚDO
Machine Translated by Google

Introdução

Por que escrevemos este livro


Bem-vindo ao Guia de Projeto para UX Design.

Em algum lugar há um estudante de design de experiência do usuário perdendo o sono porque não
sabe como será trabalhar em um projeto real em sua nova empresa. Do outro lado da cidade, há
uma designer visual com muita experiência em projetos que anseia por assumir novas
responsabilidades na definição da experiência do usuário em seu site. São duas pessoas em
momentos diferentes de suas vidas, mas com uma necessidade semelhante: entender como
integrar práticas de experiência do usuário no contexto de um projeto vivo e vibrante.

Nosso objetivo com este livro é fornecer as ferramentas básicas e o contexto que o ajudarão a
usar ferramentas e técnicas de UX com equipes de trabalho. Como você verá em muitos destes
capítulos, não estamos tentando ser tudo para todas as pessoas, mas estamos tentando fornecer
a você as informações e o conhecimento básicos que você deve ter para executar muitas das
tarefas que você irá realizar. ser designado como designer UX. Além de nossos próprios
exemplos, fornecemos exemplos que ajudam a identificar maneiras de alavancar os materiais
básicos e permitem combinar as informações e criar algo mais novo, melhor ou até mais
adequado aos seus próprios propósitos.

Esperamos ter feito um trabalho decente ao articular que esta é uma abordagem muito boa
para projetos de design UX.

Não somos nada se não estivermos constantemente tentando aprender e melhorar (o que quer que façamos)

com cada iteração. É por isso que, até certo ponto, estamos neste campo.

Uma palavra de Russ

Como mentor do Information Architecture Institute (www.iainstitute.org)


Percebi um padrão entre as pessoas com quem trabalhei: a maioria estava tendo dificuldade em
conseguir empregos ou não estava alinhada com as expectativas dos possíveis empregadores.
Alguns tiveram uma educação excelente, mas nem sempre aplicação prática suficiente de suas
habilidades de design UX em um ambiente baseado em projetos.

Os mesmos temas ressoaram em muitas das conversas que tive no Information Architecture
Summit (www.iasummit.org) em 2008. Foi então que o

INTRODUÇÃO xv
Machine Translated by Google

A ideia para este livro – que aborda muitas dessas questões comuns – começou a tomar
forma. Não me lembro se Carolyn ou eu enviamos o primeiro e-mail, mas sei que nela
encontrei uma coautora disposta e capaz que me ajudou a lixar a ideia que acabou se
tornando este livro.

Uma palavra de Carolyn

Há muitos anos, estou na posição de sorte de construir e gerenciar equipes de UX. Digo
“sortudo” porque acho que os designers de UX em geral têm um grande equilíbrio de
características que os tornam muito divertidos de trabalhar, misturando a intuição do lado
direito do cérebro e a lógica do lado esquerdo do cérebro.

Ao conduzir entrevistas para formar essas equipes, uma coisa realmente se destacou: uma
formação educacional relacionada, como fatores humanos ou design de comunicação, é um
ótimo indicador de que alguém está comprometido com a área de design UX, mas não é o
indicador número um para saber se alguém se encaixaria bem na equipe ou em um projeto.
Tão importante quanto — se não mais — é a capacidade da pessoa de ter a mentalidade de
um consultor. Isso significa uma atitude positiva, um desejo de compreender e incluir outras
pessoas ao longo de um projeto e, acima de tudo, um foco em causar um impacto real para
usuários e clientes.

Essa mentalidade significa reservar um tempo para compreender as perspectivas de outras


funções no projeto, apresentar argumentos e fazer concessões quando necessário. É
preciso experiência e esforço para definir bem essa mentalidade, mas ter uma mente aberta,
uma base sólida e um bom conjunto de perguntas (com a coragem de fazê-las) pode levar
você muito longe. Este livro pode não fornecer todas as “respostas”, mas lhe dará as perguntas
a serem feitas para ajudá-lo a encontrá-las.

Quem deveria ler esse livro


Um Guia de Projeto para UX Design fornece uma visão geral ampla e introdutória ao design
UX no contexto de um projeto. Qualquer pessoa interessada em design UX deve encontrar
algo útil aqui. Nós nos concentramos nos seguintes grupos em particular:

Alunos que fazem cursos de design UX (como interação humano-computador ou design de


interação) que desejam complementar seus cursos com informações sobre como aplicar seu
aprendizado a situações da vida real, onde a comunicação e a colaboração são vitais.

xvi INTRODUÇÃO
Machine Translated by Google

Profissionais que desejam aprofundar seus conhecimentos sobre as ferramentas e


técnicas básicas de design UX e melhorar a comunicação da equipe sobre as funções
envolvidas. O Capítulo 3 também é especialmente voltado para freelancers que
precisam criar suas próprias propostas.

Líderes de grupos de design de UX que procuram um livro que ajude suas equipes
a integrar as melhores práticas de projetos com atividades de design de UX.

Líderes de qualquer equipe de projeto que estejam interessados em aprender


mais sobre como o design UX se integra em seus projetos, qual é o valor e o que
esperar dos designers UX.

SE VOCÊ PRECISAR… ENTÃO VOCÊ DEVE LER…

Defina o design da experiência do usuário e entenda Capítulo 1: O Tao do UXD


o que atrai as pessoas para a área

Faça as perguntas que são importantes para serem Capítulo 2: O Ecossistema do Projeto
respondidas antes do início do projeto (ou pelo Capítulo 3: Propostas para Consultores e
menos antes de começar a trabalhar nele) Freelancers

Comece bem com reuniões eficientes, objetivos Capítulo online: Um breve guia para reuniões
claros e pontos de aprovação bem compreendidos Capítulo 4: Objetivos e Abordagem do Projeto

Definir requisitos do projeto que sejam inequívocos e Capítulo 5: Requisitos de Negócios


fáceis de priorizar, extraídos de Capítulo 6: Pesquisa do usuário
partes interessadas e usuários de negócios Capítulo 9: Transição: Da Definição para
Projetando

Aprenda sobre seus usuários e represente suas Capítulo 6: Pesquisa do usuário


necessidades ao longo do projeto Capítulo 7: Personagens
Capítulo 13: Teste de Design com Usuários

Escolha e utilize as ferramentas e técnicas que permitem Capítulo 10: Mapas do Site e Fluxos de Tarefas
trazer ideias visuais para sua equipe de projeto Capítulo 11: Wireframes e Anotações
rapidamente Capítulo 12: Prototipagem

Garanta que seu site seja facilmente encontrado e pesquisado Capítulo 8: Design de Experiência do Usuário e
pelos usuários e pelos mecanismos de pesquisa Motor de Otimização de Busca

Comunique e evolua seu design com a equipe do Capítulo 14: Transição: Do Design ao
projeto assim que o desenvolvimento começar Desenvolvimento e além

Não deixe de visitar www.projectuxd.com para ler o capítulo bônus “Um breve guia para
reuniões” e para baixar outros materiais bônus, como modelos.

INTRODUÇÃO
xvii
Machine Translated by Google

Uma nota sobre metodologia


Existem diversas abordagens e metodologias por aí. Não somos defensores de uma
abordagem em detrimento de outra. Nosso objetivo neste livro é focar nas etapas comuns
à maioria dos projetos: definir as necessidades do projeto, projetar a experiência e
desenvolver e implantar a solução. A quantidade de sobreposição entre estas etapas
irá variar muito dependendo da abordagem de projeto usada (veja o Capítulo 4 para
mais detalhes). Na maior parte, nossa estrutura é uma abordagem flexível e linear, onde
a etapa de definição vem primeiro – mas em cada etapa aproveitamos as técnicas de
facilitação e design onde elas são mais úteis.

O que este livro não é


Uma enciclopédia de todas as técnicas. A área de UX tem um número enorme
de pessoas criativas, e elas estão sempre tentando novas abordagens para problemas
de design. Incluir todas essas abordagens aqui daria um livro muito maior – e que
rapidamente ficaria desatualizado. O que incluímos aqui são as técnicas mais
comumente usadas, os detalhes básicos do design UX.
Tentamos fornecer informações suficientes para intrigá-lo e permitir que você
comunique as atividades a outros membros do projeto – incluindo o processo básico de
cada técnica e referências adicionais a livros ou sites que o ajudarão a implementá-las
assim que escolher seu caminho.

Um guia para ser um gerente de projetos. Um bom gerenciamento de projetos


(incluindo definição e acompanhamento de objetivos, cronogramas e orçamentos) é
fundamental para o sucesso de qualquer projeto. Não abordamos detalhes sobre como
ser gerente de projetos ou como escolher uma metodologia de projeto específica.
Discutimos as habilidades que um designer UX traz para um projeto que lhe permite
funcionar de forma eficaz, como facilitação e comunicação, bem como a capacidade de
esclarecer e manter o foco nos objetivos do projeto. Essas habilidades o ajudarão a
se tornar um parceiro no gerenciamento de projetos.

O único ou perfeito processo ou metodologia para você seguir. Não temos todas as
respostas – ninguém tem hoje. O campo do design UX é relativamente jovem e todos
estamos trabalhando para melhorar onde estamos. Você provavelmente descobrirá
que tentativa e erro, aprimoramentos e melhorias e feedback

XVIII INTRODUÇÃO
Machine Translated by Google

de outros o ajudará a adaptar um processo para atender às suas necessidades. Quando


você encontrar algo que funcione para você, compartilhe! Nos informe!

Como usar este livro


Existem muitos recursos excelentes para designers de UX. Cobrimos os tópicos de forma
ampla aqui, mas indicamos referências que lhe permitirão explorar os tópicos em um nível mais
profundo, dependendo de quanto tempo você deseja dedicar a eles. Para ajudá-lo a entender a
quantidade de tempo geralmente necessária para cada referência, nós os dividimos em três
categorias principais:

Surfar

As referências citadas com a prancha de surf são recursos mais curtos (geralmente
online) que levará de 5 a 30 minutos para ser lido.

Mergulho com snorkel

Aqueles chamados com o snorkel são artigos on-line mais longos, white papers,
ou livros curtos que levam de uma hora a um fim de semana para serem lidos.

Mergulho Profundo

Os chamados com capacete de mergulhador são livros mais longos que


provavelmente levará mais de um fim de semana para ler; eles fornecem uma cobertura detalhada
do tópico.

INTRODUÇÃO XIX
Machine Translated by Google

Esta página foi intencionalmente deixada em branco


Machine Translated by Google

O Tao do UXD
1 A curiosidade encontra a paixão
Encontra a empatia

O importante é não parar de questionar. A curiosidade tem

sua própria razão de existir. Não se pode deixar de ficar maravilhado

quando contempla os mistérios da eternidade, da vida, da maravilhosa

estrutura da realidade. É suficiente se alguém tentar

apenas para compreender um pouco deste mistério todos os dias.

Albert Einstein

O senso de curiosidade é a escola original de


Educação.

Smiley Blanton

Paixão e propósito andam de mãos dadas. Quando você des-

Para cobrir seu propósito, você normalmente descobrirá que é algo pelo qual

você é tremendamente apaixonado.

Steve Pavlina

A grande dádiva do ser humano é que temos o poder da empatia.

Meryl Streep

1
Machine Translated by Google

Muito simplesmente,
para o campo este capítulo
do design de éexperiência
sobre vocêdo
–e sobre (ou
usuário outras pessoas
design que são
UX, para atraídas
abreviar).

Se você está lendo esta frase, você é uma pessoa curiosa.

Você quer saber como as coisas funcionam – desde maçanetas até aviões e aquela coisa no
fundo da sua garganta. Acima de tudo, você quer saber o que motiva as pessoas.

Você não vê as coisas em preto e branco; há muitos tons de cinza para explorar! Claro, às vezes
você pode deixar seus colegas um pouco loucos por sempre se voluntariar para bancar o
advogado do diabo, mas não é como se você pudesse parar de tentar olhar para o outro lado da
moeda.

Sortudo!

O campo do design de experiência do usuário atrai curiosos que se sentem confortáveis em


trabalhar com vários tons de cinza.

Buscamos padrões e prosperamos em termos de organização e estrutura. Nós conectamos os


pontos. Perseguimos incansavelmente a próxima peça do quebra-cabeça e, quando o quebra-
cabeça é resolvido, procuramos maneiras de melhorá-lo!

Podemos ser analógicos ou digitais. Estamos em casa com lápis e papel, quadros brancos e
marcadores de quadro branco, post-its e canetas Sharpie. Falamos em termos de Visio e
Graffle e vivemos em um mundo de caixas e setas conectadas nas múltiplas telas de nossos
computadores.

Não estamos apenas curiosos. Somos apaixonados!

Temos paixão por debater ideias e facilitar discussões. Temos paixão por criar coisas que
fazem a diferença para quem as usa – e para quem as cria. Curiosamente, ficamos mais
orgulhosos quando algo que criamos é tão bom que as pessoas não percebem o quão bom é!

E, claro, temos empatia.

Podemos sentir isso profundamente no âmago do nosso ser quando nos deparamos com
uma experiência ruim. Pior ainda, tentamos instantaneamente encontrar soluções para resolver os
problemas.

Sabemos o que é receber uma resposta inesperada ao que parece ser um simples pedido – e
não gostamos disso! Não queremos que os usuários – pessoas como nós – tenham que suportar
a confusão e os sentimentos de inadequação que muitas vezes andam de mãos dadas com uma
experiência ruim.

2 CAPÍTULO 1: O TAO DO UXD


Machine Translated by Google

Quando você combina essa curiosidade quase constante e infantil com uma paixão incomparável
por “fazer o que fazemos” e uma noção de como os outros se sentem, você acaba com uma
comunidade animada de profissionais que se sentem confortáveis em falar o que pensam, fazer
perguntas, compartilhar soluções, e estar errado – tudo em nome de chegar ao que é certo.

Bem-vindo à comunidade de design UX.

O que é design de experiência do usuário?


Existem muitas definições para design de experiência do usuário. Afinal, é um campo que
prospera em definir coisas. É certo que às vezes não fazemos um bom trabalho ao “definir a
maldita coisa” quando se trata das várias partes do todo, mas pelo menos sabemos o que é o
todo.

Neste livro vamos nos concentrar em duas definições em particular: o sentido mais amplo do
termo UX design e a definição que usaremos no contexto de
este livro.

A definição ampla
O design da experiência do usuário é

A criação e sincronização dos elementos que afetam a experiência dos usuários


com uma determinada empresa, com o intuito de influenciar suas percepções e
comportamento.

Esses elementos incluem coisas que um usuário pode tocar (como produtos e embalagens
tangíveis), ouvir (comerciais e assinaturas de áudio) e até mesmo cheirar (o aroma de pão
recém-assado em uma lanchonete).

Inclui coisas com as quais os usuários podem interagir de maneiras que vão além do físico,
como interfaces digitais (websites e aplicativos para celulares) e, é claro, pessoas (representantes
de atendimento ao cliente, vendedores, amigos e familiares).

Um dos desenvolvimentos mais emocionantes dos últimos anos foi a capacidade de fundir os
elementos que afectam estes diferentes sentidos numa experiência mais rica e integrada. O
Smell-o-vision ainda está num futuro distante, mas por outro lado os produtos continuam a
confundir os limites tradicionais.

O QUE É DESIGN DE EXPERIÊNCIA DO USUÁRIO? 3


Machine Translated by Google

Não se esqueça do tangível


Embora estejamos nos concentrando nos aspectos digitais da experiência do
usuário, esses tipos de interações não ocorrem no vácuo. Certifique-se de considerar
os efeitos da experiência tangível ao projetar seus produtos digitais. O ambiente
em que seus usuários estão trabalhando é importante, assim como os produtos
físicos (telas, teclados e outros dispositivos de entrada) que afetam a maneira
como seus usuários interagirão com seu design. O Capítulo 6 oferece técnicas para
ajudá-lo a compreender o impacto do contexto.

Além disso, não se esqueça dos demais pontos de contato que um produto ou
empresa possui com quem com ele interage. Afinal, a marca da empresa é
afetada por muitas coisas, e a experiência da marca não termina na tela de um
computador ou de um celular. O melhor design possível de um site não pode
compensar a reputação de mau atendimento ao cliente ou proporcionar a satisfação
de uma embalagem bem projetada quando um produto é entregue.

Figura 1.1 Uma experiência moderna em sala de aula combina o analógico e o digital.

4 CAPÍTULO 1: O TAO DO UXD


Machine Translated by Google

Experiências tangíveis, como a aprendizagem em sala de aula, são cada vez mais
influenciadas por aplicações digitais. Da mesma forma, experiências que
antes eram individuais, como escolher qual aparelho de karaokê comprar em
casa, estão cada vez mais aprimoradas por meio da interação social.

Figura 1.2 As avaliações online são um grande influenciador dos consumidores.

Nosso foco
Como você pode ver, o escopo do design UX é grande e crescente. Para os
propósitos deste livro, nos concentraremos em projetos centrados no design de
experiências digitais – em particular, mídias interativas como sites e aplicativos
de software. Para ter sucesso, o design da experiência do usuário desses produtos
deve levar em consideração os objetivos de negócios do projeto, as necessidades
dos usuários do produto e quaisquer limitações que afetem a viabilidade dos
recursos do produto (como limitações técnicas ou restrições em torno do projeto).
orçamento ou prazo).

O QUE É DESIGN DE EXPERIÊNCIA DO USUÁRIO? 5


Machine Translated by Google

Amostras grátis de um novo Figura 1.3 Este livro


Uma maçaneta de porta barra nutricional distribuída em
enfoca os aspectos
uma maratona
digitais do design da
experiência do usuário.
Embalagem
por um par de
Tangível
sapato
Celular
recursos de mensagens de texto

Atendimento ao Cliente Individual Social


chamada telefónica

Nosso foco

Lendo análises de
produtos online
Digital
Procurando um
arquivo on-line
Atendimento ao Cliente
Bate-papo ao vivo
Visualizando segmentado
anúncio

Sobre designers de UX
Embora curiosidade, paixão e empatia sejam características compartilhadas pelos designers de
experiência do usuário, há também um desejo de alcançar o equilíbrio. Procuramos um equilíbrio,
principalmente entre lógica e emoção, como Spock e Kirk ou Data e Data naquele episódio em que
seu chip emocional sobrecarregou seus relés positrônicos.

Você entendeu a ideia.

Para criar experiências verdadeiramente memoráveis e satisfatórias, um designer UX precisa entender


como criar uma estrutura lógica e viável para a experiência e precisa entender os elementos que são
importantes para criar uma conexão emocional com os usuários do produto.

O saldo exato pode mudar de acordo com o produto. Uma campanha publicitária para um brinquedo
infantil terá um equilíbrio diferente de um aplicativo para rastrear informações de pacientes em um
hospital. Um produto projetado sem a compreensão da necessidade de ambos provavelmente perderá
oportunidades de uma experiência verdadeiramente memorável.
e os benefícios resultantes para a empresa por trás do produto.

Nota Para obter informações adicionais sobre design emocional, consulte Emotional Design:
Why We Love (or Hate) Everyday Things (Basic Books, 2005), de Donald Norman.

6 CAPÍTULO 1: O TAO DO UXD


Machine Translated by Google

Alcançar esse equilíbrio requer um elevado senso de empatia: a capacidade de mergulhar


no mundo dos usuários potenciais do produto para compreender suas necessidades e
motivações. Os designers de experiência do usuário realizam pesquisas para chegar a
esse entendimento (veja o Capítulo 6) e criam ferramentas como personas (veja o
Capítulo 7) para ajudar o restante da equipe do projeto a concentrar seus esforços.

Lembre-se de que a emoção é apenas uma parte do quadro geral. Use o lado lógico
para trazê-lo de volta do limite e manter sua mente concentrada nas tarefas em questão.
Na maioria dos casos, você trabalhará com um orçamento baseado no tempo e nos
materiais necessários para concluir o projeto. Você precisa entender que às vezes
você precisa pescar ou cortar iscas.

Onde vivem os designers de UX


Você não está sozinho nisso. Olhe ao seu redor e você encontrará diversas
organizações e comunidades que podem promover seu desenvolvimento como
designer de experiência do usuário. Além de oferecer listas de e-mail, recursos on-
line e um grande número de pessoas realmente inteligentes, muitas dessas
organizações patrocinam eventos ou conferências que podem ajudá-lo a ampliar seus
horizontes e estreitar seu foco profissional, tudo ao mesmo tempo. Várias empresas
organizam eventos voltados para fornecer educação continuada, incluindo o Web
App Summit e a User Interface Conference da User Interface Engineering, o Adaptive
Path's UX Intensive e a Usabilidade Week do Nielsen Norman Group. Há também um
número crescente de “desconferências” em diferentes cidades; estes são criados por
um conjunto de indivíduos motivados, independentes de qualquer empresa ou
associação específica.

ONDE VIVEM OS DESIGNERS UX 7


Machine Translated by Google

Várias organizações profissionais também patrocinam conferências anuais.


A Tabela 1.1 fornece uma pequena lista de algumas das organizações mais conhecidas, seus sites
e eventos que organizam.

TABELA 1.1 Uma amostra de organizações de experiência do usuário

ORGANIZAÇÃO LOCAL NA REDE INTERNET GRANDE CONFERÊNCIA


(TIPICAMENTE REALIZADO)

Design de interação www.ixda.org Interação (início de fevereiro)


Associação (IxDA)

A informação www.iainstitute.org Conferência IDÉIA

Instituto de Arquitetura (IAI) (Setembro Outubro)

Sociedade Americana para www.asis.org Cimeira IA (março)


Ciência da Informação e

Tecnologia (ASIS&T)

Interesse especial da ACM www.sigchi.org CHI (início de abril)


Grupo no computador-
Interação humana

(Suspiros)

Os Profissionais de Usabilidade www.usabilityprofessionals.org UPA (junho)


Associação

Vamos começar!
Você chegou até aqui. É hora de explicar o motivo pelo qual você comprou este livro. Vire a
página e mergulhe em como o design da experiência do usuário existe no âmbito dos projetos.

Mas não pare aí: este livro é um guia para você começar. Ele contém muitos exemplos que
podem ajudá-lo a realizar muitas das atividades que lhe serão atribuídas. Também tentamos
fornecer exemplos adicionais para ajudá-lo a expandir e encontrar sua melhor abordagem
para criar resultados que sejam úteis para sua equipe e seus clientes.

Mantenha viva sua curiosidade, paixão e empatia! Desafie-se a encontrar novas maneiras de
inspirar outras pessoas a construir a experiência de usuário ideal.

Isso, é claro, antes de você começar a melhorá-lo.

8 CAPÍTULO 1: O TAO DO UXD


Machine Translated by Google

2 O ecossistema do projeto
Planejando as necessidades do projeto,
Funções e Cultura

Você está prestes a iniciar um novo projeto? Ou você está


no meio de um? De qualquer forma, reserve um momento
para considerar a dinâmica e o contexto do projeto—
os problemas que afetarão você e o restante da equipe do
projeto. Que tipo de sites ou aplicativos estão envolvidos?
Quais funções e habilidades são necessárias? Qual é a cultura
da empresa? Responder a essas perguntas o ajudará a definir
o projeto e, em última análise, a determinar as ferramentas e
habilidades que você precisa trazer para o sucesso.

Carolyn Chandler

9
Machine Translated by Google

Cada
ouprojeto tem seus
aplicativos, próprios
muitos dessesdesafios únicos.
desafios Se você
envolverão estivereprojetando
recursos sites específicas,
funcionalidades
como a criação de um método para um usuário compartilhar fotos com amigos e familiares on-
line ou a reestruturação das informações em uma intranet para que o conteúdo possa ser
encontrado e compartilhado mais facilmente.

Em torno desses objetivos específicos de design, no entanto, todos os projetos têm um


contexto mais amplo que você precisa compreender e integrar ao seu planejamento. Esse
contexto é o “ecossistema” do projeto e inclui o ambiente em que você está trabalhando (a
cultura da empresa), o tipo geral de trabalho em que todos vocês estarão envolvidos (como o
tipo de site que você está projetando) e o pessoas com quem você interagirá (incluindo
suas funções e responsabilidades).

Se você dedicar algum tempo para entender o ecossistema do projeto, você terá conhecimentos
que o ajudarão durante todo o projeto. Você pode comunicar suas responsabilidades e ideias
de maneira mais eficaz e ajudar outras pessoas da equipe a antecipar necessidades do
projeto que talvez não tenham considerado.

Para ajudá-lo, este capítulo identifica diferentes tipos de projetos nos quais você pode trabalhar,
bem como as funções que você pode desempenhar, as pessoas de quem você pode
depender e como o envolvimento delas tende a variar de acordo com o tipo de site ou aplicativo
que está sendo projetado. Finalmente, o capítulo discute alguns elementos da cultura da
empresa que podem afetar a forma como você trabalha durante o projeto.

Nota Dependendo de como a empresa cliente estrutura seus projetos, um determinado


projeto pode envolver o design de mais de um site ou aplicação. Por uma questão de
simplicidade, este livro assume que um projeto envolve o design de um único tipo de local.
Se você tiver mais de um site, considere cada um separadamente para garantir que as funções
corretas estejam representadas na equipe do projeto.

Identifique o tipo de site


Embora não existam distinções claras entre um tipo de sítio e outro, algumas diferenças relativas
no foco e nas características do sítio são identificadas.
confiável. Compreender essas semelhanças e diferenças pode ajudá-lo

Defina metas de design para você mesmo. Estes são os problemas gerais que precisam ser
resolvidos (como “explicar o modelo de negócios da empresa”) ou os atributos que precisam
ser representados (como “demonstrar a capacidade de resposta da empresa aos seus
clientes”) dentro do design visual e design de interação do site.

10 CAPÍTULO 2: O ECOSSISTEMA DO PROJETO


Machine Translated by Google

Solidificar os objetivos principais do projeto (ver Capítulo 4).

Entenda quais departamentos ou unidades de negócios podem (ou deveriam) estar


envolvidos à medida que você reúne os requisitos de negócios (consulte o Capítulo 5).

Determine os melhores métodos para incorporar a pesquisa do usuário (ver Capítulo 6).

Faça perguntas sobre quais sistemas e tecnologias podem estar envolvidos.

Seu site provavelmente estará fortemente associado a um dos quatro tipos:

Presença da marca – plataforma online constantemente presente que facilita o


relacionamento entre a empresa e o público em geral (qualquer pessoa interessada em
seus produtos ou serviços)

Campanha de marketing – um site ou aplicativo direcionado destinado a ilícitar uma


resposta específica e mensurável de um público específico ou de um público geral durante
um período limitado de tempo

Fonte de conteúdo – um armazenamento de informações, potencialmente composto


por vários tipos de mídia (artigos, documentos, vídeos, fotos, tutoriais) destinados a
informar, envolver ou entreter os usuários.

Aplicativo baseado em tarefas – uma ferramenta ou coleção de ferramentas destinadas a permitir

que os usuários realizem um conjunto de tarefas ou fluxos de trabalho importantes

As próximas seções analisam mais detalhadamente cada um desses tipos, discutindo suas
características e o impacto que terão nos desafios durante o design do site ou aplicativo.
Também discutiremos os projetos cruzados mais comuns – comércio eletrônico, e-learning e redes
sociais – que possuem características de mais de um tipo.

Presença da marca
O que você pensa quando alguém diz a palavra marca? Muitas vezes, a primeira coisa que vem
à mente é o logotipo de uma empresa, como o Swoosh da Nike ou o emblema da Coca-Cola.
Porém, a marca de uma empresa é muito mais do que seu logotipo; é toda a série de impressões
que uma determinada pessoa tem sobre a empresa.

IDENTIFIQUE O TIPO DE SITE 11


Machine Translated by Google

Dirk Knemeyer apresenta algumas excelentes definições de marca em seu artigo


“Experiência da Marca e a Web”:
Marca representa as associações intelectuais e emocionais que as pessoas fazem com
uma empresa, produto ou pessoa… Ou seja, marca é algo que realmente está dentro
de cada um de nós.
A ciência do branding trata de projetar e influenciar as mentes das pessoas – em outras
palavras, construir a marca.

Surfar
Para obter mais informações sobre as distinções entre a experiência de um
cliente com a marca de uma empresa e os esforços de uma empresa para construir sua
marca, leia a explicação de Dirk Knemeyer em “Brand Experience and the Web”:
www.digital-web.com/articles/brand_ Experience_and_the_web.

Para uma excelente discussão sobre como o design UX de um site pode influenciar a
experiência de marca de um indivíduo, leia o artigo de Steve Baty “Brand Experience in
User Experience Design”: www.uxmatters.com/MT/archives/000111.php.

Uma empresa pode fazer muito para influenciar as associações feitas com a sua marca, desde a
realização de campanhas publicitárias memoráveis até à expressão de características da marca
(como “capacidade de resposta” ou “valor”) através das características e design dos seus websites.

Todos os sites dentro de uma empresa provavelmente terão algum impacto na marca da
empresa, seja diretamente (apresentando um site que os clientes possam visitar) ou
indiretamente (permitindo um serviço importante no qual os clientes confiam, como o suporte ao
cliente). Os sites de presença de marca, entretanto, são os mais focados em apresentar as
mensagens e valores da marca da empresa. Eles fornecem canais que interagem diretamente com
os clientes e funcionam como um amplo funil online para aqueles interessados em saber mais
sobre a empresa ou suas ofertas.

Um site de presença de marca geralmente é o site .com ou .org principal da empresa, como GE.com,
ou, para empresas maiores e mais distribuídas, são os sites principais para unidades de negócios
de tamanhos variados, como GEhealthcare.com. Distinto
as linhas de produtos também costumam ter presença on-line de marca própria e exclusiva. Por
exemplo, Pepsico.com tem presença de uma marca, enquanto Pepsi.com tem sua própria presença
distinta.

12 CAPÍTULO 2: O ECOSSISTEMA DO PROJETO


Machine Translated by Google

Se você estiver trabalhando em um site de presença de marca, provavelmente estará projetando


para uma variedade de grupos de usuários, incluindo clientes atuais e potenciais, investidores,
parceiros, mídia (como organizações de notícias e autores de blogs importantes) e empregos.
buscadores.

Sites comuns de presença de marca

O site principal de uma empresa (empresa.com, empresa.org, empresa.net, etc.)

Um site para uma unidade de negócios principal da empresa (geralmente um site exclusivo para
um determinado setor, região ou grande conjunto de produtos)

Sites de submarcas proeminentes dentro de uma empresa

Metas de design de presença de marca

Os objetivos de design que costumam ser de maior importância em um projeto de presença de


marca são estes:

Comunique os valores e as mensagens da marca da empresa, seja explicitamente (talvez


uma declaração sobre a importância dada à resposta às necessidades do cliente) ou através da
experiência geral ao entrar no site (como garantir que ele tenha um bom desempenho e
ofereça recursos de destaque que incentivem clientes para se comunicarem com a empresa).

Fornece acesso rápido e fácil às informações da empresa. Você deseja responder às


perguntas “O que a empresa faz?” e “Como entro em contato com alguém para obter mais
informações?”

Apresentar ou explicar o modelo de negócio e proposta de valor da empresa: “O que a empresa


pode fazer por mim?” e “Como a empresa faz isso?”

Envolva um conjunto de grupos de usuários primários e oriente-os para interações,


funcionalidades ou conteúdos relevantes.

Ajude a empresa a atingir as metas definidas em relação às principais métricas, como o


número de visitantes únicos. Freqüentemente, isso faz parte de uma estratégia geral de
marketing.

Posteriormente, na seção “Escolha seus chapéus”, você aprenderá as diversas funções que
podem estar envolvidas no design de um site de presença de marca. Por enquanto, vamos dar uma olhada

IDENTIFIQUE O TIPO DE SITE 13


Machine Translated by Google

nos outros tipos de sites em que você pode trabalhar, incluindo aquele que tem um
relacionamento próximo com sites de presença de marca: o site de campanha de marketing.

Campanha de Marketing
Os sites de campanhas de marketing são semelhantes aos sites de presença de marca, pois
ambos se concentram em envolver os usuários com uma experiência que influencia sua
percepção da marca da empresa. Os sites de campanhas de marketing, no entanto, tendem a
ser avaliados quanto à sua capacidade de realizar ações muito específicas dentro de um foco
definido (como dentro de um determinado período de tempo ou com um público-alvo). Em
vez de servirem como um funil para canalizar o interesse, eles pretendem ser os motores
que geram interesse. Do ponto de vista on-line, isso geralmente significa que eles estão
alinhados com uma estratégia geral de marketing e podem ser executados em conjunto com
outros esforços de marketing usando canais diferentes, como comerciais de TV ou rádio,
anúncios impressos e outras promoções.

Sites comuns de campanhas de marketing

Uma landing page que promove uma oferta específica. A página é acessada por meio de
um banner de outra página.

Um pequeno site (ou microsite) que promove um determinado evento.

Um jogo ou ferramenta criada com o propósito de gerar buzz ou tráfego.

O objetivo principal de um site de campanha de marketing é criar uma campanha com foco
restrito , geralmente visando um conjunto específico de métricas. O foco é frequentemente
limitado por um ou mais dos seguintes:

Tempo – por exemplo, uma campanha centrada em um evento (como uma conferência)
ou uma temporada (como a temporada de compras de Natal)

Grupo de usuários – como uma campanha direcionada a adolescentes ou professores

Produto, conjunto de produtos e/ou uso específico desse produto — por exemplo,
um site que destaca eletrodomésticos de cozinha mostrando cozinhas virtuais com fornos,
lava-louças e fogões correspondentes

14 CAPÍTULO 2: O ECOSSISTEMA DO PROJETO


Machine Translated by Google

Uma campanha que utilizasse uma combinação dessas estratégias seria uma campanha de
primavera direcionada à venda de equipamentos para pátios, combinando tempo e conjunto de produtos. Ver
A Figura 2.1 mostra um exemplo que mostra uma combinação de conjunto de produtos e grupo de usuários.

Um site de campanha de marketing pode ser tão simples quanto um banner que leva a uma página
de destino no site .com da empresa, ou pode ser um microsite, um site pequeno que muitas vezes se
desvia da marca aparente no site .com para fornecer um experiência personalizada de acordo com
uma ou mais áreas de foco. “Pequeno” é relativo aqui – alguns microsites têm apenas uma
página e outros têm muitas, mas de qualquer forma o microsite é menor e mais focado do que o principal
site de presença da marca da empresa.

Figura 2.1 A Texas Instruments usa este microsite com foco em educação, http:// timathrocks.com/
index.php, para apresentar informações sobre as calculadoras gráficas da empresa. O conjunto de produtos
é usado principalmente por estudantes do ensino médio e universitários em aulas de álgebra. O microsite
mantém laços gerais com a marca Texas Instruments, mas é intencionalmente distinto para atrair um
público mais jovem e organizar conteúdos e funcionalidades de acordo com suas necessidades.

Metas de design de campanha de marketing

Para a pessoa ou equipe responsável por projetar e implementar um site de campanha de marketing, os
objetivos de design que geralmente são de maior importância são estes:

Gerar interesse e entusiasmo, muitas vezes apresentando uma proposta de valor clara e imediata
(o valor que um produto ou serviço traz ao usuário, como a possibilidade de qualificação rápida de
empréstimo) ou algum tipo de incentivo (uma oferta especial, entrada em um concurso ou
entretenimento, como um jogo online).

IDENTIFIQUE O TIPO DE SITE 15


Machine Translated by Google

Envolva um conjunto de grupos de usuários primários para ilícitar uma ação específica,
como clicar em um local específico em um site de presença de marca, inscrever-se para
receber um boletim informativo ou solicitar um empréstimo. Quando esta ação é
executada por um usuário, ela é chamada de conversão.

Ajude a empresa a atingir as metas definidas em relação às principais métricas, como o


número de visitantes únicos. Freqüentemente, isso faz parte de uma estratégia geral de marketing.

Mergulho Profundo

Para obter mais informações sobre como criar páginas para apoiar campanhas de marketing, consulte

Otimização da página de destino: o guia definitivo para testes e ajustes para conversão, por Tim Ash (Sybex, 2008).

Origem do conteúdo
Um site de fonte de conteúdo contém um armazenamento de informações, potencialmente em
vários tipos de mídia (artigos, documentos, vídeos, fotos, tutoriais), e tem como objetivo informar,
envolver e/ou entreter os usuários.

Sites de fontes de conteúdo comuns

Intranet de uma empresa

Uma biblioteca online ou centro de recursos para membros de uma organização

Sites ou áreas de sites focados em fornecer notícias ou postagens atualizadas com


frequência (grandes blogs comerciais podem se enquadrar nesta categoria)

Centros de suporte ao cliente

Todos os sites e aplicativos possuem algum conteúdo, é claro, mas alguns sites dão ênfase
especial à apresentação e estrutura de seu conteúdo.
A ênfase pode surgir porque o site tem uma quantidade tão grande de conteúdo que representa
seu próprio desafio ou porque tipos específicos de conteúdo têm um alto grau de importância;
eles podem, por exemplo, apoiar decisões críticas ou atrair usuários de volta ao site com
frequência.

16 CAPÍTULO 2: O ECOSSISTEMA DO PROJETO


Machine Translated by Google

O objetivo principal de um site fonte de conteúdo é aumentar o conhecimento e a autossuficiência do


usuário, fornecendo conteúdo relevante (uma intranet, por exemplo).
Muitas vezes também incentivam algum tipo de ação, como compartilhar informações ou comprar um
produto após revisar sua descrição.

Metas de design de fonte de conteúdo

Um site de origem de conteúdo geralmente precisa executar um ou mais dos seguintes procedimentos:

Apresente conteúdo que seja o principal atrativo para as primeiras e repetidas visitas ao site.

Demonstre as capacidades de liderança inovadora de uma empresa, por exemplo, fornecendo


acesso a ideias e perspectivas do CEO ou de outros especialistas no assunto da empresa.

Apoie decisões críticas entre a base de usuários.

Aumente o conhecimento empresarial de uma empresa, trazendo à tona ideias que podem estar
enterradas em departamentos individuais. Isto pode ser parte de um objetivo maior de identificar
mais oportunidades de inovação.

Apoie os usuários que buscam informações de diferentes maneiras. Por exemplo, alguns ainda não
sabem de que produto específico precisam (e são mais propensos a navegar), enquanto outros podem
saber exatamente o que procuram (e são mais propensos a usar um campo de pesquisa).

Surfar
Para obter mais informações sobre as diferentes maneiras pelas quais os usuários tendem a buscar informações

Para isso, leia “Quatro modos de busca de informações e como projetar para eles”, de Donna
Spencer: http://boxesandarrows.com/view/four_modes_of_seeking_

informações_e_como_projetar_para_eles

Com relação ao design UX, algumas das tarefas mais comuns em um projeto de fonte de conteúdo são:

Criando uma estrutura de categorização que se adapte aos modelos mentais de seus usuários

Determinar como incorporar um sistema para crescimento orgânico de conteúdo (por exemplo,
funções como marcação e filtragem)

Projetando uma ferramenta de pesquisa eficaz

IDENTIFIQUE O TIPO DE SITE 17


Machine Translated by Google

Aplicativos baseados em tarefas


Os aplicativos baseados em tarefas podem variar desde uma simples calculadora incorporada em um
site de hipoteca até um sistema completo que lida com vários fluxos de trabalho críticos. Se o seu
projeto envolver este último, haverá mais funções envolvidas e, muito provavelmente, um processo
substancial de coleta de requisitos (para saber mais sobre esse processo, consulte o Capítulo 5).

Aplicativos comuns baseados em tarefas

Um aplicativo de software que suporta a criação de um tipo específico de item (como uma planilha
ou peça impressa)

Uma ferramenta ou aplicativo da Web que oferece suporte a um fluxo de trabalho crítico dentro de

uma empresa (como um aplicativo de gerenciamento de tickets para um grupo de suporte de TI ou um


aplicativo de rastreamento de clientes para uma central de atendimento)

Um site que permite acesso e gerenciamento de dados pessoais (como o Flickr)

O objetivo principal de uma aplicação baseada em tarefas é permitir que os usuários executem um
conjunto de tarefas alinhadas às suas necessidades e, em última análise, aos objetivos de negócios do
cliente.

Metas de design de aplicativos baseados em tarefas

A maioria dos aplicativos baseados em tarefas precisa

Permita que os usuários façam algo que não poderiam fazer em outro lugar – ou, se puderem, que
façam melhor (“melhor” pode significar de forma mais eficiente, mais eficaz, com maior grau de
satisfação ou mais conveniente)

Apoie usuários novatos com instruções de fácil acesso e priorização visual das principais tarefas

Dê suporte a usuários intermediários e avançados com acesso a recursos de atalho e funcionalidades

mais profundas

Reduza a carga do usuário e faça o melhor uso dos recursos do sistema (por exemplo, reutilizando
dados em vez de exigir entradas duplicadas)

18 CAPÍTULO 2: O ECOSSISTEMA DO PROJETO


Machine Translated by Google

Ser projetado e implantado com atenção ao grau de mudança exigido dos usuários do
aplicativo – de preferência, com um design que facilite o aprendizado e um plano de
comunicação que demonstre o valor para o usuário

Um dos maiores desafios de projetar um aplicativo baseado em tarefas é manter o “aumento


de recursos” sob controle. À medida que um projeto está sendo desenvolvido é muito comum
que grandes ideias surjam em fases posteriores do design, ou mesmo durante o
desenvolvimento. O design da experiência do usuário é adequado para proteger contra
o aumento de recursos porque modelos de usuário, como personas, podem ser usados para
identificar recursos de alto valor e manter o foco durante todo o projeto.

Se uma ideia realmente excelente surgir mais tarde no processo, atender às necessidades de um
grupo de usuários de alta prioridade e estiver alinhada com os objetivos de negócios do site, sua
equipe poderá construir um caso para mudar de direção. Se uma ideia não passar por esse
espremedor, pode não valer a pena o atraso e o custo.

Sites de comércio eletrônico

Os sites de comércio eletrônico podem incluir elementos de todos os quatro tipos de projeto,
porque um site destinado principalmente ao comércio eletrônico precisa ter presença de marca
própria, fornecer conteúdo (geralmente especificações de produtos ou descrições de uso do
produto) e facilitar tarefas (pesquisar , comparando, escrevendo comentários, finalizando a compra).
As campanhas de marketing também costumam estar intimamente ligadas a esses sites e
podem envolver vários grupos de marketing dentro da organização.

Metas de design adicionais comuns para sites de comércio eletrônico são

Explique o modelo do site, se não for padrão. Como os mercados online estão
constantemente a ser reconcebidos, esta explicação ajudará a definir expectativas (por
exemplo, eBay, Amazon e Craigslist têm modelos muito diferentes).

Apoie a tomada de decisões à medida que o usuário passa do aprendizado à


consideração, da comparação à compra, com conteúdo e recursos úteis.

Aproveite os pontos da experiência onde a venda cruzada e o upsell são possíveis e


coloque essas sugestões de uma forma que chame a atenção, sem ser perturbadora.

Crie um fluxo de comunicação desde o ponto de compra até o ponto de entrega. A


comunicação precisa acontecer não apenas dentro do site, mas também com outros canais,
como integração com sistemas de rastreamento de entrega e comunicações por e-mail
sobre o status do pedido.

IDENTIFIQUE O TIPO DE SITE 19


Machine Translated by Google

Aplicativos de e-learning
Os aplicativos de e-learning são cruzamentos entre uma fonte de conteúdo e um aplicativo
baseado em tarefas. O conteúdo das aulas deve ser gerado, o que muitas vezes exige que a equipe
adicione as funções de especialista em aprendizagem e especialista no assunto (SME) para o
tópico que está sendo abordado. O produto é baseado em tarefas, pois o usuário geralmente
segue um fluxo durante a aula e também pode precisar acompanhar o progresso ou explorar tópicos
relacionados. Algumas aulas práticas também podem exigir a conclusão de tarefas.

Os objetivos comuns de design são

Defina uma compreensão do conhecimento básico necessário para iniciar um curso e a quem ele
se destina.

Forneça conteúdo em partes gerenciáveis e com ritmo de compreensão.

Envolva o aluno em atividades que simulem o aprendizado prático.

Comunique o desempenho e o progresso e, se for o caso, sugira os próximos passos para


continuar o processo educacional, como mais
cursos avançados.

Aplicativos de redes sociais


Um aplicativo de rede social é principalmente um aplicativo baseado em tarefas, porque os usuários
precisam ser capazes de encontrar e adicionar amigos, gerenciar seus perfis, conectar-se,
postar e pesquisar. No entanto, eles também contêm desafios associados às fontes de conteúdo,
especialmente a necessidade de uma estrutura orgânica que possa lidar com uma quantidade
potencialmente muito grande de conteúdo gerado pelo usuário. Se o site tiver essencialmente uma
identidade própria, também terá as características de um site de presença de marca.

Mergulho com snorkel

Se você estiver trabalhando em um aplicativo de rede social ou tentando integrar


recursos sociais em outro tipo de site, este livro irá ajudá-lo em seu caminho:
Designing for the Social Web, de Joshua Porter (New Riders, 2008).

20 CAPÍTULO 2: O ECOSSISTEMA DO PROJETO


Machine Translated by Google

Os objetivos comuns de design para aplicativos de redes sociais são

Concentre os usuários potenciais no propósito e nos valores da rede.

Facilite interações significativas entre usuários que suportam e são apoiados pelos
recursos apresentados (como compartilhamento de imagens, compartilhamento de vídeos
e discussões).

Proteja a integridade do site garantindo que todos na rede entendam como controlar suas
informações e responder a comportamentos inadequados.

Aproveite e exiba o poder da comunidade para apresentar recursos que só são possíveis
com membros ativos, como recursos populares
e comentários.

Identificar o tipo de site ou aplicativo em que você estará trabalhando durante um projeto é
apenas o primeiro passo. Em seguida, você deve considerar as diferentes funções que muitas
vezes são necessárias e como o seu envolvimento pode variar com base no tipo de projeto.

Escolha seus chapéus


Quando você se torna o designer UX de um projeto, muitas vezes acaba tendo que desempenhar
diversas funções. Quer estejam formalmente definidos dentro da organização do seu cliente
ou não, os papéis que você desempenhará dependem do tipo de projeto e da composição do
restante da equipe, bem como da experiência do cliente com cada um. É bom saber quais funções
você já se sente confortável em assumir e quais você acha que pode aprender no trabalho.
Também é útil descobrir quais expectativas os outros podem ter sobre as responsabilidades
abrangidas por essas funções. Com esse entendimento, você poderá se representar com mais
clareza desde o início do projeto.

Quais são as funções mais comuns esperadas de um designer UX? Cada empresa cliente para
a qual você trabalha pode ter cargos diferentes para essas funções (ou nenhum nome, se não
for um cargo formal na organização). Em geral, você pode esperar encontrar os três grandes:
arquiteto de informação, designer de interação e pesquisador de usuários.

Observação Poucas empresas têm tamanho ou orçamento para dividir essas funções comuns entre
diferentes indivíduos. Tenha em mente os nomes das funções ao definir um projeto, mas fale em termos
de necessidades e responsabilidades ao falar com o cliente - caso contrário, eles podem pensar que
você está construindo uma equipe muito grande! Esse foco nas responsabilidades, em vez dos títulos,
também ajudará a mantê-lo são: se você estiver desempenhando várias dessas funções, isso não
significa necessariamente que esteja fazendo o trabalho de muitas pessoas, porque as
responsabilidades vão e vêm através de diferentes partes. do projeto.

ESCOLHA SEUS CHAPÉUS 21


Machine Translated by Google

Arquiteto de Informação
Um arquiteto de informação é responsável por criar modelos para estrutura de informação e
usá-los para projetar navegação amigável e categorização de conteúdo. Durante o design
de sites e aplicativos, as responsabilidades comuns incluem a criação de mapas detalhados do
site (discutidos no Capítulo 10) e a garantia de que as categorias e subcategorias de
informações sejam distintas e fáceis de usar.

Compreendendo as expectativas

Dentro do campo UX, são feitas distinções entre as funções do arquiteto de informação e do
designer de interação (discutido a seguir). Numa determinada empresa, contudo, raramente
existe uma distinção comum entre as duas funções, pelo menos quando se trata do que é
declarado como uma necessidade para um determinado projecto. Por exemplo, você pode
acabar em uma equipe com o título de arquiteto de informação porque esse é o termo histórico
para a função, independentemente de isso realmente se adequar ou não às suas
responsabilidades.

Você deveria corrigir a equipe do projeto se o título que você recebeu não corresponde à
função principal que você está assumindo? Se este for um projeto de curto prazo (digamos,
quatro meses ou menos) e o título que você possui for amplamente aceito dentro da
organização, com responsabilidades claras delineadas, pode não valer a pena a confusão
potencial que você estaria introduzindo. tente mudar isso. Entretanto, se não houver um título
amplamente aceito e você achar que há uma chance de precisar que ambos os papéis
sejam representados – potencialmente por pessoas diferentes – então vale a pena fazer
uma distinção no início do projeto, quando estiver planejando seu envolvimento. e comunicar
suas responsabilidades.

Essencialmente, para aplicações mais baseadas em tarefas faz sentido enfatizar o papel do
designer de interação, e para projetos mais baseados em conteúdo faz sentido enfatizar
o papel do arquiteto de informação. Mas o que pode fazer mais sentido é usar o termo familiar
à organização do cliente e garantir que a equipe entenda como você está definindo a
função em relação às responsabilidades que está assumindo. Essa definição é algo que você
deseja deixar claro na declaração de trabalho (veja o Capítulo 3).

As responsabilidades de um arquiteto de informação também podem se confundir com as


de um estrategista de conteúdo (veja abaixo, em “Outras funções”). Se esses papéis forem

22 CAPÍTULO 2: O ECOSSISTEMA DO PROJETO


Machine Translated by Google

representado por diferentes pessoas na equipe do projeto, não deixe de discutir como você
colaborará no início do projeto.

Designer de interação
Um designer de interação é responsável por definir o comportamento de um site ou aplicação
de acordo com as ações do usuário. Isso inclui fluxos no site em diversas visualizações e
interatividade em uma visualização específica. Durante o design de sites ou aplicativos, as
atividades comuns são criar fluxos de tarefas que mostram a interação entre páginas ou
componentes do site (consulte o Capítulo 10) e criar wireframes que mostram interações na
página, como menus dinâmicos e áreas expansíveis de conteúdo (consulte o Capítulo 11).

Compreendendo as expectativas

Se você estiver trabalhando em uma equipe pequena ou em um projeto que não esteja altamente
focado na criação de novas funcionalidades baseadas em tarefas (por exemplo, se estiver
trabalhando em um site de presença de marca que inclui principalmente algumas categorias de
conteúdo, um formulário de contato , e um formulário de inscrição para um boletim informativo)
o designer de interação pode ser o principal responsável por capturar os requisitos do projeto (ver Capítulo 5).

Se você estiver trabalhando como designer de interação em um projeto com um alto nível de novas
funcionalidades, provavelmente terá uma pessoa separada na equipe responsável por delinear
os requisitos detalhados (por exemplo, um analista de negócios ou gerente de produto). O processo
de coleta e detalhamento de requisitos funcionais pode ser muito auxiliado pelas habilidades de
um designer de UX, e documentos como especificações funcionais e casos de uso são afetados
pelo design de experiência. Certifique-se de conversar com a pessoa responsável pela coleta
de requisitos para discutir como vocês podem trabalhar melhor juntos.

Pesquisador de usuários

Um pesquisador de usuários é responsável por fornecer insights sobre as necessidades dos


usuários finais, com base nas informações geradas ou validadas com a pesquisa que essa pessoa
conduz com os usuários. Existem muitos tipos de atividades que podem se enquadrar na categoria
de pesquisa de usuários e podem ocorrer em vários pontos do cronograma do projeto. (Veja o
Capítulo 6 para uma descrição de técnicas comuns, como entrevistas com usuários, pesquisas
e testes de usabilidade.)

ESCOLHA SEUS CHAPÉUS 23


Machine Translated by Google

Compreendendo as expectativas

O apetite da empresa cliente pela pesquisa de usuários pode variar imensamente, com
base na importância atribuída a ela pela equipe do projeto ou pelo patrocinador do projeto.
O fato de você estar conversando com um patrocinador do projeto sobre design UX antes
do início do projeto mostra que alguém da equipe do cliente sabe que é uma prioridade
garantir que as necessidades do usuário sejam representadas. Mas, como sabem aqueles
que trabalharam em sua parcela de projetos baseados em computador, a introdução da
pesquisa também pode gerar ansiedade entre os membros da equipe do projeto –
desencadeada pela preocupação de que a pesquisa do usuário criará um gargalo,
aumentará o risco (e se encontrarmos algo errado, e precisa fazer grandes mudanças para
corrigi-lo?) ou refutar o valor de uma ideia específica que ganhou muito impulso. As
expectativas para a pesquisa do usuário podem variar entre as partes interessadas do
negócio e a equipe do projeto, portanto, certifique-se de esclarecer as expectativas para a função com ambos o

O cliente também pode esperar que o pesquisador do usuário forneça insights baseados
em análises do site – ferramentas e relatórios que comunicam padrões de uso do site,
como páginas visitadas com frequência e pontos comuns onde os usuários saem do site.
Algumas das ferramentas analíticas mais comuns são do Google (www.google.com/
analytics), WebTrends (www.webtrends.com) e Omni-ture (www.omniture.com/en/products/
web_analytics).

Você pode acabar assumindo essas três funções: arquiteto de informação, designer de
interação e pesquisador de usuários. Você consegue equilibrar os três ou está mordendo
mais do que pode mastigar? Em parte, isso depende do tamanho e do cronograma do projeto,
mas o tipo de projeto também tem impacto no grau de envolvimento que cada função
provavelmente terá. A Tabela 2.1 descreve como as funções de design UX podem variar
de acordo com o tipo de projeto.

Surfar
Precisa defender o design UX? Esses artigos oferecem abordagens
que pode ajudar:
“User Experience as Corporate Imperative”, de Mir Haynes:
www.hesketh.com/publications/user_experience.pdf
“Evangelizando o design da experiência do usuário com dez dólares por dia”, por Louis Rosenfeld:
http://louisrosenfeld.com/home/bloug_archive/000131.html

24 CAPÍTULO 2: O ECOSSISTEMA DO PROJETO


Machine Translated by Google

TABELA 2.1 Responsabilidades comuns da função de design UX

PRESENÇA DA MARCA MARKETING FONTE DE CONTEÚDO BASEADA EM TAREFAS


CAMPANHA APLICATIVO

Informação Médio Baixo envolvimento Envolvimento muito alto. Envolvimento médio


Arquiteto envolvimento. para sites menores As fontes de a alto,
(como uma única conteúdo exigem uma focado principalmente
Quanto maior o
landing page). Médio arquitetura de na criação da
desafio do conteúdo, mais
envolvimento se informação que tenha estrutura de navegação,
parecido com uma
estiver trabalhando com um equilíbrio apropriado a menos que haja áreas
fonte de conteúdo o
microsites maiores. entre estrutura e de conteúdo maiores que
projeto se tornará.
flexibilidade, para fornecer precisem ser
aos usuários uma referenciadas durante
base sólida e permitir o alguns fluxos de
crescimento planejado. trabalho.

Meio de Design de Interação Baixo envolvimento Envolvimento médio Envolvimento muito alto.
envolvimento. para sites menores, a alto. Esse tipo de projeto
envolvimento médio a geralmente exige o
Quanto maior o Os recursos de
alto para microsites trabalho mais pesado, já
número de tarefas, pesquisa, marcação
mais parecido com maiores ou advergames e filtragem cruzam a linha que os resultados do
(jogos online patrocinados entre a arquitetura da design de interação (como
um aplicativo baseado em
destinados a gerar diversão fluxos de processos
tarefas o projeto se tornará. informação e o design
e agitação). de interação. As do usuário e wireframes)
são essenciais para a
fontes de conteúdo
comunicação visual dos
também podem ter
fluxos de trabalho requisitos.

envolvendo criação
e gerenciamento de
conteúdo.

Pesquisador de usuários Esforços de pesquisa Devido à natureza A pesquisa de Pesquisas de


pode se concentrar muitas vezes temporária campo, como a investigação campo, como
O envolvimento variará
na compreensão das campanhas, o contextual, pode ajudar a pesquisas contextuais,
com base no orçamento
necessidades de envolvimento do equipe a compreender podem ser feitas para
e no acesso aos usuários.
grupos de usuários usuário costuma ser como diferentes usuários compreender as tarefas
Listadas aqui estão
técnicas comuns para prioritários (através de leve. Soluções mais trabalham atualmente com à medida que os usuários
pesquisas ou permanentes a informação. as estão concluindo. A
cada tipo de projeto.
entrevistas) ou podem utilizar técnica mais
Para obter mais A classificação de
pesquisas de design pesquisas semelhantes frequentemente
informações sobre cada cartões é uma
que testam a eficácia de às de sites de presença
uma dessas técnicas, excelente maneira de entender usada
como e mais bem
um design visual específico de marca. Também é compreendida para
consulte o Capítulo 6. seus usuários podem
na transmissão da comum usar ferramentas envolver os usuários no
agrupar informações e
mensagem correta da marca. analíticas para apresentar projeto de uma
padrões e modelos
duas ou mais variações de aplicação baseada em
mentais comuns.
uma determinada página tarefas, entretanto, é o teste de
para ver qual delas
leva a mais conversões. Uma vez que um quadro-

Isso é chamado de A/ B o trabalho foi definido, os


testando. testes de usabilidade
podem validar a
estrutura.

ESCOLHA SEUS CHAPÉUS 25


Machine Translated by Google

Outras funções que você pode desempenhar ou precisar


Várias funções normalmente não se enquadram na função de designer de UX, mas suas
responsabilidades geralmente se sobrepõem à função de design de UX - especialmente se você
estiver trabalhando em um projeto em que ninguém desempenha oficialmente a função e você tiver
habilidades para trazer para o mesa.

Algumas das funções sobrepostas mais comuns incluem:

Estrategista ou administrador de marca

Analista de negócios

Estrategista de conteúdo

Copiadora

Designer visual

Desenvolvedor front-end

As seções a seguir analisam cada uma dessas funções com mais detalhes e discutem como elas podem
variar dependendo do tipo de site que está sendo projetado.

Estrategista de marca e administrador de marca

Um estrategista de marca é responsável por construir um relacionamento com os principais mercados


por meio da definição e representação consistente dos elementos da marca da empresa, que podem
incluir qualquer coisa, desde valores da marca (como “capacidade de resposta”) até diretrizes para texto
e mensagens até especificações. para tratamentos de logotipo, cores e layout. Essa função
geralmente envolve a criação ou representação de diretrizes de marca e a compreensão de como elas
se aplicam a diferentes projetos. Também pode envolver conhecer ou definir os públicos-alvo importantes
no projeto em que você está trabalhando. Na maioria das vezes, você provavelmente trabalhará com
um estrategista de marca, mas não assumirá a responsabilidade.

O administrador da marca não define necessariamente as diretrizes, mas é responsável por garantir que
elas sejam seguidas de forma adequada durante o projeto. Essa responsabilidade pode ser atribuída ao
designer UX ou ao designer visual de um projeto.

Se os atributos, valores e diretrizes da marca da empresa já estiverem bem definidos e se espera que
o site os siga, seu papel como administrador da marca do projeto será principalmente garantir que o
resultado esteja alinhado com essas diretrizes. Seu ponto de contato fora do projeto provavelmente
seria um

26 CAPÍTULO 2: O ECOSSISTEMA DO PROJETO


Machine Translated by Google

membro do departamento de marketing que está disponível em caráter consultivo ou


base de revisão, mas não está na equipe em tempo integral.

A função de administrador da marca pode ser mais ativa se o objetivo do site for ampliar a
marca de alguma forma – visando um novo mercado, por exemplo. Está mais envolvido
quando uma presença de marca completamente nova está sendo criada ou quando a
empresa está fazendo uma mudança drástica em sua marca, reformulando-se efetivamente.
Por exemplo, a CellularOne mudou completamente de nome para se tornar Cingular, um
grande esforço para uma empresa estabelecida. Nessa situação, você deve ter muita
experiência em desenvolvimento de marca ou estabelecer um relacionamento claro e
próximo com a pessoa da empresa que o possui.

Perguntas-chave que ajudarão você a entender as expectativas em torno de uma marca


funções relacionadas são estas:

Já existem diretrizes de marca?

Em caso afirmativo, até que ponto eles precisam ser respeitados neste projeto?

Quem é responsável por definir ou manter a mensagem da marca, a aparência da


marca e o tom do conteúdo (como casual ou profissional)?

Serão direcionados novos públicos que não são cobertos pelas definições de marca
anteriores? Em caso afirmativo, quem é responsável por garantir que as diretrizes da
marca ainda sejam adequadas a esses públicos?

Haverá atividades de nomeação ou renomeação? Se sim, como devo planejar meu


envolvimento? (Um exemplo seria criar um nome para uma nova ferramenta que será
fortemente promovida.)

Para projetos que não têm um grande impacto potencial na percepção da marca pelos
clientes, como o desenvolvimento de uma aplicação interna, o envolvimento do administrador
da marca pode ser tão leve quanto um check-in ocasional para garantir que a marca está bem.
representado.

Analista de negócios

Um analista de negócios (às vezes chamado de analista de sistemas de negócios em TI


projetos) é responsável por identificar as principais partes interessadas do negócio, conduzir
o processo de coleta de requisitos (consulte o Capítulo 5) e servir como o principal elo de
ligação entre as partes interessadas do negócio e a equipe de tecnologia. Ele ou ela
também é o proprietário principal da documentação detalhada dos requisitos, como
especificações funcionais e casos de uso, se necessário.

ESCOLHA SEUS CHAPÉUS 27


Machine Translated by Google

A função de analista de negócios ou gerente de produto pode não existir em seu projeto ou
pode ser uma das funções mais importantes durante o processo de design. Aplicativos baseados em
tarefas e fontes de conteúdo geralmente desempenham esse tipo de função; projetos de presença
de marca e campanhas de marketing não podem. É mais provável que um aplicativo baseado em
tarefas precise dessa função. Quanto mais recursos e maior a complexidade do projeto,
maiores serão as necessidades de pessoa dedicada e de documentação de funcionalidades.

Embora um analista de negócios normalmente não seja considerado um membro da equipe


de UX, pequenas equipes de UX são frequentemente solicitadas a preencher a função, por isso é
importante entender onde estão essas responsabilidades. Os analistas de negócios conduzem a
captura dos requisitos de negócios, servindo como elo de ligação entre a equipe de tecnologia e as
principais partes interessadas do negócio. Se houver um analista de negócios em um projeto,
essa pessoa e o designer de interação geralmente estarão unidos.
Se for a mesma função, o responsável pode ter muita documentação para acompanhar!

Para entender as expectativas nesta área, pergunte quem será responsável por delinear o escopo
do projeto, facilitar as discussões em torno dos requisitos e documentar os requisitos ao longo
do projeto. Para projetos pequenos ou que não possuem muitas funcionalidades, o gerente de
projeto às vezes assume essas responsabilidades. De qualquer forma, se não for você, você
ainda saberá de quem precisa ficar próximo para garantir que seus resultados estejam sincronizados.

Estrategista de conteúdo

Um estrategista de conteúdo é responsável por compreender os requisitos de negócios e


usuários para conteúdo em diversas mídias (artigos, documentos, fotos e vídeos), identificando
lacunas no conteúdo existente e facilitando o fluxo de trabalho e o desenvolvimento de novos
conteúdos.

Os esforços relacionados ao conteúdo são frequentemente subestimados. Um cliente pode ter


uma grande quantidade de conteúdo maravilhoso em um único meio (como folhetos impressos ou
vídeos), mas esse conteúdo pode não ser apropriado para o projeto em que você está
trabalhando. Além disso, às vezes há expectativas tácitas de que as pessoas dentro da
organização do cliente irão gerar conteúdo – expectativas que podem ser uma surpresa para essas
pessoas quando chegar a hora de preencher seu produto com descrições, notícias e tópicos de
ajuda! Se conteúdo de alta qualidade é um

28 CAPÍTULO 2: O ECOSSISTEMA DO PROJETO


Machine Translated by Google

principal impulsionador de negócios em seu projeto, certifique-se de saber quem é responsável


pelo seguinte:

Definir diretrizes de conteúdo para o novo produto (tipo de conteúdo, tom,


quantidade).

Avaliar a adequação do conteúdo existente em relação a essas diretrizes.

Desenvolvimento de novos conteúdos. Isso irá variar com base no tipo geral de projeto. Para
aplicativos baseados em tarefas, pode incluir cópias de instruções, mensagens de erro e
tópicos de ajuda. Para fontes de conteúdo, pode incluir artigos, notícias e postagens de blog.

Servir como elemento de ligação entre as partes interessadas e a equipe técnica para
comunicar as limitações e possibilidades do sistema de gerenciamento de conteúdo.

Definir diferentes tipos de conteúdo, bem como os metadados de cada um (as


informações que tornam a pesquisa e a referência cruzada mais eficazes).

Planejar a migração de conteúdo, que envolve a criação de modelos para diferentes tipos
de conteúdo e a garantia de que o conteúdo seja marcado e carregado corretamente quando
for movido para o sistema de gerenciamento de conteúdo do site.
(Esta é outra área onde o esforço necessário é frequentemente subestimado.)

Copiadora

Um redator é responsável por escrever o texto no site que enquadra a experiência geral. Em
alguns casos, esta cópia permanece praticamente inalterada no dia a dia. Normalmente
inclui introduções de sites e páginas ou instruções na página. Um redator também pode estar
envolvido na criação contínua de conteúdo dinâmico, como notícias ou textos para campanhas
de marketing.

Redação é uma daquelas áreas cinzentas que muitas vezes cabe a um designer de UX,
especialmente se wireframes estiverem sendo criados (consulte o Capítulo 11). Você pode
inicialmente inserir um texto de exemplo para servir como espaço reservado para cópia, como
uma descrição do site ou instruções na página, mas eventualmente alguém precisará preenchê-
lo com o texto final que será visto pelos usuários - e porque muitos projetos não têm um redator
dedicado, esta tarefa pode ser sua responsabilidade.

É menos provável que você seja solicitado a assumir a função de redator em áreas de
destaque de sites de presença de marca ou campanhas de marketing; nessas situações

ESCOLHA SEUS CHAPÉUS 29


Machine Translated by Google

cada palavra pode ser examinada de perto. Mas se você estiver trabalhando em um aplicativo
baseado em tarefas que precisa de mensagens curtas de instrução, mensagens de erro ou
outros tipos de informações que não necessariamente caiam em um depósito de conteúdo
claro, você pode acabar herdando essa tarefa de escrita (ou ela irá cabe ao desenvolvedor
por padrão). Pergunte antecipadamente se um redator estará disponível e pergunte novamente
quando estiver criando um wireframe, caso nenhum tenha sido encontrado. Se o trabalho
for de sua responsabilidade, inclua esse esforço ao planejar suas atividades durante o projeto. E
esteja avisado: esta é uma responsabilidade que muitas vezes é deixada de lado ou subestimada.

Designer Visual

Um designer visual é responsável pelos elementos do site ou aplicativo que o usuário vê.
Esse esforço inclui projetar uma aparência que crie uma conexão emocional com o usuário que
esteja alinhada com as diretrizes da marca. Por exemplo, um site bancário muitas vezes
precisa parecer estável, confiável e acessível. O design visual pode dar essa garantia por meio
de elementos visuais como cores e imagens. Essa promessa será então mantida (ou quebrada)
pelo design de interação do site e outros pontos de contato com a empresa (como um call center).

Sejamos francos: muitas pessoas se autodenominam designers visuais, web designers ou


designers gráficos, e muitos sites têm designs visuais ruins ou apenas aceitáveis. Há uma
grande diferença entre criar um design visual eficaz, envolvente e emocional e simplesmente
sobreviver. Às vezes, sobreviver é suficiente para atingir os objetivos do projeto, e às vezes
leva a frustrações e atrasos no projeto quando o patrocinador do projeto está insatisfeito ou os
primeiros usuários não estão envolvidos com o design.

Por outro lado, também pode ser fácil concentrar-se demasiado na criação de um impacto com
o design visual, permitindo que a usabilidade do design seja prejudicada.
Se você está sendo solicitado a assumir essa função e não tem certeza de suas habilidades
para criar o impacto certo para o cliente, dê uma olhada no site atual da empresa e nos sites
ou produtos que os clientes admiram do ponto de vista visual para avaliar seu conforto nível.

Os designers visuais muitas vezes assumem um papel muito central nos projetos de presença da
marca e nas campanhas de marketing, sendo o principal responsável pela comunicação eficaz
da marca da empresa.

30 CAPÍTULO 2: O ECOSSISTEMA DO PROJETO


Machine Translated by Google

Para projetos de fonte de conteúdo, eles podem se concentrar na criação de modelos de


conteúdo que possam ser aplicados a muitas páginas (por exemplo, um modelo para um artigo).
Para aplicações baseadas em tarefas, eles podem fornecer um guia de estilo que pode
ser aplicado a elementos comuns de interação, como áreas de navegação e ferramentas (o
que exige um alto grau de colaboração com o designer de interação).

Desenvolvedor Front-End

Um desenvolvedor front-end é responsável por construir a estrutura técnica por trás dos
designs e fluxos das páginas, bem como dos elementos interativos dentro do site, como
menus rollover, áreas expansíveis de conteúdo, interações com elementos multimídia como
vídeo. Este trabalho geralmente usa tecnologias como XHTML, CSS, Flash, JavaScript, Ajax e
Silverlight. O desenvolvimento front-end concentra-se nos elementos do site que estão
diretamente ligados ao que o usuário vê, em oposição aos sistemas no back-end que
fornecem a plataforma subjacente (como bancos de dados, sistemas de gerenciamento de
conteúdo e o código necessário para construir a funcionalidade por trás de recursos
complexos).

Se você ou membros de sua equipe estão assumindo a função de desenvolvedor front-


end, a colaboração estreita com o restante da equipe de desenvolvimento é importante
para compreender as expectativas e responsabilidades. Outras questões importantes
incluem quais sistemas back-end precisarão ser integrados, o método usado para gerar
HTML, a necessidade de flexibilidade na estrutura da página para acomodar “skins”
personalizados e as expectativas em relação a tecnologias como o Flash. Se um
protótipo estiver sendo planejado (ver Capítulo 12), pergunte quem é o responsável pelo
desenvolvimento do protótipo e qual o nível de funcionalidade esperado. Um protótipo
destinado a simplesmente comunicar possibilidades pode ser criado rapidamente em um
aplicativo como o Flash, mas um protótipo totalmente funcional que precise extrair dados reais
(por exemplo, as informações da conta que um usuário acabou de inserir em um formulário)
precisará ser feito de perto. colaboração com membros da equipe de desenvolvimento de back-
end.

Preocupado em assumir todas essas funções? A menos que você esteja trabalhando em um
projeto muito pequeno – ou em uma empresa muito pequena – você provavelmente não
assumirá todos eles. A chave é entender quais funções você é capaz e deseja assumir,
conforme necessário, para o projeto específico em que está trabalhando. De resto, você pode
obter o suporte necessário da equipe do projeto construindo uma rede dentro da empresa
cliente ou recomendando pessoas adicionais para atender às necessidades. Vamos conversar
um pouco sobre maneiras de fazer isso.

ESCOLHA SEUS CHAPÉUS 31


Machine Translated by Google

Construindo uma rede de defesa do usuário


Para aquelas áreas que você não tem certeza se pode ou deseja assumir, é hora de começar
a procurar ajuda. Existem três maneiras principais de fazer isso:

Recomendar que membros adicionais da equipe sejam adicionados, se necessário

bastante aparente.

Eduque-se nas principais áreas onde existem lacunas – se as novas responsabilidades forem
administráveis e você tiver tempo para se dedicar a elas.

Construa uma rede de suporte dentro da empresa para ajudá-lo em momentos importantes.

Vamos dar uma olhada em como você pode construir uma rede de apoio.

Provavelmente existem alguns recursos importantes em outros departamentos da empresa que


podem ajudá-lo a ter sucesso. Você precisará avaliar quanto tempo pode contar com essas
pessoas, porque solicitar o tempo de terceiros pode ser uma solicitação complicada em
projetos que pertencem principalmente a um departamento. Se você não quiser exigir muito
tempo deles desde o início, basta perguntar se você pode fazer parceria (ou consultá-los) para
garantir o melhor resultado para as principais responsabilidades dessa função. Depois de fazer
alguma parceria, você terá uma melhor compreensão da quantidade de interação necessária e se
precisa fazer uma solicitação mais formal.

para o seu tempo.

Cada empresa terá uma estrutura e nomes diferentes para seus departamentos, mas aqui
estão alguns locais comuns para procurar parceiros:

Para a função de estrategista de marca, pergunte se há alguém no departamento de


marketing que possa servir como seu ponto de contato. Esta também pode ser uma fonte para
designers visuais e estrategistas de conteúdo.

Parceiros de design visual e estratégia de conteúdo também podem ser encontrados no


gerenciamento de programas ou produtos ou no departamento de pesquisa e desenvolvimento,
operações ou estratégia corporativa, onde muitas vezes você pode encontrar analistas de
negócios e gerentes de produtos.

O departamento de TI ou engenharia costuma ser sua melhor aposta para desenvolvedores


front-end e outros que podem ajudá-lo a obter acesso e insights sobre ferramentas de análise
de sites.

32 CAPÍTULO 2: O ECOSSISTEMA DO PROJETO


Machine Translated by Google

Se você foi recentemente contratado por uma nova empresa e espera trabalhar em vários
departamentos, uma das melhores coisas que você pode fazer desde o início é identificar
pessoas-chave que poderiam ser parceiras e agendar uma entrevista com elas para entender
suas funções. e experiência. Ele começa com uma rede na qual você pode confiar por muito
tempo e lhe dá a oportunidade de explicar suas responsabilidades (e o design da experiência
do usuário em geral).
Você também pode fazer uma ótima pergunta no final da entrevista: “Com quem mais você
acha que eu deveria conversar?” A resposta pode ajudá-lo a encontrar pessoas que podem
não ser aparentes para o seu principal gerente de projeto ou contato com o cliente.

Se você já está em uma empresa há algum tempo, ainda pode iniciar um agendamento de
entrevistas como este. Nessa situação, é melhor vinculá-lo a um marco específico (como o
início de um novo projeto) ou a um objetivo corporativo que tenha alguma urgência por trás
dele, para garantir uma alta participação.

Certifique-se de que seu gerente saiba o que você está fazendo para evitar parecer que você
está perto dele. Uma boa comunicação é fundamental para compreender as expectativas
sobre as funções e construir confiança.

Outra chave para ganhar confiança dentro da empresa é compreender sua cultura,
as expectativas muitas vezes tácitas de como uma empresa funciona, como aquelas criadas
por experiências de projetos anteriores (positivas ou negativas), etiqueta em relação à
hierarquia organizacional e logística de trabalho aceitável (como trabalhar em casa).

Entenda a cultura da empresa


A cultura é um pouco como colocar um Alka-Seltzer num copo – você não vê, mas
de alguma forma ele faz alguma coisa.
—Hans Magnus Enzensberger

A cultura de uma empresa pode não ser consistente em todas as suas regiões, unidades de
negócios ou departamentos, mas geralmente você pode identificar as principais
características que afetarão você e o projeto ou projetos que você está realizando. A seguir
estão alguns aspectos que é bom ter em mente ao definir o escopo de projetos e navegar
em situações políticas potencialmente complicadas.

ENTENDA A CULTURA DA EMPRESA 33


Machine Translated by Google

História
Todos conhecemos a citação de que aqueles que não conseguem lembrar o passado
estão condenados a repeti-lo, e o trabalho em projetos não é exceção. Compreender
como um projeto ou equipe chegou ao estado atual de necessidade pode ajudá-lo a
compreender os desafios que poderá enfrentar durante o projeto.

Vamos abordar algumas das perguntas que você pode fazer para entender o histórico que
pode afetar um projeto. Embora algumas das respostas a essas perguntas possam
parecer terríveis, tenha em mente que algo desencadeou a necessidade de trazê-lo para
o projeto, de modo que um projeto pode ter uma história difícil e ainda assim ser bem-sucedido.
Talvez você seja um componente chave desse sucesso! No entanto, se muitos dos
problemas discutidos abaixo parecerem aplicáveis e você achar que não será capaz de
ajudar a resolvê-los, isso pode ser um sinal de alerta. Nesse caso, considere uma
avaliação geral para saber se este projeto está posicionado para ter sucesso.

Qual é um exemplo de projeto passado que parece ter sido considerado um


sucesso e o que parece ter sido considerado um sucesso? Qual é um projeto
passado que parece ter sido um fracasso (ou particularmente doloroso) e por
que falhou?

Fazer essas perguntas (diretamente ou de uma maneira mais sutil e conversacional)


pode ajudá-lo a entender algumas coisas: como a pessoa que responde define o
sucesso, os riscos potenciais para o seu projeto e quaisquer preconceitos ou
expectativas que serão levadas a cabo neste projeto , bem como abordagens
que funcionaram bem.

A empresa trabalhou e lançou um designer no mesmo projeto ou equipe?

Se sim, tente descobrir o que parece não estar funcionando e como o cliente
espera que sua abordagem seja diferente. Se você puder fazer essa pergunta a mais
de uma pessoa na empresa, isso o ajudará a entender muito sobre as expectativas
tácitas. Se você obtiver duas respostas muito diferentes, isso pode significar que
as responsabilidades do designer não foram bem definidas e pode ser necessário
garantir que haja muita comunicação sobre suas responsabilidades durante todo o
projeto.

A equipe do projeto está trabalhando no projeto (ou nos materiais relacionados)


há um tempo que parece incomumente longo, sem terminar?

34 CAPÍTULO 2: O ECOSSISTEMA DO PROJETO


Machine Translated by Google

Nesse caso, isso pode ser um sinal de que as principais partes interessadas do cliente não
estão na mesma página ou não estão envolvidas nos momentos apropriados, causando
várias paralisações, mudanças de direção ou perda de tempo devido a múltiplas
iterações. Também pode significar que não existe um líder claro, alguém que possa dizer não
(ou pelo menos priorizar efetivamente) para manter o foco nos objetivos de negócios. Se
você estiver em posição de influenciar a comunicação do projeto, pode ser útil criar diretrizes
de participação para ajudar a levar o projeto adiante.

A empresa criou designs sem a participação prévia de um designer UX?

Isso pode ser uma bênção mista. Por um lado, você está lidando com uma equipe que
entende a necessidade do design e tenta preencher a lacuna.
Por outro lado, você pode receber um design que acha que não atende aos objetivos do
projeto para a experiência do usuário. Esta pode ser uma situação delicada de navegar.
Muitas vezes, é melhor abordar o criador desses designs com o tom de um mentor respeitoso
ou de um consultor prestativo, apontando primeiro os aspectos positivos do design e depois
discutindo os objetivos de experiência do usuário e como eles podem ser melhor alcançados
com uma abordagem diferente. É provável que o criador seja um membro valioso da
sua rede de apoio, por isso é importante não queimar a ponte aqui, mas redefinir os seus
papéis de uma forma colaborativa para manter vivo o entusiasmo.

O patrocinador principal ou gerente do projeto parece particularmente preocupado


com o projeto?

Há muitas razões pelas quais isso pode ocorrer, especialmente se alguns dos fatores
acima estiverem em jogo. A ansiedade também pode ser devida a pressões do mercado que
seria útil que você entendesse. Por exemplo, o preço das ações da empresa está caindo?
Algum concorrente específico fez avanços alarmantes recentemente? O negócio está
operando no vermelho? Novamente, essas situações não significam necessariamente
que você não deva executar o projeto; afinal, são o tipo de situação que muitas vezes faz
com que um projeto seja financiado. Mas se você tem uma preocupação significativa de que
a empresa não conseguirá pagar suas faturas, esse é um risco que você deve avaliar.

ENTENDA A CULTURA DA EMPRESA 35


Machine Translated by Google

Hierarquia
Geert Hofstede tem um excelente modelo que descreve as diferenças culturais, o que ele chama de
“dimensões culturais”, que muitas vezes afetam a forma como as pessoas interagem e comunicam.
Um deles é o conceito de distância de poder, que é a medida em que os membros de uma
sociedade (no nosso caso, uma empresa) compreendem e aceitam a distância entre pessoas de
diferentes níveis de poder. Por exemplo, se os membros da equipa executiva de uma empresa
são vistos como particularmente poderosos e potencialmente inacessíveis, a empresa pode ter
uma grande distância de poder e os seus funcionários podem estar mais focados na hierarquia.

Se a empresa encorajar a partilha democrática de ideias e o questionamento da visão, poderá ter uma
distância de poder relativamente pequena.

Distância de potência é

“… a medida em que os membros menos poderosos das organizações e instituições (como


a família) aceitam e esperam que o poder seja distribuído de forma desigual.
Isto representa a desigualdade (mais versus menos), mas definida a partir de baixo, não a
partir de cima. Sugere que o nível de desigualdade de uma sociedade é endossado tanto
pelos seguidores como pelos líderes.”
Geert Hofstede
Dimensões Culturais
www.geert-hofstede.com

Nenhum dos extremos pode ser considerado bom ou mau por si só, embora geralmente nos
Estados Unidos a maioria dos trabalhadores pareça preferir a aparência de uma pequena distância
do poder no seu local de trabalho. O que é interessante notar é que isso não é necessariamente um
indicador do sucesso de uma empresa. A Apple tem uma distância de poder relativamente grande (se
você considerar a aura em torno de Steve Jobs),
e o Google tem uma distância de poder relativamente pequena como parte de sua cultura, mas
ambas as empresas são conhecidas por serem líderes inovadores.

O que é importante notar é que a distância do poder dentro da empresa cliente terá um impacto
na forma como você navegará com sucesso nas águas políticas durante o projeto. Este
aspecto se tornará particularmente importante em pontos-chave do projeto: durante a coleta de
requisitos (discutido no Capítulo 5) e em marcos importantes, como pontos de aprovação (discutidos
no Capítulo 4).
Se você estiver trabalhando em uma empresa com uma grande distância de poder, leve alguns recursos extras

36 CAPÍTULO 2: O ECOSSISTEMA DO PROJETO


Machine Translated by Google

tempo para entender as relações de subordinação antes de agendar reuniões, como


entrevistas e avaliações com as partes interessadas, e considere envolver mais pessoas
em níveis intermediários durante suas comunicações.

Logística
Além dos aspectos mais amplos da cultura mencionados acima, também é útil
compreender alguns dos elementos que são de natureza mais logística, para que você
possa integrar melhor os métodos de trabalho atuais ou introduzir mudanças de
maneira ponderada.

Por exemplo, é útil compreender o ritmo geral esperado dentro da empresa, incluindo
as principais datas de lançamento ou prazos que afetarão o projeto (criar um aplicativo
de software com um cronograma de lançamento anual provavelmente teria um ritmo
diferente de um microsite que suporta uma campanha sazonal, por exemplo). Espera-
se que sua equipe trabalhe até tarde para cumprir os prazos iminentes?

Também é bom entender as expectativas em relação ao trabalho remoto versus


trabalho no local. Se for esperado muito tempo no local, você precisará planejar a
viagem e a configuração de recursos lá. Se o trabalho remoto for aceitável (ou
incentivado, o que é comum quando se trabalha com empresas globais), é importante
compreender os métodos e ferramentas de comunicação. Por exemplo, é aceitável
a utilização de aplicações de mensagens instantâneas? Quais ferramentas de
conferência pela Web estão em uso? Existem métodos de inclusão de intervenientes
internacionais que se revelaram eficazes no passado?

Também é interessante entender a “cultura do papel” numa empresa. Alguns


as empresas preferem a mídia eletrônica para a maioria das coisas; nesse caso,
um bom projetor e uma conexão Ethernet consistente são importantes. Outros são
muito centrados no papel; nesse caso, você precisará trazer cópias suficientes
para uma reunião para torná-la produtiva. Você poderá mudar a cultura do projeto se
achar que outra forma é mais eficaz. Mas é bom saber que você está pedindo às
pessoas que mudem para que você possa suavizar a transição – e potencialmente
entender por que uma abordagem específica não está funcionando como você
esperava.

ENTENDA A CULTURA DA EMPRESA 37


Machine Translated by Google

Juntando tudo
Agora que explorou o terreno do projeto, você deve ter uma melhor compreensão
do ecossistema do projeto: o ambiente em que está trabalhando (a cultura da
empresa), o tipo geral de trabalho em que todos estarão envolvidos. (como os
tipos de sites que você está criando) e as pessoas com quem você interagirá
(incluindo suas funções e responsabilidades).

Essas informações serão valiosas à medida que você delineia seu papel no projeto
e se prepara para começar a sério. Se você trabalha como freelancer ou
subcontratado, isso fornecerá uma base para escrever uma proposta cobrindo
seu trabalho no projeto (veja o próximo capítulo, que discute propostas de UX).
Se você trabalha como membro de uma equipe maior e não está diretamente
envolvido na redação da proposta, poderá levar seu novo conhecimento para o início
do projeto – a primeira reunião de sua equipe. Para obter um guia básico para
conduzir uma boa reunião, consulte o capítulo on-line, “Um breve guia para reuniões”,
ou se quiser ir direto aos tipos de perguntas a serem feitas quando o projeto for
iniciado, consulte o Capítulo 4, “ Objetivos e abordagem do projeto.”

38 CAPÍTULO 2: O ECOSSISTEMA DO PROJETO


Machine Translated by Google

Propostas para
3 Consultores e Freelancers
Um guia para quem está no ramo e
Também gerencie seu próprio negócio

Pode ser bastante desafiador gerenciar projetos e


expectativas do cliente, mas se você não tiver um acordo
apropriado em vigor, poderá acabar perdendo qualquer
projeto que assumir. Propostas e declarações de trabalho
são essenciais para proteger sua empresa – e você
mesmo – de problemas financeiros e jurídicos. Depois
de aceitar um projeto e apertar a mão, certifique-se de
gastar o tempo certo redigindo um acordo que detalhe os
termos do seu relacionamento e o cronograma de
pagamento do seu cliente.

Russ Unger

39
Machine Translated by Google

Propostas
Há um velho ditado que diz que “nenhuma boa ação fica impune”, e o mesmo geralmente
vale para qualquer projeto – os cumprimentos e os momentos de bem-estar são rapidamente
substituídos por “Oh, merda! É hora de escrever a proposta!”

O maior desafio em escrever a proposta é escrever a primeira.


É quase impossível saber por onde começar se você nunca teve que criar um, e é aí que este
capítulo deve ser útil.

Cada tipo de projeto que você encontrar terá sabores variados que o manterão alerta quando
chegar a hora de redigir a proposta. Felizmente, existe um núcleo que é comum a todas as
propostas e pode ser reutilizado de projeto para projeto. (Para uma discussão detalhada dos
tipos de projetos, consulte o Capítulo 2.)

Quando você deve escrever uma proposta? Sempre.

Por que você deveria escrever uma proposta? Ao longo da história de trabalho em projetos,
os que colocaram as pessoas em situações mais desconfortáveis foram aqueles em que não
houve acordo entre o cliente
e o vendedor.

Você pode ficar muito tentado a pular esta etapa quando fizer a primeira conexão com um
cliente em potencial e as coisas parecerem funcionar. Mesmo que você tenha uma aparente
compreensão das necessidades do cliente e seja capaz de articulá-las de uma maneira que eles
entendam, você ainda não está pronto para começar a trabalhar.

Na verdade, este é exatamente o ponto em que você precisa desacelerar e respirar.

Em vez de ir direto ao trabalho, reserve um tempo para definir seu relacionamento profissional
e as regras de engajamento com seu novo cliente. Jean Marc Favreau, do escritório de
advocacia Peer, Gan & Gisler, LLP, em Washington DC, diz:
Muitas vezes, os empreiteiros e os seus clientes acreditam que há uma convergência
de ideias no início da sua relação, quando na verdade as ambiguidades estão apenas
à espreita. Embora seja quase impossível preparar-se para todas as contingências
possíveis, um contrato escrito abrangente é a sua melhor defesa e a maneira mais
inteligente de garantir que mais tarde você não se encontre num tribunal discutindo sobre
os termos do seu relacionamento. Quanto mais claramente você definir
antecipadamente os termos e parâmetros de seu relacionamento com um cliente em um
contrato escrito, menor será a probabilidade de acabar brigando pelas obrigações de cada parte no futuro.

40 CAPÍTULO 3: PROPOSTAS PARA CONSULTORES E FREELANCERS


Machine Translated by Google

Novos projetos e novas pessoas são emocionantes. Muitas vezes existe o desejo de não “matar o negócio”

adicionando uma proposta à mistura, mas, como em qualquer relacionamento, a sensação de lua de mel pode

eventualmente diminuir.

As promessas podem ser quebradas em ambos os lados do relacionamento.

Um cliente pode não fornecer acesso oportuno ao conteúdo. (Eu sei que isso é quase inédito, mas acredite

ou não, isso acontece! Isso é sarcasmo, caso você tenha perdido.) O financiamento que antes estava

disponível para o projeto pode ser transferido para outro lugar – e então você, aquele que está envolvido no

trabalho, pode ficar segurando o saco.

As empresas também percebem que estão assumindo riscos ao trabalhar com fornecedores externos –

especialmente aqueles que são empresas muito pequenas ou prestadores de serviços independentes.

Propostas bem escritas proporcionam aos clientes uma sensação de estabilidade e proteção, o que pode

ajudar a aliviar muitas das preocupações que possam surgir.

Uma proposta também permite definir termos que protejam ambos os lados caso algo mude. Se o cliente

não lhe fornecer acesso oportuno aos seus recursos, seu cronograma poderá diminuir; você precisa

conscientizá-los de suas obrigações para o sucesso do projeto. Se um cliente perder financiamento e

encerrar o projeto – e você não tiver uma proposta ou outra forma de contrato em vigor – então você

corre o risco de não ser pago pelo trabalho que já concluiu.

A questão deve ser bem clara: sempre escreva uma proposta.

Criando a Proposta
Depois de finalizar o projeto, é hora de finalizar a proposta. Quanto mais cedo uma proposta for aprovada e

assinada, mais cedo você poderá começar a trabalhar e – o mais importante – começar a ser pago pelo

trabalho.

Os principais componentes de uma boa proposta são

Folha de rosto

Histórico de Revisão

Visão Geral do Projeto

Abordagem do projeto

CRIANDO A PROPOSTA 41
Machine Translated by Google

Escopo de trabalho

Premissas

Entregáveis

Propriedade e direitos

Custos e taxas adicionais

Preços do projeto

Agenda de pagamentos

Reconhecimento e assinatura

Vamos nos aprofundar em cada parte da proposta.

Folha de rosto
A página de título é a página simples que apresenta o seu documento. As páginas de título são
interessantes: há várias maneiras de criá-las do ponto de vista do estilo e da informação. Como
você faz isso depende de você.

Uma página de título típica consiste nos seguintes elementos:

Nome da empresa cliente

Logotipo da empresa cliente (se você tiver permissão para usá-lo)

Título do projeto

Tipo de documento (proposta)

Versão da proposta

Data de submissão

O nome da sua empresa

Autores da proposta

Número de referência do projeto

Custo

Confidencialidade

Para sua primeira proposta inclua tudo – exceto o logotipo da empresa do cliente, o custo e
(potencialmente) o número de referência do projeto.

Por que não incluir esses elementos na página de título?

42 CAPÍTULO 3: PROPOSTAS PARA CONSULTORES E FREELANCERS


Machine Translated by Google

Seu cliente sabe quem ele é. Provavelmente não vale a pena gastar tempo e esforço
solicitando permissão para usar o logotipo da empresa, nem vale a pena o possível
desconforto se você usá-lo inadvertidamente. O custo é melhor colocado depois de
você ter identificado os vários componentes do projeto no corpo, e as informações
de custo conduzem perfeitamente ao cronograma de pagamento. O número de referência
do projeto é algo que você deve estar ciente. Muitas empresas não usarão nenhum;
entretanto, sabe-se que algumas agências governamentais confiam neste item
específico e, se ele não for encontrado em sua página de título, sua proposta poderá ser rejeitada.

Figura 3.1 Exemplo de página de título da proposta

Na Figura 3.1 foi utilizado o logotipo (fictício) do cliente. Caso não tenha sido concedida
autorização ou não tenha sido estabelecido relacionamento, é aconselhável não exibir
a logomarca da empresa cliente.

CRIANDO A PROPOSTA 43
Machine Translated by Google

Histórico de Revisão
O histórico de revisões é uma seção própria da proposta e é usado para identificar
quantas vezes você atualizou a proposta desde a versão original. Em geral, é melhor
fornecer o número da versão, a data, o autor e quaisquer comentários associados à
versão, como o que foi modificado, para
fornecer ao leitor o contexto das modificações (Tabela 3.1).

TABELA 3.1 Exemplo de tabela de histórico de revisões


SEÇÃO DE REVISÃO DESCRIÇÃO DATA DO EDITOR

1,0 Documento original REU 8 de janeiro de 2009

1.1 Premissas atualizadas para refletir os requisitos de software REU 11-Jan-09

Ocasionalmente, os clientes aprovam uma proposta e solicitam novas revisões. Se você


optar por seguir em frente com o cliente e fazer essas alterações, deverá aproveitar
a oportunidade para atualizar seu documento da versão 1.x para 2.0.

Em essência, quando um cliente aprova uma proposta e ambas as partes concordam


com os termos, você está pronto para começar a trabalhar. Portanto, quando modificações
adicionais forem solicitadas, será necessário revisá-las com muito cuidado. Isso
garante que seus custos ainda façam sentido e que haja um entendimento claro de
ambos os lados sobre as modificações e em que estágio o projeto será reiniciado (se
necessário). Você também deve sempre fornecer uma explicação apropriada do motivo
pelo qual a revisão constitui uma nova versão completa no histórico de revisões.

Visão Geral do Projeto


A seção de visão geral é uma descrição do projeto no qual você estará trabalhando
– com suas próprias palavras. Esta descrição deve fornecer ao seu cliente uma
imagem clara do que você imagina que o produto dele implicará, bem como uma
explicação do que ele pode esperar encontrar no restante da proposta.

Aqui está um exemplo do início de uma visão geral:


[Nome da empresa cliente] está buscando criar uma nova presença online na Web. Esse
A presença na Web oferece aos clientes da [Nome da Empresa Cliente] a capacidade
de pesquisar e comprar produtos on-line, bem como outros serviços e benefícios
disponíveis através da empresa. Os objetivos da presença online na Web são…

44 CAPÍTULO 3: PROPOSTAS PARA CONSULTORES E FREELANCERS


Machine Translated by Google

Você deve ser capaz de fornecer uma visão geral sólida em um ou dois parágrafos, fornecendo
detalhes de alto nível sobre o que o cliente deve esperar de você. É uma boa ideia concluir a visão
geral com uma explicação sólida das suas recomendações e da abordagem proposta para
concluir o projeto:
Esta proposta detalhará as recomendações e a abordagem da [Nome da sua
empresa] para o design e desenvolvimento da presença on-line da [Nome da empresa
cliente] na Web. Dado o prazo de [data limite], propõe-se que…

Abordagem do projeto
A abordagem do projeto irá variar dependendo do tipo de projeto que você está realizando.
Esta é a sua oportunidade de identificar ao seu cliente como você planeja trabalhar no projeto
com ele. Você pode definir suas regras de engajamento e definir expectativas para o trabalho
que está à sua frente.

Muitos indivíduos e empresas operam com metodologias muito semelhantes –


mas use nomes diferentes ou siglas inteligentes que combinem com sua marca geral.

Era uma vez uma metodologia mitológica criada para mostrar aos (potenciais) clientes e que
encontrou o seu caminho em muitas propostas. O processo foi chamado de Processo
PURITE™ (pronuncia-se “pureza”) e, ao compartilhar isso com vocês, um ser mitológico
acaba de morrer um pouco por dentro, então, por favor, tome cuidado para ler isso como
uma peça de ficção. O nome do processo é um pouco cafona e claramente um tanto incompleto.
A análise pós-lançamento foi omitida nesta metodologia (um descuido), mas deveria ser
incluída para todos os clientes, é claro. Sem mais delongas, aqui está a abordagem PURITE:

[Nome da sua empresa] identificou um processo padrão para o sucesso do projeto com
nossos clientes. Embora cada uma dessas fases possa não ser aplicável ao [Título do
Projeto], todo o processo é definido da seguinte forma:
O PURITE Process™ é a metodologia interna da [Nome da sua empresa] para garantir o
sucesso geral de todas as iniciativas. Ao utilizar o PURITE, [Nome da sua empresa] tem
um conjunto comprovado de diretrizes para trabalhar em estreita colaboração com clientes e
usuários/públicos para manter e superar de forma confiável as expectativas de entrega.
P – Prepare-se. Dedicamos uma parte de cada iniciativa para entender seu setor e seus
concorrentes e como eles fazem negócios, a fim de estarmos o mais informados
possível antes de iniciar a coleta de requisitos.
Você entende. Trabalhamos em estreita colaboração com seus especialistas no
assunto e/ou usuários para definir os requisitos para a construção correta do projeto.

CRIANDO A PROPOSTA 45
Machine Translated by Google

R – Renderizar. Através da fase Render criamos e desenvolvemos todas as peças do projeto/


produto. Em nossa experiência, qualquer fase de desenvolvimento requer muito esforço de
trabalho concentrado e concentrado, mas também comunicação aberta e oportuna com sua(s)
equipe(s). Também exige que nós...

Eu – Iterar. A fase Iterar é repetida durante todo o ciclo de vida do projeto. Agimos o mais rápido
possível para dar vida ao projeto, e isso geralmente requer a criação de múltiplas iterações em
cronogramas rápidos. Isso requer envolvimento direto e oportuno de sua parte e de seus recursos
dedicados. O resultado final é o produto que você especificou – e ajudou a criar.

T – Teste. Testamos todos os projetos ao longo da fase de renderização; no entanto, também


exigimos um olhar extra – de nossa própria equipe de testes e de seu grupo de usuários/público
designado para realizar testes baseados em metas. Esta rodada adicional de testes ajuda a garantir
que o mínimo possível de pedras sejam deixadas de lado, a fim de entregar um projeto que foi
rigorosamente avaliado em vários níveis.

E – Habilitar. Após a conclusão bem-sucedida das cinco fases anteriores e sua aprovação
assinada, habilitaremos a solução e a colocaremos em operação.

O PURITE Process™ não termina aí. Após a conclusão do projeto, nos comunicamos
regularmente com nossos clientes. Continuaremos avaliando seus níveis de satisfação, entendendo
suas mudanças de metas ou melhorias de projeto e ajudando você a definir a melhor abordagem
para o desenvolvimento futuro de seu projeto.

Você está convidado a usar o mínimo ou o máximo que for aplicável ou útil para você. O
autor mitológico que criou o processo também não se importa se você não der crédito à
fonte.

A definição do seu processo pode ser tão detalhada como acima ou tão simples
como a seguir:
Planejar, Definir, Desenvolver, Ampliar

Planeje a estratégia geral

Defina os requisitos detalhados do projeto

Desenvolva, teste, refine e lance o produto de trabalho

Estenda o projeto recomendando aprimoramentos e melhorias com base nas informações


aprendidas durante o desenvolvimento, testes e pós-lançamento

Depois de definir seu processo, você terá a oportunidade de detalhar os diversos esforços
que ocorrerão em cada fase de sua abordagem, bem como o que cada um desses
esforços significa para você e seu cliente.

A seção de abordagem da sua proposta irá variar em extensão dependendo do projeto,


do seu processo e das atividades que ocorrem em cada etapa do seu processo. Tente
mantê-lo em duas a três páginas no máximo, e

46 CAPÍTULO 3: PROPOSTAS PARA CONSULTORES E FREELANCERS


Machine Translated by Google

certifique-se de incluir apenas os resultados que você será capaz de entregar ao seu
cliente – para evitar atualizações adicionais do documento ou revisão do preço do
projeto.

Escopo do Trabalho
A seção de escopo de trabalho é onde você identifica a divisão de trabalho do
projeto. Ou seja, você identifica quais componentes do projeto você é responsável e
por quais o cliente é responsável.

Releia isso. Pense nisso por um momento. Deixe-o penetrar. Lá vamos nós.

Isso mesmo. Esta é a parte da proposta em que você diz ao cliente, por escrito, que
vamos fazer isso e você vai fazer aquilo. Mais tarde, quando o cliente assinar sua
proposta, ele estará concordando com esse acordo e você terá um documento para
apoiá-lo em caso de mal-entendido.

A intenção aqui é identificar claramente quem vai cuidar de quais aspectos do projeto,
bem como quais aspectos do projeto estão incluídos na sua proposta e pelo preço
que você estimou.

Se você não encontrar nenhum outro motivo realmente convincente para escrever uma proposta,
isso deverá ser motivo suficiente.

Aqui está um breve exemplo de um escopo de trabalho:


Fomos abordados por [Nome da empresa cliente] para fornecer todos os serviços necessários
para construir [Tipo de projeto].

[Nome da sua empresa] se concentrará exclusivamente no [Design de experiência do usuário


Aspecto(s)] do site da [Nome da Empresa Cliente].

A [Nome da Empresa Cliente] fornecerá feedback detalhado sobre todos os aspectos do [Tipo de
Projeto] de acordo com o Plano do Projeto.

A [Nome da Empresa Cliente] fornecerá todos os recursos necessários para uso no projeto, incluindo
fontes, esquemas de cores, padrões de marca, etc.

Premissas
A seção de suposições da proposta é um bom lugar para explicar, sem deixar espaço
para debate, o que é necessário do seu cliente para garantir o seu sucesso. Ou seja,
essas são as coisas que você está assumindo – e comunicando ao cliente – que você
terá acesso ou que serão entregues a você para tornar o projeto um sucesso.

CRIANDO A PROPOSTA 47
Machine Translated by Google

O que você chama de suposições nesta seção são, na verdade, expectativas. É muito mais educado
presumir.

Você pode criar quantos planos de projeto desejar, mas se nem você nem o cliente se
comprometerem a cumprir os marcos e objetivos, ambos os lados estarão se comprometendo com o
fracasso do projeto. Em geral, os pressupostos são uma expectativa de recursos e activos, bem
como o acesso atempado (tradução: rápido, imediato) a ambos.

Aqui está um exemplo de como escrever suposições:

Premissas

É necessário que a [Nome da Empresa Cliente] forneça os seguintes ativos e recursos. A


incapacidade de fornecer estes activos e recursos de forma atempada e completa pode
contribuir para o fracasso ou atraso na entrega deste projecto.

Os seguintes ativos e recursos são esperados:

Acesso oportuno a todos os funcionários necessários da [Nome da empresa cliente].

Acesso oportuno a todos os ativos necessários do [Projeto] no estado atual, incluindo quaisquer
arquivos de origem, se disponíveis.

Conteúdo, conforme necessário e incluindo, entre outros, cópia, imagens, áudio, etc. para qualquer
aspecto do [Projeto].

Entregáveis
As entregas são o produto de trabalho que você criará e entregará ao cliente. Esta seção é sua
oportunidade de detalhar ao cliente que tipo de produto de trabalho ele pode esperar de você
durante o projeto. É recomendável que você lide com o relatório de status separadamente, próximo ao
final do projeto, mas sinta-se à vontade para adicioná-lo a esta parte do projeto.

Forneça descrições de qualquer produto de trabalho que você possa incluir, mesmo que o produto de
trabalho não seja produzido. Isso pode parecer um exagero ou tem o potencial de abrir a lata de
minhocas “Eu li sobre [tipo de entrega] na proposta, mas não o vejo aqui”, mas uma pequena palavra,
pode , pode
fazer a diferença.

Entregáveis

[Nome da sua empresa] fornece uma variedade de resultados ao longo de um projeto.


Para [Nome da Empresa Cliente], identificamos os seguintes resultados:

48 CAPÍTULO 3: PROPOSTAS PARA CONSULTORES E FREELANCERS


Machine Translated by Google

Resumo Criativo

O Creative Brief é a primeira etapa do projeto. Este documento nos ajudará a criar uma visão
geral rápida, eficaz e de alto nível do projeto. O objetivo do Creative Brief é esclarecer os
objetivos e necessidades dos usuários e definir quaisquer recursos especiais e/ou restrições
relacionadas ao projeto.
E assim por diante…

Propriedade e Direitos
É importante considerar até que ponto você permitirá que seu cliente utilize o produto de trabalho
que você produz. Esses direitos podem ser definidos de muitas maneiras diferentes, mas a maior parte
do seu trabalho se enquadrará em duas categorias:

Trabalhar por conta de outrem

Trabalho licenciado

Os projetos de trabalho contratado (conhecido no mundo jurídico como “trabalho feito sob encomenda”)
são considerados criados por e sob direitos autorais da parte que paga pelo trabalho – e não da parte
responsável pela execução do trabalho real.

Isso significa que, ao realizar um trabalho em um projeto que é contratado, você não tem absolutamente
nenhum direito sobre o trabalho e tudo o que você cria relacionado ao projeto é de propriedade do
cliente. Esta situação é difícil para muitas empresas
empresas e indivíduos com os quais lidar: muitas vezes significa que não há

trabalho de “manutenção” (com sua receita adicional), pois os clientes podem decidir manter o
projeto por conta própria depois de concluído.

Não se deixe influenciar por um projeto em que um cliente força a estipulação; não é incomum.
Quando você coloca projetos de trabalho contratado no contexto de emprego em tempo integral
em uma empresa, isso é bastante padrão para uma relação empregador-empregado. É também
uma oportunidade de visitar o seu modelo de preços – muitos projetos são cobrados a uma taxa um
pouco mais elevada para compensar a perda potencial de receitas no futuro.

Lembre-se de que tudo isso depende do relacionamento que você tem com seu cliente e de como
você escolhe fazer negócios. O tempo e a experiência o ajudarão a tomar a decisão certa sobre os
tipos de trabalho que você realiza e os modelos de preços que você escolhe.

Os projetos de trabalho licenciados permitem que você retenha os direitos autorais do trabalho, mas
concede a outras partes o direito de copiá-lo e/ou distribuí-lo. Você pode incluir qualquer número de
estipulações no contrato de licenciamento. Você provavelmente irá

CRIANDO A PROPOSTA 49
Machine Translated by Google

aproveite o licenciamento do seu trabalho ao manter a propriedade de todo o material de


origem do seu trabalho e entregar apenas produtos de trabalho de uso limitado aos seus
clientes (como PDFs em vez do original editável Word, Visio, Axure, OmniGraffle ou outros
documentos ).

Você pode adotar muitas abordagens diferentes para licenciar seu trabalho, incluindo licenciar
o trabalho para ser usado sem modificação, de forma não comercial ou uma série de outras
maneiras que possam se adequar à sua situação.

Creative Commons (http://creativecommons.org/about/licenses) fornece explicações fáceis


de entender sobre uma variedade de tipos de licença que você pode usar, mas esses são
apenas um pequeno subconjunto do mundo do licenciamento. Se você se encontrar em uma
situação em que tenha necessidades muito detalhadas e específicas, é sempre melhor entrar
em contato com um advogado de direitos autorais para ajudá-lo a criar a melhor solução
possível.

Custos e taxas adicionais


É importante que seu cliente entenda se o preço do projeto que você fornecerá considera (ou
não) recursos externos.

Por exemplo, alguns projetos podem exigir a compra de um banco de imagens de um fornecedor.
Você pode comprar as imagens (com os direitos de uso apropriados) e incluí-las como parte
de sua taxa, ou pode identificar claramente a compra de imagens como um custo adicional que
será repassado ao seu cliente.

Você também pode oferecer serviços que deseja conscientizar seu cliente – esta é uma boa
oportunidade para promover esses serviços.

Aqui está um exemplo de como explicar como os custos e taxas adicionais serão
ser tratado:
Custos e taxas adicionais

Caso sejam necessários recursos externos (como conteúdo, imagens, fontes, etc.),
estes deverão ser identificados, aprovados e cobrados da [Nome da Empresa
Cliente].
Além disso, a [nome da sua empresa] pode fornecer serviços de hospedagem aos
nossos clientes com custos muito baixos. Fornecemos serviços de hospedagem –
incluindo e-mail configurável baseado na Web – a partir de US$ 25 por mês, com uma
taxa de instalação de US$ 25. Caso a [Nome da Empresa Cliente] queira adquirir um
pacote de “manutenção”, a [Nome da Sua Empresa] trabalhará para criar um pacote que
seja mutuamente aceitável e benéfico para ambas as partes.

50 CAPÍTULO 3: PROPOSTAS PARA CONSULTORES E FREELANCERS


Machine Translated by Google

Preço do projeto
Depois de documentar os detalhes de como você executará o trabalho do projeto, é uma boa
ideia informar o custo ao cliente.

A forma como você chega ao preço depende em grande parte de você, mas aqui vai uma dica:
estime quanto tempo você acha que levará para concluir o projeto - incluindo um número
específico de revisões, estime um período de tempo razoável para o gerenciamento do projeto,
o que poderia estar em torno de 25 por cento; em seguida, determine a taxa faturável por
hora que deseja cobrar e calcule tudo. Há uma variedade de fórmulas para ajudá-lo com isso,
como aplicar graus de dificuldade a cada parte do projeto, para ajudá-lo a definir uma faixa de
custos a ser fornecida ao seu cliente.

Na maioria dos casos, a experiência será a chave para ajudá-lo a estimar adequadamente seus
projetos – do ponto de vista de tempo e materiais.

Como você determina sua taxa de faturamento? Pesquise o que os outros estão cobrando, para
comparação, localizando pesquisas salariais e taxas de contratantes. Por exemplo, organizações
como o Information Architecture Institute (www.iainstitute.
org), AIGA (www.aiga.com), Coroflot (www.coroflot.com) e a agência de talentos Aquent
(www.aquent.com) realizam pesquisas salariais e de taxas de contratantes. Você pode ter
uma ideia decente das taxas que pode cobrar levando em consideração sua experiência, o que
outras pessoas em seu mercado estão cobrando e o que você considera justo.

Lembre-se: você sempre pode diminuir sua taxa. É muito mais difícil pedir ao seu cliente que
pague mais dinheiro depois de ver os números em uma página!

Existem muitas maneiras diferentes de estruturar o preço do seu projeto.


Dependendo da natureza do seu projeto, você pode querer ou precisar fornecer diversas
estimativas que permitam uma variedade de opções de preços. Suponha, por exemplo, que
você forneça duas opções a um cliente: um site HTML estático e um site com um sistema de
gerenciamento de conteúdo (CMS) que permitiria conteúdo dinâmico (que o cliente poderia
então administrar sem recursos dedicados). Veja como você poderia formular as estimativas do
projeto:
Estimativa do Projeto

[Nome da sua empresa] propôs várias estimativas para [Nome da empresa cliente], a fim de
fornecer as melhores opções possíveis para suas necessidades imediatas e/ou futuras. [Nome da
sua empresa] pressupõe que todo o conteúdo será fornecido por [Nome da empresa cliente]. Caso
a [nome da sua empresa] seja solicitada a fornecer serviços de conteúdo, as estimativas precisarão
ser redefinidas.

CRIANDO A PROPOSTA 51
Machine Translated by Google

As estimativas da [Nome da sua empresa] permitem flexibilidade do ponto de vista de custos e


necessidades. As estimativas são as seguintes:
Estimativa 1

[Nome da sua empresa] estima que o [Projeto] para [Nome da empresa cliente],
sem nenhum conteúdo interativo…

Lembre-se de que não existe uma maneira realmente errada de elaborar a estimativa do seu
projeto – a menos que você se coloque em uma posição de fluxo de caixa negativo!

Agenda de pagamentos
Existe um mito de que todos os projetos freelance são pagos 50% adiantado, antes do início
do trabalho, e 50% após a conclusão, quando o projeto termina.

Este mito precisa ser dissipado – agora mesmo! Esta não é uma maneira de fazer negócios e
não é uma maneira de garantir uma renda oportuna e consistente enquanto você executa o
trabalho. Você não quer se colocar em uma posição em que precisa fazer alterações após
alterações para um cliente simplesmente porque deseja concluir o projeto e ser pago, em vez de
trabalhar em um processo de pedido de alteração.

Você pode precificar projetos de diversas maneiras: desde faturas enviadas em um período de
tempo pré-determinado até pagamentos baseados em marcos. Uma abordagem mais sábia é
direcionar seus projetos para um cronograma de pagamento recorrente com faturas regulares e
detalhadas. Essa abordagem também deve fornecer aos clientes uma compreensão clara do que
foi realizado e do trabalho que resta no projeto.

O exemplo a seguir é uma forma de estruturar os pagamentos pelo seu trabalho:


Agenda de pagamentos

O cronograma de pagamento típico da [Nome da sua empresa] é receber uma taxa de retenção
de XX% do preço total estimado do projeto antes do início.

[Nome da sua empresa] deverá enviar faturas nos dias 1º e 15 de cada mês; o pagamento
é devido integralmente em 14 dias.

Após a conclusão do projeto, [Nome da sua empresa] entregará todos os produtos de trabalho
para [Nome da empresa cliente]. Assim que os materiais forem aprovados satisfatoriamente,
a [Nome da Sua Empresa] reembolsará qualquer excesso de pagamento restante do
adiantamento ou a [Nome da Sua Empresa] enviará uma fatura final para valores não cobertos
pelo adiantamento.

Nota: Se o [Projeto] for suspenso por um período de mais de 14 dias sem nenhum progresso de
trabalho, a [Nome da sua empresa] deverá enviar uma fatura final para quaisquer taxas não
cobertas pela retenção e terá o direito de primeira recusa em caso de reabertura do projeto.

52 CAPÍTULO 3: PROPOSTAS PARA CONSULTORES E FREELANCERS


Machine Translated by Google

Embora não seja obrigatório, é útil incluir uma observação sobre como o projeto será conduzido
se for suspenso por um longo período de tempo. Esse
estipulação pode ajudá-lo a manter seu projeto no caminho certo e seguir em frente -
e fornece um ponto de discussão com seus clientes. Se você não fará trabalho adicional para eles
por um longo tempo, você quer poder seguir em frente
e procure trabalho para preencher o vazio.

Reconhecimento e aprovação
Embora seja muito importante garantir que você tenha uma proposta em vigor, por si só não é
suficiente. A proposta realmente não significa muito até que a pessoa certa na empresa cliente a
aprove e assine.

É vital garantir que todos tenham uma compreensão clara do que vai acontecer e do quanto
se espera de cada lado. É igualmente importante que você se proteja da “superestrada de
iteração” e reduza o risco de permitir que um cliente o envolva em “aumento de recursos”: solicitar
continuamente “só mais uma coisa” que precisa ser incluída.

As assinaturas são bastante simples e claras. Depois de criar o documento da proposta, você
fornecerá ao seu cliente um reconhecimento e assinatura que aprovará o acordo entre suas duas
empresas. Sempre prepare duas cópias – uma para cada parte – e certifique-se de que ambas
estejam assinadas.

Aqui está um exemplo de reconhecimento que você pode usar:


Reconhecimento
Esta proposta é reconhecida e acordada em sua totalidade pela [Nome da
Empresa Cliente]. Esta proposta deve ser assinada e datada por um representante
autorizado da [Nome da Empresa Cliente] para entrar em vigor. Alternativamente,
um pedido de compra assinado referenciando esta proposta constituirá aceitação no
lugar deste documento assinado (desde que, no entanto, quaisquer termos pré-
impressos em tal pedido de compra sejam considerados nulos e sem efeito).
Esta proposta constitui o acordo integral entre as partes com relação ao
objeto desta proposta. Esta proposta funde e substitui todos os acordos,
discussões, negociações, compromissos, escritos ou entendimentos anteriores,
orais ou escritos. Isto inclui, sem limitação, quaisquer representações contidas em
qualquer literatura de vendas, brochuras ou outro material escrito descritivo ou
publicitário e é a declaração completa e exclusiva dos termos do acordo entre as
partes. Cada uma das partes reconhece e concorda que, ao executar esta
proposta, não se baseou, e renuncia expressamente a qualquer confiança, em
qualquer representação ou declaração não estabelecida aqui ou no Contrato.

CRIANDO A PROPOSTA 53
Machine Translated by Google

Aceito pelos representantes autorizados de:

[O nome da sua empresa] [Nome da empresa cliente]

Por: ________________________________ Por: ________________________________


Nome: _____________________________ Nome:_____________________________

Título:_______________________________ Título: ______________________________

Data: ______________________________ Data: ______________________________

Faça todos os cheques nominativos para: [Nome da sua empresa]

Declarações de Trabalho
Uma declaração de trabalho (DT) é uma definição de alto nível dos objetivos do seu projeto
que você deve ser capaz de reunir em um documento de duas a três páginas (sem incluir a
capa). O SOW normalmente é escrito antes de você entrar nos requisitos detalhados,
embora, dependendo das necessidades do seu cliente e do seu projeto, você possa optar
por criar um documento híbrido que melhor atenda às suas necessidades.

Em geral, os SOWs devem ser usados para construir consenso entre sua equipe e as
partes interessadas do seu cliente desde o início. O SOW definirá as entradas e saídas do
projeto, bem como as suposições e limitações.

Neste ponto, não é incomum que os clientes peçam que você forneça um “valor
aproximado” para o trabalho que você fará para eles. Pode ser um pouco arriscado responder
a isso neste momento. É recomendável que você faça o possível para evitar especificidades
ou compromissos sem definir os detalhes. Simplesmente não é possível saber quanto custará
um projeto quando você ainda não escreveu a proposta e/ou o documento de requisitos.

Dito isto, você deve fazer um julgamento neste momento. Se você estiver trabalhando em um
projeto como um site básico, e tiver concluído com êxito vários projetos semelhantes antes e/
ou já trabalhou com o mesmo cliente antes, então você terá alguma margem de manobra.
Lembre-se de que errar por excesso de cautela é sempre melhor do que uma situação
desconfortável posteriormente no projeto.

Uma declaração de trabalho deve ter aproximadamente duas a três páginas e, no mínimo,
conter o seguinte:

54 CAPÍTULO 3: PROPOSTAS PARA CONSULTORES E FREELANCERS


Machine Translated by Google

Folha de rosto

Histórico de Revisão

Número de referência do projeto

Resumo do projeto

Data de início

Data final

Taxa/preço

Explicação do projeto

Atividades e resultados

Custos discriminados e cronograma de pagamento

Reconhecimento e assinatura

Os elementos parecem familiares? Eles deveriam - você pode montar um SOW


utilizando uma versão simplificada da proposta.

Agora você aprendeu como reunir dois tipos de documentação que lhe permitirão identificar o
trabalho que está realizando para um cliente. Esses
os documentos devem ser a base de qualquer trabalho de projeto que você faça para qualquer cliente
e fornecerão a você e a seus clientes um conjunto bem definido de ordens de marcha para seus
projetos.

DECLARAÇÕES DE TRABALHO 55
Machine Translated by Google

Objetivos e
4 abordagem do projeto
Saiba por qual estrela navegar

Um dos segredos para um bom projeto é iniciar a equipe com

objetivos de projeto claros e uma visão bem compreendida.

abordagem. Idealmente, a liderança do projeto terá isso definido para

você – mas como saber se eles não o fazem?

Este capítulo fala sobre a formação dos objetivos do projeto e

oferece algumas questões que o ajudarão a solidificar essas metas.

Também discutiremos algumas abordagens (ou metodologias)

comuns de projetos e como elas podem influenciar

a maneira como você trabalha.

Carolyn Chandler

67
Machine Translated by Google

Vocêoestá no pontapé
gerente inicial
do projeto do projeto,
distribui algunscom a equipe
materiais completa
e dá pela
uma visão primeira
geral vez. OAo final
do projeto.
da reunião, idealmente, você deverá ter o seguinte
Informação:

Por que o projeto é importante para a empresa?

Como as partes interessadas determinarão se o projeto foi um sucesso?

Que abordagem ou metodologia o projeto seguirá?

Quais são as principais datas ou marcos para pontos-chave, como a obtenção da


aprovação das partes interessadas da empresa?

Todas estas questões dizem respeito às expectativas que as partes interessadas têm em
relação ao projecto: o que o projecto irá realizar e como estarão envolvidos nele. As duas
primeiras questões referem-se aos objetivos do projeto e as duas últimas à abordagem do
projeto.

Um objetivo do projeto é uma declaração de uma meta mensurável para o projeto. Vamos
fale sobre os objetivos com mais detalhes.

Solidificar os objetivos do projeto


As objetivas são lentes de foco importantes que você usará durante todo o projeto.
Devem surgir da estratégia global de negócios da empresa cliente, portanto os objetivos do
projeto devem estar alinhados com as iniciativas estratégicas dentro da empresa. Por
exemplo, se houver uma iniciativa estratégica para atrair um novo grupo de clientes potenciais
(chamado mercado), o site ou aplicativo que você está criando pode ser um esforço
para fornecer a esse mercado acesso on-line a produtos e serviços relevantes. para eles.
O objetivo desse projeto seria então focado em alcançar e envolver esse mercado.

Um objetivo claro ressoa em todo o projeto. Isso ajuda você

Faça as perguntas certas ao reunir ideias das partes interessadas da empresa

Planeje pesquisas com os usuários e concentre sua análise nos resultados

Detalhe as ideias coletadas das partes interessadas e usuários e converta-as em uma


lista consolidada de requisitos do projeto

Priorize esses requisitos do projeto com base em seu valor para a empresa

SOLIDIFICAR OS OBJETIVOS DO PROJETO 57


Machine Translated by Google

Crie designs de interação eficazes

Gerenciar solicitações de alterações no design assim que o desenvolvimento começar

Concentrar esforços durante as atividades de implantação (como treinamento e


comunicação aos usuários sobre o novo site ou aplicativo antes e durante seu lançamento)

Determine se você atendeu às necessidades da empresa cliente, assim que o projeto for
lançado

Ao iniciar um novo projeto, você provavelmente terá os objetivos do patrocinador do projeto (a


parte interessada da empresa que tem responsabilidade direta pelo sucesso do projeto), bem
como um conjunto de solicitações relacionadas ao projeto vindas das partes interessadas da
empresa e de clientes, mas todos eles podem ser um pouco confusos (Figura 4.1). Seu objetivo
é esclarecê-los em declarações sólidas que você possa usar como parâmetro para o sucesso
do projeto.

Relacionado ao projeto
solicitações de
Empresa
Estratégia
Do utilizador

Precisar
Difuso
Parte interessada
Objetivo
Ideia

Difuso Do utilizador

Objetivo
Reclamação

Parte interessada
Ideia

Figura 4.1 Objetivos, ideias e necessidades difusos

Um objetivo sólido é

Fácil de entender. Evite terminologia interna.

Distinto. Evite declarações vagas; em vez disso, use palavras que pareçam úteis ao
priorizar requisitos.

Mensurável. Faça declarações concretas com as quais você possa definir uma medida
independente para determinar seu sucesso.

À medida que você define um objetivo difuso, tornando-o claro e mensurável, ele se torna um
objetivo sólido no qual você pode basear decisões.

58 CAPÍTULO 4: OBJETIVOS E ABORDAGEM DO PROJETO


Machine Translated by Google

Figura 4.2 Objetivos sendo solidificados

Empresa
Estratégia

Projeto
Objetivos

Você ouvirá muitas afirmações que poderiam ser consideradas objetivos. A análise
de questões confusas como as abaixo o ajudará a solidificar seus objetivos e a
se comunicar de forma mais eficaz dentro da equipe do projeto.

Negócios “Nosso objetivo é nos tornarmos o


Advogado
B líder de mercado na indústria x.”

Este é um objetivo para toda a empresa, mas é muito amplo para um projeto
específico. Múltiplas iniciativas na empresa precisam se unir para que isso aconteça;
qualquer site ou aplicativo pode ajudar com isso, mas é muito improvável que seja
capaz de lidar com todo o fardo – a menos que toda a empresa se concentre nesse
site ou aplicativo e ele acabe sendo um grande sucesso.

Negócios “Nosso objetivo é gerar entusiasmo


Advogado
B entre nossa base de clientes.”

Este é melhor, porque um site ou aplicativo pode ter impacto nisso, mas ainda é muito
vago. Por que é importante gerar entusiasmo? Como esse entusiasmo se traduz na
satisfação de uma necessidade comercial? E como você pode saber se teve
sucesso?

Negócios “Nosso objetivo é aumentar o valor


Advogado
de tráfego em nosso site.”
B

Agora estamos chegando lá. Este é fácil de medir, mas está muito focado em uma
etapa intermediária. Suponha que você gere mais tráfego: pode não ajudar se as
pessoas não realizarem as ações que você deseja quando chegarem lá.

SOLIDIFICAR OS OBJETIVOS DO PROJETO 59


Machine Translated by Google

Objetivos difusos podem dar uma ideia dos desejos e objetivos maiores do cliente.
A partir deles você pode criar objetivos de projeto mais sólidos, como

Aumente a receita das vendas online em 10%.

Aumentar a receita da publicidade online em 20%.

Aumentar o número de clientes atuais e potenciais em nosso banco de dados de clientes


para pelo menos 20.000.

Fornecer conteúdo altamente avaliado e referenciado aos nossos usuários principais.


(Observe que este requer algum trabalho para decidir como medir “altamente avaliado” e
“altamente referenciado”, mas os elementos estão aí para serem construídos.)

Cada um deles pode ser medido e afetado pelo seu projeto. Eles também podem mapear de perto
seus designs e os recursos oferecidos. Por exemplo, é muito comum oferecer uma newsletter
online como forma de cumprir o objetivo de aumentar a base de dados de clientes: Para entregar
a newsletter você precisará capturar os endereços de e-mail dos clientes, que serão
adicionados à base de dados. Os objetivos também podem trazer novos requisitos. Por
exemplo, se você estiver medindo o sucesso pela classificação média dada aos artigos do seu
site, precisará de um recurso que permita aos usuários atribuir classificações. Dessa forma, os
objetivos ajudam você a se concentrar enquanto reúne ideias para o site, e estas podem
mais tarde se tornar requisitos do projeto.

Se houver vários objetivos, certifique-se de criar uma lista de prioridades com o patrocinador
do negócio e a equipe do projeto. Às vezes, os objetivos entram em conflito entre si durante o
design e a equipe precisará saber o que tem precedência.
A lista final de objetivos priorizados deve vir do patrocinador do projeto, mas você pode ser uma
parte fundamental da discussão. Vamos conversar sobre como.

Como um designer UX pode ajudar?


Se você achar que os objetivos do projeto não estão claros no início do projeto, você pode
usar suas habilidades de facilitação. Ajude a equipe do projeto a compreender o contexto
comercial do projeto, realizando um workshop com as principais partes interessadas (veja o
próximo capítulo para saber mais sobre como identificar as partes interessadas certas).
Seu objetivo nesta sessão, que geralmente dura de duas a quatro horas, é trazer à tona
informações sobre os pontos fortes, fracos,

60 CAPÍTULO 4: OBJETIVOS E ABORDAGEM DO PROJETO


Machine Translated by Google

oportunidades e ameaças. Chamada de análise SWOT, esta é uma técnica comum de


análise de negócios e uma forma de discutir a posição de uma empresa no mercado. Você
também pode usar esse tempo para discutir a concorrência da empresa.

Entenda os pontos fortes e fracos

O SW em uma análise SWOT são os pontos fortes e fracos atuais da empresa no que se
refere ao projeto. Os pontos fortes e fracos podem incluir processos internos, bem como
percepções externas – e muitas vezes influenciam-se mutuamente. Por exemplo, uma
empresa com um grande departamento de pesquisa e desenvolvimento (P&D) poderia ter
acesso a uma grande fonte de pesquisas originais publicadas (um ponto forte), mas pode
não haver ninguém para ajudar a tornar esse conteúdo mais acessível ao usuário médio. ,
levando à percepção de que a empresa é “muito acadêmica” (um ponto fraco).

Identifique oportunidades e ameaças

O AT é a metade da SWOT voltada para o futuro. Considerando os aspectos que diferenciam


a empresa de seus concorrentes, que iniciativas futuras ela poderia adotar para abrir um novo
nicho ou fortalecer um nicho atual? Que situações poderiam ameaçar esses planos?

Por exemplo, nossa empresa de P&D pode decidir contratar redatores para publicar artigos
mais acessíveis sobre sua pesquisa original (uma oportunidade), mas se o conjunto de
ferramentas atual do site não tiver recursos robustos de gerenciamento de conteúdo, o processo
de publicação poderá ser proibitivamente lento. Isso poderia dar aos concorrentes a
oportunidade de responder mais rapidamente (uma ameaça).

Comparar concorrentes

Qual é o principal concorrente da empresa? Quem são os concorrentes do site que está sendo
desenvolvido? Eles podem ser diferentes, especialmente para grandes empresas ou sites
totalmente novos.

Existem sites que não são concorrentes diretos, mas que representam modelos interessantes
a serem considerados? Você pode aprender muito analisando outros sites de comércio
eletrônico para ver se e como eles vendem o que você está vendendo.

Junte tudo

As discussões SWOT e dos concorrentes são bons tópicos para discutir ao mesmo tempo
porque interagem entre si. É difícil falar sobre

SOLIDIFICAR OS OBJETIVOS DO PROJETO 61


Machine Translated by Google

ameaças futuras sem saber quem são seus concorrentes – e quando você começar a falar
sobre oportunidades futuras, novos concorrentes poderão vir à mente.

Depois que você tiver uma visão completa dos concorrentes da empresa e do SWOT, os
objetivos do seu projeto – bem como o ajuste geral do seu projeto dentro da estratégia
da empresa – deverão se tornar mais fáceis de definir e as prioridades entre eles deverão
ficar claras.

Solidificar os objetivos do projeto ajuda a compreender as expectativas sobre o que o projeto irá
realizar. A seguir, vamos falar sobre as expectativas em relação à forma como o projeto será
executado. Compreender a abordagem do projeto ajudará você a colaborar de forma eficaz e a
envolver as pessoas certas no momento certo.

Entenda a abordagem do projeto


Conhecer a abordagem geral, ou metodologia, de um projeto é uma parte importante para
entender quando e como você estará envolvido e como deverá envolver outras pessoas, como a
equipe do projeto e as partes interessadas do negócio.

Às vezes parece haver tantas abordagens de projetos quantos projetos. Como escolher
a abordagem certa para um projeto é um tópico extenso por si só. A metodologia escolhida
pode depender de muitas coisas, incluindo a estrutura e localização da equipe do projeto, as
tecnologias usadas no projeto e o grau em que a colaboração faz parte da cultura da empresa.
Para os propósitos deste livro, presumimos que você ingressou em um projeto cuja abordagem
foi amplamente determinada pelos responsáveis pelo sucesso do projeto, como o patrocinador
e o gerente do projeto. Nessa situação, seu principal objetivo será compreender a abordagem
e ajudar a torná-la eficaz para as partes interessadas do negócio e seus usuários.

Aqui vamos nos concentrar em dois dos tipos de abordagem mais comuns, bem como em uma
terceira que mostra uma possível variação que você pode encontrar em um projeto. O importante
a observar é que a maioria das abordagens envolve as mesmas etapas:

Planeje a estratégia geral, a abordagem e a estrutura da equipe.

Defina os requisitos do projeto.

Projete conceitos visuais e de interação e transforme-os em especificações detalhadas.

Desenvolva, teste e refine a solução.

62 CAPÍTULO 4: OBJETIVOS E ABORDAGEM DO PROJETO


Machine Translated by Google

Implante a solução por meio de mensagens, treinamento e lançamento planejado.

Estenda o projeto fazendo recomendações de melhorias.

Os nomes destas etapas podem variar, assim como o grau em que se sobrepõem e a forma
como a informação é documentada. Mas as atividades gerais em cada etapa são comuns à
maioria dos projetos e a todos os três modelos aqui apresentados.

Abordagem em cascata
Uma abordagem em cascata envolve tratar as etapas de um projeto como fases
separadas e distintas, onde a aprovação de uma fase é necessária antes do início da
próxima fase. Por exemplo, a fase de Design não começa para valer até que os requisitos
tenham sido aprovados pelas partes interessadas do negócio, que assinam um ou mais
documentos de requisitos no final da fase de Definição.

Aprovação Aprovação Aprovação

Plano Definir

Projeto

Desenvolver

Implantar

Ampliar

Figura 4.3 Exemplo de abordagem em cascata, onde cada fase “cai” na próxima

O problema com uma abordagem em cascata pura é que ela assume que cada fase
pode ser concluída com alterações mínimas na fase anterior. Portanto, se você apresentar
novos requisitos na fase de Design, o que é comum, deverá sugerir alterações nos documentos
que foram aprovados no final da fase de Definição, o que pode prejudicar o plano e o
cronograma.

Abordagens Ágeis
Como a mudança é constante, as equipes de projeto procuram continuamente abordagens
mais flexíveis do que o modelo em cascata. Muitas metodologias seguem uma abordagem
mais fluida, com algumas etapas acontecendo lado a lado; por exemplo, versões do site
poderiam ser lançadas em um cronograma rápido e iterativo, usando uma abordagem de
desenvolvimento ágil ou rápido . Uma abordagem ágil geralmente tem um foco maior na
colaboração rápida e um foco reduzido na documentação detalhada e na aprovação formal.

ENTENDA A ABORDAGEM DO PROJETO 63


Machine Translated by Google

Iteração 1 Iteração 2 Iteração 3

Desenvolver Desenvolver Desenvolver

Implantar projeto Implantar projeto Implantar projeto

Definir Definir Definir


Aprovação

Implantar
Plano Liberar

Ampliar

Figura 4.4 Exemplo de abordagem ágil

Uma verdadeira abordagem ágil (seguindo as melhores práticas desenvolvidas pelos


membros da Agile Alliance, por exemplo) exige equipes pequenas cujos membros
estejam localizados fisicamente próximos uns dos outros, com pouco foco na
definição de papéis formais entre os membros da equipe. Trabalhar dessa forma
permite um alto grau de colaboração, o que reduz a necessidade de documentação
pesada entre as etapas de design, desenvolvimento e teste. Um membro da equipe
pode fazer uma pergunta, chegar à resposta junto com outros membros da equipe
durante uma rápida sessão de quadro branco e implementar uma solução sem a
demora de documentação detalhada e aprovação. As revisões das partes interessadas
ocorrem com um sistema em pleno funcionamento quando uma das muitas iterações é
lançada, e a entrada resultante é levada em consideração à medida que a próxima
iteração é planejada. (Iterações são versões preliminares de um site ou aplicativo específico.)

Quando uma abordagem ágil funciona como foi projetada, é uma coisa linda.
Na maioria das empresas e na maioria dos trabalhos de consultoria, entretanto, as
equipes raramente seguem uma abordagem puramente ágil. Em parte, isto acontece
porque as empresas utilizam cada vez mais equipas distribuídas e trabalhadores
remotos, o que torna difícil manter o elevado grau de colaboração necessário para tirar
o melhor partido da abordagem puramente ágil.

Abordagens modificadas
A maioria dos projetos tenta seguir uma abordagem que combina o melhor dos dois
mundos, com estrutura e documentação suficientes para reduzir os riscos
representados por equipes distribuídas e rotatividade de membros da equipe, mas com
colaboração e iteração suficientes para responder às mudanças de maneira
relativamente ágil. Por exemplo, um projeto pode seguir um modelo em cascata,
mas incluir uma sobreposição de fases para que haja pontos-chave de colaboração entre equipes. Isso p

64 CAPÍTULO 4: OBJETIVOS E ABORDAGEM DO PROJETO


Machine Translated by Google

mudanças potenciais surgirão mais cedo em cada fase. Isso também pode incluir uma
versão antecipada (como uma versão beta para um grupo de usuários específico) com
um ciclo de iteração mais curto. O feedback dessa versão pode então ser incorporado
antes da implantação completa do novo site.

Plano Definir Desenvolver

Projeto
Projeto Definir

Desenvolver
Implantar
Implantar versão beta Liberar

Ampliar

Figura 4.5 Cascata modificada com versão beta

Observe as iterações menores na fase de Design na Figura 4.5. Esse é um dos maiores
valores que você agrega à sua equipe como designer de UX. Ferramentas como
wireframes (Capítulo 11) e protótipos (Capítulo 12) permitem coletar feedback sobre
iterações rápidas de ideias, antes que muito tempo de desenvolvimento seja investido.

Uma abordagem em cascata modificada como a da Figura 4.5 está entre as


metodologias mais comumente usadas, portanto é a abordagem que forma a
estrutura deste livro. No entanto, muitos dos tópicos abordados aqui serão aplicados ao
seu projeto, independentemente das especificidades da sua abordagem, porque as
atividades básicas por trás deles – definição e design, por exemplo – ainda são necessárias.

Mergulho Profundo

Se o seu projeto estiver usando uma abordagem ágil, você terá


necessidades específicas durante a coleta de requisitos, como a escrita de “histórias
de usuários” como forma de capturar requisitos. Recomendamos User Stories Applied:
For Agile Software Development , de Mike Cohn (Addison-Wesley Professional, 2004).

ENTENDA A ABORDAGEM DO PROJETO 65


Machine Translated by Google

Como a abordagem me afeta?


Conhecer sua abordagem ajuda você a entender uma série de coisas:

Que perguntas você deve fazer e quando. Por exemplo, se você estiver trabalhando
com uma abordagem em cascata pura, precisará fazer um esforço extra para garantir
que os requisitos capturados na fase Definir contenham todas as informações
necessárias para a fase Design. (Discutiremos os requisitos no próximo capítulo.)

Expectativas sobre como os membros da equipe do projeto irão colaborar e


quão estreita será essa colaboração. Por exemplo, uma abordagem ágil requer uma
colaboração muito próxima. Uma abordagem em cascata pode envolver trabalho
individual na maior parte do tempo, com pontos de contato uma ou várias vezes por semana.

O nível de detalhe necessário na sua documentação e o nível de


formalidade. Os documentos apresentados nos pontos de assinatura precisam
ser formais, quase como contratos legais. Normalmente, você precisará de documentos
mais formais em uma abordagem em cascata, onde a aprovação é necessária
antes de passar para a próxima fase. No entanto, você também pode ter alguns
documentos formais de aprovação ao usar uma abordagem ágil — por exemplo,
para capturar informações em pontos de decisão importantes, como quando uma
iteração específica é preparada para lançamento e implantação completos.

Marcos importantes que envolvem aprovação das partes interessadas e


implantação em diferentes grupos. A abordagem determinará o que os diferentes
públicos precisam fornecer em vários pontos do projeto, incluindo aprovações das
partes interessadas nos pontos de aprovação e feedback de usuários potenciais
durante uma versão beta.

Agora que você solidificou os objetivos do seu projeto e obteve uma compreensão da
abordagem do projeto, no próximo capítulo começaremos com o trabalho principal da
fase Definir: coleta de requisitos.

66 CAPÍTULO 4: OBJETIVOS E ABORDAGEM DO PROJETO


Machine Translated by Google

5 Requisitos de negócio
Conheça o problema antes
Você cria a solução

Quando a equipe do projeto se reunir, você provavelmente


provavelmente ouviram ou tiveram muitas ideias sobre o que
precisa ser feito. Já pode haver listas de recursos fornecidos por
alguns membros proeminentes da empresa (as partes interessadas
do seu negócio), juntamente com suas opiniões sobre quais
recursos são mais importantes.
Esses são elementos dos requisitos de negócios do projeto e
são um bom começo. Para ter certeza de que você
tiver uma solução completa ao final do projeto, você precisará gerar e
esclarecer requisitos de vários
pontos de vista. Neste capítulo, nos concentraremos na coleta e no
detalhamento dos requisitos das partes interessadas do seu negócio.

Carolyn Chandler

67
Machine Translated by Google

O Capítulo
ajude4aabordou objetivos
esclarecê-los paradifusos
você eepara
discutiu algumas
a equipe maneiras
do projeto. pelas
Nos quaisiniciais
estágios você pode
de
um projeto, é provável que você também tenha um conjunto de solicitações relativamente confuso.
Podem ser ideias de partes interessadas, reclamações ou solicitações de usuários. Para tornar
esses componentes úteis e rastreáveis do seu projeto, você precisará agrupar essas ideias em
requisitos.

Requisitos são declarações que definem o que o site ou aplicativo precisa fazer. Idealmente, um
requisito de negócios

Fornece informações sobre a necessidade geral que deve ser atendida

Representa e consolida necessidades fornecidas por diferentes partes interessadas

Dá orientação para o design, sem ser muito específico sobre como isso será realizado

Serve como uma unidade de trabalho distinta para fins de priorização e rastreamento

Aqui está um exemplo de ideia para um recurso em um site de comércio eletrônico. Você poderia
receber a mesma ideia de algumas partes interessadas de negócios diferentes no início da fase de
Definição:

“Os clientes podem rastrear seus pedidos online.”

Esta é uma boa base para um requisito, mas é confusa. Comece a fazer perguntas que abordem
os detalhes do requisito, como

Por que é importante para a empresa que os clientes possam rastrear seus pedidos online?
Por exemplo, é para reduzir o número de chamadas para o suporte ao cliente?

A empresa atualmente tem capacidade de rastrear pacotes online?


Caso contrário, novos requisitos precisarão ser capturados para os recursos de
rastreamento, ou a empresa poderá precisar fazer parceria com terceiros.

Quão preciso deve ser o rastreamento? Que tipo de informação deve ser incluída nos
detalhes de rastreamento? Por exemplo, o site precisa fornecer uma estimativa atualizada do
prazo de entrega?

Fazer esse tipo de pergunta o ajudará a unir ideias confusas em requisitos sólidos. Também
deixará claro que a mesma afirmação pode significar coisas diferentes para pessoas diferentes.

68 CAPÍTULO 5: REQUISITOS DE NEGÓCIO


Machine Translated by Google

Por exemplo, uma parte interessada pode pensar que o


rastreamento de pacotes envolve o recebimento de um e-mail de
Parte interessada
Ideia
confirmação com um número de rastreamento, que pode ser
inserido no UPS.com ou em outro site para que o cliente
Parte interessada
Ideia pode ver a última parada que o pacote atingiu.
Outra parte interessada pode pensar que a empresa precisa ir além
no rastreamento de pacotes e investir no desenvolvimento da
capacidade dos clientes de rastrear pacotes via GPS, vendo a
localização exata em tempo real usando um mapa on-line. Como você pode imaginar, há uma
diferença significativa aqui na experiência e no escopo do usuário!

É importante delinear essas diferenças no início do projeto. Caso contrário, você acabará
desenvolvendo uma solução que ignora a intenção das partes interessadas do negócio — e
potencialmente ignora os objetivos do projeto. Isso leva a partes interessadas insatisfeitas e, se
o recurso precisar ser redesenhado, perda de tempo e dinheiro.

Portanto, requisitos claros e detalhados são uma parte fundamental do seu projeto geral. Chegar a
uma lista consolidada dos requisitos do projeto envolve as seguintes etapas:

1. Compreenda o estado atual do site ou de seus concorrentes.

2. Reunir necessidades e ideias das partes interessadas do negócio, bem como dos atuais e

usuários potenciais. (Consulte o Capítulo 6 para obter detalhes sobre como trabalhar com usuários.)

3. Reúna ideias em requisitos.

4. Priorize os requisitos com base nos objetivos do projeto. (Veja o Capítulo 9 para sugestões
sobre como definir prioridades.)

Empresa e usuário Projeto


Requisitos Requisitos

Empresa
Estratégia

Figura 5.1 Reunir ideias de partes interessadas de negócios em requisitos de negócios e ideias de
pesquisas com usuários em requisitos de usuários. Em seguida, use os objetivos do projeto para concentrar
os esforços de priorização e criar uma lista consolidada dos requisitos do projeto.

REQUISITOS DE NEGÓCIO 69
Machine Translated by Google

Primeiro, vamos falar sobre como entender o estado atual do seu site para que você tenha
um contexto para as ideias que surgirão durante a coleta de requisitos.

Entenda o estado atual


Ao mergulhar nas especificidades do site ou aplicativo que você está projetando, é importante
entender o estado atual do site (se você estiver redesenhando um que já existe) ou entender
mais profundamente os principais concorrentes (se você estiver redesenhando um que já
existe). você está projetando um novo site ou aplicativo).

Você pode aprender muito sobre o estado atual por meio de entrevistas com as partes
interessadas (mais sobre isso em algumas páginas). Você também pode obter muito
conhecimento por conta própria, e isso pode servir como uma base sólida para entrevistas com
as partes interessadas e esforços de pesquisa com usuários. Uma ótima maneira de obter
informações básicas e gerar ideias que possam se tornar requisitos é realizar uma análise heurística.

Por qualquer outro nome…


A palavra heurística significa regra prática ou melhor prática. Uma análise heurística passou a significar

uma revisão de um produto em relação a um conjunto de regras (heurísticas) para design utilizável,

geralmente conduzida por um designer UX. Sites fáceis de usar seguirão a maior parte ou todas as

heurísticas que você usa em sua análise.

Você também pode ouvir essa técnica ser chamada de avaliação heurística, revisão de especialistas ou
alguma combinação desses termos.

Análise Heurística
Uma análise heurística é uma técnica que você pode usar para avaliar a usabilidade de um
design existente, com base nas melhores práticas no campo da experiência do usuário.
Você pode realizar essa análise no site atual no início de um projeto de reformulação ou
analisar sites concorrentes para compreender as oportunidades de oferecer uma experiência
de usuário melhor do que outras empresas. O resultado é um documento que descreve os
pontos fortes e fracos do site, incluindo recomendações para melhorias. Depois de
concluído, você terá uma visão mais profunda

70 CAPÍTULO 5: REQUISITOS DE NEGÓCIO


Machine Translated by Google

compreensão do site analisado e uma lista de ideias para contribuir com os requisitos do
novo site.

Por exemplo, uma heurística comumente usada é esta, da lista de dez heurísticas de usabilidade
de Jakob Nielsen (veja a lista completa no site de Jakob Nielsen, em www.useit.com/papers/
heuristic/heuristic_list.html):

Visibilidade do status do sistema. O sistema deve sempre manter os usuários informados


sobre o que está acontecendo, através de feedback apropriado dentro de um prazo razoável.

Existem muitas situações em um site onde esta heurística pode não ser seguida. Por
exemplo, digamos que o usuário clica no botão Download e não recebe nenhuma mensagem
informando que seu arquivo está sendo baixado. O sistema não informou ao usuário que o
arquivo está em processo de download, mesmo que o download tenha sido iniciado. Assim, o
usuário pode clicar no botão novamente, pensando que errou o botão na primeira vez...e
depois clicar novamente....

Isso pode levar a vários downloads – potencialmente causando problemas tanto para o
desempenho do site quanto para o usuário, que agora tem vários downloads em andamento
sem perceber.

Durante a análise heurística, você pode identificar isso como uma área problemática, descrevê-
la e avaliar seu impacto. Você também pode compartilhar uma ideia que possa resolver o
problema, que pode ser adicionada à lista de requisitos.

Por que realizar uma análise heurística?

Conduzir esse tipo de análise é uma maneira relativamente rápida e barata de obter
feedback sobre um projeto. Uma análise heurística pode fornecer uma compreensão
geral da qualidade do projeto e ajudar a identificar possíveis problemas de projeto.

Tenha em mente que esta atividade não envolve diretamente os usuários finais e não deve
substituir a verdadeira pesquisa com usuários. Por exemplo, é possível que apenas 50% das
suas descobertas heurísticas possam realmente ser validadas por pesquisas posteriores.
A análise, no entanto, dá à equipe uma boa noção das prováveis áreas de preocupação.
Se você estiver trabalhando no redesenho de um produto ou site existente, também pode
ser bom para identificar soluções rápidas óbvias que podem levar a melhorias imediatas à
medida que os esforços de redesenho continuam nos bastidores.

ENTENDA O ESTADO ATUAL 71


Machine Translated by Google

Como eu faço isso?

As heurísticas específicas que você usa podem variar de projeto para projeto, mas o processo para
conduzir a análise geralmente permanecerá o mesmo:

1. Reúna conhecimento prévio do produto e do projeto.

Certifique-se de ter os objetivos do site, uma lista dos principais grupos de usuários que
precisam de suporte, informações sobre o tipo de ambiente em que os usuários provavelmente
trabalharão e uma compreensão básica de qualquer conhecimento especializado que seus
usuários tenham. provavelmente terá. (Sua análise será diferente para um site criado para
consumidores em geral e para um site criado para farmacêuticos, por exemplo.) Se precisar
de ajuda com o último, visitar uma variedade de sites ou aplicativos concorrentes pode ajudá-lo
a entender os aspectos mais comuns. terminologia e áreas de interesse.

2. Escolha a heurística a ser usada.

Existem muitas heurísticas para referência. Além da lista de Jakob Nielsen, muitos designers
de UX referem-se à lista de princípios de design de Bruce Tognazzini: www.asktog.com/basics/
firstPrinciples.html. Quando estiver familiarizado com o assunto do site, você pode adicionar
alguns de sua preferência, especialmente se estiver analisando mais de um site. Certifique-se de
manter sua lista em um tamanho gerenciável (digamos, 8 a 12); muitas heurísticas podem
tornar a técnica difícil para você e seus leitores.

3. Percorra as áreas priorizadas do local, identificando áreas onde o heu-


estatísticas são bem seguidas ou perdidas.

Cada observação que você fizer deve conter as seguintes informações:

A observação geral. Uma breve declaração resumindo a descoberta.


O ideal é que eles sejam numerados para que você possa consultá-los rapidamente à medida
que orienta as pessoas no relatório.

Uma breve descrição. Um ou dois parágrafos descrevendo o contexto da observação – por


exemplo, o ponto em um processo específico onde você percebeu um problema.

Uma classificação de impacto. Essa classificação pode ser alta, média ou baixa para
observações de problemas, ou pode ser uma nota de uma descoberta positiva se você
estiver compartilhando algo que o site fez bem. Em geral, problemas de alto impacto são
aqueles que você acredita que farão com que muitos usuários falhem em uma tarefa específica ou

72 CAPÍTULO 5: REQUISITOS DE NEGÓCIO


Machine Translated by Google

perder informações permanentemente (por exemplo, um problema que faz com que um
usuário perca alterações em um documento no qual está trabalhando). Questões de médio
impacto são aquelas que causam frustração e erros, mas não causam problemas irreversíveis.

questões versíveis. Problemas de baixo impacto são problemas menores que podem
causar alguma confusão, mas normalmente não levam à perda de tempo ou à frustração.

Recomendações. Estas são as próximas etapas ou ideias que você compartilha e


que podem servir como solução para o problema que você encontrou.

A Figura 5.2 mostra um exemplo desses elementos juntos, como podem aparecer na sua
análise heurística.

Observação #4 A função ALTO


Preocupação
de busca não parece trazer todos os resultados possíveis.

Um teste de amostra da função de pesquisa produziu resultados mistos. Pesquisas usando um nome em uma postagem
relativamente nova, apresentando um tópico menos abordado, retornavam ocasionalmente
sem resultados. Parece também que a pesquisa primária retorna links apenas para novas histórias, não para vídeos.

Recomendações

1. Certifique-se de que o conteúdo recém-adicionado seja indexado e pesquisável antes, ou logo depois,
estando publicamente disponível.
2. Considere trazer à tona conteúdo relacionado quando os resultados da pesquisa forem trazidos de volta - por
por exemplo, histórias em categorias semelhantes ou com tags semelhantes – para que os usuários que estão explorando
tenham mais tópicos para seguir.

3. Considere uma pesquisa universal que apresente resultados organizados por categoria.
4. Use registros de termos de pesquisa para entender os itens comumente pesquisados. Isso também pode fornecer informações
sobre itens que os usuários estão tendo dificuldade para encontrar.

Figura 5.2 Uma amostra de observação em um relatório de análise heurística

4. Apresente suas descobertas à equipe do projeto e aos principais interessados.

Acompanhe-os em suas observações e recomendações. Discuta por que você deu as


avaliações que fez. (Este também é um ótimo momento para ter uma recomendação preparada
sobre como validar suas descobertas, usando uma das técnicas discutidas no Capítulo 6.)

Como uma análise heurística ajuda na coleta de requisitos?

Depois de concluir sua análise heurística, você terá uma compreensão mais profunda do estado
atual do site (ou de seus concorrentes) e uma lista de ideias que podem contribuir para a coleta de
requisitos. Você também terá algumas ideias sobre como estruturar os tópicos que precisará
abordar durante as sessões de levantamento de requisitos — o que nos leva à próxima etapa
desse processo.

ENTENDA O ESTADO ATUAL 73


Machine Translated by Google

Reúna ideias das partes interessadas


Como vimos em nosso exemplo no início deste capítulo, se você não entender o contexto de
uma ideia, como “Os clientes podem acompanhar seus pedidos on-line”, você corre o risco de
perder as diferenças de expectativas entre as partes interessadas, como as do nosso amigo quem
deseja que os pacotes sejam rastreados por GPS. Um dos erros mais comuns cometidos em
um projeto é agarrar-se a um recurso e chamá-lo de requisito sem primeiro entender o
problema e as expectativas
em torno de uma solução.

Então, por que o processo de coleta de requisitos é encurtado com tanta frequência?

Reunir ideias — e juntá-las em requisitos — pode levar bastante tempo. É fácil subestimar o
número de perguntas que você precisa fazer para delinear os requisitos para que possam ser
priorizados. E se o processo não estiver bem estruturado ou a participação for incompleta,
pode haver muita rotatividade que pode durar todo o projeto. (A rotatividade é o tempo
desperdiçado em reuniões extras e iterações de trabalho causadas pela falta de comunicação e
envolvimento. Estas são diferentes das iterações de trabalho mais produtivas que fazem parte do
projeto e do teste de soluções válidas em um esforço para encontrar a melhor.)

Então, como você incentiva um processo de requisitos bem equilibrado, focado nas
necessidades do negócio, mas que evita perder tempo? Aqui estão algumas etapas para um
processo eficiente:

1. Descreva funções e responsabilidades. Certifique-se de que os membros da equipe do


projeto entendam as funções que devem preencher à medida que os requisitos são coletados.

2. Reúna as partes interessadas certas, nos grupos certos, para garantir que o tempo seja
utilizado da melhor maneira durante entrevistas ou reuniões focadas nos requisitos.

3. Crie um plano para as reuniões, incluindo tópicos a serem abordados e perguntas a serem
feitas durante as reuniões.

4. Conduza as reuniões com eficiência, captando ideias e obtendo esclarecimentos.


Investigue ideias para descobrir as necessidades por trás de cada uma.

Quando suas reuniões terminarem, não se esqueça de agradecer às partes interessadas


envolvidas e mantê-las atualizadas sobre o progresso assim que você passar para uma lista
consolidada e priorizada.

Vamos examinar cada uma dessas etapas com mais detalhes.

74 CAPÍTULO 5: REQUISITOS DE NEGÓCIO


Machine Translated by Google

Descrever responsabilidades
O ato de coletar requisitos de negócios geralmente envolve membros da equipe do projeto
entrevistando as principais partes interessadas do negócio para reunir ideias.

As partes interessadas empresariais são aquelas dentro da empresa que têm uma
participação empresarial no sucesso do projeto ou que têm conhecimentos especializados para
contribuir, ou ambos. Essas pessoas não estão no projeto em tempo integral, mas precisam
estar envolvidas em pontos-chave do processo, e a coleta de requisitos é um desses pontos.
Tenha em mente que eles também têm empregos diurnos (por assim dizer), então seu tempo
é valioso e muitas vezes difícil de conseguir, a menos que você planeje com antecedência.

O patrocinador (ou patrocinadores) do projeto é a parte interessada do negócio que também


tem responsabilidade direta pelo sucesso do projeto, muitas vezes em um nível relativamente
alto na empresa, como o diretor. Ele ou ela não estará no projeto diariamente durante todo o
ciclo de vida do projeto, mas provavelmente estará ativamente envolvido na coleta de
requisitos e na garantia de um alto nível de participação das partes interessadas do negócio.
O patrocinador também pode participar de algumas ou de todas as sessões.

A equipe do projeto inclui pessoas oficialmente designadas para o projeto como recursos
contínuos. Eles podem estar envolvidos como gerente de projeto, designer UX, analista de
negócios, líder técnico, designer visual, líder de garantia de qualidade e assim por diante.
Dependendo do tamanho do projeto, este pode ser o trabalho principal.

Dentro da própria equipe do projeto, as responsabilidades durante a coleta de requisitos


muitas vezes não são claras. Reservar um tempo para definir responsabilidades desde o início
ajudará a garantir um processo de coleta eficiente.

Aqui estão algumas perguntas a serem feitas ao determinar as responsabilidades específicas


que cada membro da equipe assumirá durante a coleta de requisitos:

Quem é o principal responsável por reunir e programar as partes interessadas certas nos
grupos mais produtivos? Isso pode incluir partes interessadas internas e externas (como
parceiros, fornecedores e assim por diante).

Quem cria a estrutura de tópicos e perguntas para as reuniões das partes interessadas do
negócio? Este é um ótimo exercício colaborativo para a equipe, se o tempo permitir. O
facilitador principal pode então organizá-los numa estrutura que flua bem numa reunião.

Quem facilita as reuniões?

Quem faz anotações e como elas são compartilhadas?

REÚNE IDEIAS DAS PARTES INTERESSADAS 75


Machine Translated by Google

Quem acompanha quem depois?

Alguém da equipe de tecnologia estará presente em todas as reuniões?


Em caso afirmativo, como essa pessoa está envolvida (ela está ouvindo, fornecendo
informações ou algo mais)?

Como designer de UX, seja você o principal responsável por uma ou mais dessas áreas ou
não, você tem habilidades importantes para trazer para o processo. Criar uma estrutura para
tópicos e perguntas requer habilidade para categorização clara (o que parece um bom cruzamento
com a arquitetura da informação) e, claro, habilidades de facilitação são importantes para manter a
reunião no tópico, com a participação de todos os participantes.

Reúna as partes interessadas certas


O principal objetivo de entrevistar as partes interessadas é obter uma compreensão das ideias,
necessidades, conhecimentos e frustrações relevantes relacionadas ao projeto, a partir de vários
pontos de vista, que podem então alimentar os requisitos do projeto.

Há também o benefício, às vezes não declarado, de envolver muitos grupos diferentes, para
que cada um sinta que teve uma palavra a dizer no projeto – e, como resultado, aceitará a
solução final. Embora envolver as pessoas para obter a sua adesão possa parecer mais político
do que prático, muitas vezes é um passo fundamental que o coloca em contacto com uma rede
que o apoiará durante todo o projecto.
Também pode ajudá-lo a evitar mudanças de última hora, que podem ocorrer quando alguém
com quem você não conversou levanta um problema no final do processo. Portanto, envolver uma
grande variedade de pessoas é frequentemente uma boa ideia.

Por outro lado, os cronogramas e orçamentos devem ser mantidos em mente. Envolver um grande
número de pessoas leva tempo, do ponto de vista delas e do seu, apenas para as reuniões – sem
mencionar o tempo de classificação de notas para identificar tendências e consolidar redundâncias.
Para eficiência e sua própria sanidade, faz sentido priorizar os grupos com os quais conversar e
escolher pessoas-chave desses grupos para atuarem como líderes inovadores para sua equipe.

Quem são as possíveis partes interessadas que você poderia envolver? Esses grupos
costumam ser boas fontes de ideias:

Grupos com iniciativas que dependem do site (por exemplo, aqueles com campanhas de
marketing que precisam ter informações apresentadas no site)

76 CAPÍTULO 5: REQUISITOS DE NEGÓCIO


Machine Translated by Google

Grupos que precisam apoiar os processos diretamente por trás do site ou aplicativo, como
fornecer conteúdo, inserir e gerenciar dados e responder imediatamente às informações coletadas

A linha de frente do atendimento ao cliente, como suporte por telefone ou on-line ou qualquer
pessoa que lide com os clientes pessoalmente (por exemplo, em um local de varejo ou por meio
de entregas)

Vendas, gerenciamento de produtos ou serviços de consultoria, para representar os produtos


e serviços apresentados

Recursos humanos, para cumprir os objetivos de recrutamento

Relações públicas, para apresentação de informações aos investidores e à mídia

Quaisquer grupos responsáveis por outros relacionamentos que precisam ser desenvolvidos como
parte do projeto e que influenciarão seu desenho, como relacionamentos com parceiros ou
fornecedores

Ao escolher as pessoas que devem ser incluídas, peça ajuda ao patrocinador do projeto e a qualquer
membro da equipe do projeto que esteja familiarizado com os grupos envolvidos para escolher as
pessoas certas.

Crie grupos que promovam uma boa discussão. Não existe uma maneira certa de fazer isso, mas
uma maneira comum é agrupar as partes interessadas por departamento, assim:

Marketing (cinco pessoas)

Gestão de produtos (quatro pessoas)

Suporte ao cliente (duas pessoas)

Vendas (quatro pessoas)

Um projeto menor pode incluir uma pessoa de cada um destes grupos, numa série de duas ou
mais sessões de trabalho colaborativo onde todos se reúnem.

Depois de ter em mente as partes interessadas, bem como uma estrutura geral para as reuniões
(discutida na próxima seção), você pode começar a agendar as reuniões. Tente começar a agendar
com pelo menos algumas semanas de antecedência; pode ser difícil reunir todos em uma sala.

REÚNE IDEIAS DAS PARTES INTERESSADAS 77


Machine Translated by Google

Crie um plano para as reuniões


Paralelamente ao seu esforço para escolher as partes interessadas certas, reúna uma
lista de tópicos a serem abordados e perguntas que precisam ser feitas (isso também o
ajudará a refinar sua lista de partes interessadas). Você deve ter um plano diferente
para cada grupo com o qual se reunir, embora várias de suas perguntas possam ser as
mesmas de grupo para grupo.

Você também precisará decidir o nível de detalhe que deseja nas reuniões. Se você
estiver se reunindo com um grande número de pessoas apenas uma vez (por exemplo,
membros de vários departamentos, como sugerido acima), você vai querer reunir ideias,
mas provavelmente não vai querer perder muito tempo mergulhando no assunto. detalhes
corajosos durante a reunião. Nesse caso, se um dos seus stakeholders lhe der a ideia
“Os clientes podem acompanhar as suas encomendas online”, poderá querer
simplesmente perguntar porque é que esta função é importante e se o interessado consegue
pensar imediatamente num site que faça isto bem. Essas questões devem ajudar a trazer
à tona as principais diferenças entre as expectativas das partes interessadas em relação
ao recurso, sem gastar toda a reunião em uma única declaração. Você pode então
trabalhar os detalhes específicos da ideia com a equipe do projeto, conversando com a
parte interessada para garantir que os requisitos gerados ainda representem a ideia original
dele.

Digamos que você esteja redesenhando um site de comércio eletrônico e se reúna com
uma grande variedade de partes interessadas, realizando uma reunião com cada grupo.
Aqui está um exemplo de plano de reunião com um grupo de um departamento de vendas.

Vendas: Reunião de Levantamento de Requisitos


Participantes
Vendas internas: Jenny Bee, Tracy Kim, Joseph Arnold
Gerenciamento líder: Kevin Abernathy, Cat Parnell
Prazo: 2 horas

Objetivo: Compreender o processo de vendas atual e identificar problemas e


oportunidades de como a Web poderia oferecer melhor suporte a esse processo.
Histórico: revisamos uma apresentação em PowerPoint sobre o processo de compra,
que forneceu um bom histórico sobre como as decisões de compra são tomadas. Também
planejamos conversar com a equipe de Atendimento ao Cliente.

78 CAPÍTULO 5: REQUISITOS DE NEGÓCIO


Machine Translated by Google

Vendas: Continuação da Reunião de Levantamento de Requisitos


Questões
Processo de vendas:

Como o processo de vendas difere para diferentes linhas de produtos?

Existem diferenças regionais?

Algumas diferenças baseiam-se no tamanho do cliente (por exemplo, pequenas empresas


versus grandes empresas)?

Como evoluiu este processo nos últimos dois anos e como se prevê que evolua nos
próximos três a cinco anos?

Como um cliente potencial entende todas as coisas que precisam ser compradas e como
elas funcionam juntas?

Impressão geral:
Quem você acredita serem os principais visitantes do site atual? Por que? Como eles são? O
que eles estão tentando realizar no site?

Como a Web contribui para o processo de vendas e/ou para a taxa de fechamento de vendas
hoje?

Quais informações os clientes precisam para tomar uma decisão de compra? Essa
informação está disponível no site hoje? é fácil de encontrar? É preciso?

Quão difícil é manter o conteúdo do site hoje?

Quais métricas você obtém do site? Que métricas adicionais você consideraria valiosas? Por
que?

Prevendo o futuro:
Ao pensar em um futuro site, o que poderíamos fazer para apoiar melhor o processo de
vendas?
Quais funções e recursos atuais do site são essenciais para as vendas?

O que não é necessário?

O que está faltando?

Resumo:
Há algum outro pensamento, sugestão ou preocupação que não abordamos?

Quais sites você acha que fazem um excelente trabalho de suporte às vendas?

Qual é a primeira coisa que a empresa poderia fazer para melhorar a satisfação do cliente?

REÚNE IDEIAS DAS PARTES INTERESSADAS 79


Machine Translated by Google

Execute as reuniões de forma eficaz


Aqui estão algumas práticas que irão ajudá-lo nas reuniões de levantamento de requisitos.

Certifique-se de que um vocabulário compartilhado seja usado

Muita confusão pode ser evitada se a equipe que coleta os requisitos concordar com uma
lista comum de termos e definições. Por exemplo, as pessoas que usam o sistema serão
chamadas de usuários, clientes ou clientes? As pessoas estão mais familiarizadas com o
termo designer de interação ou arquiteto de informação?

Para evitar confusão, reserve algum tempo no início de cada reunião para indicar
qual termo está sendo usado e o que significa. Você também pode se beneficiar da criação
de alguns elementos visuais que ajudam a explicar as relações entre diferentes termos
ou funções (ver Figura 5.3).

Figura 5.3 Diagrama mostrando


Categoria Categoria Categoria os termos e relacionamentos do projeto

Subcategoria Subcategoria Subcategoria

Tema Tema Tema

Artigo Artigo Artigo

Um vocabulário comum para os resultados que serão utilizados no projeto também


ajudará as partes interessadas a compreender o processo e o tipo de resultados que
podem esperar ver. Isso pode gerar confiança de que seu tempo e esforço não irão
para um buraco negro de ideias.

Geralmente, se você definir as mesmas palavras mais de uma ou duas vezes


(especialmente se achar que as definições mudam sutilmente a cada vez), considere
colocá-las em um glossário do projeto e compartilhá-lo com a equipe do projeto. Outros
exemplos de terminologia que é bom esclarecer no início do projeto incluem

80 CAPÍTULO 5: REQUISITOS DE NEGÓCIO


Machine Translated by Google

Funções que interagirão (por exemplo, candidato a emprego versus cliente ou produtor de conteúdo
versus editor)

Entregáveis primários que serão amplamente referenciados (especificações funcionais,


wireframes, mapa do site) e uma breve descrição de como eles diferem

Distinções entre diferentes níveis de informação (como a nossa informação de categoria na Figura
5.3)

Distinções entre necessidades e ideias

Ouça as ideias e analise as necessidades

As partes interessadas podem fazer declarações que pareçam ser necessidades. Considere
um exemplo.

Negócios “Precisamos de um blog no site.”


Advogado
B

Esta é realmente uma ideia, não uma necessidade. Se a funcionalidade do blog for totalmente
projetada e implementada, ela se tornará uma solução, mas não é necessariamente a solução que
melhor atende às necessidades básicas das partes interessadas que a solicitam.

Ao perguntar por que um blog é importante, você poderá obter uma ampla gama de declarações de
necessidades, como

“Precisamos parecer relevantes e em contato. Todo mundo está falando sobre blogs, e sinto que
ficaremos atrasados se não os incluirmos.”

“Precisamos de uma maneira de fazer com que as pessoas acessem o site repetidamente
para gerar mais receita publicitária, e blogs significam conteúdo recém-publicado com seguidores.”

“Precisamos nos posicionar como líderes inovadores, e os blogs são uma forma mais pessoal
de mostrar nossa experiência.”

“Precisamos ter uma maneira melhor de nos comunicar e inovar com nossos clientes, e os blogs
nos enviam comentários para que possamos ouvir suas opiniões.”

Cada uma dessas declarações descreve necessidades válidas. Ao trazê-los à tona, você aprenderá
sobre os motivadores por trás das solicitações de recursos específicos, o que o ajudará a construir
consenso à medida que você consolida e prioriza requisitos.

REÚNE IDEIAS DAS PARTES INTERESSADAS 81


Machine Translated by Google

Requisitos de coalescência
Quando as reuniões terminarem, pegue as ideias que você reuniu e classifique-as em áreas
gerais de funcionalidade. Você começará a notar muitas sobreposições; este é um bom sinal de
que uma ideia específica tem muita adesão das partes interessadas.
Remova redundâncias e tente consolidar uma lista de ideias que capte de forma eficiente a
intenção das partes interessadas.

Para transformar as ideias reunidas em componentes úteis e rastreáveis do seu projeto, você
precisará agrupar essas ideias em requisitos. Pense nas gotas de chuva se formando a partir
de uma nuvem: você está passando de uma nuvem grande e indefinida para um número
maior de gotas de chuva bem definidas.

Portanto, quando você tiver uma nuvem de ideias como “Os clientes podem rastrear seus
pedidos on-line”, será necessário convertê-la em declarações distintas que definam o que o
sistema precisa fazer. Os requisitos resultantes devem

Fornecer insights sobre a necessidade geral que deve ser atendida

Representar e consolidar necessidades fornecidas por diferentes partes interessadas

Dar orientação para o design, sem ser muito específico sobre como isso será realizado

Servir como uma unidade distinta de trabalho para fins de priorização e rastreamento

À medida que você começa a passar das ideias aos requisitos, certifique-se de que seu líder
técnico (ou outra pessoa que possa representar a equipe de desenvolvimento em seu projeto)
esteja envolvido para fazer as perguntas que ajudarão a estimar o esforço necessário
quando você priorizar posteriormente. Se você tiver um membro dedicado da equipe de
garantia de qualidade, essa pessoa também poderá fornecer algumas perguntas detalhadas
para ajudar a unir os requisitos.

Para detalhar a ideia de rastreamento em requisitos, faça perguntas como

Quão preciso deve ser o rastreamento?

Que tipo de informação deve ser incluída nos detalhes de rastreamento; por exemplo,
precisamos fornecer uma estimativa atualizada do prazo de entrega?

Perguntas desse tipo podem ser feitas e detalhadas com os stakeholders que lhe deram a
ideia original, caso eles tenham muito tempo dedicado ao projeto. Se você não tiver tanto
acesso a essas partes interessadas, poderá resolver os detalhes sozinho, conversando com
a equipe do projeto.

82 CAPÍTULO 5: REQUISITOS DE NEGÓCIO


Machine Translated by Google

e depois revisar os requisitos com o patrocinador do projeto para garantir que suas escolhas
façam sentido para o negócio.

A Tabela 5.1 lista os tipos de requisitos que podem surgir da ideia de rastreamento e como
você pode capturá-los.

TABELA 5.1 Um exemplo de requisitos de negócios


ÁREA DE IDENTIFICAÇÃO REQUERIMENTO NECESSIDADE DE NEGÓCIO

1 Rastreamento de pedidos Os pedidos podem ser rastreados Incentive o autoatendimento

inserindo um código de rastreamento durante a entrega (Suporte


on-line beneficiar)

2 Rastreamento de pedidos Os usuários podem rastrear seus Mostrar inovação em eficiência

pacotes por GPS, seguindo caminhões entrega eficiente (Competitiva

ou aviões beneficiar)

3 Os usuários de rastreamento de pedidos podem visualizar todos os Incentive novos pedidos e

pedidos anteriores feitos nos últimos 365 dias autoatendimento (vendas, suporte

beneficiar)

Observe que em alguns casos os requisitos se sobrepõem, como no caso dos dois primeiros
requisitos da tabela – ambos são métodos de rastreamento. Eles podem morar juntos no
mesmo sistema porque você pode inserir um código para localizar seu pacote através da
visualização GPS. Eles estão separados, entretanto, porque o requisito relacionado ao GPS
é provavelmente um esforço maior e deve ser priorizado independentemente dos outros
recursos.

Ao consolidar as declarações, observe os requisitos de negócios que você acha que podem
entrar em conflito com as necessidades do usuário. Por exemplo, um requisito comercial
poderia ser coletar informações pessoais de clientes em potencial, como seus endereços de e-
mail. Mas os clientes podem ter reservas quanto ao fornecimento de informações. Afinal, o
preenchimento de formulários leva tempo, a segurança e a privacidade são uma preocupação,
e essa etapa pode estar interrompendo a tarefa maior que eles estão tentando realizar.

À medida que você identifica conflitos como esses, eles começarão a lhe dar ideias que
poderão ajudá-lo a atender às necessidades da empresa e dos usuários. Para o exemplo de
rastreamento, você pode sugerir o uso do recurso “Enviar para um amigo” para capturar o
endereço de e-mail e fornecer comodidade ao usuário. Isso significa que Enviar para um
amigo pode se tornar um requisito que você coloca no mix para priorização. Idéias como esta

REÚNE IDEIAS DAS PARTES INTERESSADAS 83


Machine Translated by Google

pode-se ajudar a atender aos requisitos de negócios e de usuários, por isso são ótimos para
capturar. Eles também vivem naquela área sobreposta entre as fases Definir e Projetar (veja
o Capítulo 4), porque você está começando a pensar em soluções de design para
problemas de negócios.

Definir

Projeto

Desenvolver

Conflitos potenciais entre as necessidades do negócio e do usuário são coisas excelentes


para explorar durante a pesquisa do usuário, que discutiremos no próximo capítulo. Do utilizador
a pesquisa também permitirá estender a Tabela 5.1 a um conjunto completo de requisitos
potenciais, que serão priorizados em uma lista de requisitos do projeto (mostrados na
Figura 5.1 e discutidos mais detalhadamente no Capítulo 9). Lembre-se de que a coleta de
requisitos de negócios geralmente ocorre em paralelo com a exploração de possibilidades
técnicas e a coleta de requisitos do usuário.

A seguir: hora de falar sobre os usuários!

84 CAPÍTULO 5: REQUISITOS DE NEGÓCIO


Machine Translated by Google

6
Pesquisa de usuário
Conheça os convidados que você é
Convidando para a festa

Existem muitas técnicas de pesquisa de usuários que podem ser


usado durante todo o ciclo de vida do projeto, seja para entender
melhor seus usuários ou para testar seu comportamento em
versões de um site. Este capítulo se concentrará em alguns dos
métodos que são mais comumente usados no início
etapas do projeto.

Estas técnicas irão ajudá-lo a definir os grupos de usuários que


devem ter maior prioridade durante o projeto, colocar
suas necessidades e frustrações no contexto, e avaliar o

desempenho do site atual (se existir) usando as melhores práticas


na área de design de experiência do usuário.

Carolyn Chandler
Machine Translated by Google

Etapas básicas da pesquisa do usuário


1. Defina seus grupos de usuários principais. Isso envolve a criação de uma estrutura que
descreva os principais tipos de usuários para os quais você está projetando, permitindo que
você concentre seus esforços no recrutamento de usuários para pesquisa.

2. Planeje o envolvimento do usuário. Isto inclui a escolha de uma ou mais técnicas para
envolver grupos de usuários na pesquisa, com base nas necessidades do seu projeto.

3. Conduza a pesquisa. Abordaremos aqui as técnicas básicas, como entrevistas e pesquisas,


e daremos dicas sobre como realizá-las.

4. Valide suas definições de grupo de usuários. Usando o que você aprendeu com a
pesquisa, você pode solidificar seu modelo de grupos de usuários. Este modelo servirá então
como plataforma para o desenvolvimento de ferramentas mais detalhadas, como personas
(discutidas no Capítulo 7).

5. Gere requisitos do usuário. Estas são declarações dos recursos e funções que o site pode
incluir. Você adicionará essas declarações aos seus requisitos de negócios (discutidos no
Capítulo 5) e priorizará-as para se tornarem requisitos do projeto (discutidos no Capítulo
9).

Este capítulo cobrirá as três primeiras etapas, começando pela primeira: definir
seus grupos de usuários.

Defina seus grupos de usuários


Planejar a pesquisa do usuário no início de um projeto pode parecer um dilema do ovo ou da
galinha (o que vem primeiro?). Como você pode ter certeza de que está falando com as pessoas
certas, se ainda não sabe quem essas pessoas precisam ser?

Uma maneira de começar é criar uma definição inicial ou provisória dos usuários para os quais
você projetará. Descreve os principais grupos de usuários do seu site, o que pode ajudá-lo a
concentrar seus esforços de pesquisa nas funções, gráficos demográficos ou outras variáveis
corretas que possam ter impacto na forma como os usuários experimentarão seu site. As
definições de grupos de usuários podem ser de alto nível (uma lista definindo cada um dos grupos
de usuários-alvo) ou detalhadas e visuais (um diagrama que mostra vários tipos de usuários,
bem como como eles interagem entre si).

86 CAPÍTULO 6: PESQUISA DO USUÁRIO


Machine Translated by Google

Uma definição de alto nível para o site .com principal de uma empresa pode incluir os seguintes
grupos de usuários: compradores potenciais, compradores atuais, parceiros e candidatos a
emprego

Ao começar a definir grupos para pesquisa de usuários, você começará a priorizar grupos de
usuários com mais detalhes.

Suas definições iniciais baseiam-se no conhecimento coletivo das partes interessadas do


negócio e dos membros da equipe do projeto em relação aos tipos potenciais de usuários
que podem estar interagindo com o site. Essas definições podem ser construídas coletando
alguns dos objetivos e atributos que diferentes grupos de usuários possam ter. Aqui estão as
etapas básicas para definir seus grupos de usuários:

1. Crie uma lista de atributos que o ajudarão a definir os diferentes usuários do seu site (a
próxima seção abordará alguns dos mais comuns).

2. Discuta os atributos com as pessoas da empresa que têm contato com


tipos relevantes de usuários (por exemplo, clientes).

3. Priorize os atributos que parecem ter o maior impacto sobre o porquê e


como um usuário potencial usaria seu site ou aplicativo.

4. Defina os grupos de usuários nos quais você se concentrará na pesquisa e no design.

As próximas seções examinam mais de perto algumas técnicas de brainstorming para ajudá-
lo a coletar esses atributos e como priorizá-los e modelá-los (criando representações dos
diferentes tipos de usuários que o ajudarão a concentrar seus esforços de pesquisa).

Crie uma lista de atributos


Um bom começo para sua lista de atributos é reunir e absorver qualquer pesquisa ou outra
documentação que a organização possua e que possa fornecer orientação em relação aos
usuários. Aqui estão algumas fontes potenciais:

Documentos que explicam as estratégias da empresa, como objetivos da empresa,


informações competitivas, estratégias de marketing e planos de negócios

Segmentações de mercado de clientes atuais e outros dados demográficos coletados pelo


departamento de marketing

Pesquisa de usuários realizada anteriormente (ver Tabela 6.1 para alguns exemplos)

DEFINA SEUS GRUPOS DE USUÁRIOS 87


Machine Translated by Google

Pesquisas, como pesquisas de satisfação do usuário e formulários de feedback

Relatórios de atendimento ao cliente cobrindo problemas que ocorrem com frequência

Em seguida, identifique pessoas dentro da organização que tenham alguma visão sobre os usuários
atuais ou potenciais. O número e a variedade de pessoas que você deve incluir dependem do tipo de
projeto e de seu escopo e cronograma. Se você sabe que a definição inicial de seus grupos de
usuários pode ter uma vida útil curta (por exemplo, está em uso por apenas um ou dois meses enquanto
a pesquisa de usuários está sendo planejada), você pode incluir apenas dois ou três participantes.
Se você acha que a definição inicial pode precisar mantê-lo durante uma boa parte do processo de
design (por exemplo, se você só tiver esta para trabalhar até realizar testes de usabilidade, depois de
algum design ter sido feito), inclua mais participantes e garanta que você tenha uma seção transversal
de perspectivas.

Alguns possíveis participantes incluem a equipe de marketing responsável pela representação,


segmentação e campanhas da marca; equipe de vendas; gerentes de produto; representantes de
atendimento ao cliente ou suporte; e treinadores.

Também é bom incluir a liderança da equipe do projeto e outras partes interessadas do negócio.
titulares neste exercício.

Peça ao grupo que pense nos diferentes tipos de usuários potenciais com os quais eles tendem a
interagir. Em seguida, peça-lhes que listem alguns dos atributos comuns que encontraram. Aqui estão
alguns exemplos do que pode variar:

Objetivos principais, pois estão relacionados ao assunto do seu site. Por que os usuários estão
recorrendo a isso e o que estão tentando realizar? Por exemplo, comprar um item, negociar
uma ação ou obter resposta a uma pergunta específica são objetivos comuns.

Funções. Isso pode ser definido de várias maneiras, mas uma delas é vincular as funções ao objetivo
principal do usuário: candidato a emprego, candidato a suporte, cliente potencial e assim por diante.
Depois de ter mais informações sobre o usuário, as funções podem ser subdivididas por diferentes
necessidades ou estilos; por exemplo, num site de comércio eletrónico, os compradores podem
incluir caçadores de pechinchas e conhecedores.

Dados demográficos, incluindo idade, sexo, família (solteiro, casado, filhos), nível de renda
e região.

Experiência incluindo nível de educação, nível de familiaridade com tecnologias relevantes (muitas
vezes referidas como conhecimento técnico), nível de conhecimento no assunto e frequência de uso
(pontual, ocasional, frequente).

88 CAPÍTULO 6: PESQUISA DO USUÁRIO


Machine Translated by Google

Atributos organizacionais, incluindo o tamanho da empresa para a qual os usuários


trabalham, seu departamento, tipo de trabalho (nível inicial, freelancer, gerenciamento
intermediário, executivo), mandato (longo prazo ou alta rotatividade?) e padrões de trabalho
(trabalho remoto , quantidade de viagens).

Depois de ter uma lista de alguns dos atributos que aparecem com mais frequência quando
as partes interessadas descrevem usuários em potencial, você pode começar a priorizá-los por
seu nível de importância e depois usar essa hierarquia para começar a definir e modelar grupos de
usuários.

Priorizar e definir
Quais dos atributos listados acima você acha que têm maior influência sobre como e por que
diferentes grupos de usuários podem usar o site? Concentre-se naqueles que você acha que terão
maior impacto nos objetivos ou comportamento do usuário.
Priorize esses atributos e lembre-se dos objetivos que você criou no Capítulo 4 – eles
também ajudarão a orientar suas escolhas.

Um exemplo ilustra melhor como priorizar atributos. Digamos que você esteja trabalhando
com uma empresa que fornece ferramentas para negociação on-line de ações, opções e
futuros. Esta empresa em particular determinou que parte da sua estratégia consistirá em envolver
não-profissionais que negoceiam ações por conta própria, online, e incentivá-los a tentar
negociar novos tipos de produtos, como opções e futuros. A empresa planeja fazer isso
fornecendo ferramentas de negociação fáceis de usar e voltadas para aqueles que desejam
aprendizado prático em um ambiente seguro.

Ao discutir atributos com as partes interessadas da empresa, você pode descobrir que os seguintes
parecem ter o maior impacto sobre como os indivíduos podem usar essas ferramentas:

Frequência atual de negociação, especificamente, frequência de negociação on-line direta


(por exemplo, uma vez por trimestre, uma vez por dia, várias vezes por dia). Aqueles que
apenas se envolvem em negociação (digamos, uma vez por mês) podem não levar a sério
a tentativa de algo novo, enquanto aqueles que já negociam em tempo integral podem não
encontrar muito valor em ferramentas direcionadas aos traders mais novos. Mas aqueles que
são comerciantes activos a tempo parcial podem ter um grande interesse nas ferramentas da empresa.

Número de tipos de produtos negociados: apenas ações ou ações, opções e futuros.


Aqueles que já comercializam todos os tipos de produtos podem já ter preferência pelas suas
próprias ferramentas, mas aqueles que comercializam apenas um tipo podem estar prontos
para diversificar para outros.

DEFINA SEUS GRUPOS DE USUÁRIOS 89


Machine Translated by Google

Nível de conhecimento no assunto (por exemplo, familiaridade com os termos


comerciais). Isso ajudará a determinar quanta ajuda eles precisarão ao longo do
caminho, com tutoriais e glossários.

Nível de conhecimento técnico (por exemplo, familiaridade com compras on-line e


transações bancárias e transações on-line). Isso influenciará o quanto eles
precisarão de garantias sobre a privacidade das informações e o quão avançada ou
simples a interface on-line precisa ser.

Você pode priorizar esses atributos porque eles podem afetar os tipos de usuários que
você almejará para pesquisa. Se o local onde os comerciantes vivem não parece ter um
impacto real sobre como ou por que eles negociam, o atributo Região pode ser retirado
da lista como uma consideração para os participantes da pesquisa. Por outro lado, se
a importância de um atributo específico suscita muita discussão, ele pode ser um bom
tema para uma pergunta de pesquisa ou de entrevista (discutiremos pesquisas mais
adiante neste capítulo).

Comparar dois ou mais atributos também pode ajudá-lo a priorizar. Por exemplo, se você
fizer um gráfico usando dois atributos para traders on-line, poderá começar a ver como os
grupos se enquadram em alguns dos intervalos. A Figura 6.1 é um exemplo de um modelo
de usuário aproximado que você poderia fazer usando os dois atributos de Frequência
de Negociação Direta e Número de Tipos de Produtos Negociados; também mostra os
grupos de usuários resultantes que podem se formar a partir da discussão.
Alto
Figura 6.1 Um gráfico de dois atributos,
representando um modelo de usuário aproximado.
Tempo total Tempo total
A criação deste modelo de forma colaborativa
Especialistas em produtos Generalistas experientes pode facilitar a discussão sobre
possíveis diferenças nas motivações e
Traders de “segundo emprego”
experiências dos usuários.

Suplementar Ativo
Comerciantes de Renda Exploradores

Frequência

Investidores de longo prazo

Baixo Interessados

Baixo Alto

Número de tipos de produtos negociados (ações, opções, futuros)

90 CAPÍTULO 6: PESQUISA DO USUÁRIO


Machine Translated by Google

Este modelo de usuário fornece uma maneira de alto nível para discutir diferentes tipos
de usuários. Não pretende ser o modelo final e não rotula exclusivamente grupos de
usuários (um usuário pode ser um investidor de longo prazo em ações e também explorar
ativamente outras possibilidades em opções ou futuros). Mas começa a expressar sua
compreensão dos diferentes grupos de usuários e como eles podem ser motivados a usar o seu site.

Esta discussão sobre atributos importantes também ajuda você a descobrir quais deles
você deseja focar ao recrutar usuários para pesquisa.
Se você determinar que a frequência de negociação é importante e que a prioridade será
envolver aqueles que atualmente têm um nível médio de frequência, você desejará definir o
que significa frequência média (uma a três vezes por semana, por exemplo). ) e recrute os
participantes da sua pesquisa de acordo.

Falando em pesquisa, vamos falar sobre técnicas que você pode usar para envolver os
usuários em seu projeto.

Você pode projetar apenas a partir de modelos de usuário?


Há um debate no campo da experiência do usuário sobre a criação de modelos de usuário
antes da pesquisa ser realizada, porque isso pode influenciar seu pensamento antes de você
ter dados reais do usuário e porque sua equipe ou patrocinador do projeto pode ver o
modelo como um substituto para a pesquisa do usuário. Usar um modelo não validado
introduz mais risco de que suas suposições estejam incorretas. Em projetos onde você
não terá nenhum contato com os usuários, entretanto, um modelo bem pensado (verificado
com fontes fora da equipe do projeto, como um grupo de atendimento ao cliente ou grupo
de treinamento) é melhor do que não ter nenhum modelo para usar durante o projeto.

Escolhendo Técnicas de Pesquisa


Agora que você tem uma ideia aproximada dos grupos de usuários que deseja incluir, é
hora de planejar a próxima etapa: suas recomendações sobre a quantidade e o tipo de
atividades de pesquisa de usuários a serem realizadas durante o projeto.

A Tabela 6.1 apresenta algumas informações sobre as técnicas de pesquisa mais utilizadas
e quando elas são frequentemente mais úteis. Use esta tabela como referência para
ajudá-lo a escolher quais se aplicam melhor ao seu projeto. A próxima seção descreve
cada técnica com mais detalhes.

ESCOLHENDO TÉCNICAS DE PESQUISA 91


Machine Translated by Google

TABELA 6.1 Técnicas comuns de pesquisa de usuários

ATIVIDADE O QUE É ISSO QUANDO É ÚTIL DESAFIOS PERÍODO DE TEMPO TÍPICO *

Entrevistas com usuários individuais Há acesso a Obtendo opiniões 2–4 semanas por 12

Conversação com usuários, mas o tipo de diretas. entrevistas: Até uma

um participante que acesso (presencial, por Pode ser difícil semana para planejar,

pertence a um dos telefone, etc.) varia. coletar informações sobre 1–2 semanas para

principais sites do site atitudes e entrevistar e até uma

grupos de usuários. contexto, especialmente se semana para compilar os resultados.


Você deseja obter
as entrevistas forem
contexto, mas não pode ir
até o usuário. conduzido remotamente.

Contextual Uma visita no local A equipe do projeto tem Obtendo acesso aos 3–4 semanas por 12

Investigação com participantes poucas informações participantes. Indo para o consultas: 1 semana para
observar e nos usuários-alvo. ambiente dos usuários planejar, 1–2 semanas
aprenda como pode levantar para observar, 1 semana
Os usuários trabalham em um

eles trabalham em seu preocupações sobre para analisar e relatar


ambiente único (por
ambiente normal e segurança, propriedade resultados.
exemplo, um hospital).
diário. intelectual e intrusividade.
Os usuários estão Para negócios
trabalhando com tarefas ou
aplicações, é
fluxos de trabalho bastante complexos.
pode ser mais fácil de visitar

em um dia de trabalho.

pesquisas Uma série de perguntas que Você quer declarar Obtendo uma amostra 3-4 semanas para um

consistem principalmente resulta em mais apropriada. pesquisa de curto prazo:


em respostas fechadas termos quantitativos (por 1 semana para planejar e
Certificando-se de que as
(múltipla escolha) exemplo, “80% do perguntas estão bem redigir a pesquisa, 1–2

utilizado para identificar grupo de usuários-alvo semanas para executá-la


escrito para que
padrões entre um grande disseram que nunca a pesquisa, 1 semana
você obtém respostas
número de pessoas. compram carros online”). para analisar e
precisas sem

Você é mais inter- relatar os resultados.


conduzindo os

empenhado em coletar entrevistados para um determinado


informações sobre responder.

preferência do que o

desempenho real.

92 CAPÍTULO 6: PESQUISA DO USUÁRIO


Machine Translated by Google

TABELA 6.1 Técnicas comuns de pesquisa de usuários (continuação)


ATIVIDADE O QUE É ISSO QUANDO É ÚTIL DESAFIOS PERÍODO DE TEMPO TÍPICO *

Grupos de foco Uma discussão em grupo A equipe acredita Compreender como 3–4 semanas: 1 semana

onde um moderador que as atitudes dos usuários direcionar suas perguntas planejar e escrever

conduz os participantes influenciará fortemente para obter as informações perguntas, 1–2

através de perguntas o uso de corretas. semanas para realizar

sobre um tópico específico. a solução (por exemplo, grupos focais, 1–2


Facilitando o grupo
Concentra-se na descoberta se tiver havido semanas para analisar
de forma eficaz.
conhecer os sentimentos, problemas com isso e relatar os resultados.

atitudes e ideias dos historicamente).


participantes sobre o

tema.

Classificação de cartões Os participantes Você está trabalhando Determinar quais tópicos 3–4 semanas: 1 semana

recebem itens (como uma fonte de conteúdo seriam planejar e preparar,

tópicos) em cartões e site com muitos itens e melhor incluir. 1 semana para realizar

são solicitados a classificar deseja um efeito pesquisa, 1–2 semanas

em grupos que sejam estrutura tiva para para analisar e

significativos para eles. seus grupos de usuários. relatar os resultados.

Teste de usabilidade Os usuários tentam realizar Uma solução existente Escolhendo as 3–4 semanas por 10

tarefas típicas em um está sendo melhorada. tarefas apropriadas para usuários e meio

site ou aplicativo focar em. formalidade: 1 semana


Apenas competitivo-
enquanto um facilitador para planejar e escrever
estão disponíveis Determinando o quão
tor observa e, em as tarefas, 1 semana para
testar. formal deve ser
alguns casos, faz executar os testes, 1–2
o teste.
Você tem um protótipo
perguntas para semanas para
entender os usuários que permite aos usuários
analisar e relatar os resultados.
comportamento.
completar (ou simular)
tarefas.

* O período de tempo típico representa o tempo frequentemente necessário a partir do momento em que os usuários estão agendados. São assumidos
dois grupos de seis a oito usuários (exceto para pesquisas, onde o número de usuários deveria ser maior). Isto não inclui o tempo de recrutamento,
que pode demorar uma a duas semanas após a criação do questionário de triagem.

Quantas atividades de pesquisa posso incluir?


Antes de escolher entre as atividades, pergunte-se quanto dinheiro e tempo a equipe pode dedicar
à pesquisa de usuários. Considere as situações a seguir para entender o quanto sua empresa cliente
tem interesse pela pesquisa de usuários.

Se a liderança do projeto e os patrocinadores do projeto se sentirem confortáveis com a


pesquisa do usuário e estiverem interessados em usá-la para objetivos conhecidos, como garantir
que o site atenda aos objetivos específicos do projeto, então você provavelmente terá mais margem de manobra

ESCOLHENDO TÉCNICAS DE PESQUISA 93


Machine Translated by Google

no planejamento de duas ou mais atividades ou de uma atividade realizada diversas vezes


(por exemplo, testar um projeto, alterá-lo com base nos resultados e testar novamente o
novo projeto).

Se ninguém na organização estiver familiarizado com a pesquisa de usuário e houver alguma


resistência a ela, talvez seja melhor propor uma rodada de pesquisa e escolher a técnica
que você acha que trará mais valor para você, para a equipe do projeto e para o partes
interessadas do negócio. Depois de obter os resultados da pesquisa, a equipe do projeto terá
uma ideia melhor do que está envolvido e de como o projeto pode se beneficiar. Você
terá então um forte argumento para incluir mais pesquisas posteriormente, se necessário.

Se você tiver espaço para pelo menos duas rodadas de pesquisa, uma boa abordagem é
incluir uma rodada durante a fase Definir, ou no início da fase Design, para entender melhor
os usuários. Em seguida, inclua mais uma rodada antes do início do desenvolvimento, para
validar o design. Por exemplo, para um aplicativo baseado em tarefas, você pode realizar
entrevistas com usuários antes de projetar e, em seguida, realizar testes de usabilidade em
um protótipo posteriormente no processo. Ou, para uma fonte de conteúdo, você pode
começar com uma investigação contextual e depois incluir um exercício de classificação de cartões.

Considerações ao planejar pesquisas


Ao planejar qualquer técnica de pesquisa, considere o seguinte:

Por que você está conduzindo a pesquisa: o que você quer aprender com ela

Quem você está incluindo: os principais grupos de usuários descritos acima

Como você conseguirá participantes: recrutando pessoas para participar e selecionando-as (ou

seja, fazendo perguntas para ter certeza de que elas se enquadram nos grupos de usuários que

você está almejando)

Como você compensará os participantes

Que espaço e equipamento você precisará

O que você está cobrindo: os tópicos principais

Como você está capturando informações: o número de pessoas envolvidas e as ferramentas que

elas usam

O Capítulo 13 abordará cada uma dessas considerações como parte de uma análise detalhada de

uma das técnicas mais comuns usadas por designers de UX: testes de usabilidade.

94 CAPÍTULO 6: PESQUISA DO USUÁRIO


Machine Translated by Google

Nota Consulte o Capítulo 2 para obter mais informações sobre aplicativos baseados em tarefas e fontes de conteúdo.

Surfar
Steve Baty escreveu um artigo descrevendo diferentes métodos e como
escolher entre eles com base na fase de desenvolvimento, nas suas necessidades de
informação e na flexibilidade que você tem para incorporar a pesquisa do usuário. É intitulado
“Bite-Sized UX Research”, por Steve Baty, UXmatters: http://uxmatters.com/MT/
arquivos/000287.php.

Vamos dar uma olhada em cada uma dessas técnicas e como elas são comumente
usadas.

Entrevistas com usuários

As entrevistas com usuários são conversas estruturadas com usuários atuais ou potenciais
do seu site. Estas podem ser realizadas por telefone, pessoalmente em um local neutro
(como uma sala de conferências) ou, idealmente, no ambiente em que o usuário
provavelmente usará o site. (Esta última situação também é ótima para conduzir uma
investigação contextual, abordada abaixo.)

As entrevistas ajudam a compreender as preferências e atitudes dos participantes, mas


não devem ser usadas para fazer declarações formais sobre o desempenho real. Se
você está procurando informações específicas sobre como as pessoas interagem com
um site, é melhor observá-las usando-o (por exemplo, em uma consulta contextual) ou
pedir-lhes que executem tarefas no site (durante testes de usabilidade). Site
a análise também pode fornecer alguns insights sobre algumas informações de
desempenho que podem ser particularmente fortes quando combinadas com entrevistas
ou consultas que fornecem contexto para os dados.

O Processo Básico

Para entrevistas com usuários, o designer UX cria uma lista de perguntas destinadas a
obter informações como as seguintes:

Experiência relevante com o site ou com o assunto

ESCOLHENDO TÉCNICAS DE PESQUISA 95


Machine Translated by Google

A marca da empresa, vivenciada pelo participante

Atitudes, por exemplo, em relação às categorias de assuntos abrangidas (para uma fonte de
conteúdo), ao processo que está sendo projetado (para uma aplicação baseada em tarefas) ou aos
métodos de marketing (para uma campanha de marketing)

Objetivos ou necessidades comuns que levam os usuários ao seu site ou ao de um


concorrente

Próximas etapas comuns que os usuários realizam após visitar o site da empresa

Outras pessoas que estão envolvidas na experiência. Por exemplo, um usuário tende a
colaborar com outra pessoa como parte de um objetivo maior que está tentando alcançar?
É provável que compartilhem informações ou peçam a opinião de outras pessoas ao longo do
caminho?

Qualquer outra informação que o ajude a validar as suposições que você fez sobre grupos de
usuários até este ponto – por exemplo, se as variáveis que você discutiu ao criar um modelo de
usuário provisório realmente parecem influenciar a forma como os usuários estão experimentando
seu site

Se mais de uma pessoa estiver conduzindo entrevistas, é uma boa ideia ter uma lista definida de
perguntas e um roteiro de introdução que possa ser usado para manter a consistência entre as
entrevistas.

Escolha com antecedência como você deseja que as entrevistas sejam estruturadas. Se você está
optando por um relatório formal, provavelmente desejará um alto grau de estrutura, onde a
ordem das perguntas não varie muito e todas as perguntas sejam feitas, com poucos acréscimos.
Se a riqueza dos dados for mais importante do que a consistência, você pode decidir optar por
entrevistas semiestruturadas, onde você começa com uma lista de perguntas, mas permite que a
conversa siga um caminho natural, com o entrevistador fazendo perguntas para explorar ainda mais
comentários interessantes ( chamada sondagem).

A duração da sua entrevista pode variar; 45 a 60 minutos costuma ser o melhor intervalo para
atirar. Isso lhe dá tempo suficiente para construir um relacionamento e cobrir uma ampla gama de
questões sem cansar o participante.

As entrevistas com usuários fornecem um rico conjunto de dados que você pode usar para escrever
personas, que são abordadas no Capítulo 7.

96 CAPÍTULO 6: PESQUISA DO USUÁRIO


Machine Translated by Google

Dicas para entrevistas

A qualidade das informações que você obtém em uma entrevista tem muito a ver com a
qualidade das perguntas que você faz.

Concentre-se nas experiências pessoais dos participantes. Não peça que especulem sobre o que
poderão fazer no futuro ou sobre o que outros poderão fazer. Esse tipo de informação raramente
prevê o que eles realmente farão.

Não faça perguntas que impliquem uma resposta específica ou que levem o participante a
uma direção positiva ou negativa. Idealmente, as perguntas são simples, neutras e abertas. Alguns
exemplos de perguntas principais são

O que você gosta no PseudoCorporation.com?

Isso pressupõe que o usuário goste de usar o site. Use esta pergunta apenas se você
também perguntar o que eles não gostam nela.

PseudoCorporation.com atende às suas expectativas?

Isso pode ser respondido com um simples sim ou não, o que não fornece muitos detalhes
para ajudar em seus esforços de design.

Você prefere usar PseudoCorporation.com ou CompetitorVille.com e, neste último caso,


por que você acha que eles são melhores que Pseudo?

Isso tem alguns problemas: é fazer duas perguntas em uma afirmação e forçar uma opinião
implícita ao participante.

Melhores perguntas a serem feitas são estas:

Conte-me sobre sua última visita a PseudoCorporation.com. Por quê você foi lá?

O que você lembra da sua visita?

Se você estiver realizando um conjunto de entrevistas mais formais e em grande escala, talvez
queira incluir algumas questões de múltipla escolha. Na maioria das vezes, porém, eles não
fornecem informações muito ricas. Eles podem ser difíceis de serem seguidos pelos participantes
quando solicitados verbalmente e não permitem que os usuários elaborem. Em geral, guarde
esse tipo de pergunta para avaliadores ou pesquisas.

Faça um teste com alguém, talvez alguém da organização que não seja membro da equipe
principal. Isso o ajudará a descobrir questões que podem não estar claras e também a refinar o
tempo e o fluxo.

Se for possível, e o participante consentir, grave a entrevista para que outras pessoas possam
se beneficiar ao ouvir as respostas diretamente da boca do participante.

ESCOLHENDO TÉCNICAS DE PESQUISA 97


Machine Translated by Google

Consulta Contextual
A investigação contextual combina a observação do usuário com técnicas de entrevista.
O designer UX vai até os participantes, de preferência aos ambientes em que eles provavelmente
usarão o site. Por exemplo, para uma aplicação de escritório, a investigação contextual envolveria sentar-
se na mesa do participante.

Este método fornece informações valiosas sobre o contexto em que um participante trabalha,
incluindo

Os problemas da vida real que os usuários enfrentam

O tipo de equipamento com o qual estão trabalhando

O espaço em que trabalham - em particular, a quantidade de espaço que têm, quanta (ou pouca)
privacidade, com que frequência são interrompidos e como usam o telefone e o papel (preste
atenção especial às impressões que postaram ou notas que eles mantêm à mão).

Sua preferência em usar mouse em vez de teclado. Isso pode afetar muito suas escolhas de design,
especialmente se você estiver projetando uma ferramenta que exija muita entrada de dados.

Como eles estão trabalhando com outras pessoas, tanto em termos de colaboração quanto de
compartilhamento de recursos. Se mais de uma pessoa estiver usando o mesmo computador, por
exemplo, isso afetará o modo como você projeta os recursos de login e segurança.

Outras ferramentas que eles usam, tanto online quanto offline. A maneira como as pessoas usam
o papel é especialmente interessante – para algumas tarefas, pode ser difícil projetar uma solução
on-line que concorra com o papel!

As consultas combinam o tempo de observação e o tempo de entrevista. Eles podem durar de algumas
horas a vários dias.

Se os participantes não puderem dedicar pelo menos 2 horas, considere apenas realizar uma
entrevista. Durante uma observação, leva algum tempo para o participante se ajustar à sua presença
e agir com certa naturalidade, e isso não acontece depois de apenas 15 minutos.

O Processo Básico

Prepare uma introdução de 10 a 15 minutos que você possa usar com cada participante. Deve
incluir o propósito da investigação, uma descrição de alto nível do que vocês farão juntos (a observação
e a entrevista) e como o

98 CAPÍTULO 6: PESQUISA DO USUÁRIO


Machine Translated by Google

informações serão usadas. Este também é um bom momento para obter assinaturas nos formulários
de consentimento e garantir aos participantes que o que eles compartilharem será mantido confidencial.

Comece com algumas perguntas de alto nível sobre os processos típicos do participante,
especialmente aqueles que são relevantes para o design do site.

Informe ao participante quando você estiver pronto para parar de falar e começar a observar. A
observação pode variar de ativa a passiva. Com observação ativa,
uma abordagem comum é fazer com que o participante assuma o papel de mestre enquanto você
assume o papel de aprendiz. O mestre explica o que está fazendo como se estivesse ensinando seu
processo. A observação ativa geralmente fornece mais informações sobre as razões do
comportamento do participante, mas pode afetar o modo como o participante trabalha.

Na observação passiva, você incentiva o participante a agir como se você nem estivesse presente.
Seu objetivo é observar um comportamento o mais natural possível.
Por exemplo, se um participante estiver conversando com você, é menos provável que ele atenda
uma ligação ou faça uma pergunta a alguém sobre um problema que está tentando resolver, mas se
você estiver observando passivamente, é mais provável que você veja isso. acontecer. Você pode
então acompanhar durante a entrevista para perguntar sobre as razões por trás de alguns dos
comportamentos que observou.

Qualquer abordagem pode funcionar bem. Geralmente, se você não tiver muito tempo com os
participantes (digamos, apenas 2 a 4 horas cada), você pode decidir usar a observação ativa para
garantir a profundidade das informações necessárias. Se você tiver um dia inteiro ou mais, a
observação passiva oferece um bom equilíbrio entre comportamento natural e discussão.

Depois de obter as informações de suas consultas, você terá muitos dados valiosos para analisar!
Então, como você identifica padrões ou tendências em seus resultados?

Uma maneira útil é uma técnica chamada diagrama de afinidade. Existem muitos recursos excelentes
disponíveis sobre este tópico, mas aqui está uma breve descrição.

Um guia rápido para diagrama de afinidades

A diagramação de afinidade é a técnica de pegar uma série de itens distintos e separados (como
declarações feitas por usuários ou observações feitas por um pesquisador) e agrupá-los para
formar padrões e tendências. Aqui estão as etapas envolvidas em uma sessão simples de diagrama
de afinidade:

1. Reúna a equipe que realizou as consultas, com suas anotações.

ESCOLHENDO TÉCNICAS DE PESQUISA 99


Machine Translated by Google

2. Dê a cada pessoa um pacote de post-its e peça-lhes que escrevam uma declaração em cada
um, junto com um código curto que permitirá que você rastreie essa declaração até um
participante, como suas iniciais. Concentre-se em declarações que pareçam ter relevância para
o design do site, seja especificamente (uma declaração de recurso) ou de uma forma mais geral
(uma declaração que represente a atitude do participante em relação à empresa ou assunto).

3. Peça a todos que coloquem os seus Post-its na parede. Você precisará de um grande espaço em branco

parede se você estiver trabalhando em um grande estudo; tente conseguir um ao qual você terá
acesso por pelo menos alguns dias.

4. Depois que todas as notas estiverem prontas, comece a agrupar afirmações semelhantes umas ao
lado das outras. Esta parte do exercício pode incluir a equipe maior. É uma ótima maneira de
começar a compartilhar resultados.

5. Assim que os grupos começarem a se formar naturalmente, comece a rotulá-los para fornecer
mais estrutura. Se alguns Post-its pertencerem a mais de um grupo, você poderá escrever
duplicatas e colocá-las em cada grupo apropriado.

Nota Este método funciona bem para investigação contextual, mas pode ser aplicado a muitas outras
situações. Por exemplo, é uma ótima maneira de criar categorias de forma colaborativa para tópicos não
classificados, para que possa ajudá-lo a mover os resultados da classificação de cartões para níveis adicionais de estrutura.

Os padrões podem surgir de várias maneiras, por isso é melhor deixá-los se formar por conta
própria. No entanto, aqui estão alguns exemplos dos tipos de categorias que você pode ver, incluindo
o tipo de afirmação que encontraria nelas:

Metas: “Tento resolver todos os itens em aberto aqui antes de sair para o dia.”

Modelos mentais (inclui declarações que demonstram como os usuários estão mapeando

experiências externas para pensamentos internos): “Eu uso esta ferramenta on-line como minha
pasta, para coisas que faço muita referência, mas não quero carregar comigo.
Comigo."

Ideias e solicitações de recursos: “Gostaria que isso me permitisse desfazer. Eu continuo


movendo a pasta inteira acidentalmente e demoro uma eternidade para cancelar
fora disso."

Frustrações: “Eu perguntaria ao suporte técnico sobre isso, mas na metade das vezes eles
também não sabem qual é o problema.”

100 CAPÍTULO 6: PESQUISA DO USUÁRIO


Machine Translated by Google

Soluções alternativas: “Isso demora tanto para fazer aqui que acabo imprimindo a lista e
trabalhando com ela ao longo do dia. Aí no final do dia eu insiro os resultados.”

Declarações de valor: “Essa ferramenta aqui me economiza muito tempo, então, se você
estiver fazendo alterações, não a retire!”

Mergulho Profundo

O recurso por excelência na investigação contextual é o Design Contextual,

por Hugh Beyer e Karen Holtzblatt (Morgan Kaufmann, 1997). O livro também inclui informações detalhadas

sobre a interpretação de resultados através de técnicas como diagrama de afinidade.

Para obter mais informações sobre modelos mentais e como entendê-los, consulte

uma olhada em Modelos Mentais: Alinhando Estratégia de Design com Comportamento do Usuário, por Indi

Jovem (Rosenfeld Media, 2008). Isso é especialmente útil quando você está trabalhando em
a arquitetura de informação para uma fonte de conteúdo.

pesquisas
As pesquisas envolvem um conjunto de perguntas bem definidas e distribuídas a um grande
público. Na maioria das vezes, consistem em perguntas fechadas (como questões de múltipla
escolha) que podem ser facilmente coletadas com uma ferramenta que pode exibir padrões entre
as respostas.

As pesquisas são boas ferramentas quando você deseja declarar os resultados de maneiras
mais quantitativas (por exemplo, “Dos entrevistados, 82% dos que trabalham no estado de origem
têm algum tipo de conexão de Internet de alta velocidade”) do que você obteria com os tipos
de perguntas abertas usadas em entrevistas. No entanto, você também pode coletar informações
qualitativas deles, sobre hábitos e atitudes dos usuários.

No campo da experiência do usuário, as pesquisas são frequentemente usadas para medir a


satisfação do usuário (com sites ou aplicativos existentes) ou para construir ou validar modelos
de usuário, como segmentações ou personas.

ESCOLHENDO TÉCNICAS DE PESQUISA 101


Machine Translated by Google

O Processo Básico

Tal como acontece com as entrevistas com usuários, você não quer fazer perguntas que exijam
especulação dos usuários. Não pergunte “Se você tivesse o Recurso X, você o usaria?”

Ao contrário das entrevistas, em pesquisas de múltipla escolha ou Sim/Não, Verdadeiro/Falso


as perguntas são melhores e mais fáceis de analisar posteriormente. Eles também são mais rápidos para
os participantes responderem.

Use pesquisas quando tiver perguntas que sejam solicitações factuais de dados demográficos,
como estas:

Dos dispositivos listados abaixo, quais você possui? Escolha todas as opções aplicáveis.

Computador

Celular

Sistema de jogo, como Xbox, Playstation ou Wii

ou para questões de atitude com uma gama definida de escolhas distintas:

Leia as seguintes afirmações e selecione o grau em que você concorda ou discorda de cada uma delas.

O Atendimento ao Cliente da Pseudo Corporation atende às minhas necessidades.

Concordo plenamente

Concordar

Não concordo nem discordo

Discordo

Discordo fortemente

Em particular, questões como o segundo exemplo são frequentemente usadas para complementar
tarefas de teste de usabilidade. Você pode usar esse tipo como uma pergunta de acompanhamento para
descobrir se os participantes ficaram frustrados ao concluir uma tarefa. Participantes
nem sempre gostam de expressar uma opinião negativa em voz alta, mas muitas vezes estão dispostos
a expressá-la quando confrontados com um sistema de classificação.

Isso traz à tona outro ponto: as pesquisas são um excelente complemento para outras formas de
pesquisa que você possa estar fazendo, como entrevistas com usuários ou investigação contextual. A
combinação de dois métodos de pesquisa fornece uma imagem mais rica do usuário do que um
método pode fornecer sozinho.

102 CAPÍTULO 6: PESQUISA DO USUÁRIO


Machine Translated by Google

Surfar
Se você deseja um alto grau de confiança em seus resultados e tem a
orçamento para isso, existem ferramentas formais disponíveis para medir a satisfação do usuário
no que diz respeito à facilidade de uso. Essas ferramentas incluem perguntas que foram
testadas para garantir que não conduzam ou confundam um público amplo. Alguns dos mais
comumente usados são
ACSI (Índice Americano de Satisfação do Cliente): www.theacsi.org/
WAMMI (Inventário de Análise e Medição de Site): www.wammi.com

SUMI (Inventário de Medição de Usabilidade de Software): http://sumi.ucc.ie

Ao planejar uma pesquisa, considere o seguinte:

Quem você está almejando?

Use seu modelo provisório para determinar isso. Isso fará diferença em como você
responde ao restante das perguntas aqui.

Qual método de distribuição da pesquisa lhe dará os melhores resultados?

Se seus principais grupos de usuários tendem a se reunir em um determinado local,


você poderá obter mais resultados se for até lá e montar uma mesa para as pessoas
preencherem a pesquisa em papel. Se os seus grupos de usuários forem usuários ativos
da Internet, realizar uma pesquisa on-line pode ser a melhor opção para um grande
número de participantes. Ou você pode decidir que seu grupo de usuários será melhor
encontrado com pesquisas por telefone usando uma lista de clientes atuais.

Quanto tempo os participantes provavelmente estarão dispostos a gastar preenchendo a


pesquisa?

Se você estiver oferecendo algum tipo de remuneração ou se eles obtiverem algum


outro benefício ao preenchê-lo, geralmente você poderá criar um questionário mais longo—
um que leva talvez meia hora para ser concluído. Caso contrário, você precisará ser breve
para ajudar a garantir que as pessoas o concluam – pense em 5 a 10 minutos. Qualquer
Dessa forma, certifique-se de que os participantes recebam uma estimativa de quanto
tempo levará e atualize-os sobre seu progresso à medida que avançam (use números de
página como “2 de 4”, por exemplo, ou mostre a porcentagem concluída).

ESCOLHENDO TÉCNICAS DE PESQUISA 103


Machine Translated by Google

Como você saberá quando começar a analisar os dados?

Você pode optar por realizar a pesquisa até atingir um determinado número de participantes
ou até atingir um determinado prazo, o que tiver prioridade.

Que ferramenta você usará para coletar e analisar os dados?

Se você estiver realizando a pesquisa on-line, a ferramenta usada para coletar os dados
poderá ter opções para visualizar e analisar os resultados. Caso contrário, você precisará de
um método para inserir os dados na ferramenta de sua escolha. Para pesquisas em papel, isso
significa muita entrada de dados, portanto, certifique-se de planejar esse período.

Grupos de foco
Os grupos focais envolvem reunir uma variedade de pessoas dentro de um público-alvo e
facilitar uma discussão com elas. Os objetivos comuns são obter opiniões sobre temas relevantes
para a organização ou sua marca, como experiências anteriores, necessidades relacionadas,
sentimentos, atitudes e ideias para melhoria.

Um grupo focal é uma boa técnica para diversos propósitos:

Ouvir uma variedade de histórias de usuários. A discussão aberta é uma ótima maneira
de trazer à tona o contador de histórias que existe em todos nós. Quando um grupo focal
está indo bem, os indivíduos constroem as histórias e ideias uns dos outros e lembram-se de
situações que talvez não pudessem lembrar em uma entrevista individual mais estruturada. O
formato e a energia do grupo podem dar às pessoas o tempo necessário para recordarem
estas histórias e partilhá-las.

Compreender diferenças relevantes nas experiências. A maioria das pessoas compartilha


informações naturalmente e deseja comparar suas ferramentas favoritas com outras de seu
grupo de interesse. Freqüentemente, você poderá aprender sobre sites ou serviços
concorrentes ou ouvir dicas de soluções alternativas, recursos e suporte.

Gerando ideias. Embora você não queira que o próprio grupo seja o designer, muitas vezes
você obtém excelentes ideias para novos recursos ou designs diretamente do grupo ou
ouvindo sobre seus processos de trabalho ou frustrações. Tal como acontece com as ideias
das partes interessadas, certifique-se de rastreá-las até à necessidade principal (ver Capítulo
4) para ter a certeza de que está a ser abordada.

Compreender vários pontos de um processo colaborativo. Se você estiver


projetando um processo que envolve múltiplas funções e colaboração relacionadas, os grupos
podem ser uma ótima maneira de preencher as lacunas em seu entendimento.

104 CAPÍTULO 6: PESQUISA DO USUÁRIO


Machine Translated by Google

de como as pessoas estão interagindo. Por exemplo, se você estiver trabalhando com
uma fonte de conteúdo como uma intranet, pode ser útil reunir uma combinação daqueles que
geram o conteúdo, editam o conteúdo e consomem o conteúdo para identificar os pontos onde
o processo pode ser melhorado.

Há muito debate sobre o uso de grupos focais na pesquisa de UX. Não é uma boa técnica para
testar a usabilidade (já que os usuários geralmente trabalham individualmente, e não em grupos),
e às vezes o ambiente do grupo pode influenciar indevidamente as declarações dos participantes.
No entanto, se bem planejados e facilitados, os grupos focais podem trazer muitos insights que
serão valiosos para você durante o projeto.
O Capítulo 13 discute isso mais detalhadamente no contexto do teste de conceito.

O Processo Básico

Ao escrever perguntas para grupos focais, considere as mesmas dicas que você usaria para
escrever perguntas para entrevistas com usuários (abordadas anteriormente).

Comece com algumas perguntas mais fáceis, como “Conte-me sobre sua última visita a
PseudoCorporation.com. Por quê você foi lá?" Guarde quaisquer perguntas focadas na geração
de ideias na parte intermediária do grupo, quando os participantes se sentirem confortáveis
com você, uns com os outros e com o tópico.

Atribua blocos de tempo para cada tópico e cumpra-os; é fácil que as discussões realmente
comecem e o tempo passe! Se você estiver preocupado com o tempo, coloque suas perguntas
mais importantes no meio da lista de tópicos, depois que as pessoas se familiarizarem com a
atividade, mas antes de qualquer possível falta de tempo que possa ocorrer perto do final.

Muitas das logísticas dos grupos focais serão as mesmas dos testes de usabilidade. (O Capítulo
13 oferece sugestões sobre triagem, recrutamento e agendamento.) A principal diferença com
os grupos focais é que você precisará de uma sala maior com uma mesa que permita aos
participantes interagirem uns com os outros facilmente.
Fotografe para seis a oito pessoas em sessões de grupo de 1 a 2 horas.

Dê a cada pessoa um crachá ou um cartão de lugar em seu assento, para que todos possam
se dirigir uns aos outros pelo nome.

O formato da discussão em si deve incluir uma introdução, que muitas vezes atinge estes
pontos-chave:

Seu papel como moderador e o que você espera obter da discussão (por exemplo, alguns
dos pontos acima).

ESCOLHENDO TÉCNICAS DE PESQUISA 105


Machine Translated by Google

Por que os participantes foram escolhidos para participar (por exemplo, “Todos vocês são
usuários atuais do site da Pseudo Corporation e nós os reunimos para saber mais sobre
suas experiências”).

Como essas informações serão utilizadas – tanto no design quanto do ponto de vista da
confidencialidade.

Que, como moderador, você esteja lá para ouvir suas opiniões e experiências. Você quer
que eles sintam que podem compartilhar honestamente, então peça aos indivíduos que sejam
diretos, mas também respeitosos com os outros membros do grupo.

Há muitos tópicos a serem abordados, então em algum momento você encerrará uma discussão
sobre um tópico para ter certeza de que consegue cobrir todos eles.

Isso pode então resultar em uma rodada de apresentações para os membros do grupo, muitas
vezes incluindo algum tipo de pergunta para quebrar o gelo.

Seu objetivo é fazer com que todos falem sobre a primeira pergunta, mesmo que contem apenas
uma pequena história. Você pode começar com uma pessoa e trabalhar em torno da mesa ou
deixar que as pessoas respondam naturalmente e depois chamar pelo nome as pessoas que ainda
não responderam. Muitas vezes você acabará dando a volta na mesa para fazer as primeiras
perguntas e então, quando sentir que o grupo está pronto, com a linguagem corporal você poderá
abrir as perguntas para todos.

Snorkeling: Linguagem Corporal


Uma boa compreensão da linguagem corporal pode ser uma ferramenta incrível
ao moderar grupos focais ou qualquer pesquisa de usuário realizada pessoalmente. Pode
ajudá-lo a entender quando alguém está se sentindo frustrado, animado, irritado ou
ameaçado, para que você possa identificar quando deve tentar deixar alguém mais
confortável ou investigar um comentário específico.

O livro a seguir sobre o assunto pode levar mais de um fim de semana para ser lido
completamente, mas foi projetado para ser fácil de folhear: The Definitive Book of Body
Language, de Allan Pease e Barbara Pease (Bantam, 2006).

Ao ligar para alguém que ainda não respondeu, repita a pergunta caso a pessoa não tenha
entendido ou não tenha ouvido a última

106 CAPÍTULO 6: PESQUISA DO USUÁRIO


Machine Translated by Google

poucas declarações na discussão. Além disso, evite fazer com que diferenças de opinião
pareçam um desacordo entre duas pessoas.

Não diga: “Bob, ainda não tivemos notícias suas. O que você acha do que Chris acabou
de dizer? mas sim (olhando para Bob): “E você, Bob?
Que tipos de experiências você teve com o atendimento ao cliente da Pseudo
Corporation?”

Como moderador, você controla o fluxo da discussão e passa o microfone virtual. Você mantém
o controle usando contato visual, volume da fala, movimentos dos braços e orientação do
corpo. A maioria das pessoas estará muito consciente da sua linguagem corporal, e
essas dicas podem ser sinais úteis se alguém estiver dominando a conversa. Se um
participante excessivamente vocal não entender essas dicas, use uma declaração gentil,
mas firme, como “OK, ótimo, gostaria de expor esse pensamento a outras pessoas. Alguém
mais encontrou alguns dos mesmos problemas que Theresa teve?

Ao passar para um novo tópico mais amplo, avise verbalmente que a discussão anterior
terminou e que uma nova está começando, para que as pessoas possam clarear suas
mentes para o próximo tópico.

Finalmente, quando a atividade está chegando ao fim, uma simples olhada no relógio e uma
mudança na orientação do corpo podem sinalizar que a conversa deve ser encerrada.
Tal como acontece com qualquer outra atividade, não se esqueça de agradecer ao grupo pelo seu tempo.

O compartilhamento de resultados com sua equipe normalmente ocorre de duas formas: as


descobertas são compartilhadas de acordo com os principais tópicos abordados ou
agrupadas em categorias relevantes, da mesma forma que o são para investigação
contextual. A diagramação de afinidades pode ser outra forma eficaz de reunir diversas
tendências e atitudes para ilustrar a equipe do projeto.

Classificação de cartões

Numa atividade de classificação de cartões , os participantes (trabalhando individualmente


ou em pequenos grupos) recebem itens impressos em cartões e são solicitados a colocá-los
em grupos que façam sentido para eles. Ou eles os agrupam em categorias fornecidas
previamente (chamadas de classificação fechada) ou criam seus próprios grupos e intitulam
cada grupo eles próprios (chamados de classificação aberta). No final da rodada de
classificação das cartas, você deverá começar a ver padrões comuns surgindo na forma
como as pessoas estão classificando os itens, bem como áreas comuns de confusão ou desacordo.

ESCOLHENDO TÉCNICAS DE PESQUISA 107


Machine Translated by Google

Um motivo comum para fazer isso é criar um mapa do site para um site ou criar uma
hierarquia de conteúdo, categorias e subcategorias contendo itens como artigos,
documentos, vídeos ou fotos. Isso torna a classificação de cartões uma técnica excelente se
você estiver trabalhando em uma fonte de conteúdo.

Nota Consulte o Capítulo 2 para obter mais informações sobre fontes de conteúdo.

Digamos que você esteja trabalhando em um tipo comum de fonte de conteúdo: a


intranet da empresa. Muitas intranets tendem a categorizar suas informações pelo
departamento que as possui, com navegação para recursos humanos, operações,
jurídico, marketing e assim por diante. Para funcionários antigos isso pode não representar
um problema óbvio, porque eles provavelmente aprenderam as linhas de responsabilidade
de cada departamento e construíram uma compreensão de onde encontrar informações.

Mas para os novos funcionários, ou para aqueles que precisam de informações às quais
normalmente não consultam, pode ser difícil localizar informações que possam pertencer a
mais de um departamento (ou que pareçam não pertencer a nenhum). Por exemplo,
onde você encontraria uma política de assinatura de contratos com funcionários recém-
contratados? Pode enquadrar-se na área jurídica ou na área de recursos humanos.

Com a classificação de cartões, você pode encontrar padrões comuns na forma como os usuários em

potencial categorizariam as informações, independentemente das linhas departamentais.

O Processo Básico

Colete os itens que você gostaria de incluir na classificação do cartão; 40 a 60 geralmente


é uma boa faixa. Você precisa de quantidade suficiente para permitir a criação de um número
potencialmente grande de grupos de cartões, mas não tantos a ponto de sobrecarregar os
participantes com opções (ou sobrecarregá- lo quando precisar analisar os resultados).

Escolha itens que você acha que serão fáceis de entender e livres de jargões
desnecessários. Você pode incluir alguns termos específicos que você acredita que seus
grupos de usuários provavelmente conheçam, mas evite incluir muitos termos
“privilegiados”. Se você incluir muitos termos ou siglas específicas da empresa (como
“a campanha SUCCEED” para aumentar as vendas), você estará testando a eficácia do
marketing e das comunicações da empresa, em vez de construir uma hierarquia de
informações comum.

Para o exemplo da intranet, você pode incluir a política de férias, informações do plano
401(k), contrato de nova contratação, contrato de fornecedor, acordo de confidencialidade,

108 CAPÍTULO 6: PESQUISA DO USUÁRIO


Machine Translated by Google

orientação para novos funcionários, informações sobre seguro saúde e política de segurança
de computadores.

Esta lista representa uma mistura de itens claramente formulados que podem ser categorizados
de diversas maneiras. Você poderia ter um participante que agrupasse a orientação de novos
funcionários e a política de férias em recursos humanos, e poderia ter outro que agrupasse a
orientação de novos funcionários e o novo contrato de contratação e os nomeasse “integração
de funcionários”.

Depois de ter sua lista de itens, coloque-os em cartões que possam ser facilmente
agrupados e desagrupados. Você pode imprimir etiquetas e colá-las em fichas ou imprimir
diretamente em folhas de cartolina perfuradas para separá-las em fichas individuais.

Faça um teste pedindo a alguém que classifique os cartões em grupos e dê nomes aos grupos –
por exemplo, colocando um Post-it na pilha e escrevendo o nome nele com uma caneta. Idealmente,
o participante do teste é alguém não familiarizado com os itens e a atividade. Isso o ajudará a
ter uma ideia aproximada de quanto tempo a atividade pode levar. Se a execução do teste
demorar mais de uma hora, pode ser necessário
para recortar alguns cartões!

Depois de ter um deck finalizado, você pode trazer um participante real e dar estas instruções
básicas:

1. Organize esses cartões em grupos que façam sentido para você.

2. Tente ter pelo menos duas cartas num grupo. Se um cartão parece não pertencer a nenhum
grupo, você pode colocá-lo de lado.

3. A qualquer momento durante a classificação, você pode nomear um grupo. No final do


atividade, por favor nomeie quantos grupos você puder.

Algumas tendências se tornarão óbvias simplesmente pela observação das sessões. Outros
podem exigir um pouco mais de análise para serem revelados. Existem diversas ferramentas
para inserir e analisar os resultados de card sorts; muitos deles vêm com ferramentas que
permitem executar classificações de cartões remotamente (consulte a seção “Variações na
classificação de cartões” abaixo para obter mais informações).

Em particular, OptimalSort (www.optimalsort.com/pages/default.html) e WebSort (http://


websort.net) fornecem recursos de classificação remota e ferramentas de análise úteis. Ou, se
quiser fazer sua própria classificação de maneira mais manual, dê uma olhada na excelente
planilha de Donna Spencer, completa

ESCOLHENDO TÉCNICAS DE PESQUISA 109


Machine Translated by Google

com instruções, disponíveis em www.rosenfeldmedia.com/books/cardsorting/


blog/card_sort_análise_spreadsheet.

Variações no tipo de cartão

A discussão até agora se concentrou em um card sort realizado com um

individual, presencial, onde o participante é solicitado a nomear as categorias que criou. Esta é uma
classificação aberta, o que significa que as categorias principais não foram dadas ao participante
– em vez disso, estão abertas para serem nomeadas. Essa é uma boa abordagem quando você
determina uma nova estrutura de navegação ou faz alterações significativas em uma estrutura
existente. Para outras situações, você pode considerar estas variações comuns de classificação de
cartas:

Tipos fechados. Em uma classificação fechada, você fornece as categorias de alto nível e
os participantes as adicionam. Os resultados são relativamente fáceis de analisar, porque você
tem um pequeno conjunto de categorias possíveis e pode se concentrar em compreender
quais itens se enquadram com mais frequência em quais categorias. Se você estiver adicionando
grandes quantidades de conteúdo a uma arquitetura de informações existente ou validando um
mapa do site existente, uma classificação fechada poderá fornecer informações rápidas e
acionáveis para ajudar em suas decisões de categorização.

Classificações de grupo. Em vez de ter um indivíduo classificando os itens em grupos, você pode
fazer com que a classificação por cartões faça parte de uma atividade de grupo focal, onde os
participantes trabalham juntos para classificar os itens. Embora os resultados não reflitam
necessariamente como qualquer indivíduo agruparia os itens, você pode obter muitos insights
sobre como as pessoas pensam sobre os itens e sua organização ouvindo-os trabalhar juntos
na atividade, debatendo a justificativa para cada colocação.

Classificações remotas. A classificação com cartões físicos pode ser uma atividade divertida,
especialmente para classificações em grupo. Mas existem muitas ferramentas excelentes para
realizar classificações online com indivíduos. Isso também permite que você alcance um número
maior de participantes ou participantes específicos que podem ser difíceis de encontrar
fisicamente. OptimalSort e WebSort, mencionados acima, são duas das ferramentas que
facilitam esse tipo de classificação online.

Testando usabilidade
O teste de usabilidade envolve pedir aos participantes que realizem testes específicos em um site
ou aplicativo (ou em um protótipo dele) para descobrir possíveis problemas de usabilidade e reunir
ideias para resolvê-los.

110 CAPÍTULO 6: PESQUISA DO USUÁRIO


Machine Translated by Google

Você pode realizar testes de usabilidade durante a fase Definir se quiser coletar
informações sobre como o site atual pode ser melhorado. Ou você pode realizá-lo em
sites semelhantes (como sites concorrentes) para compreender algumas das oportunidades
potenciais para uma solução mais amigável.

Na maioria das vezes, os testes de usabilidade são conduzidos como parte da fase de
Design, idealmente em rodadas iterativas (onde um design é criado, testado, refinado e
testado novamente). Discutiremos novamente os testes de usabilidade em detalhes no
Capítulo 13, “Testes de Design com Usuários”; esse capítulo inclui dicas para recrutamento e
planejamento que também podem ajudá-lo a realizar as atividades discutidas anteriormente neste capítulo.

Depois da Pesquisa
Depois de concluir uma ou mais dessas atividades de pesquisa de usuários, é hora de
rever as suposições que você fez originalmente sobre seus grupos de usuários.
Deixe essas suposições de lado por um momento e pergunte-se quais grupos de
usuários você criaria agora que tem mais informações. Se algumas de suas suposições
anteriores não eram válidas, considere quaisquer lacunas que você possa ter em sua
pesquisa de usuários porque um grupo-chave não foi incluído. Se esta lacuna for identificada
suficientemente cedo na sua actividade de investigação, poderá ter tempo para ajustar e
adicionar outro conjunto de participantes à investigação em curso, para garantir que está a
obter uma imagem completa.

Com seu novo conhecimento, você poderá revisar suas definições de usuário para
refletir com mais precisão os grupos que devem ser o foco. Isso o ajudará a criar ferramentas
mais detalhadas, como personas (discutidas no Capítulo 7), e a criar requisitos de usuário
para a lista que começamos no Capítulo 5.

Nesse capítulo, discutimos o processo de pegar declarações das partes interessadas da


empresa e refiná-las em requisitos. Você seguirá um processo semelhante com os usuários:
seu trabalho não para quando você captura a ideia ou solicitação. Aprofunde-se nas
necessidades e objetivos para ter certeza de entendê-los. Em última análise, isso ajudará
você a projetar uma solução que melhor atenda às necessidades de todos os grupos de
usuários relevantes.

No próximo capítulo, você aprenderá como usar o conhecimento obtido ao conduzir


pesquisas com usuários para criar ferramentas que possam trazer foco para seus grupos
de usuários durante o design e desenvolvimento: personas.

APÓS A PESQUISA 111


Machine Translated by Google

Pessoas
7 Encontre a melhor maneira de formar sua equipe -
ou seu cliente – no lugar de seus usuários

Personas são frequentemente um tópico de debate entre os profissionais

de experiência do usuário. As opiniões variam de quanto


conteúdo é necessário para quanta pesquisa é necessária para

se eles fornecem algum valor aos projetos. Algumas pessoas

questionar se eles pertencem ou não ao processo

de forma alguma. Independentemente de onde você se posicione,

personas podem ser usadas para ajudar sua equipe de projeto e seu cliente

a ter empatia com seus usuários. Personas podem fornecer uma verificação

intuitiva para muitas partes do seu projeto - negócios

requisitos, design visual ou garantia de qualidade - fornecendo

informações sobre quem é seu público e o que

suas expectativas e comportamentos são.

Russ Unger

67
Machine Translated by Google

O que são personas?


Personas são documentos que descrevem usuários-alvo típicos. Eles podem ser úteis para sua
equipe de projeto, partes interessadas e clientes. Com pesquisas e descrições apropriadas, as
personas podem traçar uma imagem muito clara de quem está usando o site ou aplicativo e,
potencialmente, até mesmo como o estão usando.

Os designers de experiência do usuário costumam ver a criação de personas como um ótimo


exercício de empatia. Personas bem elaboradas costumam ser usadas como ponto de contato
sempre que surge uma dúvida ou preocupação sobre como aspectos do projeto devem ser
concebidos. Você pode pegar suas personas e perguntar: Como seria <este usuário>
executar <esta tarefa>? ou O que <este usuário> irá procurar em <esta situação>? Embora
esse processo possa não ser tão preciso quanto testar a funcionalidade e o design com usuários
reais, ele pode ajudar a levar seu projeto adiante até que você consiga realizar testes mais
extensos.

Josh Seiden (www.joshuaseiden.com) aponta que existem dois tipos distintos de personas:

Personas direcionadas ao marketing que modelam as motivações de compra

Personas interativas que são modeladas de acordo com comportamentos de uso

Este capítulo se concentra em personas interativas.

Por que eu criaria Personas?


No processo de design da experiência do usuário, as personas ajudam você a focar em usuários
representativos. Ao fornecer insights sobre comportamentos “reais” de usuários “reais”, as personas
podem ajudar a resolver conflitos que surgem ao tomar decisões de design e desenvolvimento,
para que você e sua equipe possam continuar a progredir.

Quão reais as personas precisam ser? A resposta varia muito. Um único documento pessoal
pode ser suficiente para uma equipe, enquanto outro pode criar “espaços de vida” completos para
que as personas dos usuários entendam profundamente como elas “vivem”.
Você pode até chegar ao extremo de criar presenças online individuais com as quais possa
interagir para fornecer insights sobre comportamentos online. A decisão de estender suas
personas depende de você.

Personas podem ser lembretes constantes de seus usuários. Uma técnica útil é os membros
da sua equipe manterem personas em seus espaços de trabalho; assim eles são

POR QUE CRIARIA PERSONAS? 113


Machine Translated by Google

continuamente lembrados de quem são seus usuários. Quando você compartilha um cubo com
“Nicolle”, a terapeuta de mãos certificada de 34 anos de West Chicago, Illinois, por um tempo, você
começa a se sentir compelido a proporcionar uma experiência que
funciona bem para ela.

Se isso ajudar você, sinta-se à vontade para manter cópias impressas com você enquanto dorme e
deixe a fada da osmose transmitir empatia das páginas, passando pelo travesseiro, até seu
subconsciente adormecido. O objetivo das personas é ajudar você, sua equipe e/ou seus clientes a
remover parte da confusão que pode surgir quando você chega a uma encruzilhada na tomada de
decisões.

Encontrando informações para personas


Personas eficazes devem representar com precisão um número específico de usuários do seu
produto ou site. Para atingir esse objetivo, as personas devem ser apoiadas por pesquisas. O
Capítulo 6 apresenta técnicas para pesquisar e modelar seus usuários potenciais para fornecer uma
base sólida para suas personas. Porém, não procure que um método seja a resposta; é melhor
encontrar o máximo de dados possível e combiná-los com uma mistura de dados observacionais e
de entrevistas – isso também pode

incluem a utilização de pesquisas on-line e a análise de comportamentos em redes sociais.

É um tema comum na criação de personas: obtenha dados reais, mas transforme as personas
em pessoas reais nas páginas. Para saber como uma empresa consegue isso, consulte a barra
lateral “Estudo de caso: Personas da Messagefirst”.

Criando Personas
Depois de identificar seu público e acumular dados para apoiar suas personas, o próximo passo é
colocar o lápis no papel e começar a dar vida a elas.
Quantas personas você precisa criar varia. Em geral, o mínimo é três, mas acima de sete não é
incomum. Em vez de buscar uma contagem específica, considere o número de segmentos-alvo que
você possui e qual você acha que é a melhor maneira de obter uma representação justa deles.

114 CAPÍTULO 7: PESSOAS


Machine Translated by Google

Estudo de caso: Personas da Messagefirst


Para criar personas eficazes e baseadas em dados, a Messagefirst (www.messagefirst.com) usa nada menos

que três fontes de entrada de dados diferentes, extraídas do seguinte:

Partes interessadas. Nós os entrevistamos para descobrir quem eles acham que são as personas e quais

são seus comportamentos. Isso está sempre incluído.

Defensor do cliente. Entrevistamos pessoas na empresa que falam diretamente com os clientes, o que

normalmente significa Vendas/Marketing e Atendimento ao Cliente. Cada um deles tem seu preconceito,

que temos em mente ao documentar nossas descobertas. Por exemplo, as pessoas que mais

comumente

entrar em contato com o Atendimento ao Cliente são aqueles que têm muito tempo disponível (muitas vezes

aposentado ou desempregado) ou alguém que está tão chateado com um produto ou serviço que vai

demorar para entrar em contato com você.

Clientes. Conversamos diretamente com as pessoas reais que irão usar ou usam atualmente o produto

ou serviço. Isso é incluído sempre que possível.

Fontes de dados do cliente. Analisamos qualquer tráfego disponível do Weblog, pesquisas e


e-mails que estão disponíveis para nós.

Alguém que conhecemos. Escolhemos alguém que conhecemos e que se enquadra no perfil inicial da

persona. Isso nos ajuda a manter os pés no chão, garantindo que a persona seja confiável e realista, além

de fornecer uma pessoa real para contato caso tenhamos dúvidas adicionais. Isto é muito importante para

validação e está sempre incluído.

Como cada fonte de entrada de dados que usamos tem um viés específico, usamos múltiplas fontes para

normalizar os dados. O que é importante para personas baseadas em dados não é entrar com uma expectativa

de quantas personas você terá, mas deixar que os dados revelem quantas personas deveriam existir. Ao

analisar os dados, procuro lacunas nos comportamentos e atividades. Essas lacunas revelam as personas

individuais.

Todd Zaki Warfel, presidente, Messagefirst

O exemplo de personagem deste capítulo é Nicolle, uma mão certificada de 34 anos.


Terapeuta de West Chicago, Illinois. Acontece que ela é uma viajante que não dirige e
passa de 2 a 3 horas por dia viajando de e para seu trabalho. O
O cliente fictício é uma empresa chamada ACMEblue, fabricante de fones de ouvido
Bluetooth para o não tão fictício iPhone da Apple.

CRIANDO PERSONAS 115


Machine Translated by Google

Esse breve parágrafo diz muito sobre Nicolle, mas como você pode ver na Figura 7.1, a
persona real contém uma história muito mais completa sobre Nicolle. Observe que o conteúdo
foi escrito sobre Nicolle, não “por” Nicolle. É melhor escrever suas personas a partir da
perspectiva de terceiros e não se contentar em escrever com suas vozes distintas,
especialmente quando você está apenas começando. À medida que expande sua experiência,
você deve naturalmente explorar e encontrar o estilo que melhor se adapta a você e que
oferece mais valor.

Figura 7.1 Persona do cliente fictício ACMEblue

Que tipo de informação entra nas personas? O tipo de informação que seu público achará
relevante e confiável, esse é o tipo.

Com base nos dados de pesquisa coletados, você poderá determinar o que é importante para o
cliente, a marca e o projeto.

A maioria das personas que você cria compartilharão um conjunto comum de conteúdo obrigatório
misturado com qualquer quantidade de dados, estatísticas e outras informações relevantes
que podem ser consideradas opcionais, porque variam de cliente para cliente, se não de
projeto para projeto. .

116 CAPÍTULO 7: PESSOAS


Machine Translated by Google

Requisitos mínimos de conteúdo


Ao criar personas, você precisa fornecer informações suficientes para atrair as
pessoas e fazê-las se relacionar com a pessoa sobre quem estão lendo na
página. Para ajudar seu público a entender como sua persona se comporta e pensa,
inclua seis informações principais: foto, nome, idade, localização, ocupação e
biografia. As próximas seções examinam mais detalhadamente o preenchimento
dos detalhes de cada item.

foto

Uma foto é o primeiro (e verdadeiro) passo para dar um rosto à sua persona.
Ao escolher uma foto para sua persona, tente garantir que a imagem não pareça
muito posada ou polida.

Fotos que parecem posadas não têm o mesmo efeito daquelas que estão em
ambientes mais naturais. As personas parecem ser mais eficazes com fotos tiradas
em ambientes mais naturais, como a foto à direita na Figura 7.2, onde a pessoa
está do lado de fora com seu casaco de inverno, possivelmente durante seu
deslocamento diário. Certifique-se de que a foto se adapta ao estilo de vida da persona!
Posado Natural
Figura 7.2
Fotos com
aparência natural
são mais eficazes.

Há uma variedade de recursos de fotos online. Algumas das melhores opções são
iStockphoto (www.istockphoto.com), Getty Images (www.gettyimages.com) e
Stock.XCHNG (www.sxc.hu).

CRIANDO PERSONAS 117


Machine Translated by Google

Encontrar a foto certa pode ser uma tarefa árdua se você não tomar cuidado.
Se tudo mais falhar (ou se você tiver tempo e orçamento), faça o seu próprio!

Nome

Simplificando, você precisa colocar um nome no rosto. A foto que você usar humanizará a
mistura de dados de pesquisa e traços de personalidade, e o nome será como todos se referem à
sua persona durante as discussões. Nicolle não apenas soa melhor do que “Mãe profissional loira
de 30 e poucos anos”, mas também é muito

mais fácil de lembrar e associar a uma persona específica.

Tente evitar que os nomes que você usa para diferentes personas em um projeto pareçam
muito semelhantes. Nicolle e Noelle podem ser facilmente confundidas, por exemplo, então
procure nomes distintos. E, embora possa ser tentador usar nomes de colegas de trabalho ou clientes,
não o faça. Quando você usa nomes parecidos ou iguais aos das pessoas envolvidas no projeto, é
fácil para elas tentarem se identificar em suas personas. Escolher nomes diferentes evita situações
desconfortáveis ou mágoas. Se você tiver dificuldade em escolher nomes, alguns recursos on-line
podem ajudá-lo: sites de nomes de bebês!

BabyNames.com: www.babynames.com

Babyhold: www.babyhold.com

Nomes populares de bebês da Administração da Previdência Social: www.ssa.gov/


OACT/nomes de bebês

Gerador de nomes aleatórios: www.kleimo.com/random/name.cfm

Uma última coisa sobre nomes: certifique-se de que seu nome seja confiável para a pessoa. Nicolle
funciona muito bem para uma mãe do meio-oeste, mas Nicola ou Natalia podem ser nomes muito
melhores para uma mãe italiana. Além disso, nomes que parecem um pouco mais divertidos ou
animados, como Bob, o Construtor, não são. Eles tendem a fazer suas personas parecerem bobas
e podem diminuir seu valor.

Idade

Embora sua pesquisa deva identificar a faixa etária de seus consumidores, fornecer uma idade
específica para sua persona ajuda a adicionar autenticidade à biografia que você escreve. Os
comportamentos de uma estudante universitária de 21 anos e de uma mãe profissional de 34 anos
são significativamente diferentes!

118 CAPÍTULO 7: PESSOAS


Machine Translated by Google

Localização

À primeira vista, a localização pode não parecer uma informação vital; no entanto, é importante
lembrar que podem ocorrer mudanças culturais e comportamentais de um local para outro. Na Itália,
por exemplo, diferentes dialetos são falados em diferentes regiões do país. Nos Estados Unidos,
uma pessoa que mora em Chicago provavelmente teria um custo de vida diferente de uma pessoa
em Savannah, na Geórgia.

Ocupação

Saber o que sua persona faz para viver ajuda você a se identificar com ela, relacionando-se com os
padrões de sua vida cotidiana. Uma pessoa que trabalha em terapia se encontra diariamente com
muitas pessoas, enquanto um operador de ponte levadiça pode não interagir muito com outras
pessoas.

Biografia

A biografia é a história convincente que torna a persona real. É aqui que você fornece detalhes
derivados de seus dados de pesquisa e os infunde com um pouco de “pessoas reais”. Ou seja, os
dados são muito importantes para a persona, mas você não quer simplesmente citar essas informações
em frases entrecortadas.
Em vez disso, você deseja incorporar dados, anedotas e observações em uma história com a qual seu
público possa se identificar.

Pode parecer um pouco estranho, mas a biografia precisa ser verossímil, e certamente não é trapaça
trazer aspectos de uma pessoa real para sua persona.
Nicolle, por exemplo, baseia-se tanto em dados estatísticos quanto em comportamentos reais de
uma pessoa que compartilha atividades, crenças e desejos semelhantes.

Dependendo do seu projeto, você pode precisar se aprofundar bastante na biografia – às vezes,
quanto mais detalhes você tiver, melhor. Não sinta que precisa espremer sua persona em uma
única folha de papel. Escolha o que funciona melhor para tornar sua persona fiel à vida e tão
significativa quanto possível para o projeto em que você está trabalhando.

Conteúdo Opcional
Ao trabalhar com personas, você descobrirá que diferentes projetos exigirão diferentes
conjuntos de informações para torná-las mais aplicáveis. Os requisitos mínimos de conteúdo
também podem ser considerados os menos comuns

CRIANDO PERSONAS 119


Machine Translated by Google

denominadores da maioria das personas que você criará. Na maioria dos casos, você combinará
alguns desses elementos de conteúdo opcionais com o núcleo de suas personas.

O conteúdo opcional que pode agregar valor às suas personas inclui

Nível de educação. Saber o quão educada uma pessoa é pode fornecer um pouco
mais de compreensão sobre alguns de seus hábitos. Uma pessoa com diploma de
ensino médio pode ter hábitos de compra e percepções de marca substancialmente diferentes
de uma pessoa com mestrado, e essas informações podem influenciar a forma como sua
persona é percebida.

Salário ou faixa salarial. O dinheiro fala e, em muitos casos, o montante do rendimento


que uma pessoa tem afecta substancialmente o seu nível de vida e o seu rendimento
disponível. Essas informações podem fornecer informações significativas quando você
almeja determinados níveis de riqueza.

Citação pessoal. Qual seria o lema que sua persona reivindicaria como seu? Às vezes, isso
pode fornecer uma visão geral rápida do modo de pensar de sua persona.

Atividades on-line. Isso pode ser complicado; há muitas maneiras pelas quais as pessoas
passam seu tempo online. Algumas pessoas pagam suas contas, algumas pessoas
gostam muito de blogs e atividades em redes sociais, e algumas pessoas simplesmente
usam o computador como um aparelho que é ligado quando precisam realizar uma tarefa.
Dado que tantos projetos têm algum componente on-line, esse elemento é uma espécie de
julgamento. Você precisará se apoiar em sua pesquisa para ajudar a pintar o quadro.

Atividades off-line. Sua persona tem um hobby? Existem informações adicionais sobre
como é a vida da sua persona quando ela não está online? Este elemento pode ser tão
complicado quanto as atividades online e pode ser tão importante para influenciar sua persona.

Entrada chave ou ponto de gatilho para cliente, marca ou projeto. Muitas vezes é
importante entender como uma persona interage com o cliente, marca ou projeto. A
persona fica sabendo disso por meio do boca a boca, de avaliações on-line, de um
outdoor, da televisão ou do rádio ou de um anúncio pop-up on-line? Sua persona busca
resolver um problema que pode ser resolvido por meio do cliente, marca ou projeto? Usar
seus dados estatísticos para entender esse ponto e inscrevê-los em sua persona pode ajudar
a fundamentar sua abordagem para envolver os usuários.

120 CAPÍTULO 7: PESSOAS


Machine Translated by Google

Nível de conforto técnico. Sua persona usa PC ou Mac? Ela possui um computador? Ela
usa mensagens instantâneas, Flickr ou escreve um blog? Ela se sente muito confortável
com essa atividade ou fica confusa com ela?
Ela seria ajudada por uma solução muito simples dirigida a um novato?
Ela tem um MP3 player ou outro dispositivo portátil? Ela usa DVR, AppleTV ou
programação sob demanda para assistir televisão? A lista pode continuar indefinidamente. E
assim por diante. Dependendo do seu cliente, marca ou projeto, pode ser importante identificar
essas noções – e uma variedade de outras.

Nível de conforto social. Dado o crescimento das mídias sociais e das redes sociais,
pode ser importante identificar muito especificamente como a sua persona se envolve
nesse espaço específico. Ela tem uma conta no Twitter?
Se sim, quantos seguidores ela tem? Quão ativa ela é? Ela é uma líder? Ela usa
MySpace, Facebook, LinkedIn ou outros agregadores ou comunidades online?

Nível de conforto móvel. À medida que o uso de dispositivos móveis se torna mais
predominante, é importante considerar a inclusão de como suas personas se encontram
no espaço móvel – se é que o fazem.

Motivações para usar cliente, marca ou projeto. Em alguns casos, você pode incluir os
motivos pelos quais a persona gostaria de usar o cliente, marca ou projeto. Se ela fica
continuamente enrolando o fio dos fones de ouvido no casaco e arrancando-os da cabeça,
esse pode ser um bom motivo para ela considerar novos fones de ouvido. Cenários reais
baseados em dados de pesquisa podem ajudar a descobrir os principais motivadores
para incluir em suas personas.

Objetivos do usuário. Você também pode identificar o que a persona espera realizar
usando o cliente, marca ou projeto. Isso pode ajudar a fornecer insights sobre os
motivadores da persona para usá-la.

Estes são apenas pontos de dados para você começar. Você pode estruturar suas personas
e apresentá-las de uma infinita variedade de maneiras. Se você estiver interessado em
mergulhar fundo no mundo das personas, um ótimo lugar para começar é The
O usuário tem sempre razão: um guia prático para criar e usar personas para a Web, por
Steve Mulder com Ziv Yaar (New Riders, 2006).

CRIANDO PERSONAS 121


Machine Translated by Google

Personagens Avançadas
Depois de compreender os fundamentos da criação de personas, há infinitas
maneiras de estender seus documentos. Muitas vezes, uma persona simples pode
atender à maioria das suas necessidades, especialmente quando a equipe do projeto
está apenas tentando obter uma compreensão empática dos usuários.

As coisas tendem a ficar mais interessantes quando você apresenta personas aos
seus clientes. Nesses casos, muitas vezes você descobrirá que precisa fornecer muito
mais do que as informações reunidas para a persona básica. As Figuras 7.3 a 7.7
ilustram algumas maneiras de ampliar personas.

Sinta-se à vontade para pegar emprestado esses exemplos, remixá-los e misturá-los


para criar algo ainda melhor para o seu projeto!

Marca PERSONAS E CENÁRIOS (baseados em estudos etnográficos)

Personas são personagens compostos baseados em dados Cenários são narrativas hipotéticas, mas realistas, que
Conheça a marca sobre seus consumidores-alvo: neste caso, etnografia, descreva por que essas personas podem visitar a marca
segmentações existentes e dados de banco de dados de clientes. site e o que eles fariam lá.
Nomeie os consumidores
Joana, 32
As percepções do consumidor nos ajudam a entender
usuários – suas motivações, objetivos
e desejos. Para aplicar esses insights
ao design do site, desenvolvemos usuários
personas e cenários que são Busca de prazer
Aficionados
fundamentada em contextos do mundo real.
“Eu realmente gosto disso”

Essa abordagem de design ajuda a criar “Jovem Sofisticado”

experiências abrangentes baseadas em

uma compreensão dos clientes, seus


motivações, resultados desejados e
COMEÇAR CONSTRUIR SENTIR EXPLORAR LINHA DE FLUXO
COMEÇAR
comportamento. EXPLORAR EXPERIÊNCIA DE CONFORTO DE NOVO E SIMPLIFICAR

Os cenários respondem especificamente a três


questões fundamentais que devem
ser abordado antes que um site possa ser “Aspirante a Novato” “Respondente Ativo” “Explorador Estabelecido” “Crescido em um ritmo”

Prático
devidamente organizado:
Faça as coisas
“Só tem que funcionar”

tenha uma experiência gratificante em seu


local na rede Internet

Alice, 26 Raquel, 42 Érica, 47 Greta, 59

Figura 7.3 Planilha mestre de visão geral da persona (orientação paisagem). Fornece uma visão agregada
de diversas personas, juntamente com os segmentos que elas representam, no contexto de uma
estratégia organizacional de alto nível. Cortesia de Will Evans.

122 CAPÍTULO 7: PESSOAS


Machine Translated by Google

Marca PERSONAS E CENÁRIOS (baseado em estudos etnográficos)

Alice é uma cozinheira novata que deseja explorar o mundo da comida, especialmente a comida METAS

para crianças, com amigos e procurando novas receitas online e em revistas. Sua exploração é mais
alimentar sua família sem muito
sobre fantasia do que realidade. Ela ainda está intimidada e não experimenta muitas receitas novas. pensamento ou esforço

Sua mãe não lhe transmitiu muitas habilidades culinárias, e seus amigos também não são cozinheiros
encontre receitas rápidas e fáceis usando
muito experientes. ingredientes básicos

(frequentemente) fazem dois tipos de


refeições: para adultos, para crianças

encontre receitas e atividades


Alice é uma mãe ocupada de uma filha em Chicago. Ela e o marido Ela adoraria adicionar mais de sua autoria gastronômicas para crianças
trabalham fora de casa – ela administra o escritório de uma pequena toque e recrie pratos que ela gosta em
seguradora. restaurantes, como seu favorito de todos os tempos, frango condimentado. encontre maneiras de “enfeitar” seus
Ela também gostaria de adicionar mais vegetais frescos às suas refeições, porque sabe alimentos de conveniência favoritos
Ela é ocupada, prática e não passa muito tempo cozinhando. Alice só é mais saudável.
quer fazer isso de maneira rápida e fácil - embora muitas vezes ela tenha
Alice, 26 “Aspirante a Novata” PROJETOS E INICIATIVAS
que preparar refeições diferentes para ela e seu marido desde Ela se orgulha de ser uma planejadora minuciosa e capaz de administrar
que começou seu regime de exercícios depois de ter Sophie há dois sua casa com um orçamento apertado. Sua geladeira e despensa estão
geração x 1 filha, 5 navegação aprimorada e arquitetura de
anos e está tentando voltar à forma para uma maratona. Ela trabalha a sempre abastecidas. Ela planeja suas compras para aproveitar as promoções
casado cansado, aspirante informação
partir de um pequeno conjunto de receitas de sucesso com as quais se e os cupons.
sente confortável, e muitas das refeições que prepara são baseadas
inscrição melhorada
em alimentos embalados e preparados.

informações periféricas contextualizadas


renda Uma semana depois, na hora do almoço, Alice encontra seu primeiro boletim eletrônico da marca:
CENÁRIO “Pizza, fácil como 1, 2, 3.” Perfeito - os filhos dela adoram pizza, e ela geralmente
Alice está assistindo ao Cartoon Network com Sophie durante o café da manhã. compra pizzas congeladas para eles. Há um link para “Pizza para iniciantes” que a
boletins informativos mais direcionados
Um comercial da marca aparece mostrando o nome da marca aqui. Alice usa inspira a ver se ela mesma consegue fazer pizza.
marca e acha que Sophie escolheria esse prato. Ela decide
Educação assistente de receita
confira o site do trabalho. Alice visita o site durante o tempo livre O link a leva a uma receita de pizza de pepperoni em algo chamado “Pizza Wizard”.
hora antes de uma reunião. A página inicial é clara e organizada. Ela vê as Ela examina a receita e vê que é bem simples;
melhor integração de cupons
principais seções do site e links para coisas interessantes, como a receita do dia. apenas 25 minutos e 4 ingredientes. Ela verifica sua cozinha para ver o que
ela tem. Ela não tem calabresa ou molho de pizza, mas o “Pizza
uso da internet Wizard” sugere substituí-los por coisas que ela tem em sua cozinha bem
PLANEJAMENTO DE REFEIÇÕES

Ela clica na receita do dia. Ela gosta das dicas que vêm com abastecida: salsicha e molho de tomate. E perfeito! Há um link para um cupom.
isso - eles a fazem sentir que ela poderia lidar com esta receita. Ela fica satisfeita Atitude de “fazer acontecer”
Neena imprime a lista de compras da receita, acrescenta alguns itens que ela também
com a navegação clara, ao contrário de outros sites onde tende a se perder. precisa e vai até a loja.
Ela gosta dos recursos úteis que vão além do que vê nos livros de receitas, depende muito da conveniência
consciência de saúde
como a possibilidade de encontrar receitas com base no que tem em sua alimentos, com relativamente pouca adição
De volta da loja, Alice começa. Ela vê instruções passo a passo sobre como
despensa e dicas de uso dos produtos. frutas e vegetais frescos
desenrolar a massa e adicionar os ingredientes. Existem imagens ao lado de cada
etapa. É fácil de entender e seguir. Ela se pergunta se deveria cozinhar os
Alice descobre que pode receber newsletters de receitas e clica em “Inscrever- passa mais tempo navegando
recheios primeiro, mas a pizza
sensibilidade ao custo receitas do que realmente cozinhar
se”. Registrar-se é tão fácil! Ela preenche algumas informações básicas e seleciona As perguntas frequentes respondem isso para ela.

o boletim informativo “Food Your Kids Will Love”. eles

Figura 7.4 Persona do público-alvo (orientação paisagem). Esta visão detalhada de uma persona incorpora
um espectro mais amplo de dados e fornece uma perspectiva mais abrangente dos objetivos, necessidades
e comportamentos dos usuários – tudo definido dentro de um ecossistema maior. Cortesia de Will Evans.

Figura 7.5 Visão geral do público-alvo e persona do público-alvo (orientação retrato). A visão geral do alvo à
esquerda fornece informações resumidas de alto nível e mostra as marcas com as quais as três personas
interagem e se relacionam. A descrição detalhada à direita apresenta uma visão geral e biografia de uma única
persona, juntamente com informações sobre seus comportamentos e motivações.

PESSOAS AVANÇADAS 123


Machine Translated by Google

Paulo e Helena

“Acho que podemos colocar qualquer coisa lá.


Só não tenho certeza de quanto vai caber.” 5

4
A mãe de Helen morreu há algumas semanas e só agora eles estão começando a esvaziar
a casa. Eles planejam vender a casa, mas há algumas coisas que precisam ser limpas primeiro. A casa também 3
necessita de algumas obras de renovação na casa de banho principal.

-
O porão está cheio de coisas que a mãe de Helen colecionou nas últimas décadas. Ela nunca jogou nada fora. 2
Ela tem jornais e revistas Time de
últimos 20 anos. Existem algumas coisas que Helen deseja manter. A maior parte das roupas e móveis será 1
doada à Goodwill. Infelizmente, a maioria dos “objetos de coleção” de sua mãe foram arruinados por causa da
água e do mofo. Ela também tem latas de tinta, mas Paul
0
e Helen não sabe se a tinta contém chumbo ou não.
Experiência Reputação
Oportunidade
Esta é a primeira vez que Paul e Helen passam por algo assim. Eles não Velocidade
Conveniência de preçode configuração

Conta on-line de reciclagem


Negócio de repetição de resíduos de pátio de organização
nem sei por onde começar. Eles só querem que isso seja o mais fácil possível. Eles sabem que precisam de uma Programa de recompensas
Idade: 24-65 Conhecimento de Domínio
lixeira, mas não têm certeza de quanto ela comportará. E eles assumem apenas
Evento de vida importante com vários tamanhos de contêineres

sobre qualquer coisa pode ir para a lixeira, a menos que alguém lhes diga o contrário. A única outra preocupação
deles é que as lixeiras tendem a ser feias. Eles esperam encontrar uma empresa que não faça o jardim da
frente parecer uma zona de construção ou que não estrague o quintal.
quando entregam ou recolhem a lixeira.
Vida útil
janeiro julho dezembro Mês

1.0 Evento de Vida

Características principais Metas Frustrações e pontos dolorosos


Evento único como aquisição de imóvel familiar ou pequena reforma Obtenha uma lixeira rapidamente. Disponível quando necessário Choque inicial do adesivo
(ex. banheiro). Livre-se de todas as coisas que eles não estão guardando ou doando. Preço Não familiarizado com o processo
Pouca ou nenhuma experiência anterior na aquisição de uma lixeira. Evite a destruição do imóvel durante o processo. O vendedor deixa o imóvel como o encontrou Não sei o que eles não sabem
Evite uma lixeira feia. Ter disponível o tamanho do contêiner necessário Fazendo uma comparação comparativa entre fornecedores
Livre-se da lixeira rapidamente quando ela estiver cheia. Velocidade de configuração e retirada uma vez contatado
Acesso à conta on-line para agendamento e pagamento
Qualidade e limpeza dos equipamentos
Perguntas Marca familiar
Existe alguma coisa que não pode entrar?
Com que rapidez eles podem entregar e retirar?
Eles deixarão a propriedade nas condições em que estava
originalmente?
Como é que isso funciona?
É necessária uma licença?
Quanto vai custar?
Com que facilidade posso entrar em contato com alguém se precisar?

Figura 7.6 Persona do grupo de público-alvo. Essa persona apresenta uma faixa etária alvo, extraída de dados
de pesquisas. As informações que ele contém são amplas e se dirigem a grupos de público, não a indivíduos
específicos. Essa abordagem pode ser útil quando você está fazendo um discurso de negócios ou quando o
orçamento do cliente permite a exploração detalhada de personas. Cortesia de Todd Zaki Warfel.

A Jill de todos os negócios

Amanda Pedra 5

“Tenho que gerenciar vários programas 4

para meus clientes.”


3

AMANDA COMPARTILHA AS RESPONSABILIDADES DO PROGRAMA DE INCENTIVO COM ALGUMAS OUTRAS


2
colegas. Eles compartilham acesso e gerenciam vários programas para clientes. Isso pode ser
É particularmente desafiador garantir que ela esteja pagando as pessoas certas no programa certo.
Ela precisa ser capaz de alternar entre os diferentes programas e saber onde está o tempo todo.
1

A Account Zone realmente a ajuda a emitir novos cartões e garantir que os participantes do programa recebam pagamentos
rapidamente. A única coisa que falta é a capacidade de analisar cada programa individualmente
Conhecimento FTP Atividades e interesses
bem como em todos os programas que ela está executando para ver como as coisas estão indo. Seus clientes gostam Excel
de acompanhar o desempenho dos programas. No momento, ela monitora isso no Excel. Pagamento fácil
PeopleSoft
Ela acaba enviando o arquivo Excel para seus clientes ou, às vezes, exportando-os e enviando um PowerPoint com alguns
Zona da conta Relatório de verificações administrativas
Saldo Atual Sistema personalizado
gráficos bonitos. Se a Account Zone tivesse uma maneira de permitir
Solicitações de novos cartões
ela executa relatórios sobre programas individuais e em vários programas que seriam - realmente incríveis.
Domínio Conhecimento Tecnologia Conhecimento Experiência
Idade: 28-55

Ela usa o Account Zone com bastante regularidade – vários dias por semana. E como ela gerencia vários programas, ela
é bastante ativa o ano todo.
Vida útil
janeiro julho dezembro Mês

Caracteristicas principais Metas Influenciadores Frustrações e pontos dolorosos


Gerencia vários programas Pague os funcionários com rapidez e facilidade. Integração com sistema atual. Não é possível visualizar vários programas ao mesmo tempo.
Empresa de médio a grande porte Evite esforços duplicados. Capacidade de pagar funcionários com rapidez e facilidade. Não é possível executar relatórios em vários programas ao mesmo tempo.
Volume moderado (50-2.000+ pedidos por vez) Veja qual é o saldo atual para saber se eles precisam transferir dinheiro. Custo (principalmente tempo). Corrigindo erros no arquivo de exceção “fede”.
Várias pessoas compartilhando uma única função Ajuda guiada. Saber qual é o problema exato e como corrigi-lo não está claro.
Pagamento rápido 70/30 e verificações administrativas Acompanhe as transações semanalmente, bimestralmente, mês, trimestre,
Uso semanal a bimestral e ano. Múltiplos passos com múltiplas aplicações não é eficiente e faz com que
Durante todo o ano Outras aplicações seja fácil “se perder” onde ela está.
Excel Várias telas de confirmação.
Muito interessado em reportar
Questões Power Point
Quer executar relatórios entre programas Outro nome de usuário e senha para lembrar.
Como executo relatórios em todos os meus programas? Internet Explorer Encontrando e-mail com suas informações de login.
Uso pesado do Excel
Existe uma maneira de obter minhas informações de login sem precisar ligar
Sistema interno personalizado para interface com
para a Ecount?

Podemos integrar com o ClientZone de alguma forma para que não tenhamos
que ir e voltar tanto entre aplicativos diferentes?

Eu estou fazendo a coisa certa?

Figura 7.7 Persona individual do público-alvo. Essa persona é um modelo fortemente baseado em dados.
Embora a história do dia-a-dia seja uma narrativa, o resto é apresentado em marcadores para servir como
uma lista de verificação de design. O diagrama é usado para comunicar uma quantidade significativa de informações
em um espaço pequeno. Cortesia de Todd Zaki Warfel.

124 CAPÍTULO 7: PESSOAS


Machine Translated by Google

Como você pode ver, você pode combinar dados de muitas maneiras diferentes para
apresentar personas, adaptando-as a diversas situações. Comece com a pessoa básica e
expanda-a para atender às suas necessidades.

Considerações finais sobre personas


Muitos profissionais do mundo do design de experiência do usuário não acreditam que as
personas façam um bom trabalho ao articular as necessidades, objetivos e atitudes dos
usuários. Eles acreditam que as personas podem impedir a criatividade, a inovação ou o bom
design por uma série de razões. Outros profissionais acreditam que as personas atendem a
uma necessidade específica que influencia o processo de design de uma forma muito
positiva – quando são baseadas em dados sólidos de pesquisa e misturadas com uma dose
de realidade personalizada. O lado da moeda em que você pousa depende inteiramente de você.

Este capítulo não pretende influenciar sua decisão de uma forma ou de outra.
Muitos artigos sobre o assunto estão disponíveis on-line e muitos profissionais estão prontos
para lhe dar sua opinião. Todos esses recursos podem ajudá-lo a descobrir como as personas
funcionarão melhor para seus projetos, então procure-as. Jared Spool, CEO e diretor fundador
da User Interface Engineering (www.uie.
com), também oferece algumas dicas sobre o assunto:
Esse valor surge quando a equipe visita e observa seu público-alvo, absorve e
discute suas observações e reduz o caos a padrões, que então se tornam as
personas.
O que está na cabeça da equipe, enquanto eles projetam, é o que fará a diferença
no design final. As descrições das personas existem apenas para lembrar a todos
o que aconteceu.

O argumento de Jared é simples: observando seu público-alvo, infundindo o que você


aprende com dados de pesquisa e sintetizando tudo isso em segmentos, você será capaz de
criar personas que desencadeiem o tipo de empatia que mantém sua equipe no caminho
certo e construindo o melhor possível aplicativo, site ou produto.

No final das contas, porém, suas personas serão muito parecidas com o Papai Noel: elas
só terão valor enquanto as pessoas acreditarem nelas.

CONSIDERAÇÕES FINAIS SOBRE PERSONAS 125


Machine Translated by Google

8 Experiência de usuário
Design e Pesquisa
Otimização do motor
Fundamentos do Design de Experiência do Usuário
Papel no SEO de sucesso

Os motores de busca são a pedra angular da economia


interativa. Tudo o que fazemos como “interactivistas” está,
em última análise, ligado ao mundo em geral através do
Google, Yahoo, MSN, Ask e da miríade de motores menores que
constituem a infra-estrutura para encontrar coisas online.
A arquitetura da informação é um componente crítico de como os
sites são interpretados pelos mecanismos de busca. Este capítulo
foi elaborado para fornecer a você uma compreensão básica
por que o design UX é fundamental para a otimização de mecanismos de pesquisa

e o que você deve levar em consideração para que os


ambientes que você criar tenham chance de destaque no
Google.

Jonathan Ashton

67
Machine Translated by Google

Introdução ao SEO
Simplificando, a otimização de mecanismos de busca é o processo de desenvolvimento e
manutenção de um ativo da Web com a intenção de obter e manter uma posição de destaque em
mecanismos de busca públicos para frases-chave especificamente direcionadas.
A otimização de mecanismos de pesquisa (SEO) é como uma arte marcial, um processo de
aprender e fazer que nunca está completo. Até mesmo um mestre pode progredir ainda mais
usando o comportamento observado ou o método aprendido. Enquanto existirem mecanismos de
busca e sites interessados em vender algo para as pessoas que pesquisam, haverá um papel para
a otimização de mecanismos de busca.

SEO depende de três áreas fundamentais para melhoria e influência:

O grupo crítico de coisas que o designer profissional de experiência do usuário pode influenciar
– infraestrutura do site, tecnologia e princípios organizacionais

Conteúdo e todos os problemas de palavras-chave relacionados a palavras otimizadas que os


mecanismos de pesquisa podem ver

Links ou popularidade do link – a quantidade e a qualidade dos links que apontam para o seu site
vindos de outros sites, bem como a estrutura organizacional dos links dentro do site

Iremos desmontar cada uma dessas três áreas e examiná-las da perspectiva do designer de
UX, para melhor equipá-lo para os desafios de otimização que temos pela frente.

Por que o SEO é importante?


É interessante que ainda hoje precisamos explicar a relevância da otimização de mecanismos de
busca. Os clientes tendem a entender, até certo ponto, que é importante que seus sites
atraiam visitantes direcionados a partir dos resultados naturais de pesquisa dos principais
mecanismos de pesquisa, mas, além disso, é difícil para a maioria dos profissionais de marketing
interativo compreender o impacto que o SEO pode ter.

Os dados sobre o volume global de pesquisas estão disponíveis em diversas fontes, mas o mais
importante é entender que, seja qual for a fonte, os números são simplesmente enormes e os
aumentos ano após ano são sempre de dois dígitos. Na maior parte, a cada trimestre o volume
global de pesquisas aumenta.
Quando o Google foi lançado pela primeira vez em 1998, 10.000 pesquisas por dia representavam
um volume enorme e representavam um fardo incrível para a versão beta do sistema.

INTRODUÇÃO AO SEO 127


Machine Translated by Google

Hitwise (www.hitwise.com) relata que o Google e suas afiliadas (incluindo AOL e


YouTube) detêm a maior parte das pesquisas em todo o mundo, com quase 72 por
cento das pesquisas nos EUA realizadas em novembro de 2008. O Yahoo está em um
distante segundo lugar, com quase 18 por cento. e MSN e Ask.com ficam com 4% e
3%, respectivamente. Internacionalmente, o Google é ainda mais dominante: a sua
quota de mercado atinge mais de 80% em muitos mercados.

Nota Para obter mais informações sobre os primeiros dias do Google, consulte The Google Story, de David A.
Vise e Mark Malseed (Delta, 2008).

De acordo com a comScore (www.comscore.com), em 2008 houve facilmente mais de 60 mil milhões de
pesquisas por mês realizadas globalmente por 750 milhões de pessoas, com mais de 18 mil milhões de
pesquisas realizadas apenas nos Estados Unidos. Dito de outra forma, 95% dos utilizadores da Internet utilizam
um motor de pesquisa pelo menos uma vez por mês, com uma média global de mais de 80 pesquisas por mês.

Além desses números notáveis de volume, o que isso realmente significa em um nível
prático para os profissionais de marketing interativo? Simplificando, se você não alcançar
seus clientes-alvo quando eles procuram seus produtos ou serviços, sua concorrência
terá a oportunidade de vender para eles.

Observe a análise do seu site e pense na questão desta forma: quanto mais receita o
site geraria se houvesse um aumento de 10% no tráfego estrategicamente direcionado?
Que tal um aumento de 100%? Ou 1000 por cento? Se o seu site não está gerando
tráfego significativo por meio de pesquisa natural, o SEO é um requisito.

Um pequeno investimento em SEO pode ajudar muito, especialmente se o esforço de


marketing interativo até o momento se concentrou na compra de cliques por meio de
listagens de patrocinadores. Vimos sites alcançarem um retorno sobre o investimento de
35 para 1 nas despesas mensais de SEO. Se você está pagando às empresas de
mecanismos de pesquisa pelo tráfego de listagens patrocinadas, mas não está investindo
em tráfego natural, na verdade está se limitando a cerca de 10% da oportunidade. Pense
em seu próprio comportamento de pesquisa: quando foi a última vez que você clicou
em mais de uma ou duas listagens de patrocinadores pagos em um resultado de pesquisa?

Qualquer discussão sobre por que o SEO é importante e por que veio para ficar pode
continuar por capítulos. Basta dizer que o Google não vai a lugar nenhum, a não ser
subir, e que o marketing interativo eficaz deve incluir a otimização de mecanismos de
busca como um componente central da execução competente.

128 CAPÍTULO 8: PROJETO DE EXPERIÊNCIA DO USUÁRIO E OTIMIZAÇÃO DO MOTOR DE PESQUISA


Machine Translated by Google

Recursos básicos importantes


A experiência emerge de uma educação completa. O profissional que simplesmente foca em sua
especialidade perde a perspectiva de tudo o que está ao seu redor. É por isso que é fundamental
que todo interativista gaste pelo menos alguns minutos aprendendo sobre SEO. Embora não exista
um conjunto oficial de diretrizes, o Google teve a gentileza de fornecer alguns recursos muito
importantes.
Se você estiver interessado em obter um melhor desempenho do mecanismo de pesquisa com seus
esforços, confira estes links:

Ajuda para webmasters/proprietários de sites: Otimização de mecanismos de pesquisa:

www.google.com/support/webmasters/bin/
answer.py?hl=pt-BR&answer=35291

Ajuda para webmasters/proprietários de sites: Diretrizes para webmasters: Diretrizes de qualidade:


www.google.com/support/webmasters/bin/
answer.py?hl=pt-BR&answer=35769

Guia para iniciantes em otimização de mecanismos de pesquisa:

www.google.com/webmasters/docs/
search-engine-optimization-starter-guide.pdf

Se isso não bastasse, mergulhe em boletins informativos e blogs. Comece em SEOmoz.org e


vá fundo. Apenas lembre-se, como em todas as outras coisas na vida, se parece bom demais para
ser verdade, então provavelmente é.

Tecnologia, design e
infraestrutura do site
Os motores de busca são essencialmente tecnologia Web 1.0.5 que está firmemente implantada no
mundo Web 2.0+. A premissa básica do mecanismo de busca mudou
pouco desde que o World Wide Web Wanderer foi lançado em 1993 para rastrear

Web e construir o primeiro mecanismo de busca na Web. Essencialmente, todo mecanismo de pesquisa
possui um aplicativo chamado alternadamente de crawler, spider ou bot que encontra e segue links,
enviando de volta ao banco de dados uma cópia dos ativos que ele pode ver. O banco de dados é
então analisado de acordo com o algoritmo proprietário do mecanismo de busca. Usando essas
regras, um ativo da Web é indexado e então classificado de acordo com sua pontuação no cartão de
pontuação específico daquele mecanismo de pesquisa. Neste processo bastante simples há uma
infinidade de armadilhas para o designer UX.

TECNOLOGIA, DESIGN E INFRAESTRUTURA DO LOCAL 129


Machine Translated by Google

Compreender esses relacionamentos essenciais permitirá que você veja seu site através
dos olhos dos mecanismos de pesquisa. Um site otimizado depende de uma estrutura e
tecnologia que facilita a movimentação dos spiders dos mecanismos de busca. Da mesma forma,
muitas decisões sobre o tratamento do conteúdo determinam quão bem os motores de busca
classificam os esforços resultantes. Como resultado, muito disso é predeterminado pelas
decisões tomadas nos wireframes e nas discussões que ocorrem sobre como estilizar e
gerenciar o conteúdo.

Flash, Ajax, JavaScript e outros conteúdos com script


O web design dinâmico e interativo de hoje depende de tecnologias que não são nada amigáveis
às necessidades dos motores de busca. Há uma lacuna cada vez maior entre o que os mecanismos
de pesquisa podem ver e o que os designers podem fazer. Cabe ao designer UX garantir que
os planos estratégicos para sites dinâmicos e com uso intensivo de design sejam implantados
para que tanto os mecanismos de busca quanto os usuários obtenham as melhores
experiências possíveis.

Ter uma compreensão fundamental de como os motores de busca interagem com este tipo
de conteúdo irá ajudá-lo a decidir quando implantá-lo e onde compensar seus pontos fracos. É
perfeitamente possível construir um site otimizado que dependa fortemente de conteúdo com
script se as compensações apropriadas forem implementadas no início do processo. É
substancialmente mais difícil construir conteúdo estático ou indexável depois que o site está
construído e ativo. Então faça um

argumento contundente a favor do conteúdo estático, com base na usabilidade e em prol dos
rastreadores dos motores de busca. Pode parecer um trabalho extra no início, mas o retorno
do investimento é exponencial.

Clarão

O conteúdo Flash é tecnicamente “indexável”. Houve alguns avanços recentes na


capacidade dos mecanismos de pesquisa de visualizar arquivos Flash para encontrar o texto
e os links incorporados a esses ativos. Embora esse conteúdo seja indexado, você já viu um
ativo totalmente em Flash ganhar a primeira posição nos resultados de pesquisa?
Provavelmente não, porque é arriscado para os mecanismos de pesquisa se abrirem para
compatibilidade total com o Flash. Vamos supor que os mecanismos de pesquisa possam ver
completamente todos os links e conteúdo de texto incorporados ao objeto SWF. O que impede
um otimizador antiético (ou “chapéu preto”) de colocar maçãs nas camadas de texto do objeto
enquanto mostra

130 CAPÍTULO 8: PROJETO DE EXPERIÊNCIA DO USUÁRIO E OTIMIZAÇÃO DO MOTOR DE PESQUISA


Machine Translated by Google

laranjas para o usuário humano que visualiza os ativos totalmente compilados por meio
de um navegador? Como você pode criar links diretos para um ativo Flash sem que ele
esteja totalmente compilado? Estas vulnerabilidades fundamentais permanecerão até
que os motores de busca possam atingir algum nível de inteligência artificial que possa
dizer que uma imagem é a imagem de um cavalo sem algum texto associado que diga “esta
é a imagem de um cavalo”.

Para arquitetar um site em Flash compatível com mecanismos de pesquisa, você deve
adicionar uma camada estática de conteúdo que duplique o conteúdo em Flash. Deixando
de lado as necessidades dos motores de busca por enquanto, uma camada estática de
conteúdo é a chave para o cumprimento dos requisitos de usabilidade. Pense no mecanismo
de pesquisa como a pessoa que visualiza o conteúdo da Web por meio de uma conexão
discada ou usa um navegador leitor de tela. Essas pessoas podem ser o menor
denominador comum, e é possível que a estratégia por trás do seu desenvolvimento Web
desconte essa porcentagem muito pequena de usuários humanos. Mas quando você
desconta esse punhado de pessoas, você também desconta o GoogleBot e o Yahoo
Slurp – os dois visitantes mais importantes do seu site, já que são os rastreadores que
permitirão que os principais mecanismos de busca indexem o seu site. Se nenhuma
palavra de texto ou links rastreáveis estiverem visíveis para os mecanismos de pesquisa,
seu conteúdo inevitavelmente não será encontrado por meio de resultados de pesquisa significativos.

Uma camada estática pode ser realizada de várias maneiras. Para cumprir os requisitos
do mecanismo de pesquisa, a camada estática de conteúdo precisa espelhar o conteúdo
Flash. Esta não é uma oportunidade de mostrar aos motores de busca algo diferente do
que é implantado no Flash; se você fizer isso, estará violando o espírito do jogo e
ficando diretamente no lado negro.

A maneira ideal de incorporar conteúdo Flash em uma camada estática é usar SWFobject
para que tanto o conteúdo Flash quanto o estático possam residir no mesmo URL. Isso vai
permitir que o mecanismo de pesquisa encontre o conteúdo estático e que o navegador
habilitado para Flash exiba a animação em vez do conteúdo estático. Se possível, não
use o redirecionamento para conservar a popularidade do link que aponta para o conteúdo
Flash. O Google Code fornece um conjunto simples de instruções para implementar essa
parte simples de JavaScript em http://code.google.com/p/swfobject.

Existe outra opção que funciona no lado cinza do SEO. Cloaking pode ser um palavrão para
os puristas de SEO, mas se você abordar os seguintes desafios do lado certo, poderá comer
um bolo e comê-lo também.

TECNOLOGIA, DESIGN E INFRAESTRUTURA DO LOCAL 131


Machine Translated by Google

A camuflagem aproveita a detecção do agente do usuário, detectando rastreadores de mecanismos


de pesquisa quando eles visitam um site e encaminhando-os para páginas estáticas para indexação.
Mas quando um visitante humano vê a mesma página nos resultados de pesquisa e clica no link,
o site detecta que o agente do usuário é um ser humano com um navegador habilitado para Flash
e mostra a essa pessoa a experiência dinâmica em uma URL completamente separada. O
cerne da questão permanece o mesmo do método SWFobject: você deve mostrar aos mecanismos de
pesquisa exatamente as mesmas coisas em seu conteúdo oculto e em seu conteúdo Flash.

Ajax, JavaScript e outro conteúdo com script

Um poderoso impulsionador do conteúdo da Web 2.0, o Ajax fornece aos desenvolvedores da Web a
capacidade de criar conteúdo sem páginas. No entanto, os problemas que os motores de busca têm
com o Ajax são múltiplos e requerem um bom planejamento para evitar grandes erros.

Ajax significa Asynchronous JavaScript And XML, o que indica as dificuldades que os mecanismos
de pesquisa enfrentam com essa tecnologia. Os mecanismos de pesquisa essencialmente não
conseguem lidar com JavaScript; As eficiências que o JavaScript traz aos desenvolvedores são os
problemas que os mecanismos de busca enfrentam com conteúdo dinâmico. Um problema
adicional que os mecanismos de pesquisa enfrentam com o Ajax é a natureza assíncrona da tecnologia.
Um mecanismo de pesquisa só pode ver o conteúdo do carregamento inicial da página, e qualquer
conteúdo carregado por meio de um script que ocorra após o carregamento inicial do shell não ficará
visível para indexação. Como o Google não pode estender uma sessão além do carregamento
inicial da página e não possui um mouse ou agente externo para ativar um script, qualquer conteúdo
sem página ativado pelo usuário ficará invisível, a menos que o conteúdo de texto seja incluído no
pré- casca carregada. Cabe ao designer de UX ter certeza de que a modelagem tridimensional
necessária para estruturar o design sem página também inclui o requisito de que todos os textos e
links sejam pré-carregados no shell da página. Qualquer outra coisa e seu design legal ficará
invisível.

Navegação com script

Um dos problemas mais comuns que dificultam a otimização é o uso de JavaScript no núcleo da
navegação do site. Esta é uma condição muito comum e é o resultado da forma como muitas
ferramentas de desenvolvimento de sites e gerenciamento de conteúdo funcionam. A navegação com
script parece mais legal, então as pessoas tendem a se interessar em usá-la. Mas se o JavaScript
é a tecnologia que impulsiona a navegação do site, o resultado é que os motores de busca não
conseguem construir adequadamente um modelo do link.

132 CAPÍTULO 8: PROJETO DE EXPERIÊNCIA DO USUÁRIO E OTIMIZAÇÃO DO MOTOR DE PESQUISA


Machine Translated by Google

relacionamentos dentro do site: eles simplesmente não conseguem ver a estrutura de links do site.
E se os mecanismos de pesquisa não conseguirem modelar os relacionamentos dos links no
site, o conteúdo profundo ficará invisível ou não receberá a popularidade correta do link.

Sistemas de gerenciamento de conteúdo


Os sistemas de gerenciamento de conteúdo foram construídos para a conveniência dos
humanos, mas muitos desses sistemas dificultam que os mecanismos de pesquisa lidem com
seus resultados. A seguir estão alguns problemas típicos que precisam ser evitados, seja usando
soluções alternativas ou escolhendo um sistema de gerenciamento de conteúdo que seja mais
amigável para pesquisa:

URLs dinâmicos. Os motores de busca não entendem uma “página” de conteúdo; ele
entende o caminho para esse conteúdo. Uma mudança no caminho, ou URL, que leva a
esse conteúdo faz com que os mecanismos de pesquisa clonem acidentalmente o conteúdo
várias vezes. Esta condição prejudica substancialmente a capacidade de um site funcionar
bem. Se o sistema de gerenciamento de conteúdo tiver um sistema que crie IDs de sessão
em URLs, você poderá ter sérios problemas. Acompanhe com análises maduras, não com
IDs de sessão.

Vários caminhos de URL. Um problema típico do gerenciamento de conteúdo de comércio


eletrônico é que, à medida que um produto avança em seu ciclo de vida, ele acumula vários
URLs. Novamente, como o mecanismo de busca só consegue entender uma página de
conteúdo com base na URL onde encontra o conteúdo, quando um produto aparece em uma
categoria e faz parte de uma cesta de presentes e é um especial semanal (e assim por
diante), em breve, os rastreadores de pesquisa seguiram vários links diferentes para
encontrar o mesmo conteúdo. Faça o que puder para garantir que cada parte do conteúdo
exista apenas em um URL e que vários caminhos realmente dependam de um URL,
independentemente de onde os links estejam implantados. Confie em sistemas analíticos
maduros para analisar canais.

Clonagem não intencional. Quando você percebe que uma parte do conteúdo só deve ser
acessível por meio de um único caminho de URL, é fácil ver outras condições nos sistemas
de gerenciamento de conteúdo que fazem com que o conteúdo seja clonado involuntariamente.
Basta dizer que a arquitetura deve ter apenas um único caminho de URL para um único
conteúdo.

Laços infinitos. Um corolário da questão da clonagem não intencional é o ciclo infinito.


Certifique-se de não colocar os spiders do mecanismo de pesquisa em

TECNOLOGIA, DESIGN E INFRAESTRUTURA DO LOCAL 133


Machine Translated by Google

uma tarefa potencialmente interminável de seguir os “próximos” links em um calendário ou


alguma situação semelhante. Se o spider do mecanismo de busca puder percorrer o próximo link
até o próximo dia de um calendário, onde poderá encontrar outro próximo link, ele seguirá esse
link para a próxima página, e assim por diante. Evite esse tipo de situação usando um link com
script que os mecanismos de pesquisa não conseguem seguir, para que os rastreadores possam
gastar seu tempo no conteúdo que você deseja indexar.

Estruturas de URL antigas. A primeira coisa que muitos projetos de redesenvolvimento de


sites fazem é substituir a antiga estrutura de URL. O problema é que os motores de busca
provavelmente já indexaram o conteúdo nessas URLs antigas,
e assim que você alterar todos eles, você estará essencialmente enviando sua indexação de
volta à estaca zero. Além disso, quaisquer links diretos que o site acumulou ao longo do
tempo apontam para a antiga estrutura de URL. A todo custo, preserve o máximo possível de
URLs antigos. É provável que, ao substituir o sistema de gerenciamento de conteúdo, você tenha
que alterar todos os URLs; portanto, se isso for inevitável, certifique-se de recomendar que os
URLs antigos recebam um código de status “301 movido permanentemente” e sejam

redirecionados para um -para um dos URLs antigos para os novos URLs. O redirecionamento 301
éo

único redirecionamento aceitável para fins de mecanismo de pesquisa.

Domínios, diretório e estrutura de URL são importantes


Se você está começando do zero e se as restrições de marca permitirem, tente selecionar um
domínio que contenha uma ou duas palavras-chave. Hoje em dia é difícil conseguir um
domínio .com que tenha palavras-chave de qualidade, mas se você conseguir, separe essas
palavras-chave com hífens.

Uma parte importante de como a UX afeta o SEO está na estrutura de diretórios de um site. Tem
uma influência crítica sobre como a popularidade do link é distribuída por todo o site. Simples é
melhor. Evite a todo custo ter arquivos estranhos na estrutura de diretórios. Alguns sistemas de
gerenciamento de conteúdo inserem automaticamente um subdiretório; evitar isso, se possível. Esta
condição dilui a relevância de todo o site. Os motores de busca entendem a hierarquia do site
com base na forma como os diretórios do site estão estruturados, portanto, certifique-se de que os
diretórios mais importantes estejam no topo da arquitetura.

Se o seu ambiente permitir, use palavras-chave na estrutura da URL que sejam relevantes para
a seção do site. Separe as palavras-chave com um hífen e

134 CAPÍTULO 8: PROJETO DE EXPERIÊNCIA DO USUÁRIO E OTIMIZAÇÃO DO MOTOR DE PESQUISA


Machine Translated by Google

não use muitas palavras-chave em um nome de arquivo. Escolha algo assim:


sitename.com/widget-catalog/aquatic-widgets/underwater-submersible.html.

Além disso, certifique-se de ter redirecionamentos configurados para http://site-in-question.


com para 301 movido Redirecionamento permanente para http://www.site-in-question.com.
Se um site for resolvido com e sem www, os mecanismos de busca (particularmente o
Yahoo) indexarão o conteúdo em ambas as URLs, abrindo todo o site para duplicação
acidental. Essa condição tende a se propagar quando um terceiro cria um link para o site
sem o www e o site contém uma estrutura de link dinâmica.

Conteúdo: O Rei Antigo (e Atual)


e Futuro
Embora a geração de conteúdo seja um problema de outra pessoa, a base estabelecida
na arquitetura do site tem muito a ver com disponibilizar o conteúdo certo para os
mecanismos de pesquisa.

Tal como acontece com todas as formas de pesquisa baseada em palavras-chave, você precisa

compreender o comportamento real de pesquisa das pessoas que deseja visualizar um ativo. Os

mecanismos de pesquisa ainda são muito “primitivos”, pois dependem da digitação de palavras-chave pelos usuários
para conectá-los com ativos que sejam mais ou menos relevantes para essas palavras.

Escolher as frases certas tem tudo a ver com a relevância do seu site no contexto certo.

Em um mundo perfeito, seu parceiro de SEO fornecerá um conjunto de alvos de frases-


chave antes de você começar e colaborará com você durante todo o processo de
wireframing. Se não houver um parceiro competente envolvido em seu processo, leia a
ferramenta de pesquisa de palavras-chave do Google AdWords (https://adwords.google.com/
select/KeywordToolExternal) e faça uma pequena investigação sobre o comportamento
real de pesquisa das pessoas que exploram sua categoria. Em seguida, passe algum
tempo com essas informações para descobrir as frases que os clientes em potencial estão
pesquisando e use-as conforme apropriado em todo o site. Os mecanismos de pesquisa
procuram palavras-chave em vários lugares ao longo da análise de um site. A otimização
depende de garantir que as palavras certas estejam nos lugares certos. Ao compreender
o papel das palavras-chave no processo de design UX, você estabelecerá a estrutura
necessária para
permitir o sucesso futuro.

CONTEÚDO: O ÚNICO (E ATUAL) E FUTURO REI 135


Machine Translated by Google

Então, por que o conteúdo é rei? É a essência do que um site foi projetado para oferecer. Os
mecanismos de pesquisa precisam de conteúdo de texto que possam ver e indexar. Os
visitantes do site precisam de conteúdo envolvente que mereça sua atenção. Bloggers e
webmasters precisam de conteúdo que mereça links. Sem o conteúdo certo nos lugares certos,
os mecanismos de pesquisa não conseguem conectar os visitantes certos ao seu site.

Convenções de nomenclatura e o
Batalha contra o jargão
É essencial que os alvos de palavras-chave sejam refletidos na taxonomia desenvolvida para
um site. Usar frases-chave na estrutura principal do site torna todo o site mais relevante para o
que você está vendendo. Se você está vendendo widgets, não chame a lista de produtos
on-line de Catálogo, chame-a de Catálogo de Widgets.
Da mesma forma, use sua pesquisa de palavras-chave para tomar decisões em relação ao
jargão. Por exemplo, use as palavras laptops em vez de notebooks em sua estrutura porque as
pessoas pesquisam laptops com mais de 10.000% de frequência do que procuram notebooks.

Metadados, cabeçalhos e palavras-chave


É bastante notável que tenhamos chegado tão longe no capítulo antes de nos aprofundarmos
nas questões básicas de metadados. Uma infinidade de metatags está disponível, mas apenas
algumas têm realmente muita influência porque todas as outras são suscetíveis a spam. Tags
relevantes são estas:

Título da página. Observe que esta não é a tag <meta title>, mas a tag <title> real no
cabeçalho da página. Esta tag contém o título real da página e são os 65 caracteres mais
importantes da página. Pense no título como a pequena aba que aparece no antigo catálogo
de fichas da biblioteca, que diz “Clements, Samuel” e indica que todos os cartões atrás
dessa aba são livros de Mark Twain. Cada página do site deve ter um título de página exclusivo.
Não coloque palavras-chave no título e certifique-se de carregar o título com as palavras
que mais importam.

Meta palavras-chave. Esta tag tem influência praticamente zero nos motores de
busca porque é muito vulnerável a spam. As exceções parecem ser que a distribuição do
Google AdSense analisa a meta tag de palavras-chave e que o Yahoo é influenciado de
maneira muito terciária por ela. Meta palavras-chave

136 CAPÍTULO 8: PROJETO DE EXPERIÊNCIA DO USUÁRIO E OTIMIZAÇÃO DO MOTOR DE PESQUISA


Machine Translated by Google

precisa corresponder ao conteúdo da página, e essa tag é, na verdade, um bom lugar


para inserir possíveis erros ortográficos. Deve ser diferente para cada página.

Meta Descrição. Tal como acontece com o título da página e as meta palavras-chave,
certifique-se de que a meta descrição seja exclusiva para cada página. Esta descrição é
apenas isso: um resumo do que está contido na página em questão. Diga, não venda, em
cerca de 150 a 160 caracteres. Este conteúdo é fundamental porque é
provavelmente o que os mecanismos de pesquisa exibirão no link para sua página. Se a
página não contiver uma meta descrição, o mecanismo de busca procurará um trecho de texto
ou outro conteúdo que contenha as palavras-chave pesquisadas e exibirá isso em seus
resultados. A meta descrição é mais sobre usabilidade do que SEO, portanto, certifique-se de
que cada página esteja devidamente marcada.

Metatag “Noindex”. Se você tiver alguma página que não deseja incluir nos resultados
do mecanismo de pesquisa, use a meta tag noindex. Apenas certifique-se de que as
páginas que você deseja indexar não contenham inadvertidamente essa tag.

Cabeçalhos. Os mecanismos de pesquisa reconhecem os cabeçalhos <h1>, <h2> e


assim por diante como fatores de influência, desde que você não envie spam com eles.
Tome cuidado para permitir cabeçalhos de seção que sejam descritivos e contenham as
palavras-chave relevantes para aquela página.

Texto âncora do link. O texto âncora do link é um importante influenciador do que os


mecanismos de pesquisa pensam sobre a página do outro lado do link. Este é o fator que
cria o “GoogleBomb”. Se links suficientes apontarem para uma página com o mesmo
texto âncora do link, o Google interpretará o destino como relevante para a frase no texto
âncora. Por exemplo, se você pesquisar no Google por “clique aqui”, o site da Adobe
aparecerá nos primeiros resultados.
Existem centenas de milhares de links que apontam para a Adobe e dizem “clique aqui
para baixar o Adobe Reader” ou algo semelhante. Use isso a seu favor; o texto âncora não
deve ser “Mais” ou “Clique aqui”. Em vez disso, deve conter palavras-chave relevantes para a
página de destino.

Divida os cabelos
É vantajoso ter páginas indexadas separadamente para widgets de papelão ondulado para
canhotos e widgets de papelão ondulado para destros. Esse nível de granularidade dá às suas
páginas uma chance melhor de corresponder exatamente às lendárias pesquisas de cauda
longa. Uma página que trata de uma coisa tem um

CONTEÚDO: O ÚNICO (E ATUAL) E FUTURO REI 137


Machine Translated by Google

melhor chance de ganhar por uma coisa do que por uma página que trata de várias coisas
(todos os outros fatores sendo iguais, é claro). E quem está interessado em ler uma página com
centenas de palavras?

Use mapas do site

Nos últimos anos, tornou-se popular omitir a página clássica do mapa do site. Este é um erro de
usabilidade e um erro de SEO. Descubra o fato de que qualquer site precisa de um mapa do
site. Pode não ser legal, mas é necessário.
Além disso, inclua arquivos de mapa do site em /sitemap.xml e /sitemap.txt. Embora essa
estrutura não ajude a melhorar a classificação do site, ela ajuda os mecanismos de pesquisa a
compreender a estrutura do diretório e a encontrar conteúdo novo e atualizado.

Mantenha o conteúdo atualizado

Um componente chave para obter e manter uma posição superior nos resultados de pesquisa é
atualizar constantemente o conteúdo do site. Isso não significa editar todo o conteúdo do site o
tempo todo; isso significa que o site deve crescer constantemente. Construa a estrutura de
diretórios para que a adição de conteúdo seja fácil e intuitiva e antecipe que o site crescerá com
o tempo.

Outros problemas de conteúdo

Um desafio básico ao lidar com a UX de um site rico em conteúdo é evitar a clonagem ou


duplicação de conteúdo. Procure criar páginas duplicadas com conveniências aparentemente
inócuas, como conteúdo “amigável para impressão”, que é uma duplicata exata de uma página
em um PDF ou tipo de documento semelhante. Proteja esses tipos de páginas com links de script
ou use o atributo de link rel=”nofollow”.

Não descarte a otimização da ampla gama de ativos digitais que os mecanismos de


pesquisa podem indexar. Este tópico daria quase outro capítulo, mas basta dizer que PDFs,
vídeos, imagens e outros ativos que não sejam páginas da Web são claramente uma parte dos
resultados naturais da pesquisa. Estruturar os wrappers em torno desses ativos é fundamental,
porque os mecanismos de busca precisam de indicadores para esse tipo de conteúdo. Por
exemplo, os mecanismos de pesquisa não conseguem dizer que um ativo é um vídeo de corrida
de cavalos, a menos que haja um link apontando para o vídeo com um texto âncora que diz
“vídeo de uma corrida de cavalos” colocado próximo ao texto sobre vídeos de corridas de cavalos na página código

138 CAPÍTULO 8: PROJETO DE EXPERIÊNCIA DO USUÁRIO E OTIMIZAÇÃO DO MOTOR DE PESQUISA


Machine Translated by Google

Usar atributos alt é outra maneira de ajudar a identificar ativos não textuais para os mecanismos de
pesquisa e é sempre uma boa ideia por uma questão de usabilidade.

Não crie páginas de conteúdo sem saída. Certifique-se de que até mesmo a parte inferior da
estrutura tenha links para o site principal, para que os spiders do mecanismo de pesquisa não fiquem
presos em um beco sem saída. Os links de localização atual são uma maneira direta de fazer isso
se um tipo de página não contiver a navegação principal do site.

Popularidade do link explicada


Se existe um Santo Graal do SEO, é a popularidade do link. É a pedra angular da razão pela
qual o Google funcionou muito melhor do que os outros motores de busca quando surgiu em cena.
A popularidade do link é uma determinação da qualidade e da quantidade de links que apontam
para um ativo da Web de outras páginas da Web. O Google usa o termo PageRank e é o principal
fator que pode superar muitas outras deficiências. Links são essencialmente votos para um ativo
da Web, e geralmente assume-se que algo que é interessante ou valioso para outros terá links
apontando para ele a partir de outros ativos confiáveis da Web. Com o tempo, esse conceito provou
ser inestimável para superar os esforços de spam e é, em sua essência, um princípio fundamental
para resultados de pesquisa de qualidade. Este princípio é fundamental para o designer de UX
compreender devido à forma como a popularidade do link será distribuída.

integrado na estrutura de um site.

Distribuição típica de popularidade de links


Semelhante à escala Richter usada para medir a intensidade da atividade sísmica, o sistema
PageRank do Google (nomeado pelo próprio Larry Page) é uma escala logarítmica que varia de
0 a 10. Isso significa (em termos muito gerais) que se uma página tem um PR de 4 e outra tem um
PR de 5, a página PR 5 tem 10 vezes a popularidade do link da página com 4.

É importante entender isso porque o PageRank distribui através de um site com base na
hierarquia de links e na estrutura dos diretórios. De modo geral, se sua página inicial tiver um page
rank de 5, as páginas da seção primária deverão ter um PR de 4, as páginas secundárias PR de 3, as
páginas terciárias PR de 2 e assim por diante.

POPULARIDADE DO LINK EXPLICADA 139


Machine Translated by Google

As páginas com mais links internos apontando para elas tendem a ter a maior popularidade
de links. As páginas mais importantes para vencer precisam ter o maior número de links
internos apontando para elas. Isso inclui links na navegação principal do site, mapa do site,
rodapé e links embutidos no texto. Como a popularidade do link é fundamental para uma boa
classificação nos resultados de pesquisa, você precisa ser o mais deliberado possível ao
colocar o máximo possível nas páginas que contêm a “proposta de compra”.

Cada página tem uma quantidade finita de popularidade de link que pode contribuir para as
outras páginas do site. Uma página que possui um link apontando para outra página está
enviando 100% de seu valor disponível ao destinatário. Uma página que possui cem links para
centenas de outras páginas está enviando 1% de seu valor para cada uma dessas cem páginas.

A página inicial tende a ter a maior popularidade de links, porque a página inicial de um site
tende a ter o maior número de links de sites de terceiros apontando para ela. Isso significa que a
página inicial tem mais valor para contribuir com outras páginas do site. Se houver uma
página crítica que faça parte da “proposta de venda”, coloque um link direto para ela na página
inicial para que os mecanismos de busca possam entender a importância dessa página
específica em comparação com o resto do site. Se possível, crie um recurso que possa girar links
para conteúdo profundo da página inicial.

Links de rodapé
À medida que procuramos maneiras de organizar e controlar a distribuição da popularidade dos
links em todo o site, lembre-se de que os links de texto no rodapé de cada página são uma
bênção e uma maldição e terão alguma influência na distribuição da popularidade dos links. em
todo o site. Links de rodapé típicos apontam para a política de privacidade e outras páginas
não transacionais, portanto, se for necessário que esses links estejam no rodapé, oculte-os atrás
de algum tipo de script ou, melhor ainda, “nofollow” esses links usando rel=”nofollow” atributo de
link. Isso evitará que a popularidade do link de cada página vaze para páginas que realmente não
precisam ser classificadas nos resultados de pesquisa. Também é melhor evitar a perda de
popularidade do link do que excluir totalmente as páginas que usam o robots.txt.

140 CAPÍTULO 8: PROJETO DE EXPERIÊNCIA DO USUÁRIO E OTIMIZAÇÃO DO MOTOR DE PESQUISA


Machine Translated by Google

Links cruzados no conteúdo


Os mecanismos de pesquisa consomem links incorporados ao texto. Só não exagere.
Algumas escolas de pensamento sustentam que, após os primeiros links em um bloco de
texto, os motores de busca não fornecem uma ponderação vantajosa. Coloque seus links
mais importantes no início do texto e use um texto âncora de link que contenha palavras-
chave relacionadas à página de destino.

Jogando com o sistema


Quem disse que a otimização de mecanismos de pesquisa é só trabalho e não é diversão?
Os mecanismos de busca podem contribuir com dólares reais para os proprietários de sites
e, em certos ambientes, existe uma abordagem realmente irrestrita para obter classificações
superiores a qualquer custo. Vários otimizadores de mecanismos de pesquisa tiraram vantagem
de seus clientes, cobrando muito dinheiro por técnicas espúrias que podem ter resultados
positivos no curto prazo, mas um impacto devastador ao longo do tempo.

Ao longo dos anos, uma variedade de técnicas de otimização foram empregadas por
webmasters em busca dos melhores resultados. Uma das principais evoluções na tecnologia
dos mecanismos de busca tem sido o trabalho na engenharia das maneiras inteligentes que
foram encontradas para manipular o sistema. Do ponto de vista dos motores de busca, os
melhores interesses dos seus usuários são atendidos por resultados claros e altamente
relevantes no topo de qualquer consulta. Da perspectiva de muitos otimizadores de
mecanismos de pesquisa, vale tudo no amor e no SEO.

Chapéu Branco versus Chapéu Preto

É fácil e divertido caracterizar os métodos de SEO como “chapéu branco” ou “chapéu preto”,
mas é muito mais difícil discernir qual é qual. Muitos otimizadores de chapéu branco são
puristas, dizendo em termos fortes e declarativos que certos gerenciamentos técnicos,
manipulação de conteúdo e links e outras abordagens estão simplesmente fora dos limites. Os
chapéus pretos encaram a questão como uma disputa que nada tem a ver com trapaça:
como algo pode ser trapaça se não existe um livro de regras escrito específico ou um tribunal
de julgamento? A abordagem deles é mais parecida com um jogo de gato e rato, onde o gato
tem todas as cartas e o rato pode ganhar muito dinheiro: arrisque, ganhe e a recompensa
será grande. Mas assim que os mecanismos de pesquisa alcançarem você (e quase

JOGANDO O SISTEMA 141


Machine Translated by Google

sempre faça isso) esteja preparado para que seu site seja banido ou, pelo menos, incapaz de
funcionar quando os métodos forem revogados.

Spam com meta palavras-chave


Muitas das técnicas de “trapaça” foram baseadas nos princípios de UX.
Um método inicial para enganar o sistema era o preenchimento de meta palavras-chave -
essencialmente preencher a meta tag de palavras-chave com centenas de ocorrências de
maçãs quando o conteúdo do site é todo sobre laranjas. Na sua raiz, a abordagem de meta
palavras-chave foi criada para ajudar na taxonomia dos primórdios da Web. Hoje, por causa de
todo o spam de palavras-chave, esse pedaço de página da Web praticamente não tem influência
no posicionamento da pesquisa. Os motores de busca detectaram facilmente essa técnica e foram
rapidamente capazes de elaborá-la. A próxima geração de spam foi um pouco mais difícil de
desvendar e também teve suas raízes em questões de UX.

Clonagem e páginas de entrada


Tanto a clonagem quanto as páginas de entrada são métodos usados para fazer um site parecer
maior ou diferente para os mecanismos de busca. Ao clonar uma página repetidamente, os
webmasters poderiam essencialmente fabricar conteúdo minuciosamente direcionado que
poderia dominar rapidamente uma frase de pesquisa específica. Devido a esta prática, é
importante ter certeza de que sua arquitetura evita a clonagem inadvertida, uma vez que os
mecanismos de busca são sensíveis a duplicações, intencionais ou não.

As páginas de entrada são outro método para influenciar os resultados da pesquisa que
se estende pelo espaço cinzento entre os métodos de chapéu branco e chapéu preto. Por um
lado, as diretrizes de qualidade do Google para webmasters dizem que “páginas de entrada…
violam nossas diretrizes para webmasters” (www.google.com/support/
webmasters/bin/answer.py?answer=66355). As diretrizes identificam as páginas de entrada como
páginas de baixa qualidade que foram otimizadas especificamente para um conjunto de palavras-
chave que podem não ser relevantes para o site real ou que contêm spam.

Por outro lado, como ajudar os mecanismos de busca a obter acesso ao conteúdo que está
preso em um banco de dados não-arranhável ou que está obscurecido por causa de uma
tecnologia que os mecanismos de busca não gostam? Em sua definição positiva, uma página
de entrada é um conteúdo estático de alta qualidade que os mecanismos de pesquisa podem ver
e compreender, ao mesmo tempo que fornece ao visitante uma porta para o conteúdo dinâmico.
Os atuais sistemas de gerenciamento de conteúdo estão melhorando nas questões centrais que

142 CAPÍTULO 8: PROJETO DE EXPERIÊNCIA DO USUÁRIO E OTIMIZAÇÃO DO MOTOR DE PESQUISA


Machine Translated by Google

necessitaram desta abordagem, mas ainda pode ser muito útil criar páginas extras com o propósito
expresso de mostrar aos motores de busca uma representação estática de conteúdo com o qual eles
não seriam capazes de lidar de outra forma.

Spam de links
Métodos recentes para manipular o sistema centraram-se na manipulação da popularidade do
link, um conceito que é fundamental para a forma como os modernos motores de busca da Web
funcionam. Conforme discutido acima, os motores de busca determinam a relevância de um ativo
específico da Web analisando a quantidade e a qualidade dos links de outros lugares que apontam
para aquela página. Os otimizadores de mecanismos de pesquisa têm trabalhado para manipular
essa parte do quebra-cabeça por meio de redirecionamentos sorrateiros, uso excessivo de
subdomínios, criação de cada página de um site como “/index.html” e uma variedade de outras
maquinações sutis.

Algumas considerações finais


É duvidoso que esta seja a sua primeira exploração de questões de otimização de mecanismos de
pesquisa. Agora está claro o quanto a arquitetura de um site e questões relacionadas influenciam o
desempenho do mecanismo de pesquisa. O atual ambiente de pesquisa é um salto quântico à frente
da simples taxonomia ou estrutura.

A otimização cuidadosa do mecanismo de pesquisa começa com uma experiência do usuário de


qualidade. A arquitetura de um site é o ponto crítico em seu ciclo de vida onde ele pode ser
destinado ao sucesso nos mecanismos de busca ou preparado para o fracasso iminente. A
otimização de mecanismos de pesquisa é uma estratégia que nunca termina, mas o SEO de qualidade
nunca começará sem a atenção cuidadosa do designer UX.

Jonathan Ashton é vice-presidente de SEO e análise da web da Agency.com e dirige seu Centro
de Excelência para SEO. Sua equipe presta serviços de SEO para toda a empresa, garantindo que o
processo de concepção e construção de experiências interativas ricas resulte em sites que podem ser
encontrados em mecanismos de busca. Sua coluna mensal, “Industrial Strength SEO”, pode ser
encontrada em http:// searchengineland.com/ lands/ columns/ industrial-strength.php.

ALGUNS PENSAMENTOS FINAIS 143


Machine Translated by Google

9 Transição: De
Definindo para Projetar
É hora de visualizar, priorizar e planejar

Agora você tem uma bela lista de requisitos de negócios e


requisitos do usuário. E você tem informações de seus usuários
para focar suas discussões. E agora?

A menos que você esteja no Shangri-la dos projetos, você terá


um orçamento (apertado), um cronograma (completo) ou ambos
que indicam que você precisará se concentrar e gerenciar
essa lista de alguma forma. Este capítulo discute algumas das
maneiras pelas quais você pode fazer a transição da definição
para o design, incluindo táticas para ajudar sua equipe a
visualizar a solução que precisa ser projetada, priorizar recursos
para criar um conjunto unificado de requisitos e planejar as
atividades de design que se seguirão. na próxima fase do projeto.

Carolyn Chandler

67
Machine Translated by Google

O Capítulo
e como 4 abordou diferentes
eles afetam abordagens
a maneira ou colabora
como você metodologias
com de projeto,
a equipe do projeto e
partes interessadas do negócio. Ele comparou uma abordagem em cascata, que tem fases
de Definição e Design separadas por uma etapa de aprovação, com uma abordagem em
cascata modificada que tem alguma sobreposição de fases.

Este capítulo discute as atividades que podem ocorrer na sobreposição entre as fases Definir
e Projetar.

Definir

Projeto

Desenvolver

Este ponto do processo é o momento certo para

Idealize e visualize recursos que não surgiram durante entrevistas com as partes
interessadas ou pesquisas com usuários. Fazer isso com a equipe do projeto
antes de priorizar permite que você considere e planeje recursos inovadores que atendam
às necessidades do negócio e do usuário.

Priorize os requisitos do projeto. Isso envolve pegar a lista integrada de requisitos de


negócios, requisitos do usuário e ideias da equipe do projeto e determinar sua importância
relativa no cumprimento dos objetivos do projeto.
Neste ponto, você trabalhará com a equipe de desenvolvimento para compreender o nível
geral de esforço necessário para atender a cada requisito.

Planeje as atividades e a documentação que você usará durante o design. Esse


o planejamento determina como você trabalhará com outros membros da equipe e que tipos
de ferramentas ou documentos eles receberão de você, como mapas do site e wireframes
(discutidos nos capítulos 10 e 11).

Este capítulo cobre cada uma dessas três áreas, começando com um método de idealização
e visualização que é fácil para um designer de UX usar em colaboração com os membros
da equipe do projeto.

TRANSIÇÃO: DA DEFINIÇÃO AO DESIGN 145


Machine Translated by Google

Um cenário comum
Os requisitos são definidos e aprovados, e você está no meio do design dos recursos do site no
plano. No meio do processo de design você percebe que fornecer uma ferramenta específica será
muito útil para seus usuários. É uma ideia interessante, mas não há requisitos que descrevam essa
nova ferramenta, portanto incluí-la agora requer uma mudança nos requisitos priorizados.

Você precisará defender fortemente a alteração da lista de requisitos, especialmente se isso significar
que algo mais precisa sair da lista (levará tempo para decidir o que é) — ou que o cronograma do
projeto possa escorregar. Existe a possibilidade de a ideia não ser incluída simplesmente porque
surgiu tarde demais no jogo.

Embora novas ideias possam surgir a qualquer momento do projeto, reservar algum tempo para
idealizar recursos após a conclusão da coleta de requisitos, mas antes da priorização, ajuda a
gerar essas ideias mais cedo e aumenta a probabilidade de elas serem incluídas. Também garante
que você reserve algum tempo para considerar recursos inovadores que podem não ter ocorrido às
partes interessadas ou usuários de sua empresa.

Idear e visualizar recursos


Os designers de UX possuem um conjunto único de habilidades que ajudam a
preencher a lacuna mental entre palavras (como requisitos) e imagens (como mapas
de sites e wireframes). Por mais que as pessoas falem sobre requisitos e discutam sobre a
linguagem, muitas vezes elas não entrarão na mesma página até que possam ver o
conceito representado visualmente.

Por outro lado, se você entrar em detalhes visuais específicos muito rapidamente, corre
o risco de focar a conversa em detalhes menores (por exemplo, se uma escolha em um
formulário deve ser um botão de opção ou uma opção suspensa) antes de resolver as
grandes questões. (como se seus usuários deveriam preencher aquele formulário
específico em primeiro lugar).

Existem muitas técnicas de design conceitual que você pode usar ao longo do processo
que ajudam a visualizar o contexto, o fluxo e a história de uma forma que envolva
outras pessoas antes que o design detalhado comece para valer. Estas técnicas também irão

146 CAPÍTULO 9: TRANSIÇÃO: DA DEFINIÇÃO AO PROJETO


Machine Translated by Google

revele a necessidade de recursos que possam ser adicionados ao seu documento de


requisitos antes que ocorra a priorização.

Uma dessas técnicas é a criação colaborativa de storyboards: visualizações de cenários


específicos de usuários esboçados em papel ou quadro branco durante uma reunião de
brainstorming. O designer UX então trabalha a partir desses esboços para adicionar detalhes.

O processo básico de storyboard


Prepare-se para a sessão de storyboard criando uma lista de cenários que você gostaria
de explorar. Para construir o cenário, considere as seguintes questões e traga as respostas
para a sessão:

Quem é o principal usuário neste cenário? Que papel ele está desempenhando? É
aqui que seu modelo de usuário ou personas serão úteis. Se você os tiver, traga-os para a
reunião – ambos focarão a conversa e garantirão que sua equipe de projeto tenha uma
melhor compreensão de como podem usar as ferramentas de modelagem do usuário durante
a fase de design.

O usuário escolhido é um usuário iniciante do site? Se não, ele é um usuário


esporádico ou usa com frequência? Isso afetará o nível dos recursos que você discutirá;
um usuário iniciante pode ficar surpreso com o número de opções que um usuário frequente
pode gostar. Você pode discutir o cenário duas vezes para revelar recursos diferentes que
podem ser necessários para cada um.

grupo, como ajuda contextual para novos usuários ou recursos de personalização para
usuários frequentes.

Que necessidade imediata levou esse usuário ao site? O que ele está tentando
realizar e por quê? Você pode gerar ideias sobre isso observando as tarefas de alto
nível abordadas em seu negócio ou requisitos do usuário, como “encontrar recomendações
de produtos”. Talvez o usuário queira encontrar recomendações de produtos porque
precisa de um par de botas de neve e quer ter certeza de que elas não vazarão e molharão
os pés.

Reúna sua equipe de brainstorming para a sessão. Essa equipe pode ser formada apenas
por você e mais uma pessoa ou pode ser um pequeno grupo de três ou quatro outras
pessoas. (É possível fazer mais, mas pode ser difícil reunir todos de forma eficaz em torno de
um quadro branco e mantê-los concentrados na tarefa em questão.)

IDEAR E VISUALIZAR RECURSOS 147


Machine Translated by Google

Idealmente, pelo menos uma pessoa do grupo será responsável por representar o ponto
de vista do usuário. Outro deve representar o ponto de vista do negócio (por exemplo, uma
parte interessada do negócio ou um analista de negócios, se essa função estiver
representada no projeto). Isso não significa que você não possa mudar de perspectiva; você
pode e deve considerar as necessidades do usuário e da empresa tanto quanto possível
durante a discussão. Consulte a seção “Manter uma boa tensão” para obter mais informações
sobre como equilibrar as necessidades do usuário e do negócio.

Depois de reunir sua equipe, diga-lhes os objetivos da atividade: compreender alguns dos
recursos que podem ser necessários para atender às necessidades do negócio e do usuário
e concentrar esforços futuros de design. Apresente as respostas às questões listadas
acima e a lista de cenários a serem discutidos. Em seguida, vá até o quadro branco (ou coloque
o lápis no papel) e faça perguntas ao grupo sobre o cenário, como

Como esse usuário provavelmente chegará ao site? Considere pesquisas online, banners,
boca a boca e outros caminhos.

Se as pesquisas on-line vierem à mente, os requisitos refletem com precisão os tipos de


recursos ou atividades (como marcação para necessidades de SEO) para apoiar essa
pesquisa?

Uma vez no site, o que o usuário vê que será relevante para sua necessidade?

Qual caminho o usuário seguirá para concluir a tarefa? Esboce isso com detalhes de
alto nível.

Outras pessoas estão envolvidas na tarefa? Em caso afirmativo, como eles poderiam
estar envolvidos (telefone, e-mail, recursos colaborativos do site) e como poderiam
influenciar as decisões ou comportamentos do usuário principal?

Onde é provável que um usuário precise de ajuda ao longo do caminho? Como ele vai conseguir isso?

O que acontece quando o usuário termina sua tarefa? Um erro comum de design é
pensar que você terminou quando a tarefa do usuário foi concluída, mas esse é um ótimo
momento para incentivar o usuário a explorar outras áreas do site ou considerar a
compra de produtos relacionados.

Considere um exemplo de um cenário empresarial comum: a necessidade de publicar uma


nova vaga no site .com da empresa. Para fins deste cenário, digamos que você conduziu
entrevistas com as partes interessadas e descobriu que o processo de contratação é
gerenciado principalmente por uma pessoa, chame-a de Jeff, do departamento de recursos
humanos, que trabalha com quem precisa contratar.

148 CAPÍTULO 9: TRANSIÇÃO: DA DEFINIÇÃO AO PROJETO


Machine Translated by Google

Jeff está bastante familiarizado com as descrições de cargos que existem atualmente.
Quando um novo é necessário, ele geralmente descobre quando o potencial gerente para
o novo cargo lhe pede para anunciar uma vaga. É então um processo colaborativo entre
Jeff e a gerente (vamos chamá-la de Emily) para redigir e publicar a descrição do cargo.

A Figura 9.1 ilustra como seria o storyboard desse cenário.

A figura mostra apenas uma parte do storyboard que você pode criar aqui.
Você pode querer começar mais cedo no cenário para mostrar o processo de aprovação pelo
qual Emily teve que passar, ou você pode querer continuar o storyboard para mostrar um
caçador de emprego encontrando e se candidatando ao emprego.

O importante a ser observado aqui é que um storyboard como esse permite que você e
sua equipe de projeto vejam o fluxo de trabalho como mais do que uma série de páginas.
Traz o elemento humano e o contexto. E sem o elemento humano de uma persona (Jeff),
sua equipe pode não ter pensado em incluir o recurso de extrair uma descrição de cargo
existente para começar - embora todos nós tenhamos feito isso como uma forma de
economizar tempo e garantir que estamos incluindo tudo o que precisamos.

Figura 9.1 Um storyboard criado inicialmente em um quadro branco e depois esboçado e


detalhado no Microsoft Visio usando um tablet Wacom

IDEAR E VISUALIZAR RECURSOS 149


Machine Translated by Google

Uma coisa a ter em mente ao usar storyboards e outros tipos de esboços (como
fluxos de usuário e wireframes conceituais) é que eles se destinam principalmente a ser
ferramentas de brainstorming. Embora algumas ótimas ideias surjam do exercício, esses
esboços não pretendem ser projetos detalhados. Esse fato pode ser aparente na forma de
esboço (em oposição à forma de protótipo), mas ainda é um ponto importante a ser discutido
com as partes interessadas do negócio, porque ver os recursos visualizados mesmo em um
esboço pode, às vezes, levar a expectativas de que eles existirão no produto final.

Outro risco aqui é que os participantes possam se distrair em debates sobre elementos da
interface do usuário, como se algo deveria estar na página ou em um pop-up. É muito fácil
entrar nessas discussões detalhadas porque esses tipos de problemas são muitas vezes
mais fáceis (ou mais familiares) de resolver do que os problemas maiores que os cenários
pretendem resolver. Para manter as coisas simplificadas e usar o tempo de forma eficiente,
peça aos participantes que guardem esse tipo de discussão para o ponto em que você está
projetando de acordo com sua lista priorizada de requisitos.

E isso nos leva à próxima etapa do processo: o processo muitas vezes animado, às vezes
doloroso, de priorizar aqueles belos requisitos que você passou tanto tempo coletando!

Facilite o processo de priorização


Você tem seu conjunto de requisitos de negócios que foram desenvolvidos com recursos
baseados nos requisitos do usuário e no seu trabalho de idealização. Agora vem uma das
partes mais difíceis: reduzir tudo a uma lista priorizada de requisitos de alto valor.

Ao analisar os requisitos que precisam ser priorizados, tenha em mãos os objetivos do projeto,
bem como seu modelo de usuário, para ajudá-lo a focar a discussão em seus grupos-alvo.
Além de você, na sua função de usuário
defendem, o processo de priorização também deve incluir:

Alguém que representa o ponto de vista do negócio (o negócio


advogado).

Alguém que representa o ponto de vista da equipe de desenvolvimento (o defensor do


desenvolvimento).

150 CAPÍTULO 9: TRANSIÇÃO: DA DEFINIÇÃO AO PROJETO


Machine Translated by Google

Alguém que representa as necessidades do projeto (como o gerente do projeto). Esta


pessoa pode não precisar estar nas reuniões de priorização, mas definirá quaisquer
restrições que afetem a priorização (como prazos ou orçamento) e garantirá que a lista
final se encaixe nelas.

O papel do UX Designer na priorização


Pode ser tentador considerar a priorização como uma responsabilidade compartilhada entre o patrocinador

do projeto, o gerente do projeto e o líder da equipe de desenvolvimento, em vez de um problema para

um designer de UX. Não há nada mais longe da verdade.

As discussões de priorização são onde soluções bem-sucedidas são feitas ou quebradas.

Os designers de experiência do usuário têm a responsabilidade de usar suas habilidades para essas

conversas importantes.

Se você já faz parte do processo de priorização, esta seção lhe dará dicas sobre como participar. Se não

estiver, faça o que puder para se envolver. Isso significa que você precisa informar a equipe do projeto

sobre as habilidades que você traz para a mesa:

como facilitação – e a perspectiva equilibrada que você pode trazer. É essencial demonstrar que você pode

compreender as perspectivas dos diferentes membros da equipe e trabalhar juntos em direção a um

entendimento unificado. Consulte a seção “Manter um bom


Tensão” para saber mais sobre como alcançar esse equilíbrio.

A equipe de priorização analisa cada um dos requisitos para responder às seguintes


perguntas:

Qual o seu nível de importância para o negócio? Quão importante é o requisito para
atingir um ou mais objetivos do projeto? Qual será o impacto se este requisito for deixado
de lado?

Qual o seu nível de importância para o usuário? O requisito atende a uma necessidade
comum do usuário (ou necessidades de alto impacto para grupos de usuários prioritários)?
Como isso afetará a experiência do usuário se isso for deixado de fora? Existem outros
requisitos muito semelhantes e que possam competir?

Para esta última pergunta, tenha em mente que múltiplas soluções para o mesmo
problema podem competir entre si e causar confusão ao usuário (além de exigir mais
esforço de suporte). Por exemplo, o New York Times pode ter uma equipe de desenvolvimento
grande o suficiente para dar suporte a todos os recursos de compartilhamento

FACILITE O PROCESSO DE PRIORIZAÇÃO 151


Machine Translated by Google

no nytimes.com (indicado em azul na Figura 9.2), mas alguns de seus usuários podem
ficar confusos sobre se devem clicar em Recomendar, Enviar e-mail,
ou Compartilhe para enviar o artigo para um amigo. Se seus usuários não estiverem
familiarizados com todas as opções de compartilhamento que explodiram nos últimos
anos, você provavelmente deveria começar com um conjunto menor de recursos.

Qual é a viabilidade técnica de desenvolver o requisito? Que tipo de tempo é


necessário para desenvolvê-lo? Se você estiver trabalhando com uma tecnologia
relativamente nova, a estimativa de tempo será maior aqui.

Qual é a viabilidade de recursos para desenvolvê-lo? A equipe do projeto possui


as pessoas, as habilidades e o dinheiro necessários para desenvolver o recurso?
(Considere os custos de aquisição e aprendizagem de novas ferramentas tecnológicas.)

Figura 9.2 Uma imagem de www.nytimes.com, destacando os vários recursos de compartilhamento


que o jornal on-line oferece

152 CAPÍTULO 9: TRANSIÇÃO: DA DEFINIÇÃO AO PROJETO


Machine Translated by Google

Crie uma planilha que capture suas decisões para cada requisito. Isso pode incluir uma
classificação baixa, média ou alta com base nas perguntas acima, ou você pode usar uma
escala numérica para poder somar os números para fins de classificação. À medida que você
analisa a lista, você pode descobrir que precisará consolidar requisitos semelhantes ou
dividir um requisito grande em vários requisitos menores que representam unidades de trabalho
potencialmente independentes.

Tenha em mente que este sistema serve simplesmente para ajudar a classificar e priorizar;
não se baseia numa análise científica da viabilidade do requisito. É, no entanto, muito útil para
gerir uma lista grande, inspirar discussões e capturar a importância relativa.

A Figura 9.3 mostra um exemplo de planilha de priorização que utiliza categorias de alto
nível de importância e viabilidade (baixa, média e alta) para atribuir valores relativos a cada
requisito.

Planilha de Priorização

Descrição do Requisito Negócios Do utilizador Técnico Recurso


Importância Importância Viabilidade Viabilidade

Figura 9.3 Um exemplo de planilha para priorização de requisitos

FACILITE O PROCESSO DE PRIORIZAÇÃO 153


Machine Translated by Google

Atribuir valores a cada uma das categorias inspirará muitas conversas entre a equipe de
priorização. Como você pode ajudar a facilitar a discussão e a tomada de decisões?

Duas das coisas mais importantes que você pode fazer são compreender (e às vezes
representar) os diferentes pontos de vista que são fundamentais para definir uma solução
equilibrada e ajudar a resolver áreas de conflito dentro da equipe do projeto.

Primeiro, vamos falar sobre como representar o conjunto correto de pontos de vista durante a
priorização. Isso envolve criar e manter a tensão entre a defesa do usuário, a defesa dos negócios
e a defesa do desenvolvimento – um bom tipo de tensão, porque garante uma solução
equilibrada que proporciona uma boa experiência ao usuário, atende às restrições do projeto e se
alinha aos objetivos de negócios.

Mantenha uma boa tensão


À medida que você reúne os requisitos, e também durante o restante do projeto, você
pode notar três funções se interpondo durante as discussões da equipe:

Defensor do negócio: O membro da equipe que representa as necessidades e


requisitos do negócio e garante que eles sejam capturados e atendidos da forma mais
fiel possível. As principais preocupações do defensor do negócio incluem o
cumprimento dos objetivos estratégicos da empresa e do departamento, garantindo
que a visão do negócio não se perca durante o projeto e estabelecendo e mantendo o
foco nos objetivos do projeto.

Defensor do usuário: O membro da equipe que representa as necessidades e


perspectivas dos principais usuários que experimentarão o site. Primário
As preocupações do defensor do usuário incluem garantir que o site atenda às
expectativas de usabilidade, proporcionando uma experiência satisfatória e envolvente
e incentivando comportamentos que apoiem os objetivos do projeto.

Defensor do desenvolvimento: O membro da equipe que representa as necessidades


e restrições das equipes de tecnologia e garantia de qualidade. Primário
As preocupações incluem garantir que a equipe de desenvolvimento trabalhe de forma
eficiente e dentro do escopo e que entregue um produto que atenda aos padrões de
qualidade esperados pelos usuários e pelas partes interessadas do negócio.

154 CAPÍTULO 9: TRANSIÇÃO: DA DEFINIÇÃO AO PROJETO


Machine Translated by Google

Imagine isto como um cabo de guerra tripartido entre os defensores. Se a tensão for
respeitosamente bem mantida entre os três (o que significa que nenhum defensor domina),
então os três lados podem trabalhar em direção a uma solução bem equilibrada
que atenda aos objetivos do projeto.

Cada membro da equipe deve estar ciente de que tem interesse em manter o equilíbrio ao
longo do projeto. Se um lado dominar, os outros papéis perdem terreno e o projecto corre o
risco de falhar os seus objectivos – ou alcançá-los a um preço muito mais elevado do que o
esperado. Veja a Figura 9.4 para exemplos do que pode acontecer quando a tensão não está
equilibrada.

Figura 9.4 Consequências quando uma boa tensão não é mantida

MANTENHA UMA BOA TENSÃO 155


Machine Translated by Google

Você pode desempenhar mais de uma dessas funções em um projeto? Absolutamente!


Idealmente, diferentes membros da equipe têm responsabilidade primária por cada função,
mas isso não significa que você não possa trocar de lugar de vez em quando. Na verdade,
você pode mudar de função de discussão para discussão – ou mesmo de tópico para tópico.
Como designer de UX, você atuará como defensor do usuário na maioria das vezes, mas
precisa entender os pontos de vista de todas as três funções e garantir que eles sejam
representados de forma consistente para criar designs de sucesso.

Embora mudar de função de tempos em tempos seja saudável, tome cuidado ao se designar
como a principal pessoa responsável por mais de uma dessas funções.
Você pode começar a fazer concessões incontestáveis à medida que o projeto avança, porque
não terá um “advogado do diabo” consistentemente presente para lhe fazer essas perguntas
desconfortáveis, mas importantes. Se você precisar assumir mais de uma função, tente
encontrar um recurso de meio período que possa desempenhar outras funções para você
ocasionalmente, para ajudar a garantir que uma boa tensão seja mantida.

Até este ponto, nos concentramos principalmente nas funções de defensor dos negócios
(particularmente nos capítulos 4 e 5) e de defensor dos usuários (particularmente nos capítulos
1 e 6). Vamos dedicar um momento para discutir o terceiro papel principal nas nossas
discussões sobre priorização: o defensor do desenvolvimento.

O defensor do desenvolvimento
Se você é um designer de UX de coração, terá sucesso ao se colocar no lugar dos outros para
entender suas necessidades e objetivos. Essa habilidade é inestimável tanto para desempenhar
seu papel como defensor do usuário quanto para garantir comunicação e colaboração
eficazes com as pessoas de sua organização. Vamos usar essa habilidade para delinear os
objetivos do defensor do desenvolvimento.

Um dos grandes debates sobre design diz respeito até que ponto o defensor do
desenvolvimento deve participar e influenciar o processo de recolha de requisitos – e
qual é o seu papel durante o processo. Se o defensor do desenvolvimento apresentar
possibilidades e limitações técnicas demasiado cedo, poderá restringir parte do brainstorming
que poderia levar a algumas soluções muito inovadoras. Afinal, a ideia do céu azul de hoje
poderia ser possível com algumas explorações técnicas adicionais. Mesmo que a ideia não
seja viável, discuti-la pode trazer à tona uma necessidade subjacente que você pode resolver.
(O mapeamento de solicitações de recursos para necessidades será abordado posteriormente
neste capítulo.)

156 CAPÍTULO 9: TRANSIÇÃO: DA DEFINIÇÃO AO PROJETO


Machine Translated by Google

Estes são os objetivos e responsabilidades relacionadas do defensor do desenvolvimento:

Atenda aos requisitos dentro do prazo e do orçamento

Garantir a eficiência da equipe (evitando trabalho redundante, garantindo uma boa


comunicação)

Faça o melhor uso das ferramentas e plataformas disponíveis

Selecione ferramentas adicionais econômicas

Garanta que mudanças futuras não exijam muito trabalho extra

Torne a solução escalável para acomodar o crescimento

Torne a solução modular, para que peças individuais possam ser facilmente modificadas

Torne a solução o mais padronizada possível: Quanto menos modificações forem feitas em
um sistema adquirido, menos trabalho de redesenvolvimento será necessário.
necessário no futuro

Certifique-se de que a equipe de desenvolvimento funcione bem

Limitar a rotatividade fornecendo um trabalho relativamente interessante e gratificante

Limite o esgotamento que pode acontecer com empurrões de última hora

g Trabalhando
q com requisitos herdados
Passo 1 Passo 4
Revise os requisitos e marque aqueles com necessidades
Herde a pilha de requisitos e faça a revisão inicial.
pouco claras ou valor questionável para o usuário.

EM

Passo 2
Reúna informações que forneçam contexto
sobre possíveis usuários.
Etapa 5
Revise os requisitos marcados com a equipe para investigar
necessidades e conflitos.
"Aqui está o porquê."

“Os usuários são...” B


EM
BD

etapa 3
Crie um modelo de usuário provisório.
Etapa 6
Priorize todas as alterações que você acha que precisam ser feitas.
Defenda-os e apresente-os à equipe do projeto. Seja direto e
A pragmático.
B
EM
C “Bom ponto!” "Hum..."

EM
BD

MANTENHA UMA BOA TENSÃO 157


Machine Translated by Google

Contudo, se o defensor do desenvolvimento não for envolvido suficientemente cedo, a


equipa pode avançar muito no caminho de uma determinada opção apenas para
descobrir que é demasiado caro incluí-la – ou o defensor do desenvolvimento acaba por
perder um ou mais dos seus próprios objectivos. E por último, mas não menos importante, o
defensor do desenvolvimento é uma excelente fonte para destacar alguns dos recursos da
tecnologia que poderiam realmente fazer sua solução funcionar, como novas tecnologias
ou funcionalidades subutilizadas.

Uma abordagem eficaz é planejar revisões importantes com o defensor do


desenvolvimento assim que o brainstorming estiver concluído, os requisitos de alto nível
tiverem sido capturados e o processo de priorização estiver prestes a começar. Isso
permite que o defensor do desenvolvimento passe a parte inicial do processo explorando
as ferramentas selecionadas para obter mais detalhes sobre o que pode ou não ser
possível e, então, participe mais intensamente do próprio processo de requisitos, uma vez
que determinados temas e ideias tenham mais peso.

Se você acha que algumas sessões de coleta de requisitos são fundamentais para o
defensor do desenvolvimento participar, certifique-se de que ambos estejam na mesma
página com antecedência em relação ao papel dele na reunião e como você capturará
quaisquer possíveis preocupações o defensor pode ter depois de ouvir. Você também
pode gravar esses tipos de sessões para revisar mais tarde com o defensor do
desenvolvimento. Você mesmo pode precisar deles quando estiver no meio do design!

Esse tipo de comunicação clara e acompanhamento durante a coleta de informações é


vital para construir relacionamentos fortes entre os membros da equipe, o que pode
fazer uma grande diferença na facilidade com que a etapa de priorização ocorre
posteriormente no processo. Mas às vezes, apesar dos seus melhores esforços, surgem
conflitos à medida que você tenta priorizar os requisitos. Vamos falar sobre como você
pode ajudar a equipe do projeto a gerenciar esse conflito.

Gerenciando conflitos durante a priorização


Se houver grandes áreas de desacordo, a priorização pode ser um processo longo.
E se essas divergências não forem resolvidas, elas continuarão a surgir durante o projeto e
o desenvolvimento.

Estes conflitos podem ter muitas causas profundas diferentes; aqui estão alguns dos
mais comum:

158 CAPÍTULO 9: TRANSIÇÃO: DA DEFINIÇÃO AO PROJETO


Machine Translated by Google

A equipe não está na mesma página sobre os objetivos do projeto ou estratégias de negócios subjacentes

(seja mal-entendido, esquecido ou discordando sobre eles).

Os membros da equipe oponente estão intimamente ligados a um determinado conjunto de recursos.

(Talvez os recursos os entusiasmem ou eles os tenham prometido a um conjunto de clientes ou partes


interessadas influentes).

Existem conflitos entre as necessidades do negócio e as necessidades do usuário que não são

facilmente resolvido.

As tecnologias utilizadas são relativamente novas para a equipe de desenvolvimento, por isso eles se sentem

desconfortáveis em fazer estimativas.

Vamos analisar algumas das situações acima e discutir como você, como designer de experiência do

usuário, pode se envolver na solução delas.

Escolhendo suas batalhas


Durante o processo de priorização, alguns de seus recursos favoritos podem estar em risco. É fácil
começar a ficar insatisfeito com isso, especialmente se parece que os requisitos do usuário são os que
mais frequentemente são retirados da lista.

Se você defender apaixonadamente todos os requisitos igualmente, corre o risco de ter decisões de
priorização tomadas por você. Aqui estão algumas perguntas que você deve fazer a si mesmo ao
decidir quando exigir um requisito específico e quando fazer concessões:

Como o requisito apoia os objetivos do projeto?

Reduz significativamente um risco específico? Por exemplo, reduz a exposição dos

utilizadores ao spam, diminuindo as opiniões negativas sobre o site?

Outros requisitos de site propostos dependem deste para funcionar corretamente?

Qual será o impacto se o recurso não for incluído?

O valor do recurso vale o esforço necessário para desenvolvê-lo (mesmo no

custo de outros recursos que você considera importantes)?

Se você tiver uma resposta forte para todas elas, traga-as para a tabela de priorização para apresentar
seu caso. Caso contrário, considere deixar para lá, mas não se esqueça de compartilhar seus motivos
para que outros vejam que você está se comprometendo com o bem geral do projeto. Isso demonstrará
sua capacidade de considerar o contexto empresarial mais amplo e solidificará seu envolvimento em
discussões futuras e priorização de solicitações de mudança.

MANTENHA UMA BOA TENSÃO 159


Machine Translated by Google

Falta de alinhamento na direção do projeto

A equipe não está na mesma página sobre os objetivos do projeto ou estratégias de negócios
subjacentes.

Vamos separar esta fonte de conflito em duas áreas: comunicação e


consenso.

Se o problema for a comunicação dos objetivos do projeto ou das estratégias de negócios, pergunte-
se como você pode ajudar pessoalmente a melhorar a comunicação. É uma questão de postar
os objetivos ou estratégias onde todos os membros da equipe os verão (como em uma sala de
guerra ou área de colaboração on-line, ou no topo da agenda de cada reunião)? Ou talvez o que seja
necessário seja uma representação visual dos objetivos ou estratégias que ajude a colocá-los em
foco para a equipe e a deixar os membros da equipe entusiasmados com a visão pela qual
estão trabalhando.
Lembra-se das habilidades de visualização discutidas no início deste capítulo?
Use-os para criar uma imagem que possa ser facilmente impressa e postada ou esboçada rapidamente
em um quadro branco para ajudar a focar as conversas.

Se o consenso for a questão, pergunte-se como você poderia ajudar a reunir todos. O conflito é
causado pela ansiedade sobre o risco envolvido no lançamento de um conjunto de recursos muito
diferente para os usuários? Talvez haja pesquisas que você possa realizar para ajudar a resolver
algumas das divergências, como pesquisas, entrevistas ou investigações contextuais (ver Capítulo
6). Ou talvez você possa usar suas habilidades de facilitação mantendo uma discussão estruturada
sobre divergências, trabalhando os problemas ponto por ponto até que sejam resolvidos.

Conflito sobre recursos favoritos

Os membros da equipe oponente estão apegados a seus próprios conjuntos de recursos.

Suponha que o diretor do departamento de treinamento queira tutoriais integrados e baseados em


tópicos e o chefe de vendas queira uma demonstração interessante para enviar para gerar
interesse. Enquanto isso, você tem outras dez partes interessadas na empresa em diversas
funções — e todas elas têm necessidades urgentes. Como você ajuda a construir consenso?

Um método é aplicar uma variação de um método que você leu no Capítulo 6:


diagramação de afinidades. Nesse método, você pode trabalhar a partir de um conjunto existente
de requisitos ou fazer com que as partes interessadas façam um brainstorming sobre seus
próprios requisitos (especialmente útil se ainda estiver no início do processo de coleta de requisitos).
Se você estiver trabalhando com requisitos existentes, poderá imprimi-los em

160 CAPÍTULO 9: TRANSIÇÃO: DA DEFINIÇÃO AO PROJETO


Machine Translated by Google

páginas individuais e cole-as todas na parede. Caso contrário, peça às partes interessadas que
escrevam seus requisitos mais importantes em um conjunto de post-its.

O que você precisará:

Uma sala grande o suficiente para o seu grupo de partes interessadas se movimentar e que
tenha uma ou mais paredes grandes em branco nas quais você possa aplicar post-its

Um bloco de post-its grandes, pelo menos um para cada parte interessada

Pontos adesivos (você pode encontrá-los em lojas de materiais de escritório; eles vêm em
várias cores), um conjunto de dez pontos por parte interessada

Reúna seus principais interessados em uma sala e peça a cada um que reserve algum tempo
para anotar os principais requisitos, um por ano. Dê-lhes 15 a 20 minutos para fazer isso. (Sem
espiar!)

Peça a todos que coloquem seus requisitos na parede. Em seguida, peça a cada pessoa que
se aproxime e descreva o que postou. À medida que você percorre a sala, comece a agrupar
requisitos semelhantes (se as partes interessadas concordarem que são semelhantes).

Depois que os requisitos forem explicados e agrupados, distribua os pontos adesivos. Diga
às partes interessadas que elas podem indicar quais requisitos são de maior prioridade para
elas, alocando seus pontos entre os post-its.
Eles podem optar por colocar todos os dez pontos em um requisito, por exemplo, se
acharem que é tão importante, ou podem escolher colocar um ponto em dez requisitos diferentes.
Você começará a ver alguns favoritos claros se formando conforme as pessoas colocam seus
pontos.

Quando terminarem de colocar os pontos, analisem os resultados juntos. Quando forem forçados
a escolher este caminho, as partes interessadas apresentarão as suas próprias prioridades
internas e a conversa provavelmente se tornará muito mais fácil.

Surfar
Para obter mais informações sobre uma variação desta técnica a ser usada na priorização, consulte

este artigo “A Técnica KJ: Um Processo de Grupo para Estabelecer Prioridades”, por
Jared M. Spool: www.uie.com/articles/kj_technique.

MANTENHA UMA BOA TENSÃO 161


Machine Translated by Google

Esse tipo de técnica pode ajudá-lo a iniciar o processo de priorização ou redefinir um processo que
está paralisado devido a divergências. Uma vez alcançado o impulso e um entendimento comum,
será muito mais fácil preencher o documento de priorização (como o que vimos na Figura 9.3).

Paralelamente às suas atividades de priorização, você deve se preparar para todo o esforço de
design que se seguirá em breve. Ter um plano para seu trabalho o ajudará a estimar o esforço que
estará envolvido na criação de projetos detalhados, integrar seu trabalho com o de outras
pessoas da equipe do projeto e coordenar esforços para alinhar-se aos marcos do projeto. A próxima
seção aborda algumas das considerações que o ajudarão a planejar.

Planeje suas atividades e documentação


Depois de ter uma lista priorizada de requisitos e, idealmente, algum trabalho conceitual inicial
concluído (como os storyboards ilustrados anteriormente neste capítulo), seu gerente de projeto
provavelmente começará a pedir detalhes sobre o que você fará ao projetar .

Existem vários tipos de atividades de design, e cada uma terá um impacto diferente em como
você projeta, no tempo que levará e no tipo de documento que você obterá. Este é um
“documento” num sentido geral; pode variar de um esboço de quadro branco a um wireframe e a
um protótipo.

Abordaremos algumas atividades de design de interação nos próximos três capítulos. Ao planejar
as atividades a serem usadas, tenha estas questões em mente:

Quão iterativo será o processo geral? Idealmente, você pode começar explorando
vários conceitos diferentes rapidamente (por exemplo, por meio de esboços) e, em
seguida, chegar a um acordo sobre um que será desenvolvido com mais detalhes.
Essa abordagem também poderia envolver levar um ou mais conceitos de design aos usuários
(veja o Capítulo 13 para obter mais informações sobre testes de design).

Como a colaboração acontecerá durante o design? Se você estiver trabalhando em estreita


colaboração com uma equipe no mesmo local, poderá incluir mais sessões colaborativas de
quadro branco. Se a equipe estiver dispersa, considere sessões de webconferência com
ferramentas que permitam um alto grau de colaboração apesar da distância.

162 CAPÍTULO 9: TRANSIÇÃO: DA DEFINIÇÃO AO PROJETO


Machine Translated by Google

Como seus documentos de design serão compartilhados com a equipe maior? Você os
está enviando por e-mail para uma pequena equipe ou os publicando em um site de colaboração
on-line? O que isso significa em termos de limitações de tamanho e do processo de rastreamento
de versões?

Quantos detalhes seus projetos precisarão conter posteriormente no processo de


desenvolvimento? Se seus documentos fizerem parte de um processo formal de garantia de
qualidade (QA), você deve envolver alguém da equipe de QA desde o início para que eles
entendam que tipos de detalhes receberão de você.

Quanto tempo seus documentos precisam para “viver”? Com projetos complexos, no
minuto em que você para de atualizar um documento, como um conjunto de wireframes, ele
começa a “morrer” – os detalhes se tornam mais imprecisos com o passar do tempo.
(Isso nem sempre é uma coisa ruim, desde que você esteja envolvido na discussão dessas
mudanças.) Documentos focados em fornecer diretrizes gerais, como um documento de
diretrizes de marca ou uma biblioteca de padrões de design de interação, tendem a viver mais.

Quem são os principais usuários de cada tipo de documentação? Esta resposta pode ser
diferente em diferentes pontos do projeto. Os principais usuários de seus documentos de
design conceitual geralmente são as partes interessadas da empresa e a equipe de design, que
os utilizam para comunicar e socializar ideias.
Documentos de projeto detalhados destinam-se principalmente aos desenvolvedores que
precisam implementar os projetos; esses documentos fornecem orientações específicas.

Com quais outros tipos de documentação a sua precisará se alinhar? Você precisará
fornecer algum tipo de vínculo entre a lista priorizada de recursos que você criou acima e os
designs que você cria. Talvez seja necessário ficar de olho em vários outros tipos de documentos
também, para garantir que todos estejam na mesma página. Esses documentos podem incluir
diretrizes de marca, planos de desenvolvimento de conteúdo, especificações funcionais ou casos
de uso (consulte o Capítulo 2 para obter uma visão geral das diferentes funções e dos tipos de
documentação que eles podem produzir).

Como você pode estimar o esforço necessário para cada tipo de documento? Este é
complicado, pois há muitas variáveis em um projeto que podem afetar o tempo. Mas, ao definir
uma linha de base para uma estimativa aproximada, você terá um ponto de partida e poderá
validar os números à medida que obtém mais informações. Por exemplo, você pode definir
uma estimativa básica de que cada wireframe detalhado levará cerca de 6 horas para ser
criado. Se você estimar um recurso específico

PLANEJE SUAS ATIVIDADES E DOCUMENTAÇÃO 163


Machine Translated by Google

exigirá cerca de cinco páginas (por exemplo, com base nos resultados das
sessões de storyboard descritas anteriormente neste capítulo), você terá uma
estimativa inicial de 30 horas para esse recurso. Se acabar ocupando oito
páginas por wireframe, tente descobrir o porquê. Se for algo que você acha que
continuará, você precisará revisar sua estimativa e possivelmente redefinir prioridades.

Que fatores adicionais afetarão o momento do documento? O tempo total


inclui o tempo de revisão com a equipe e com as partes interessadas, bem como
o tempo para o número de revisões que você acha que precisará fazer. Para
sites detalhados, também pode incluir o tempo necessário para reconciliar seus
documentos de design com outros documentos, como requisitos funcionais
detalhados (como casos de uso). Anote essas suposições para que você possa
verificá-las mais tarde.

Você trabalhará com vários designers e, em caso afirmativo, como


dividirá o trabalho? Se estiver trabalhando em áreas paralelas, mas distintas do
site, você poderá trabalhar de forma bastante independente nos documentos
que criar. Se você estiver dividindo o trabalho de uma forma muito interdependente,
precisará planejar um tempo para reconciliar seus projetos e também poderá
precisar de uma maneira de rastrear e mesclar diferentes versões em
documentos. Evite uma grande dor de cabeça mais tarde, elaborando um
processo no início e defina algumas diretrizes de design desde o início para
que você esteja na mesma página sobre elementos-chave como navegação.

Agora que falamos sobre algumas coisas que você deve considerar ao escolher
suas atividades de design, vamos explorar essas atividades. Nos próximos três
capítulos discutiremos uma variedade de documentos, incluindo mapas de sites, fluxos
de tarefas, esboços, wireframes e protótipos.

164 CAPÍTULO 9: TRANSIÇÃO: DA DEFINIÇÃO AO PROJETO


Machine Translated by Google

10 Mapas do site e fluxos de tarefas


Estruturando seu projeto a partir de
Aqui para lá e de volta

Os mapas de sites ajudam a identificar a estrutura de sites e aplicativos.

Eles podem mostrar hierarquias e conexões que permitem ao seu

público entender onde os usuários podem localizar o conteúdo. Os fluxos

de tarefas levam os mapas do site um passo adiante, identificando os vários

cursos de ação que um usuário pode percorrer em uma seção do site.

Tarefa
fluxos também traçam conexões com estados de erro, conteúdo,

ou visualizações de páginas com base em pontos de decisão ao longo

do processo. Quando usados juntos, mapas de sites e fluxos de tarefas

pode fornecer ao seu público uma imagem clara das estruturas de

conteúdo e de como os usuários podem navegar por elas.

Russ Unger

165
Machine Translated by Google

O que é um mapa do site?


1,0 1.0.1

Termos e
Pagina inicial Condições

2,0 – 2,x 3,0 4,0 5,0

Blogue Sobre Trabalhar Contato

Figura 10.1 Um mapa do site para um site básico com funcionalidade de blog

Começando com as definições mais básicas, um mapa do site é simplesmente uma forma
visual de exibir páginas representativas de um site (Figura 10.1). Um simples mapa do site
geralmente cabe em uma única folha de papel e se assemelha ao organograma de um
empregador. Contudo, os mapas de sites não são apenas para sites; você pode usá-los para
qualquer tipo de aplicativo que se beneficiaria com a identificação de páginas, visualizações,
estados e instâncias de tudo o que está sendo exibido.

Na maioria dos casos, você usará um mapa do site para mostrar aos colegas de equipe e aos
clientes como o conteúdo será organizado para um site. Ele fornecerá uma visão geral da
navegação no site e, em alguns casos, exibirá todas as conexões que cada página pode ter.

O que é um fluxo de tarefas?


Figura 10.2 Um fluxo de tarefas básico

Pagina inicial mostrando o caminho para um


usuário dependendo do status de login

O usuário está logado?

Não
Não Sim Logado
Logado
Página
Página

Os fluxos de tarefas identificam caminhos ou processos que os usuários (e às vezes um


sistema) seguirão à medida que avançam no seu site ou aplicativo (Figura 10.2).
Embora os mapas do site e os fluxos de tarefas possam parecer semelhantes à primeira vista,
os dois tipos de diagramas têm finalidades diferentes: um mapa do site informa a hierarquia
visual do layout de um site ou aplicativo, enquanto um fluxo de tarefas fornece detalhes das
opções dos usuários e dos caminhos. eles serão capazes de tomar.

166 CAPÍTULO 10: MAPAS DO SITE E FLUXOS DE TAREFAS


Machine Translated by Google

Ferramentas do comércio
Se você está apenas começando na área de design de experiência do usuário e precisa de uma
ferramenta para começar a criar produtos de trabalho, você tem muitas opções:

Microsoft Visio (http://office.microsoft.com/visio)


Axure RP Pro (www.axure.com)

OmniGraffle (www.omnigroup.com/applications/OmniGraffle)

Adobe InDesign (www.adobe.com/products/indesign)

Adobe Illustrator (www.adobe.com/products/illustrator)

Microsoft PowerPoint (http://office.microsoft.com/powerpoint)

OpenOffice Draw (www.openoffice.org)


HTML

Blueprint CSS (www.blueprintcss.org)


Então, como você escolhe? Você pode perguntar a outros designers; todo mundo tem um favorito
e geralmente fica feliz em nomeá-lo. Só não se surpreenda se eles, assim como seus autores,
responderem “bom e velho lápis e papel”. Você também pode testar avaliações gratuitas on-line
ou optar por uma solução gratuita, como o OpenOffice Draw, que faz parte do conjunto de
ferramentas OpenOffice.org e produz os mesmos formatos que pop-ups.
grandes suítes de escritório.

Além do lápis e do papel, o que usamos? Muitos dos exemplos neste livro foram gerados
com o Microsoft Visio 2003, usando estênceis criados por Nick Finck, diretor de experiência
do usuário da Blue Flavor (www.blueflavor.com) e editor da Digital Web Magazine (www.digital-
web.com). . Você pode baixar os excelentes estênceis de Nick em www.nickfinck.com/
stencils.html.
Esses estênceis, formas e amostras prontas são inestimáveis para
profissionais novos e experientes. Além de Nick, confira as ofertas do
Information Architecture Institute, que abriga muitas dessas ferramentas em
sua página Learning IA: http://iainstitute.org/en/learn/tools.php.

Observação A Microsoft oferece atualmente uma versão 2007 do Visio; entretanto, muitas
empresas ainda não atualizaram para o produto e, para não lidar com diferenças de
versão, atualmente recomendamos o Microsoft Visio 2003.

FERRAMENTAS DO COMÉRCIO 167


Machine Translated by Google

Quaisquer que sejam as ferramentas que você decida usar, existem inúmeros exemplos
online de outros profissionais que ficarão felizes em compartilhá-los e ajudá-lo em sua
carreira. Eles são em grande parte gratuitos e podem fornecer a estrutura necessária
para criar – no mínimo – documentação com aparência muito profissional. Infelizmente,
muitas pessoas não estão aproveitando esses recursos. Não seja como essas pessoas!

Elementos básicos do site


Mapas e fluxos de tarefas
Os elementos mais básicos do seu programa de desenho serão mais que suficientes para
você começar a criar mapas do site e fluxos de tarefas. Contudo, para garantir que suas
criações possam ser facilmente interpretadas por um público amplo, é melhor usar um
conjunto padrão de formas.

O Vocabulário Visual para Arquitetura da Informação é um desses padrões e é o usado


neste livro. Criado por Jesse James Garrett, um dos fundadores do Adaptive Path
(www.adaptivepath.com), está disponível online em www.jjg.net/ia/visvocab. O site
fornece muitos elementos para ajudá-lo a articular os mapas do site e os fluxos de tarefas,
todos disponíveis com descrições detalhadas e como estênceis para download para
muitos dos programas populares de desenho e esboço (mais sobre isso daqui a pouco).

Para ajudá-lo a começar e se familiarizar com o básico, as próximas seções dão uma
olhada no conjunto básico de elementos do Vocabulário Visual e o que eles representam.

Figura 10.3 Elemento de Figura 10.4 Elemento


página do vocabulário visual Pagestack do Vocabulário
de Jesse James Garrett Visual de Jesse James Garrett

Página

De acordo com Jesse James Garrett, uma página é “a unidade básica da experiência
do usuário na Web”. “Instâncias” ou “visualizações” de conteúdo podem ser mais
realistas hoje, mas uma página ainda é muito significativa. Existem diversas maneiras
de desenhar essas páginas, mas o formato mais simples e mais comumente usado é o simples.

168 CAPÍTULO 10: MAPAS DO SITE E FLUXOS DE TAREFAS


Machine Translated by Google

retângulo (Figura 10.3). À medida que você avança na criação de mapas do site e fluxos de tarefas, você
desejará encontrar o estilo que melhor se adapta a você para rotular e numerar suas páginas.

Pilha de páginas
Uma pilha de páginas representa múltiplas páginas de conteúdo semelhante (Figura 10.4). Um
Uma maneira fácil de compreender as pilhas de páginas é pensar em conteúdo dinâmico, como uma
página de blog comum criada usando um sistema de publicação. Essas páginas são projetadas uma
vez e estão em um modelo de design, mas você tem a capacidade de clicar em muitas páginas de
conteúdo diferentes, sem realmente sair do design do modelo original.

Ponto decisivo
Figura 10.5 Elemento de
ponto de decisão do
Conecte-se
Vocabulário Visual de Jesse James Garrett

(10a)

membro
erro
lar

Um ponto de decisão é usado para mostrar o caminho que um usuário pode seguir dependendo da
resposta a uma pergunta (Figura 10.5). O ponto de decisão 10a pode ser “As credenciais de login do
usuário estão corretas?” A resposta a essa pergunta determinaria qual página (ou visualização de conteúdo)
seria exibida. Um login com falha resulta em uma mensagem de erro, enquanto um login bem-sucedido
leva o usuário à página inicial dos membros do site. Reserve um tempo para rotular adequadamente os
pontos de decisão; você ficará feliz por ter feito isso, principalmente ao compartilhar seu produto de
trabalho com
colegas de equipe ou clientes.

ELEMENTOS BÁSICOS DE MAPAS DO SITE E FLUXOS DE TAREFAS 169


Machine Translated by Google

Conectores e setas

Figura 10.6 Elementos de conector


e seta do Vocabulário Visual de Jesse
James Garrett

Conectores e setas são usados para mostrar movimento ou progresso entre páginas, pilhas de
páginas, pontos de decisão e assim por diante. Os conectores geralmente aparecem onde há uma
frase de chamariz de uma página para outra. Por exemplo, um link para a página Sobre nós na
página inicial pode ser o conector entre as duas páginas. As setas (parte superior da Figura 10.6)
indicam o movimento “a jusante” em direção à conclusão da tarefa.

Conectores com barra transversal (parte inferior da Figura 10.6) podem ser usados para identificar
quando o movimento de volta para a página de origem (movimento “upstream”) não está mais
disponível. Por exemplo, uma vez que um usuário esteja conectado a um site, o conteúdo da
página inicial poderá agora ser personalizado para o usuário, e a página genérica, ou a página
de login, não estará mais disponível para o usuário no caminho que ele acabou de acessar.
seguido.

Condições

Figura 10.7 Elemento Condição


do Vocabulário Visual de
A B
Jesse James Garrett

Uma linha tracejada é uma forma bastante comum de exibir uma condição. Ele pode aparecer em
mapas do site, fluxos de tarefas e outros produtos de trabalho que você possa criar ou inventar.

Você pode usar uma linha tracejada como conector (como na Figura 10.7) ou como uma
caixa ao redor de uma área para destacar que uma conexão com uma página – ou uma seção inteira
de páginas – é condicional com base em alguma outra ação ou evento.

170 CAPÍTULO 10: MAPAS DO SITE E FLUXOS DE TAREFAS


Machine Translated by Google

Erros comuns
Você não iria para uma apresentação com um pedaço de manteiga de amendoim no queixo
ou uma camisa manchada de café. Tal erro não apenas prejudicaria todo o seu trabalho
árduo, mas também poderia impedi-lo de realizar um bom projeto. Um mapa do site
desleixado ou um fluxo de tarefas que parece pouco profissional podem causar o mesmo dano.

Para ajudá-lo a reconhecer esses pequenos lapsos com grandes consequências, as


próximas seções examinarão de perto alguns designs ruins. Aprenda a identificar esses
erros comuns e depois evite-os.

Conexões Desleixadas
Figura 10.8 Uma conexão perdida
entre duas páginas

Conexões desleixadas são apenas isso: desleixadas. Estão mal desenhados. Eles
parecem muito amadores e dão a você – o autor – a aparência de não prestar muita
atenção aos detalhes de seu trabalho, para dizer o mínimo. A maioria das ferramentas
possui algum método para ajudá-lo a conectar suas linhas às caixas.
Por favor, aproveite isso.

Não fique com preguiça, independentemente das restrições de tempo e da pressão


que você possa estar sofrendo . Na maioria dos aplicativos, o uso de uma combinação de
Shift e outras teclas permite arrastar elementos de um ponto inicial em incrementos de
ângulo de 45 graus. Aproveite essa funcionalidade integrada e garanta que suas conexões
estejam bem conectadas. Se estiver mostrando esboços a lápis, você deve ter uma
borracha à mão, para garantir.

Faça disso uma regra: sempre certifique-se de que todas as linhas que tocam qualquer outro objeto
estejam conectadas com precisão.

ERROS COMUNS 171


Machine Translated by Google

Objetos desalinhados e com espaçamento irregular

Figura 10.9 Páginas não alinhadas e com espaçamento irregular

Dependendo da ferramenta que você está usando, pode ser difícil garantir que seus objetos
estejam alinhados com precisão ou espaçados uniformemente no mapa do site ou no fluxo
de tarefas. Existem algumas maneiras bastante simples de garantir que você entenda essa regra
básica.

Para começar, ative a grade em qualquer aplicativo que você estiver usando. Dessa forma,
independentemente de a ferramenta oferecer opções que garantam objetos com
espaçamento uniforme e alinhamento adequado, você sempre poderá contar o número de
grades entre seus objetos. Felizmente, ao usar lápis e papel, você pode usar papel milimetrado e
aplicar o mesmo princípio básico.

É muito fácil fazer com que seus documentos pareçam profissionais. Infelizmente, também é
muito fácil fazer com que seus documentos pareçam que você realmente não se importa com a
qualidade do seu trabalho.

Texto mal colocado


Figura 10.10 Texto colocado de forma inconsistente
Passo 1

Passo 2

A colocação descuidada do texto (como na Figura 10.10) parece simples de evitar, mas é
outro erro comum. Encontre uma maneira de fazer com que seu texto se ajuste perfeitamente
à forma que você criou e certifique-se de que todos os rótulos colocados fora de seus elementos
tenham conexões apropriadas (Figura 10.11).

1,0 1.0.1 Figura 10.11 Texto bem colocado


Termos e
Pagina inicial Condições

172 CAPÍTULO 10: MAPAS DO SITE E FLUXOS DE TAREFAS


Machine Translated by Google

Pode parecer básico, mas o posicionamento adequado do seu texto – juntamente com o
tamanho e uso de fonte apropriados – tornará seus documentos mais fáceis de ler e usar.

Falta de numeração de páginas


É hora de estabelecer outra regra: numere cada página de cada mapa do site que você criar. Não
crie um mapa vago e inumerável como a Figura 10.12.

Termos e
Pagina inicial
Condições

Blogue Sobre Trabalhar Contato

Figura 10.12 Mapa do site sem estrutura de numeração

Qualquer página que você identificar no mapa do site precisa receber um número, e seu sistema
de numeração deve permitir que alterações posteriores ocorram à medida que novas iterações
e versões do seu projeto são criadas.

Você pode usar diversas abordagens para numerar páginas; o mais comum é identificar sua
página inicial como 1.0 ou 0.0.0.0 (Figura 10.13). Sobre
Ao mesmo tempo, você será capaz de determinar qual delas funciona melhor para você, mas
até se sentir confortável e compreender as vantagens e desvantagens de ambas as abordagens,
comece identificando sua página inicial como 1.0. Este método permite que você considere
quaisquer decisões e páginas que possam ocorrer antes de sua página inicial – como um pré-
carregador Flash, uma tela de login ou registro ou vários outros tipos de página – como 0.X.

Um sistema de numeração nos mapas do seu site permite que outras documentações sejam
sincronizadas com ele. O sistema de numeração pode proliferar para outros documentos, como

Matriz de conteúdo. Os criadores de conteúdo podem mapear suas cópias e outros conteúdos para

páginas específicas (e para um elemento específico em um wireframe; falaremos mais sobre isso mais tarde).

Fluxos de tarefas. Os fluxos de tarefas podem usar o mesmo sistema de numeração para
mostrar como um usuário procederá pelas páginas de uma tarefa específica.

Wireframes (veja o Capítulo 11). As páginas dos seus wireframes devem compartilhar o
mesmo sistema de numeração das páginas do mapa do site para fornecer uma conexão
clara entre os dois documentos.

ERROS COMUNS 173


Machine Translated by Google

Design visual. Os designers visuais podem sincronizar páginas e elementos de design


com páginas específicas no mapa do site. Isso permite que eles segmentem seu inventário
quando chegar a hora de entregar seus projetos aos desenvolvedores.

Documentos de garantia de qualidade. As equipes de garantia de qualidade podem


criar scripts de teste dedicados a uma página ou páginas específicas no mapa do site.

Sua atenção aos detalhes e à estrutura neste ponto ajuda a manter todos os demais envolvidos
no projeto no caminho certo e fornece-lhes estrutura para suas tarefas.

1,0 1.0.1

Termos e
Pagina inicial Condições

2,0 – 2,x 3,0 4,0 5,0

Blogue Sobre Trabalhar Contato

Figura 10.13 Mapa do site que conecta páginas corretamente, com elementos alinhados, espaçados
uniformemente e numerados adequadamente

Resumindo, numerar as páginas do mapa do seu site facilitará a vida de todos - e isso significa
que a sua vida também será mais fácil.

O mapa do site simples


Além de conter números de página, a Figura 10.13 é um bom modelo para criar o mapa
de um site básico que possui funcionalidade dinâmica limitada e natureza principalmente
estática. As páginas identificadas para este site foram

Lar

Blogue

Sobre

Amostras de trabalho

Contato

Como você pode ver, este mapa do site simples incorpora os elementos principais do
vocabulário visual e mantém um estilo e aparência profissionais. Mais importante ainda,
fornece uma imagem muito clara da navegação, das páginas e das condições disponíveis
para os usuários do site.

174 CAPÍTULO 10: MAPAS DO SITE E FLUXOS DE TAREFAS


Machine Translated by Google

Mapas avançados do site


Um mapa do site simples geralmente cabe em uma única folha de papel e provavelmente
se parece com um organograma de um empregador. Mapas de sites mais avançados,
entretanto, podem se expandir para várias páginas.

1.0 Página inicial muito dolorosa

Deixe a dor ser muito boa 9 de fevereiro de 2008 pág. 3/9

Figura 10.14 Visualização avançada da página inicial do mapa do site

Ao criar mapas de sites mais avançados ou para sites e aplicativos de maior escala, uma
abordagem é usar sua primeira página para identificar qualquer uma das etapas
necessárias para chegar à página inicial do site. (Correto, sugerimos que você use um
fluxo de tarefas como parte do mapa avançado do site.) Além disso, você deve identificar
todas as páginas de nível superior, elementos de navegação global e elementos de
rodapé. Isso permite que você mostre antecipadamente uma visão geral de alto nível do
site e fornece à sua equipe e clientes uma imagem clara do projeto.

A primeira página também é um local apropriado para incluir uma legenda ou chave para
ajudar na leitura do mapa do site (veja a Figura 10.14). Sua equipe e seus clientes
precisarão de um. Não pule esta etapa!

MAPAS DE SITE AVANÇADOS 175


Machine Translated by Google

Deixe a dor ser muito boa 19 de fevereiro de 2008 pág. 4/9

Figura 10.15 Visualização avançada da seção do mapa do site

As páginas que você cria após a primeira página devem essencialmente mapear de volta para ela.
Para cada página de nível superior, você deve ter pelo menos uma página seguinte que
identifique todas as páginas, pilhas de páginas e conteúdo externo que serão necessários para o
site ou aplicativo (Figura 10.15). Se necessário, não tenha medo de conectar subpáginas. Os mapas
do local podem crescer e se tornar mais expansivos do que qualquer folha de papel de tamanho
padrão permitiria. Não há nada com que se preocupar, desde que o mapa do seu site esteja bem
organizado e as conexões estejam claramente documentadas para o seu público.

Esses exemplos são mais que suficientes para você começar no mundo da criação de mapas
de sites. À medida que você começa a percorrer uma variedade de projetos e descobre que suas
habilidades - e muitas vezes as necessidades de sua equipe ou cliente - estão crescendo, você
descobrirá que existem abordagens e métodos muito diferentes que você pode adotar para entregar
mapas de sites .

176 CAPÍTULO 10: MAPAS DO SITE E FLUXOS DE TAREFAS


Machine Translated by Google

Quebrando o molde do mapa do site


Agora você viu exemplos sólidos de mapas de sites que devem atender à maioria das suas
necessidades na realização de suas tarefas principais. Não deixe que esses modelos o impeçam de
explorar maneiras que funcionam melhor para você – e compartilhe-os conosco! Diferentes abordagens
podem destacar informações além da arquitetura básica do site. Por exemplo, considere o mapa
do site na Figura 10.16, que foi gentilmente cedido por Andrew Hinton, arquiteto sênior de
informações da Vanguard.

Se Apoiar
Monitor Conecte-se Atualizar Encontrar
inscrever bc.org Perfil
Novo Semelhante
Pesquisar Contribuir
Pessoas

“Acadêmico”
Conversação
Interesse
(Com, estudante,
Em geral) Pegar
Socializar
Especialista
Impresso Aprender Conf.
Mtrls sobre
Gerenciar Novo participar
bc.org Risco
Preocupação Aprender

Preocupado
Novo
Diag.
Amado Novo
Um
Palco /
Sente-se.

Figura 10.16 Mapa avançado do site. Cortesia de Andrew Hinton.

Este mapa do site não apenas mostra as diversas páginas do site, mas também serve para fornecer
informações sobre os caminhos e prioridades dos usuários. Andrew (www.inkblurt.com) diz que criou
o mapa do site depois de ver um exemplo de Wolf Noeding que despertou sua chama criativa. Andrew
usa este mapa do site para mostrar vários cenários de usuário e modelos mentais relacionados ao
site. Os círculos maiores no mapa desempenham uma função adicional: realçam as áreas de nível
superior do mapa.
site que recebe mais tráfego.

Como todos os bons profissionais de experiência do usuário, Andrew pediu emprestado, mas
também deu crédito. Existem maneiras ilimitadas de expandir os mapas do site à medida que
você começa a se sentir mais confortável usando as ferramentas e identificando as necessidades
do produto de trabalho - e do cliente. Deixe a inspiração atingir você onde você a encontrar! Não
tenha medo de tentar algo novo, mas reserve um tempo para garantir que o tempo gasto seja útil e
valioso.

QUEBRANDO O MOLDE DO MAPA DO SITE 177


Machine Translated by Google

Fluxos de tarefas
Usando muitos dos mesmos elementos básicos dos mapas de sites, os fluxos de tarefas são
diagramas que identificam um caminho ou processo que os usuários (e às vezes um sistema)
seguirão à medida que avançam em seu site ou aplicativo.

Você pode usar fluxos de tarefas de diversas maneiras diferentes. Quando usados em
conjunto com um mapa do site, eles podem mostrar como um usuário chega a uma página
com um conjunto específico de informações exibidas. Às vezes, eles são usados para mostrar
como um tipo específico de usuário (uma persona) esperaria percorrer um site e o que essa
persona esperaria ver com base em seu modelo mental pessoal. Você também pode usar fluxos
de tarefas para identificar processos complexos que precisam ser claramente compreendidos
antes que o projeto seja enviado à equipe de desenvolvimento.

Talvez você não use fluxos de tarefas em todos os projetos em que trabalha e eles nem
sempre acabem como produtos de trabalho que você apresenta aos seus clientes, mas é
sempre uma boa ideia usá-los - mesmo que apenas a lápis - e -formato de papel para seu
próprio benefício.

Um pouco de clareza pode ajudar muito.

Para criar um fluxo de tarefas, você precisa entender o objetivo do usuário. Em alguns
casos, você receberá um documento de requisitos e, em outros casos, poderá receber (ou
criar) um caso de uso. Embora um caso de uso consista em apenas algumas frases
resumindo tarefas e objetivos, ele permitirá sintetizar a visão do usuário na experiência.

O caso de uso para o cenário da Figura 10.17 pode ser assim:

Sistema exibe lista de projetos.

O usuário seleciona um projeto.

O sistema exibe informações básicas do projeto, no modo Gravação.

O usuário altera o status do projeto para Fechado.

O sistema verifica tarefas pendentes.

Se houver tarefas pendentes, o sistema exibirá aviso de erro.

Se não houver tarefas pendentes…

178 CAPÍTULO 10: MAPAS DO SITE E FLUXOS DE TAREFAS


Machine Translated by Google

O sistema verifica pagamentos pendentes.

Se houver pagamentos pendentes, o sistema exibirá aviso de erro.

Se não houver pagamentos pendentes…

O sistema exibe a página de resumo.

Lar
[Minha lista de reivindicações]

Selecione Reivindicar

Informação
[Modo de gravação]

Status da reivindicação alterado: fechado

Sim Tarefas pendentes?

Aviso de erro
Não
[Exibir pendente
tarefas e solicitações]

Sim Solicitação de pagamento pendente?

Não

Informação
[Modo somente leitura]

Figura 10.17 Este fluxo de tarefas identifica como um sistema exibe informações
para um usuário com base nas respostas a múltiplas condições.

O fluxo de tarefas na figura representa a sequência de informações exibidas a um usuário


com base no atendimento de uma variedade de condições do caso de uso. Se qualquer
pergunta no centro (“Tarefas pendentes?” ou “Solicitação de pagamento pendente?”) for
respondida com sim, o sistema exibirá um aviso de erro, potencialmente fornecendo informações
adicionais para ajudar o usuário a concluir as tarefas necessárias antes de fazer progresso
adiante. Se ambas as condições forem respondidas não, o sistema fornece ao usuário uma
tela que identifica o sucesso.

O fluxo de tarefas na Figura 10.18 mostra os caminhos que um usuário pode seguir de um
aplicativo de calendário até um site de compras de viagens. O fluxo de tarefas é de nível muito
alto, pois identifica três caminhos muito diferentes que exigem testes por parte dos usuários para
garantir que o fluxo detalhado de cada caminho atenda às necessidades do usuário.

FLUXOS DE TAREFAS 179


Machine Translated by Google

Calendário

S100
S10
Calendário
Tarifa detalhada
procurar Localizador
Tarifa de compras
Localizador

Procurar por Flexível Procurar por


Preço datas Agendar
(exibição da
matriz tarifária)

selecione

R20 R60 R1
Resultados da Datas flexíveis Resultados da

pesquisa (por preço) – Exibições Resultados da pesquisa (por pesquisa (por programação)-
itinerários Exibe segmentos
-Editar pesquisa
Preço) -Editar pesquisa

P30 P10
Seletor de assento
Rever Itinerário/
Passageiro
análise Informações - Selecione
Assentos

P20

comprar Pagamento e cobrança Chave


Informação

Página

Várias páginas

Decisão
P50 apontar
confirme Confirmação
Condicional
Conector
Conector

Figura 10.18 Fluxo de tarefas usado para demonstrar o caminho de um usuário


através das fases de um processo de compra

Os usuários deste aplicativo podem inserir um conjunto de datas para suas viagens e
depois fazer compras com base em suas próprias prioridades. Depois que os usuários definem
as datas de busca das viagens, eles podem priorizar seus resultados de acordo com o que é
mais importante para eles: preço, flexibilidade de datas de viagem ou horários de viagem (horário).

O fluxo de tarefas identifica os caminhos de alto nível que um usuário pode seguir para
fornecer orientação às pessoas que facilitam o teste. Fluxos de tarefas detalhados poderiam
ser criados para cada um dos caminhos nos agrupamentos e depois fornecidos à equipe de
desenvolvimento para criar as páginas necessárias para o teste.

180 CAPÍTULO 10: MAPAS DO SITE E FLUXOS DE TAREFAS


Machine Translated by Google

Levando os fluxos de tarefas para o próximo nível


Tal como acontece com todos os tópicos deste livro, não sinta que o que você está vendo aqui é o
começo e o fim do universo dos fluxos de tarefas. Explore novos usos e expanda o uso dos princípios
básicos descritos aqui tanto quanto possível – desde que haja um bom propósito para isso.

À medida que suas habilidades na criação de fluxos de tarefas continuam a crescer, você poderá criar
um produto de trabalho um pouco mais colorido, com mais opções, incluindo regras de linguagem
modificadas ou aprimoradas e assim por diante.

Fluxo de processo
A Figura 10.19 mostra um fluxo de tarefas que Will Evans (www.semanticfoundry.com) levou para o
próximo nível e o transformou em um diagrama de fluxo de processo.

Seu fluxo de processo é de altíssimo nível e flexível e é usado aqui para mostrar que nas muitas etapas
de um processo de projeto, a primeira fase do projeto parece ser apenas uma única etapa, porém,
neste caso específico, é importante entenda que a fase não consiste em um único evento. Em vez
disso, a primeira fase do projeto, neste caso, é na verdade composta por muitas atividades diferentes:

Pesquisa de usuário

Pesquisa de mercado

Etnografia e investigação contextual

Testando usabilidade

Analise competitiva

Análise de mercado

Análise de cultura

Análise de arquivo de log

LEVANDO OS FLUXOS DE TAREFAS PARA O PRÓXIMO NÍVEL 181


Machine Translated by Google

Figura 10.19 Este diagrama de fluxo de processo leva os fluxos de tarefas ao próximo nível para articular
cenários complexos. Cortesia de Will Evans.

Para cada uma dessas atividades, são gerados relatórios que alimentam outros
documentos diversos antes do início do projeto, onde as partes interessadas necessárias
se reuniriam para determinar o escopo, a prioridade e as datas. Tudo isso é mostrado
no diagrama de fluxo do processo.

Como você pode ver neste exemplo, o céu é o limite quando se trata de criar fluxos de
tarefas. Veja o exemplo acima e considere maneiras de levar seus resultados para o
próximo nível. Pode exigir um pouco de prática, mas com um pouco de sutileza você
pode criar fluxos de tarefas que vão surpreender seus clientes!

Raias
James Melzer (www.jamesmelzer.com), principal arquiteto de informações da SRA
International Inc. (www.sra.com), criou vários diagramas que vão muito além dos fluxos
básicos de tarefas. O diagrama na Figura 10.20 mostra um fluxo de tarefas que foi
estendido para mostrar “raias” de ações, notificações
ções, e assim por diante, em um processo que teve muitos eventos acontecendo ao mesmo
tempo – com este projeto uma abordagem tradicional para fluxos de tarefas poderia ter sido
um pesadelo!

182 CAPÍTULO 10: MAPAS DO SITE E FLUXOS DE TAREFAS


Machine Translated by Google

Em vez disso, James explorou a extensão do fluxo de tarefas básico para abranger
todas as diversas etapas e ações que ocorrem em um formato que fosse muito mais
fácil de entender.

Figura 10.20 Este diagrama de raias é um exemplo de expansão de fluxos de tarefas para
ilustrar cenários complexos com múltiplas ações em muitos lugares. Cortesia de James Melzer.

James descreveu o projeto e as raias da seguinte forma:


O sistema permite que as pessoas gerenciem informações sobre os edifícios de sua
propriedade. Esta extensão permitiria que os parceiros de serviços de construção
fornecessem dados de sistema para sistema em nome dos seus clientes, reduzindo a entrada
de dados necessária por parte dos proprietários. O projeto teve três partes: parceiros
configurando a apresentação e operação de seus serviços de dados, clientes inscrevendo-
se e usando os serviços de dados de parceiros e gerenciamento contínuo de dados de
parceiros e solução de problemas no back-end.

Estávamos planejando uma grande extensão de um sistema existente. Sabíamos desde o


início que quase todos os cenários de serviço envolviam vários usuários e vários
sistemas. Houve várias notificações e muitos processos eram assíncronos. Este diagrama
nos ajudou a identificar, projetar e explicar os cenários de serviço necessários para o projeto.
Na versão completa deste produto de trabalho, tínhamos wireframes detalhados
organizados abaixo dos fluxos neste diagrama.
A coisa toda cobria uma parede. Quando estávamos bastante confiantes no conceito de
design, nós o dividimos em uma especificação de múltiplas páginas mais tradicional.

LEVANDO OS FLUXOS DE TAREFAS PARA O PRÓXIMO NÍVEL 183


Machine Translated by Google

O importante a lembrar aqui é não se limitar ao uso de fluxos de tarefas ou


mapas de sites. Expanda os limites dos princípios básicos que foram mostrados
neste capítulo. Caso você realmente precise de algo para testar sua coragem,
gaste algum tempo criando um fluxo de tarefas sobre como amarrar os sapatos.
Boa sorte!

184 CAPÍTULO 10: MAPAS DO SITE E FLUXOS DE TAREFAS


Machine Translated by Google

Wireframes e
11 Anotações
Design e direção – antes do
início do design visual

Wireframes e anotações são formas de identificar o conteúdo e


a estrutura propostos, bem como os comportamentos funcionais,
de uma visualização de uma página Web ou de um aplicativo.
Quando combinados com mapas de sites e fluxos de tarefas,
esses documentos também são extremamente úteis para identificar
cenários de prototipagem e provas de conceitos. Wireframes são
normalmente apresentados em escala de cinza, desprovidos de
elementos gráficos ou conteúdo finalizado; em vez disso, eles usam
conteúdo de espaço reservado para destacar locais representativos
que podem ser usados como orientação no design visual.

Russ Unger
Machine Translated by Google

O que é um wireframe?
Basicamente um protótipo de baixa fidelidade de uma página Web ou tela de aplicação, um
wireframe é utilizado para identificar os elementos que serão exibidos na página ou tela, como

Navegação

Seções de conteúdo

Necessidades de imagens e/ou mídia

Elementos de formulário

Frases de chamariz (CTAs)

Wireframes são normalmente criados em preto e branco ou tons de cinza, usam espaços reservados
para imagens e não entram em detalhes de fontes (embora muitos apliquem dimensionamento de
fonte para transmitir separações de tipos de cópia). Eles vêm em todos os formatos e tamanhos,
desde os mais básicos até os tão avançados que quase reproduzem o design de tela inteira.

Wireframes estão evoluindo; eles não são mais fornecidos apenas aos designers e desenvolvedores
como esboços de suas tarefas. Wireframes agora são usados para representar o site ou aplicativo
para clientes, designers, desenvolvedores e quaisquer outros membros da equipe que tenham interesse
nele em seu nível mais básico. É comum mostrá-los aos clientes para obter validação do “design
thinking” antes do início das fases de design visual e desenvolvimento. Freqüentemente, as pessoas
que criam os wireframes trabalham lado a lado com aquelas que criam os requisitos de negócios (em
alguns casos, são as mesmas pessoas).

Também deve ser observado que alguns dos melhores wireframes e anotações

são o resultado da interação e colaboração direta entre os vários parceiros de trabalho – desde analistas
de negócios até desenvolvedores e outros designers. Alguns
as empresas estão migrando para o uso de wireframes e anotações no lugar de documentos de
requisitos de negócios (BRDs). Embora o mundo esteja longe de afirmar que os BRDs estão extintos, o
início dessa mudança é suficiente para mostrar o quão importante é ser muito minucioso e cuidadoso
ao criar seus wireframes e anotações.

Em muitos casos, serão mostrados aos usuários wireframes para obter feedback que pode validar
os elementos da página ou solicitar modificações. Wireframes que

186 CAPÍTULO 11: WIREFRAMES E ANOTAÇÕES


Machine Translated by Google

são colocados na frente dos usuários normalmente têm um nome diferente: protótipos. (Para
mais informações sobre prototipagem, consulte o Capítulo 12.)

Para ajudá-lo a identificar a abordagem que funciona melhor para você, este capítulo discute os
fundamentos da criação de wireframes e mostra exemplos de designers da área. Como o restante deste
livro, esses exemplos são apenas o começo:
não tenha medo de explorar e inovar por conta própria.

O que são anotações?


As anotações são, simplesmente, explicações e notas sobre um elemento ou interação em um
wireframe. Eles normalmente contêm informações como

Identificação ou rotulagem de conteúdo

Fonte(s) de conteúdo

Regras de exibição

Regras de interação

Destinos de interação

Regras de processo

Conteúdo/mensagem de erro

É melhor criar anotações com um tom muito direto, se não conciso, e explicações claras. Não deixe
nada ao acaso em uma anotação; há uma diferença muito grande entre deveria e deve.

Ruim: “Acionar esta frase de chamariz (CTA) deve resultar na exibição da página inicial.”

Bom: ”O acionamento desta frase de chamariz (CTA) resultará na exibição da página inicial.”

OK, para ser justo, o primeiro exemplo não é exatamente horrível, mas a palavra deveria
pode deixar espaço para confusão para um desenvolvedor posterior no processo, que pode não ter
o luxo de ter seu designer UX favorito pronto para responder a perguntas. Certifique-se de que seu estilo
de anotação seja sucinto e não deixe nenhuma ambiguidade para qualquer pessoa que precise ler -
e confiar - em suas instruções.

O QUE SÃO ANOTAÇÕES? 187


Machine Translated by Google

Quem usa wireframes?


Com suas anotações claras e concisas, os wireframes são muito bons, mas quem
é realmente o público desses resultados? Infelizmente, não há uma resposta simples
para isso. De projeto para projeto, seu público pode variar de uma única pessoa a
qualquer combinação de vários grupos. A Tabela 11.1 descreve os públicos potenciais
para seus wireframes.

TABELA 11.1 Públicos de wireframe


PÚBLICO PROPÓSITO

Gerenciamento de projetos Os gerentes de projeto podem usar wireframes como pontos de discussão dentro da

equipe para destacar a estratégia, as necessidades tecnológicas e uma experiência do

usuário de alto nível.

Analistas de negócios Os analistas de negócios podem usar wireframes para garantir que seus requisitos

estão sendo atendidos e para validar que não perderam requisitos que precisam ser incluídos.

Designers Visuais Os designers visuais podem usar wireframes como modelo para sua produção. Os

wireframes fornecem uma contabilidade dos elementos e comportamentos da página que


precisam ser incluídos.

Criadores de conteúdo Redatores, estrategistas de conteúdo, editores e outras pessoas responsáveis pela

cópia podem usar wireframes para mapear uma matriz de conteúdo e identificar necessidades

de conteúdo ao longo de um projeto.

Motor de Otimização de Busca Os especialistas em SEO podem usar wireframes para ajudar a identificar esquemas de

Especialistas em (SEO) nomenclatura apropriados, necessidades de cópia e melhorias na estratégia geral de SEO.

(Para obter mais informações sobre SEO, consulte o Capítulo 8.)

Desenvolvedores Os desenvolvedores costumam usar wireframes em conjunto com (e às vezes em

vez de) requisitos de negócios para compreender as funções e comportamentos esperados

do design. Em alguns casos, os wireframes podem ser usados como base para uma prova

de conceito.

Garantia da Qualidade Uma equipe de controle de qualidade pode usar wireframes como base para a criação de

seus scripts de teste. Depois que os wireframes forem aprovados pelo cliente, a variação

deverá ser mínima, e isso permite que o QA

equipe comece a trabalhar em suas tarefas mais cedo.

Usuários Os usuários podem ver wireframes em estágios iniciais, às vezes na forma de “protótipos

de papel”, como um mecanismo para testar a direção do design. (Veja o Capítulo 12.)

Clientes Os clientes estão cada vez mais envolvidos na revisão de wireframes para validar se os

requisitos, metas e objetivos do negócio foram atendidos e para fornecer aprovação para

avançar para a fase de design visual.

188 CAPÍTULO 11: WIREFRAMES E ANOTAÇÕES


Machine Translated by Google

Criando Wireframes
Para criar um wireframe, normalmente você precisa de um conjunto de requisitos. Eles
podem vir na forma de um documento formal de requisitos de negócios de um cliente, um
resumo criativo ou resumo do projeto, notas de reunião, um mapa do site ou fluxo de
tarefas bem articulado ou até mesmo notas em um guardanapo que fornecem orientação.
De uma forma ou de outra, você precisa entender o que está tentando criar para um
usuário, quais são as conexões e uma compreensão geral das limitações e expectativas
tecnológicas.

Nota Para obter mais informações sobre como definir requisitos de negócios, consulte os Capítulos 4 e 5.
Para sugestões sobre notas de reuniões eficazes, consulte o capítulo bônus on-line, “Um
breve guia para reuniões”, em www.projectuxd.com.

Depois de compilar as informações necessárias, reserve um tempo para ler atentamente


todos os requisitos, fazer perguntas e considerar as respostas para obter clareza
adicional. Você estará pronto para começar a criar seus wireframes!

Ferramentas do comércio
A seção “Ferramentas do Comércio” do Capítulo 10 listou as muitas ferramentas de
design que você pode usar para criar mapas de sites e fluxos de tarefas. A boa notícia é
que você pode usar basicamente os mesmos aplicativos para wireframes e anotações. O
a má notícia é que se esta for sua primeira experiência na criação de wireframes, você
pode se sentir um pouco perdido sobre por onde começar.

Mas espere – ainda há mais boas notícias. Quase todos os profissionais experientes em
experiência do usuário começam com lápis e papel, então você não deve sentir que
precisa escolher imediatamente uma solução tecnológica (embora seja perfeitamente
possível que você precise traduzir rapidamente de esboços para algo digital). ).

Leah Buley, designer de experiência da Adaptive Path, destaca a importância do uso de


lápis e papel (assim como os autores) em sua apresentação “How to Be a UX Team of
One”. Lia diz:
Quando você começa a esboçar ideias para um wireframe, eis o que geralmente
acontece: você tem uma ou duas boas ideias e então se depara com uma parede.
Essas ideias provavelmente virão de algo que você viu e gostou ou de algo que
você projetou no passado. Esse não é um ponto final; é um bom ponto de partida.

QUEM USA WIREFRAMES? 189


Machine Translated by Google

A mente tende a correr para o que é familiar, mas o que é familiar nem sempre pode
ser a melhor solução para o problema. Quando você se força a buscar ideias mais
variadas, muitas vezes pela ideia 4 ou 5, você surge com algo novo e interessante.
Não sei por que isso acontece dessa maneira. Simplesmente faz.
Os modelos podem ser úteis para se orientar nesse processo. No Adaptive Path,
usamos um modelo de seis páginas, que simplesmente fornece um espaço para
fazer seis pequenos esboços em miniatura. O número de esboços não é tão importante.
O importante é forçar-se a ir além das primeiras ideias óbvias.
Seis é um número mágico (para mim) porque o modelo seis, com suas seis
caixinhas, me incentiva a continuar até que todas as miniaturas sejam preenchidas.

Figura 11.1 Modelo de seis páginas do Adaptive Path

Estas são palavras sólidas para se viver - especialmente se você está apenas se
familiarizando com o trabalho que está fazendo no mundo do design UX. Com o passar do
tempo, você começará a identificar a abordagem que funciona melhor para você, mas não
há conselhos muito melhores do que os de Leah. Para obter informações adicionais
sobre sua abordagem, a apresentação completa “Como ser uma equipe UX integrada” está
disponível online em www.slideshare.net/ugleah/how-to-be-a-ux-team-of-one.

Não tenha medo de começar com lápis e papel – apenas traga muitas
borrachas. Os erros fazem parte do processo, e você deve esperar que, mesmo
depois de se comprometer com um esboço a lápis, você faça modificações à
medida que passa para o digital.

190 CAPÍTULO 11: WIREFRAMES E ANOTAÇÕES


Machine Translated by Google

Poucas profissões operam no domínio das iterações com tanta frequência e consistência
quanto os designers de UX. Muito raramente, ou nunca, o trabalho de design é aceito na
primeira passagem, e às vezes você só pode esperar estar “errado na direção certa”. Por
isso, comece aos poucos: pegue uma única página ou uma pequena parte de uma seção de
um projeto, revise-a primeiro com sua equipe interna e depois com a equipe do cliente
para garantir que seu entendimento esteja no caminho certo. Alinhar seus projetos com a
maneira de pensar do cliente sobre seus objetivos de negócios antecipadamente evita
muito retrabalho no futuro. A mesma abordagem pode ser aplicada aos testes de design com
usuários – busque a validação com antecedência!

Comece de forma simples: projete um


Estrutura de arame básica
Nesta seção, você verá como criar um wireframe em um nível muito básico.
Muitas vezes você pode começar com nada mais do que um simples mapa do site e
alguns requisitos adicionais, mas com isso você pode construir um wireframe para a página
inicial de um site.

Lembra-se do mapa básico do site do Capítulo 10, que mostra como um site muito
simples pode ser estruturado? A Figura 11.2 apresenta uma atualização – como você pode
ver, há um certo grau de hierarquia de navegação mostrado. Cada página X.0
identificada é provavelmente uma página de nível superior ou primária. Você pode usar isso como um
ponto de partida para definir uma parte dos requisitos de negócios e um
estrutura de arame.

1,0 1.0.1

Termos e
Pagina inicial Condições

2,0 – 2,x 3,0 4,0 5,0

Blogue Sobre Trabalhar Contato

Figura 11.2 Um mapa do site para um site básico com funcionalidade de blog

COMECE SIMPLESMENTE: PROJETE UM WIREFRAME BÁSICO 191


Machine Translated by Google

Começando
Não é incomum que você seja o autor do seu próprio documento de requisitos de
negócios, e isso pode ser uma bênção e uma maldição. Quando você é o autor dos
requisitos, essencialmente você tem apenas você mesmo – ou seu cliente – com quem
discutir o significado de algo vago ou relativamente indefinido. Muitas vezes pode
parecer que você está inventando tudo, mas não deixe que isso o detenha.

Em muitos casos, seus wireframes o ajudarão a identificar lacunas nas informações


com as quais você está trabalhando. Isso pode ajudá-lo a criar a melhor solução—
eventualmente. Lembre-se de que os profissionais de experiência do usuário trabalham
para apresentar a melhor solução possível para os usuários, e suas primeiras versões
de qualquer projeto sempre serão usadas para solicitar feedback e influenciar a
próxima iteração do design. Seu design não precisa ser perfeito, mas você quer ter certeza
de que parece limpo e profissional e que, na pior das hipóteses, está errado na direção
certa.

Os requisitos para o design desta página inicial são limitados e muito breves. Felizmente,
o mapa do site na Figura 11.2 fornece informações suficientes para formular a navegação
que poderia ser usada no site:

A página inicial (numerada 1.0) é o nível mais alto de navegação. Termos


& Conditions (1.0.1) é provavelmente um elemento de rodapé comum ou, pelo menos,
não deve ser considerado parte da navegação principal.

Os outros elementos primários de navegação são Sobre (3.0), Trabalho (4.0),


Contato (5.0) e Blog (2.0–2.x) - que é representado como uma pilha de páginas,
para que você possa ter certeza de que será visualizado como múltiplas páginas
dinâmicas e pode ter uma forma de navegação “anterior” e “próxima”.

Esses elementos primários de navegação fornecem muitas informações para você começar,
mas isso está longe de ser suficiente para criar efetivamente uma página inicial para um
site. Então, para ajudar a fornecer orientação, o cliente forneceu
algumas informações adicionais:

A empresa é uma empresa boutique de design de experiência do usuário que ganhou exposição
devido aos seus blogs e à variedade de projetos nos quais trabalhou. É importante que os
visitantes do site possam aprender rapidamente o que a empresa/
O site é baseado em texto limitado e imagens fortes e evocativas que funcionam em conjunto com
o design da experiência do usuário. Além disso, é importante que a navegação seja clara (prefira
cabeçalho e rodapé reutilizáveis, se possível) e

192 CAPÍTULO 11: WIREFRAMES E ANOTAÇÕES


Machine Translated by Google

que haja um apelo à ação nas postagens mais recentes do blog, para que os visitantes possam
ler rapidamente um resumo da nossa opinião mais recente sobre questões atuais no mundo da
experiência do usuário. Se possível, seria bom poder destacar trabalhos recentes na página
inicial, mas isso é secundário, já que grande parte do nosso trabalho está frequentemente em
desenvolvimento ou sob estrita confidencialidade.

Os wireframes e anotações
Existem diversas maneiras de interpretar esses requisitos, e a primeira
apresentação do wireframe ao cliente pode ser muito semelhante à Figura 11.3.

WIREFRAME COM ANOTAÇÕES

Pagina inicial

Anotações
1 Logotipo
1 · Imagem do logotipo.· O logotipo funcionará como um link para a página inicial do
23 4 Lar Blogue Nosso trabalho 5 Sobre nós 6 Contato
o site a partir de qualquer local dentro do site.
2 · Navegação inicial.· Deverá ter um link para a página inicial do site
de qualquer local do site.
3 · Navegação no blog. · Deverá vincular à página inicial do blog a partir de qualquer
localização dentro do site.
4 · Navegação Nosso Trabalho.· Deverá ter um link para a página inicial Nosso Trabalho
de qualquer local do site.
5 · Navegação Sobre nós. · Deverá ter um link para a página inicial Sobre nós a partir
de qualquer local do site.
6 · Navegação de contato.· Deverá vincular à página de contato de qualquer
localização dentro do site.
7 7 · Rotação de imagens de herói. · As imagens devem girar através de vários
imagens esteticamente agradáveis e alinhadas com a marca.

8 · Título de boas-vindas.· Título do texto de visão geral do site.


9 · Conteúdo de boas-vindas.· Conteúdo de visão geral do site.
10 · <· Exemplo de portfólio· >· Título.· Título do exemplo aleatório
exibido no portfólio de trabalho.
11 · <· Exemplo de portfólio· >· Link da imagem.· Imagem do aleatório
exemplo exibido no portfólio de trabalho. Deverá criar um link para visualizar os
detalhes do exemplo aleatório exibido no portfólio
de trabalho.
12 · <· Exemplo de portfólio· >· Resumo.· Breve texto de resumo do exemplo aleatório
O título de boas-vindas vai aqui 8 <Exemplo de portfólio> 10 <Título do blog mais recente> 14 exibido no portfólio de trabalho (recomendado 1-2 linhas de texto no
máximo).
Lorem ipsum pain sit amet, consectetuer adipiscing elite, porque eles Sejamos muito felizes com a dor, consectetuer adipiscing elit, 13 · <· Exemplo de Portfólio· >· Mais Link.· Deverá criar um link para visualizar o
nonummy nibh euismod tincidunt out laoreet 15 out laoreet
mas eles não são nibh euismod tincidunt detalhes do exemplo aleatório exibido no portfólio de
9
Foi um fim de semana de muita dor. 11 Foi um fim de semana de muita dor. trabalhar.

14 · <· Blog mais recente· >· Título.· Título do blog ao vivo mais recente
Pois, como vi, chegarei ao último, que está no exercício da intrusão. Pois, como vi, chegarei ao último, que está no exercício da intrusão. postagem.

ullamcorper suscepti lobortis como alguns deles. É muito importante ter um ullamcorper suscepti lobortis como alguns deles. É muito importante ter um
15 · <· Blog mais recente· >· Conteúdo de introdução.· Os primeiros 200
caracteres da postagem mais recente do blog ao vivo.
bom atendimento ao cliente, mas é uma boa ideia bom atendimento ao cliente, mas é uma boa ideia
16 · <· Blog mais recente· >· Mais link.· Deverá criar um link para visualizar a postagem
Nonummy Nibh Euismod Tincidunt Out Laoreet Dolore Magna Aliquam Erat Nonummy Nibh Euismod Tincidunt Out Laoreet Dolore Magna Aliquam Erat completa do blog da postagem mais recente do blog ao vivo.
Volutpat. O cliente deve ficar muito feliz, ele é um bom amigo Volutpat. 17 · Conteúdo de direitos autorais.· Direitos autorais e ano atual junto com
12
Mais > Nome da companhia.
Mais >
13 16 18 · Link de Termos · &· Condições.· Deverá ter um link para a página de
Termos · &· Condições de qualquer local do site.
©<ano> UserGlue | Termos e Condições | Contato
19 · Link de contato.· Deverá vincular à página de contato de qualquer local
17 dentro do site.
18 19

Item # 8 · Título de boas-vindas.· Título do texto de visão geral do site.


9 · Conteúdo de boas-vindas.· Conteúdo de visão geral do site.
· <· Exemplo de portfólio· >· Título.· Título do exemplo aleatório 10
exibido no portfólio de trabalho.
11 · <· Exemplo de portfólio· >· Link da imagem.· Imagem do aleatório
exemplo exibido no portfólio de trabalho. Deverá criar um link para visualizar
Título do blog> 14 os detalhes do exemplo aleatório exibido no portfólio de trabalho.

que seja dor, consectetuer a 12 · <· Exemplo de portfólio· >· Resumo.· Breve texto de resumo do exemplo
aleatório exibido no portfólio de trabalho (recomendado 1-2 linhas
ummy nibh euismod15 tincidunt de texto no máximo).
13 · <· Exemplo de Portfólio· >· Mais Link.· Deverá criar um link para visualizar o
foi um fim de semana.
detalhes do exemplo aleatório exibido no portfólio de
trabalhar.

14 · <· Blog mais recente· >· Título.· Título do blog ao vivo mais recente
Eu vou deixar você saber quem somos postagem.
15 · <· Blog mais recente· >· Conteúdo de introdução.· Os primeiros
200 caracteres da postagem mais recente do blog ao vivo.
· <· Blog mais recente· >· Mais link.· Link para ver o 16 completo
postagem no blog da postagem mais recente no blog ao vivo.
· Conteúdo de direitos autorais.· Direitos autorais e ano atual junto com 17
Nome da companhia.
18 · Termos · &· Link de Condições.· Deverá vincular aos Termos · &·
Página de condições de qualquer local do site.
Anotação 19 · Link de contato.· Deverá vincular à página de contato de qualquer local do site.

Figura 11.3 Wireframes com anotações enviadas para design da página inicial

COMECE SIMPLESMENTE: PROJETE UM WIREFRAME BÁSICO 193


Machine Translated by Google

O wireframe com anotações detalha cada elemento da página, bem como as frases
de chamariz esperadas e os resultados da ação (como carregar uma página
específica). Este exemplo específico funciona muito bem devido ao número limitado
de elementos e à quantidade limitada de detalhes necessários.

Figura 11.4 Design da página inicial ao vivo para www.userglue.com

Como mostra a Figura 11.4, a versão ativa desta página inicial hoje é apenas
ligeiramente diferente do wireframe original da Figura 11.3. Como a linha do tempo
e o conteúdo se tornaram problemas, por exemplo, a seção Exemplos de portfólio
foi removida. Observe também a diferença nas convenções de nomenclatura para
navegação e apelos à ação: O wireframe serviu como diretriz, não foi a palavra final.
Seu resultado final também terá muitas vezes uma variedade de pequenas
alterações e atualizações em comparação com o conteúdo do seu wireframe.

194 CAPÍTULO 11: WIREFRAMES E ANOTAÇÕES


Machine Translated by Google

Um exercício: projete um
Wireframe da página inicial
Você viu um exemplo, agora é hora de mergulhar de cabeça e criar um wireframe por conta própria.
Sua tarefa é redesenhar a página inicial do Global
Cruises, uma linha de cruzeiros internacional fictícia. A Global Cruises deseja que sua página

inicial se torne mais eficaz como ferramenta de vendas e recurso de informações para visitantes
recorrentes – que frequentemente parecem ser aqueles que reservaram um cruzeiro e estão
interessados em aprender mais sobre outras oportunidades e complementos, atualizações nas
condições de viagem , e assim por diante.

O exercício consiste em usar os requisitos abaixo para criar um wireframe de página inicial com
anotações no documento ou em um documento separado (sua escolha). Nada mais.

Requisitos
O principal requisito obrigatório é que o cabeçalho e o rodapé globais (Figura 11.5) permaneçam os
mesmos – absolutamente inalterados.

CABEÇALHO GLOBAL

Logotipo Logotipo da campanha atual Procurar Ir

Destinos Experiência de viagem Planejar uma viagem Antes da sua viagem Cruzeiros Globais Clube VIP Especiais Meus cruzeiros globais

Bem-vindo de volta, <nome de usuário> (não <nome de usuário>?) | XX dias até o seu próximo cruzeiro –Gerenciar Reserva | Complementos do BookTravel | Check-in on-line

RODAPÉ GLOBAL
Cadastre-se para receber e-mails da Global Cruises | Não é de <país>? Clique aqui
Sobre Cruzeiros Globais | Contate-nos | Perguntas frequentes | Localizador de Agente de Viagens | Mapa do Site | Informações Jurídicas | Termos de preços | Política de
Privacidade ©<ano> Global Cruises

Figura 11.5 Cabeçalho e rodapé globais existentes da Global Cruises

O cabeçalho/navegação deve ser

Destinos | Experiência de viagem | Planeje uma viagem | Antes da sua viagem | Global
Clube VIP Cruzeiros | Promoções | Meus cruzeiros globais

Bem-vindo de volta <nome de usuário> (não <nome de usuário>?)

XX dias até sua viagem | Gerenciar reserva | Reserve complementos de viagem |


Check-in on-line

UM EXERCÍCIO: PROJETE UM WIREFRAME DE PÁGINA INICIAL 195


Machine Translated by Google

O rodapé deve ser

Cadastre-se para receber e-mails da Global Cruises

Sobre Cruzeiros Globais | Contate-nos | Perguntas frequentes | Localizador de Agente de Viagens | Mapa do Site |

Informações Jurídicas | Termos de preços | política de Privacidade

Informações sobre direitos autorais

Além disso, o site deve ter

Capacidade de apresentar várias promoções

Capacidade de exibir manchetes/notícias

CTA para atendimento ao cliente

CTA para localizador de agente de viagens

CTA para navegar por itinerários de viagem populares

Os “bons para ter” são

Capacidade de exibir itinerários mais recentes, mais populares e/ou em promoção

Capacidade de exibir geolocalizações de itinerários e pontos de viagem

Capacidade de, se estiver logado, visualizar o itinerário (MEU ITINERÁRIO/IES)

Capacidade de visualizar itens de venda adicional, como paradas adicionais (por exemplo, se for ao Havaí,

reserve um passeio pela ilha), experiências gastronômicas a bordo e assim por diante

Qualquer outra coisa que você possa pensar em adicionar que possa ser de valor para
Cruzeiros Globais

E agora, o trabalho começa. Comece a esboçar seu wireframe – e não se esqueça de anotar adequadamente!

Depois de concluir seu wireframe, consulte a próxima página para ver exemplos de outros profissionais

importantes que receberam o mesmo conjunto de requisitos.

196 CAPÍTULO 11: WIREFRAMES E ANOTAÇÕES


Machine Translated by Google

Os resultados: crie um wireframe de página inicial


Will Evans, arquiteto de experiência do usuário da Semantic Foundry (www.
.semanticfoundry.com) teve a gentileza de criar wireframes com base nos requisitos do
exercício Global Cruise.

Compare seu próprio trabalho com os projetos dele nas Figuras 11.6 e 11.7 para ver como a
abordagem dele se compara à sua. Uma explicação de como ele montou
segue seu wireframe e anotações.

990 px de largura

Alertas de viagem
4,0 5,0 Notas anotadas
3,0
1,0 2,0
ENCONTRE UM Novo Popular
LOGOTIPO Bahamas IR 1,0 Alertas de viagem: link para 0.2.0.0
CRUZEIRO Itinerários Itinerários
10
111 2,0 Links de marca/logotipo Página inicial

Destinos | Experiência de viagem | Planeje uma viagem | Antes da sua viagem | Clube VIP da Global Cruises | Promoções | Meu Global 12
3,0 Pesquisa com sugestão preditiva definida
Bem-vindo de volta, W iLog Out 15 dias até seu próximo cruzeiro - ver itinerário | Meu global cenário do usuário 3.X
6,0 7,0 8,0 9,0
4,0 Menu suspenso Novos Itinerários com link: display
13 14 15 Itinerário com link para a seção 4.x

5,0 Itinerários populares - exibição suspensa


Os 5 itinerários mais populares

6,0 Link de destinos: vai para a seção X.0

7,0 Link Experiência de Viagem: vai para a seção X.0


Mídia/Flash/Imagem Hedônica
16
8,0 Planeje uma viagem Link: vai para a seção X.0

9,0 Link Antes da Sua Viagem: vai para a seção X.0

Título para Hero Shot 10 Link do Clube VIP da Global Cruises: vai para
seção X.0
17
18 Reserve este pacote especial » 11 Link de promoções: vai para a seção X.0

Manchetes globais | Crie seu próprio momento Starring You agora! Ir 12 Link My Global Cruises: vai para
seção X.0

Precisa de ajuda para planejar seu cruzeiro Promocionais/Notícias Promocionais/Notícias 13 Link de logout: desconecta o usuário da sessão

19 20 21 14 Ver link do itinerário: vai para My Global/


Veja minha página de itinerários.

HEDÔNICO HEDÔNICO HEDÔNICO 15 Meu link global: vai para personalizado

IMAGEM IMAGEM página


IMAGEM
16 Imagem do carrossel de promoções/pacotes

17 Link do Crowdsource do Momento Estrelado por Você


Adipisicing Consequente do Cabeçalho Header Adipisisicing Duis será seguido, ou a dor será Adipisicing Consequente do Cabeçalho
Clareza é a própria pulseira repreendida no prazer, e os cabelos fugirão da dor, e não haverá Não fique zangado com a dor na repreensão no prazer que ele quer ser 18 Link para promoções de livros vinculados à imagem
Duis ou Irure dor na reprimenda reprodução. um fio de cabelo da dor na esperança de que não haja reprodução. na grande foto do herói.
com prazer ele quer estar a um fio de cabelo da dor Cabeçalho da ideia número 1
Cabeçalho da ideia número 1 Cabeçalho da ideia número 3 19 Precisa de ajuda para planejar seu cruzeiro
Clareza é a própria pulseira Cabeçalho da ideia número 2
Cabeçalho da ideia número 2 Cabeçalho da ideia número 4
Não fique zangado com a dor na repreensão no prazer
Cabeçalho da ideia número 3 20/21 CTAs promocionais/promoções de parceiros
queira ser uma pena na dor da alegria

22 Compartilhe seus momentos, chame,


Estrelando você momentos 8 de outubro de 2008 18h46 Promoção da marca perfil do membro
22
Mas para que vocês vejam de onde nasce todo esse erro, do prazer dos acusadores 23 Publique seus próprios momentos estrelando
e a dor de quem elogia, vou abrir todo o assunto, e essas mesmas coisas daquele inventor link para a página de croudsourcing.
Vou explicar o que foi dito sobre a verdade e como arquiteto de uma vida feliz. 23
imagem 24 Inscreva-se para receber e-mails

Mas para que você possa ver de onde nasce todo esse erro
o prazer de quem acusa e a dor de quem elogia, todo o Publique o seu próprio A própria dor é muito consectateur nonummy 25 Link Alterar país
Vou abrir o assunto, e essas mesmas coisas daquele inventor Lorenzino Às vezes o homem comum percebe que é aí que ele comete um erro.

26 Links de rodapé globais


25
24 26
Registre-se para receber e-mails globais. Não é de <país>? Clique aqui

Sobre Cruzeiros Globais | Folheto | Perguntas frequentes | Localizador de Agente de Viagens | Mapa do Site | Informações Jurídicas | Termos de preços | política de Privacidade
Página 2

Figura 11.6 Wireframe da página inicial da Global Cruises por Will Evans

UM EXERCÍCIO: PROJETE UM WIREFRAME DE PÁGINA INICIAL 197


Machine Translated by Google

990 px de largura

Alertas de viagem
4,0 5,0 Notas anotadas
3,0
1,0 2,0
ENCONTRE UM Novo Popular
LOGOTIPO Bahamas IR 1,0
Itinerários Itinerários Alertas de viagem: link para 0.2.0.0
CRUZEIRO

1 2,0 Links de marca/logotipo Página inicial


Destinos | Experiência de viagem | OK, vontade para "Bahamas"
Planeje encontramos
uma viagem
18
| Antes da sua viagem | Clube VIP da Global Cruises | Promoções | Meu Global 6.0
Especiais de cruzeiro 3,0 Pesquisa com sugestão preditiva definida
Bem-vindo de volta, W iLog Out 15 dias até seu próximo cruzeiro - ver itinerário | Meu global
cenário do usuário 3.X
7 noites detalhes
7,0
$ 279 Bahamas e Flórida 4,0 Menu suspenso Novos Itinerários com link: display
Charleston Great Stirrup Cay (nossa ilha particular) Nassau Sexta-feira -
Itinerário com link para a seção 4.x
Porto Livre Porto Canaveral Charleston Sábado
5,0 Itinerários populares - exibição suspensa
detalhes Os 5 itinerários mais populares
7 noites
$ 279 Bahamas e Flórida 6,0
Charleston Great Stirrup Cay (nossa ilha particular) Nassau Sexta-feira - Sugestão rápida: exibição de resultados em cache
Porto Livre Porto Canaveral Charleston Sábado sequência correspondente

Mídia/Flash/Imagem Hedônica detalhes 7,0 Boleto de Cruzeiro com os seguintes metadados:


7 noites
$ 279 Bahamas e Flórida 1. Preço
Charleston Great Stirrup Cay (nossa ilha particular) Nassau Sexta-feira -
2. Avaliação Média
Porto Livre Porto Canaveral Charleston Sábado 3. Título: Título do Cruzeiro
4. Duração
7 noites detalhes
5. Portos de escala
$ 279 Bahamas e Flórida
Charleston Great Stirrup Cay (nossa ilha particular) Nassau
Título para Hero Shot
Sexta-feira - 6. Link de detalhes
Porto Livre Porto Canaveral Charleston Sábado 7. Reserve este link de cruzeiro
Reserve este pacote especial » 8. Lembre-se/favorite este cruzeiro

Filtre
Manchetes globais | Crie seu próprio momento Starring seus
E Ir
You agora! resultados 8,0 A Navegação Facetada permite ao usuário
para alterar dinamicamente sua porta,

Precisa de ajuda para planejar seu cruzeiro Porto/cidade de origem: Promocionais/Notícias


Washington DC Navio: -Qualquer NavioPromocionais/Notícias Mês da viagem, navio ou faixa de preço
e classificará/filtrará dinamicamente a correspondência
conjunto de resultados. Qualquer um
Mês: Preço: deles pode ser revertido quando o usuário visualizar todos
8,0 -Qualquer mês -
os resultados na tela de resultados da pesquisa
$ 190 a $ 1650
HEDÔNICO HEDÔNICO HEDÔNICO
IMAGEM IMAGEM IMAGEM
Ver todos os resultados da pesquisa 9,0 9,0 Após o uso, os filtros foram ajustados para previsão
pesquisar, eles podem clicar para ver todos
resultados de pesquisa que usarão Ajax para
carregue os resultados completos definidos em
Adipisicing Consequente do Cabeçalho Header Adipisisicing Duis será seguido, ou a dor Adipisicing Consequente do Cabeçalho
uma matriz javascript para classificação rápida.

Clareza é a própria pulseira será repreendida no prazer, e os cabelos fugirão da dor, e não Dúvidas ou dor ao repreender com prazer
Não fique zangado com a dor na repreensão no haverá reprodução. Ele quer ser um fio de cabelo, deixe-o fugir da dor e ninguém dará à luz.
10 Compartilhe seus momentos, chame,
prazer queira ser uma pena na dor da alegria Cabeçalho da ideia número 1
Cabeçalho da ideia número 1 Cabeçalho da ideia número 3 perfil do membro

Clareza é a própria pulseira Cabeçalho da ideia número 2 111 Publique seus próprios momentos estrelando
Cabeçalho da ideia número 2 Cabeçalho da ideia número 4
Não fique zangado com a dor na repreensão no link para a página de croudsourcing.
Cabeçalho da ideia número 3
prazer queira ser uma pena na dor da alegria 12 Inscreva-se para receber e-mails

Estrelando você momentos 8 de outubro de 2008 18h46 Promoção da marca 13


10 Link Alterar país

Mas para que vocês vejam de onde nasce todo esse erro, do prazer dos acusadores
14 Links de rodapé globais
e a dor de quem elogia, vou abrir todo o assunto, e essas mesmas coisas daquele inventor
11
imagem Vou explicar o que foi dito sobre a verdade e como arquiteto de uma vida feliz.

Mas para que você possa ver de onde nasce todo esse erro
aqueles que acusam o prazer e elogiam a dor, vou abrir todo o assunto, e Publique o seu próprio Lamento muito a perda do consectateur nonummy Lorenzino. Às
essas mesmas coisas daquele inventor vezes o homem comum percebe que é aí que ele comete um erro.
13
12 14
Registre-se para receber e-mails globais. Não é de <país>? Clique aqui

Sobre Cruzeiros Globais | Folheto | Perguntas frequentes | Localizador de Agente de Viagens | Mapa do Site | Informações Jurídicas | Termos de preços | política de Privacidade
Página: 3

Figura 11.7 Wireframe da página inicial da Global Cruises de Will Evans com pesquisa ativada

Criação de wireframe nas palavras de Will

Para mim, wireframes atuam como uma forma de “dispositivo de pensamento” para a definição e
exploração de um determinado espaço problemático – neste exemplo, uma página inicial para uma
operadora de linha de cruzeiro. Projetar através do uso de wireframes é uma busca em um espaço
problemático de alternativas; é tanto um processo de definição de problemas quanto de resolução
de problemas, o que significa que sempre começo com o contexto.

Neste caso, o público principal quer encontrar facilmente o melhor cruzeiro, na hora certa, pelo
preço certo. Para simplificar, escolho meu público principal e a atividade que lhes permite resolver um
objetivo de forma rápida, fácil e elegante.

Ao esboçar uma série de wireframes, posso explorar alternativas, e ideias impossíveis e


concebíveis são apresentadas, testadas e, em muitos casos, descartadas. Eu já sabia que queria
projetar a melhor interface de pesquisa de linha de cruzeiro possível e queria que essa
atividade fosse colocada em destaque no design. Foi aqui que esbocei o conceito de fornecer
sugestões imediatas de cruzeiros, mesmo antes de o usuário se comprometer a ver

198 CAPÍTULO 11: WIREFRAMES E ANOTAÇÕES


Machine Translated by Google

uma tela completa de resultados de pesquisa. Eu queria que o usuário fosse


envolvido em uma conversa e envolvido no processo de encontrar um ótimo cruzeiro.

ENCONTRE UM
Bahamas IR
CRUZEIRO

OK, vontade para "Bahamas" encontramos 18


Especiais de cruzeiro

7 noites detalhes
$ 279 Bahamascharleston
e Flórida
Great Stirrup Cay (nossa ilha particular) Nassau Sexta-feira -
Porto Livre Porto Canaveral Charleston Sábado

7 noites detalhes
$ 279 Bahamascharleston
e Flórida
Great Stirrup Cay (nossa ilha particular) Nassau Sexta-feira -
Porto Livre Porto Canaveral Charleston Sábado

7 noites detalhes
$ 279 Bahamascharleston
e Flórida
Great Stirrup Cay (nossa ilha particular) Nassau Sexta-feira -
Porto Livre Porto Canaveral Charleston Sábado

7 noites detalhes
$ 279 Bahamascharleston
e Flórida
Great Stirrup Cay (nossa ilha particular) Nassau Sexta-feira -
Porto Livre Porto Canaveral Charleston Sábado

Filtre seus
E resultados

Porto/cidade de origem: Washington DC Enviar: -Qualquer navio

Mês: Preço:
-Qualquer mês -
$ 190 a $ 1650

Ver todos os resultados da pesquisa

Figura 11.8 Recurso de resultados de pesquisa de cruzeiro na primeira página de Will Evans

No caso da operadora de cruzeiros, esbocei o cabeçalho, o rodapé, o conteúdo


estático e a necessidade de bloquear áreas no design para módulos de conteúdo,
como CTAs e promoções. Compartilho o resultado deste estágio com as principais
partes interessadas, mas também trago o designer visual e o líder de desenvolvimento,
bem como a garantia de qualidade, para que possam contribuir com o processo,
fornecer mais ideias e começar a documentar armadilhas e problemas. restrições.

Finalmente, como designer, tive que tomar a decisão de implementar o design numa
especificação. Criei dois ou três candidatos para consideração final e, por meio do
uso de anotações, autorizei o wireframe a defender seu caso às partes interessadas e
aos testadores direcionados. Os wireframes que você vê nas Figuras 11.6 e 11.7 estão
agora neste estágio, onde as alterações no design são pequenas e os detalhes estão
sendo polidos.

UM EXERCÍCIO: PROJETE UM WIREFRAME DE PÁGINA INICIAL 199


Machine Translated by Google

Comparar e contrastar

É importante observar que o exemplo da Figura 11.3 e o trabalho de Will Evans são estilos
bastante semelhantes — embora diferentes — de criação de wireframes. É fácil olhar para ambos
agora e anunciar com orgulho: “Esses são wireframes!” Eles
ambos têm elementos de estilo e abordagem próprios, mas a essência é muito semelhante.
Os exemplos neste capítulo são ótimos lugares para começar a encontrar o estilo de wireframing
que funciona melhor para você.

Design visual: quando os wireframes crescem


e encontram seu próprio caminho no mundo

oioctw
jsese
kyzcraiw eoiM
ro
ta P
F
d
c

Figura 11.9 Design visual da página inicial da Global Cruises por Mark Brooks

200 CAPÍTULO 11: WIREFRAMES E ANOTAÇÕES


Machine Translated by Google

A partir dos requisitos e do wireframe de Will Evans, Mark Brooks (www


.markpbrooks.com) criou um design de página inicial para o fictício Global
Linhas de cruzeiro. Ao revisar o design visual da Figura 11.9, observe como ele considerou o
layout e o conteúdo da página. Assim que o design passar pelo processo e chegar ao
desenvolvimento, os modelos de interação começarão
para ganhar vida.

Acompanhamento do exercício de design: qual design é o correto?


Não existe design certo ou errado, desde que os requisitos sejam atendidos.
Às vezes, você pode se sentir compelido a criar vários wireframes para uma única página para
explorar várias abordagens, trabalhar nos detalhes e apresentar a usuários em potencial, colegas de
equipe e, possivelmente, seus clientes.

Isto é completamente aceitável.

Lembre-se de que este é um exercício de iterações. É quase sempre garantido que o trabalho que
você apresenta a um cliente não será considerado “correto” ou “final” na primeira tentativa. Na
maioria das vezes, você se verá trabalhando em pelo menos uma rodada de iterações e atualizações.
Infelizmente, isso pode, por vezes, estender-se a múltiplas rondas – mas essa é a natureza dos
projetos e, em última análise, deverá levar a menos exploração para os seus parceiros de trabalho
a jusante.

Ao comparar seu wireframe e anotações com os dois exemplos fornecidos, examine a diferença
na abordagem e no estilo de apresentação. Compare-os com o exemplo da página inicial
anteriormente neste capítulo e com o trabalho que você fez. Encontre as semelhanças e diferenças
e crie a abordagem que funciona melhor para você, a menos que já exista um modelo estabelecido
para você.

Em muitos casos, a parte mais difícil de criar um wireframe é colocar o lápis no papel pela primeira
vez. Siga o conselho de Leah Buley e comece a esboçar várias ideias – rabisque e desenhe,
explore diferentes abordagens e teste seus projetos com colegas de trabalho, colegas e
familiares até se sentir confiante de que pode defender seu projeto (sem ficar na defensiva) e você
se verá se movendo na direção certa.

UM EXERCÍCIO: PROJETE UM WIREFRAME DE PÁGINA INICIAL 201


Machine Translated by Google

Uma nota final sobre a apresentação


Wireframes
Depois que você começa a criar wireframes e se sente mais confortável com o produto de
trabalho – e entende o quanto eles são valiosos para o seu fluxo de trabalho – é fácil esquecer
que nem todo mundo entende a quantidade de pensamento e tempo gasto para criá-los.
Freqüentemente, clientes e parceiros de trabalho podem ter sido expostos a wireframes com um
nível de qualidade e complexidade completamente diferente ou com um estilo de anotações
diferente.

Na verdade, você pode descobrir que muitos de seus parceiros de trabalho e clientes
nunca viram um wireframe antes (mesmo que digam que viram). Também não é incomum que
clientes e parceiros de trabalho fiquem confusos sobre as diferenças entre mapas de sites e
wireframes e a finalidade de cada um.

Em outras palavras, seu primeiro wireframe também pode ser o primeiro wireframe do seu
cliente! Isso torna extremamente importante definir com precisão o cenário para o que você
vai apresentar. Antes de apresentar os wireframes você precisa explicar claramente o que eles
são, como serão em comparação com o design visual final e qual é a sua finalidade.

Aqui estão alguns conselhos adicionais para apresentar wireframes:

Se possível, envolva a equipe do seu cliente durante a descoberta; tente envolvê-los no


desenho ativo em um quadro branco. Explique que eles estão contribuindo para o
processo de wireframing e que o resultado final será semelhante, mas será produzido
em formato eletrônico. É muito importante explicar que esta é uma atividade que levará a
wireframes que podem parecer completamente diferentes à medida que você explora as
opções de design.

Encontre metáforas fortes para transmitir as diferenças entre seus wireframes e o


design final do projeto. Uma metáfora popular é “Os wireframes estão para os aplicativos/
sites assim como as plantas/plantas baixas estão para uma casa”. Os wireframes permitem
que as mudanças sejam implementadas com mais facilidade e eficiência, e em um estágio
em que as mudanças geralmente são mais baratas (antes de envolver as equipes de
construção e lançar as bases).

Diga aos participantes da reunião que os wireframes não são uma representação final do
tratamento gráfico do site. Os wireframes estão sendo apresentados para dar conta do
conteúdo, layout geral e interação do

202 CAPÍTULO 11: WIREFRAMES E ANOTAÇÕES


Machine Translated by Google

elementos das páginas. Depois que os wireframes forem aprovados, a construção pode
começar. (Ah, e mudanças sutis ainda podem ocorrer!)

Envolva seus designers visuais – se houver tempo e orçamento – para fornecer


modelos de design para mostrar as diferenças entre seus wireframes e o design final. Se
possível, mostre ao cliente exemplos de outros projetos que demonstrem como wireframes
e designs finais são semelhantes e diferentes em
o mesmo tempo.

Explique como outros membros da sua equipe de projeto usarão os wireframes –


nunca é demais para um cliente entender a importância de sua revisão e aprovação desse
marco, bem como como os wireframes informam o restante do projeto.

Depois que seus clientes e parceiros de trabalho começarem a entender e apreciar o valor
dos wireframes e onde eles vivem no processo de design, será mais fácil levar seus projetos
adiante.

Por que?

Porque os wireframes ajudam a criar clareza visual e direção durante todo o restante do
projeto. Em muitos casos, parceiros de trabalho e clientes podem até evangelizar a utilidade
dos wireframes em seu nome. Isso permite que você gaste mais tempo focando no design da
experiência do usuário e menos tempo vendendo-o!

UMA NOTA FINAL SOBRE A APRESENTAÇÃO DE WIREFRAMES 203


Machine Translated by Google

12 Prototipagem
Respiração (algum tipo de)
Vida em seus designs

A prototipagem é uma forma eficaz de testar e validar


funcionalidades e designs propostos antes de investir no
desenvolvimento. Você pode usar diversas ferramentas e
abordagens para criar protótipos, desde o rápido e
sujo (mas preferimos rápido e limpo) ao interativo
e robusto. O método que você usar será determinado em
grande parte por dois fatores: o tempo e os materiais que
você tem disponíveis para dedicar ao desenvolvimento do protótipo.

Russ Unger e Jono Kane

67
Machine Translated by Google

O que é prototipagem?
No contexto do design da experiência do usuário, a prototipagem é o ato de (e em
muitos casos, a arte de) criar e testar toda ou parte da funcionalidade de um aplicativo
ou site com os usuários. Os protótipos podem ser feitos com ferramentas analógicas
(como quadros brancos ou lápis e papel) ou digitalmente com PowerPoint, Acrobat,
Visio, OmniGraffle, HTML ou outras ferramentas baseadas em tecnologia.

A prototipagem pode ser um processo iterativo, pois geralmente os protótipos são


criados para identificar problemas – ou validar – a experiência do usuário. Depois de
coletar feedback, você pode fazer modificações no protótipo para testes adicionais.
Em outros casos, um protótipo bem-sucedido (suficientemente) pode manter o projeto
avançando para outras fases do ciclo de vida de desenvolvimento.

Lembre-se de que a prototipagem é um processo e não um artefato. Você pode acabar


criando telas e funcionalidades (às vezes simuladas) que você chama de protótipo,
mas elas fazem parte da prototipagem e não do resultado final. O resultado do
processo de prototipagem é um feedback acionável de conceitos que podem ser
usados para aprimorar e melhorar o design.

Este capítulo, no entanto, concentra-se apenas na criação do protótipo, deixando os


detalhes dos testes para o Capítulo 13.

Quanto protótipo eu preciso?


Qualquer processo de design de experiência do usuário deve incluir algum grau de
prototipagem – seja formal ou informal, interativo ou estático. A prototipagem não
precisa ser executada para um site ou aplicativo inteiro. Na verdade, a prototipagem
pode ser muito eficaz quando utiliza apenas uma amostragem representativa de um sistema –
em outras palavras, você não precisa criar uma simulação de todo o sistema, mas
apenas das partes principais. Na maioria dos casos, você desejará testar alguns
conceitos e seu protótipo deverá incluir esses conceitos e pouco mais.

Você pode fazer prototipagem usando vários métodos que estão prontamente
disponíveis: quadro branco, esboços com lápis e papel, storyboard, recortes de
papelão e assim por diante. Além disso, estão disponíveis diversas ferramentas
digitais que permitem criar protótipos interativos e envolver os usuários de teste em um
ambiente mais realista.

DE QUANTO PROTÓTIPO PRECISO? 205


Machine Translated by Google

O método de prototipagem que você escolher dependerá muito do tempo e dos materiais
disponíveis. A seguir estão alguns dos métodos mais populares disponíveis para atender a
muitas de suas necessidades de prototipagem.

Prototipagem de papel
Poucas atividades podem levá-lo de volta aos seus primeiros anos como a abordagem
prática e artesanal da prototipagem em papel. As únicas ferramentas necessárias são lápis
e canetas, papel, tesoura e qualquer coisa que você possa roubar do departamento de arte
ou comprar em uma loja de materiais de escritório local.

A prototipagem em papel é flexível. Contanto que você tenha uma borracha ou mais
materiais, você poderá criar quantos cenários precisar. Você também pode revisar
rapidamente de teste para teste – ou seja, se um usuário em potencial apontar um erro
evidente em algo que você criou, não será um processo complexo atualizar o design antes
de mostrá-lo ao próximo usuário em potencial.

Também é barato. Além da quantidade de tempo que você investe na prototipagem de


papel, geralmente você pode criar qualquer cenário por muito menos do que o custo de
alguns cafés com leite intelectuais. Papel, post-its, fichas, lápis e similares já devem estar à sua
disposição e, se não estiverem, você não vai quebrar o banco estocando.

O processo é simples: esboce a parte da funcionalidade que você deseja testar. Apresente
a funcionalidade ao(s) usuário(s). Documente o feedback (é papel, então vire seu protótipo
e comece a escrever). Em seguida, passe para o próximo usuário ou faça atualizações e
recomece.

Simples. Diversão. Eficaz.

Usada no início do processo, a prototipagem em papel pode ajudar a descobrir


problemas relacionados ao design antes que você tenha investido pesadamente. As alterações
nesta fase podem ser feitas de forma rápida e eficiente, reduzindo o risco. Isso permite que
você faça alterações eficientes antes de investir muito no design.

Usando três folhas de papel de cores diferentes, cada aba da Figura 12.1 foi esboçada
como seria exibida no site e empilhadas umas sobre as outras.
A guia Global Now é colocada na parte superior para exibir seu conteúdo como se o usuário
tivesse acabado de visitar a página inicial pela primeira vez. Cada aba mostra a navegação
disponível aos usuários e permite que eles selecionem uma opção de visualização diferente.

206 CAPÍTULO 12: PROTOTIPAGEM


Machine Translated by Google

Figura 12.1 Protótipo em papel de uma navegação Figura 12.2 Protótipo em papel de uma navegação
vertical baseada em guias vertical baseada em abas com a aba Meu Itinerário
ativada

Quando um usuário seleciona uma guia diferente, essa guia específica é movida para a frente
da pilha para mostrar a visualização da área de conteúdo da guia recém-ativa, como a guia Meu
Itinerário exibida na Figura 12.2.

A prototipagem em papel tem o menor orçamento possível e pode ser tão simples quanto o
exercício acima. Quando você começa a explorar sistemas completos, as horas investidas
podem se tornar substanciais (embora os custos de material aumentem apenas ligeiramente). Se
você precisar alterar a navegação primária em cem páginas de protótipos em papel, esse
método se tornará caro. Embora a prototipagem em papel seja essencialmente de baixo custo, ela
não é adequada para reutilização quando as peças precisam ser atualizadas. Nesse ponto, você
deve considerar se mudar para ferramentas digitais
seria mais benéfico.

Prototipagem Digital
Se suas necessidades de prototipagem forem maiores do que o papel pode suportar, você
poderá descobrir que uma solução baseada em tecnologia funciona melhor para você e seu público.
Essas ferramentas podem permitir que você mostre exatamente como as partes interativas do site
ou aplicativo aparecerão para os usuários.

A prototipagem digital extrai muitos outros aspectos do processo de design.


Você poderá se referir às suas personas ao apresentar ou testar seu protótipo digital, aos
seus wireframes para bloqueio e tratamento visual do protótipo e aos ativos de design visual (se
estiverem disponíveis neste ponto do processo) para uma visão realista ajuste e finalize seu
protótipo.

Wireframe vs. protótipos realistas


Assim como acontece com os métodos de prototipagem em papel, sua quilometragem pode variar com
os protótipos digitais. Dependendo das ferramentas, recursos e habilidades que você possui em seu

PROTOTIPAGEM DIGITAL 207


Machine Translated by Google

disposição, bem como os requisitos com os quais você está lidando, você pode descobrir que
ter seu protótipo parecido com wireframes é bom o suficiente para o seu projeto.
Na verdade, pode ser preferível. Wireframes podem mostrar ao público que o projeto ainda
é um trabalho em andamento e não o site final pronto para produção.

Por outro lado, às vezes durante os testes de design com usuários, você descobrirá que o
aspecto mais importante do protótipo é o quão realisticamente ele representa o sistema final.

O resultado do seu protótipo digital depende de três fatores:

Como é sua linha do tempo?

Você tem tempo para reunir uma equipe e construir um protótipo incrível, quase pronto
para produção, que mostrará aos usuários que estão sentados à sua frente uma visão
cristalina do site pronto para produção? Você tem algumas horas para exportar seus
wireframes como HTML ou construir um projeto Flash muito simples para simplesmente
mostrar o fluxo da página e os elementos interativos básicos do projeto?

Ambos os tipos de protótipos digitais podem ser muito úteis. No entanto, assim como
acontece com qualquer projeto real com prazo iminente, é importante definir expectativas com
base no tempo e nos materiais disponíveis.

Para quem você está construindo este protótipo e por quê?

É vital para o sucesso do seu protótipo saber o que você está fazendo com ele antes de se
aprofundar no projeto. Você está construindo um protótipo para teste de design com
usuários? Em caso afirmativo, no que é importante focar para o teste? Faz diferença se o
protótipo é um wireframe em preto e branco ou precisa se parecer com um site ativo? Você
está testando a capacidade de descoberta de botões e links?

Você está construindo o protótipo para um discurso de negócios que precisa da adesão de
uma equipe de executivos, gerentes, investidores ou outras pessoas que possam assinar
seu cheque no final do dia? Se sim, o que você está tentando comunicar a eles? O que
precisa ser funcional e o que simplesmente precisa ter aparência
funcional? Essas perguntas podem ajudar a determinar os requisitos do seu protótipo
digital.

208 CAPÍTULO 12: PROTOTIPAGEM


Machine Translated by Google

Que tipos de recursos, ferramentas e habilidades você tem disponíveis?

Se você não é um especialista em HTML ou Flash e não tem orçamento para contratar
alguém que o seja, você ainda pode construir um protótipo muito funcional usando uma
ferramenta de apresentação simples como PowerPoint ou Keynote, ou uma ferramenta
de wireframing como Visio ou OmniGraffle. Até mesmo um simples PDF pode servir.

Editores HTML vs. WYSIWYG


HTML é o equivalente digital de um protótipo de papel. É (às vezes) gratuito e (um tanto)
fácil. Se você não é um assistente de HTML ou um especialista em código front-end, ainda
pode ser um assistente de protótipo de HTML com apenas algum conhecimento básico
de HTML.

Existem essencialmente duas maneiras de construir um protótipo HTML: codificando


manualmente o HTML ou usando um editor WYSIWYG, como Adobe Dream-weaver,
RapidWeaver da Realmac ou Microsoft Visual Studio. Essas ferramentas possuem uma
visualização de código e também uma visualização de layout que permite visualizar seus
esforços de código sem abrir um navegador.

Criando um protótipo com um editor WYSIWYG

A grande vantagem de usar a visualização de layout em um editor HTML WYSIWYG é que


você pode criar um layout de página com aproximadamente o mesmo esforço que seria
necessário para criar o layout de uma página no Microsoft PowerPoint, no Keynote da Apple
ou em qualquer outro layout gráfico simples. aplicação (mais sobre isso mais tarde). E é
igualmente fácil adicionar interatividade, como links, eventos de mouse e assim por diante.

Um dos aspectos mais impressionantes do Dreamweaver CS4 (Figura 12.3) é que ele
apresenta o que a Adobe chama de Live View, que é baseado no mecanismo de renderização
de código aberto WebKit. O que isto significa? Muito simplesmente, significa que o que você vê
no Live View é exatamente o que você obterá nos navegadores Safari da Apple e Chrome do
Google – supondo que você tenha sido meticuloso com os detalhes do seu protótipo. O
Dreamweaver CS4 é uma ferramenta de prototipagem muito poderosa, especialmente
quando usada em conjunto com o Adobe Fireworks CS4.

PROTOTIPAGEM DIGITAL 209


Machine Translated by Google

Figura 12.3 Um exemplo de protótipo simples criado no Dreamweaver CS4

Criando um protótipo HTML básico

Possivelmente, a maneira menos dispendiosa de construir um protótipo HTML simples, rápido e


sujo é fazê-lo “manualmente” – digitando o código manualmente em uma ferramenta de edição de texto.

Um dos motivos mais comuns para a transição de um design de wireframe para protótipo é
a necessidade de mostrar ou testar o fluxo proposto e a navegação do site. Pegando blocos de
elementos ou até mesmo páginas inteiras de seu wireframe (ou modelo de design) e configurando-
os como imagens clicáveis em seu protótipo HTML, você pode construir um protótipo funcional de
maneira muito rápida e fácil.

Um protótipo muito simples que permite clicar em imagens de página inteira em um navegador e

depois carregar páginas diferentes é bastante simples. No exercício a seguir, você precisará ter

uma página inicial e um wireframe de resultados de pesquisa à sua disposição ou poderá baixar imagens de

amostra em www.projectuxd.com.

Nota Erros de digitação são os erros mais comuns cometidos na codificação HTML, portanto, preste
muita atenção à precisão da sua digitação.

210 CAPÍTULO 12: PROTOTIPAGEM


Machine Translated by Google

1. Exporte o wireframe da sua página inicial a partir de sua ferramenta preferida (como Visio ou
OmniGraffle) ou sua composição de design a partir de sua ferramenta de design visual.
Você deve salvar a página inteira como uma imagem GIF chamada homepage.gif; crie uma
nova pasta chamada Prototype e armazene homepage.gif lá.

Nota O formato JPEG funciona muito bem para imagens raster e fotográficas; GIF funciona melhor
para wireframes e desenhos de linha.

2. Em seu editor HTML WYSIWYG ou em um editor de texto simples, como o Note-


pad (Windows) ou TextEdit (Mac), crie um novo documento e salve-o como homepage.html
na mesma pasta Prototype. Se você estiver usando o TextEdit,
certifique-se de selecionar HTML como formato de arquivo.

3. No seu novo documento, insira o seguinte código HTML:

4. Salve o documento e abra o arquivo no navegador da Web. Você


deverá ver uma página em branco, mas observe a barra de título no navegador. Deveria dizer
“Página inicial”.

5. Em seu editor de texto, modifique o código homepage.html. Entre o <corpo>


e </body>, insira o seguinte HTML:

Este código transformará toda a sua imagem homepage.gif em um botão clicável que carregará
a página searchresults.html (que você precisará criar para ver se a funcionalidade funciona
com sucesso).

6. Salve seu documento e recarregue a página em seu navegador. Você deverá ver a nova página
inicial que acabou de criar em seu navegador, em toda a sua glória (Figura 12.4). Ao clicar
na imagem no navegador, o navegador tentará carregar a página searchresults.html (que
ainda não existe).

PROTOTIPAGEM DIGITAL 211


Machine Translated by Google

7. Repita a etapa 1 para o conteúdo do wireframe dos resultados da pesquisa.


Salve esta página como uma imagem GIF, nomeie-a como searchresults.gif
e salve-a na pasta Prototype. Salve uma nova cópia do documento
homepage.html atual como searchresults.html. Selecione “Salvar como” para a
página “homepage.html” atual e salve-a como “searchreseults.html”. Em seguida,
atualize seu HTML para exibi-lo e vincular de volta à página inicial (homepage.html).

Você precisará substituir esta linha de código:

Com isso:

8. Depois que esta página for criada, você terá um protótipo HTML muito básico que
mostra como duas páginas podem ser vinculadas entre si.

Figura 12.4 Protótipo HTML da página inicial, visualizada em um navegador da Web

212 CAPÍTULO 12: PROTOTIPAGEM


Machine Translated by Google

Quebrando o Código

Agora que você criou um protótipo básico usando uma quantidade muito limitada de
HTML, vamos examinar brevemente o código, ou tags HTML, que você usou, para
que possa entender melhor o que acabou de fazer.

As tags HTML , head e title

são tags básicas exigidas em qualquer documento HTML. O item importante a ser
observado aqui é a tag de título, que permite especificar o nome da página.

Uma etiqueta de imagem

também é uma tag simples; é tudo que você precisa para visualizar uma imagem em um navegador.

Tags âncora, como esta,

são usados para configurar links em seu documento HTML. Para simplificar, a tag
âncora do exemplo usa um caminho relativo – “relativo” porque o projeto do tutorial
está na mesma pasta. Um caminho absoluto se parece com isto:

Embora este HTML não seja estilizado ou compatível com padrões (não mostre isso a
um desenvolvedor — ele pode ser solicitado a lhe dar uma dura lição sobre práticas
de desenvolvimento de código!), ele é mais que suficiente para fazer seu protótipo
funcionar. em um navegador. Lembre-se, este protótipo não precisa ser perfeito: o
objetivo é simplesmente comunicar suas ideias ao seu público.

Este exemplo de marcação simples criou arquivos HTML vinculados que permitem
cliques página a página, mas e se você quiser obter mais granularidade com as áreas
clicáveis no layout? A resposta: mapas de imagens. Com mapas de imagens,
você pode designar áreas de uma imagem para vincular e exibir páginas diferentes
quando clicadas. A maneira mais fácil de criar mapas de imagens é usar uma
ferramenta WYSI-WYG, como o Dreamweaver, para atribuir partes vinculáveis de uma
imagem sem nenhum conhecimento real de como criar o código HTML. Para obter
mais informações sobre como criar mapas de imagens, consulte “Como criar um mapa de imagens para

PROTOTIPAGEM DIGITAL 213


Machine Translated by Google

minha página da Web” tutorial de Dave Taylor em: www.askdavetaylor.com/


how_do_i_create_an_image_map_for_my_web_page.html.

Os protótipos HTML são apenas uma abordagem para a prototipagem digital. Muitas
estruturas diferentes e linguagens de codificação dinâmica podem ser usadas para
criar protótipos muito robustos para atender a quase todas as necessidades. Se a
prototipagem HTML for uma área que você deseja explorar e expandir, você pode
procurar tutoriais e outros recursos para se aprofundar nessa área. Para começar, você
pode pesquisar JavaScript, PHP (ou outras linguagens de codificação dinâmica), jQuery
(http://jquery.com) ou Yahoo! Biblioteca de Interface (http://developer
.yahoo.com/yu).

Nota Para uma exploração mais profunda do HTML, consulte HTML Dog: The Best-Practice
Guide to XHTML and CSS, de Patrick Griffiths (New Riders, 2006).

Ferramentas adicionais para prototipagem


Agora você explorou opções práticas que podem ajudá-lo a criar protótipos em espaços
analógicos e digitais. Além desses métodos, há uma série de outras ferramentas de
software que você pode usar para criar protótipos que vão desde o básico “fazer o
trabalho” até aqueles mais robustos e cheios de interação e inteligência. A lista a seguir
está longe de ser inclusiva, mas fornecerá uma variedade de opções para criar o protótipo
certo para sua situação.

PowerPoint e Keynote

Um protótipo do PowerPoint ou Keynote se enquadra na categoria rápida e suja e, às


vezes, isso é tudo que você precisa. Você pode construir seu protótipo de PowerPoint
ou Key-note como se estivesse construindo uma apresentação de slides básica,
com interações simples. Ambas as ferramentas permitem criar interações para
simular o click-through de um fluxo que você deseja validar com seus usuários. Se você
é um “usuário avançado” do PowerPoint ou Keynote, pode incorporar animação e outros
elementos para tornar seu protótipo um pouco mais interativo.

PDFs do Adobe Acrobat

Exportar seus wireframes ou composições de design visual como um PDF de várias


páginas pode ser tudo que você precisa para mostrar a aparência do produto e como
ele pode navegar em um formato linear página a página. Lembre-se de que muitas aplicações

214 CAPÍTULO 12: PROTOTIPAGEM


Machine Translated by Google

exporte para PDF e, se estiver em um Mac, poderá escolher Imprimir em PDF para praticamente
qualquer documento ou arquivo em qualquer aplicativo que permita uma função de impressão.
Muitos aplicativos, incluindo Visio e OmniGraffle, permitem especificar pontos de acesso e ações,
como localização do link, para interatividade.

Visio e OmniGraffle

Tanto o Microsoft Visio quanto o OmniGraffle do Omni Group são ferramentas bem conhecidas
para a criação de wireframes. Ambos permitem que você crie protótipos click-through por meio de
sua capacidade de exportar para os formatos HTML e PDF. No OmniGraffle, você pode atribuir
ações facilmente e especificar um ponto de salto em um PDF ou URL, se estiver exportando como
HTML. O Visio possui kits de prototipagem disponíveis para download na Web que permitem fácil
exportação para HTML ou PDF com áreas clicáveis, para navegação página a página.

Visio e OmniGraffle também podem exportar formatos vetoriais e raster populares, como EPS,
GIF e JPEG, que permitem importar facilmente suas imagens para Flash, usá-las como imagens
para protótipos HTML e assim por diante.

Axure RP

O “RP” em Axure RP significa prototipagem rápida, que é o que torna a ferramenta popular entre
muitos designers de experiência do usuário. A ferramenta oferece recursos de desenho semelhantes
aos do Visio e OmniGraffle, mas adiciona um conjunto de ferramentas relativamente fácil de aprender
que permite criar uma variedade de estilos de navegação, formulários, pop-ups e outras
interatividades típicas baseadas em páginas. . Além disso, sua integração flexível de especificações,
comentários, atribuições e marcadores de progresso permite produzir especificações baseadas em
documentos diretamente do protótipo. No entanto, o Axure é uma ferramenta exclusiva para Windows,
o que pode ser um desafio se você estiver trabalhando com um Mac e não estiver usando nenhum
aplicativo que permita iniciar o Windows.

Fogos de artifício CS4

O Fireworks CS4 da Adobe tornou-se recentemente mais popular como uma ferramenta para
criar uma variedade de componentes de design, desde wireframes até designs visuais.
Possui um conjunto padrão de elementos e controles de formulário do Windows e Mac que

permitem interações facilmente definidas que podem destacar funcionalidades sem a


necessidade de um desenvolvedor externo. A Biblioteca Comum armazena elementos que podem
ser adicionados e compartilhados em vários documentos, para que você possa reutilizá-los.

PROTOTIPAGEM DIGITAL 215


Machine Translated by Google

componentes. O Fireworks também possui um recurso Páginas que permite criar conjuntos
de elementos comuns a todas as páginas de um documento específico—
semelhante à forma como os desenvolvedores usam “inclui” ou como alguns sistemas de
documentação permitem criar planos de fundo para reutilização em páginas de documentos.
Esse recurso é útil para identificar áreas de conteúdo repetíveis no nível da página,
como cabeçalho, rodapé e navegação, mantendo áreas de conteúdo exclusivas em cada
página.

Maquetes Balsamiq

Mockups da Balsamiq Studios é uma ferramenta de wireframing e prototipagem que


fornece uma experiência semelhante a esboçar wireframes com lápis e papel—
só você usa um computador. Uma variedade de controles de interface de usuário comuns
predefinidos estão disponíveis (mais de 60 no momento da escrita) que você pode arrastar
e soltar em uma tela e personalizar para seu projeto.

Seus modelos são estilizados como se fossem desenhados à mão, o que dá uma sensação
um pouco mais orgânica às telas criadas digitalmente, mas a plataforma digital permite
que você modifique rapidamente os designs para iterações rápidas.

Flash e Catalisador Flash

A prototipagem com Adobe Flash é uma ótima maneira de comunicar conceitos


interativos além de apenas um protótipo básico de clique. O Flash permite criar facilmente
protótipos de clique, mas também permite adicionar outros elementos de interatividade,
incluindo eventos de passar o mouse ou passar o mouse, eventos de clique, vídeo e
animação. Se você tiver a capacidade de explorar o Flash com mais detalhes, ele também
possui um conjunto básico de componentes de interface do usuário que podem ser
programados para responder às interações do usuário e exibir um resultado desejado.

Para uma introdução sobre prototipagem em Flash, procure o artigo de Alexa


Andrzejeski “Quick and Easy Flash Prototypes” em Boxes and Arrows: www.boxesand
arrows.com/view/quick-and-easy-flash.

Quando este livro estava prestes a ser impresso, a Adobe anunciou uma nova ferramenta
de prototipagem chamada Flash Catalyst. Flash Catalyst é um ambiente de desenvolvimento
que funciona com outros aplicativos do pacote Adobe CS4 para atuar como um canal entre
o design e o processo de desenvolvimento. Isso permite que você exporte seus designs para
um formato pronto para navegador com pouco esforço. Para mais informações, visite www.
adobe. com.

216 CAPÍTULO 12: PROTOTIPAGEM


Machine Translated by Google

Trabalhando com um desenvolvedor


Se você tiver os recursos disponíveis, convém contratar um desenvolvedor para criar um
protótipo para você com base em seus wireframes ou designs.
Observe que o desenvolvedor precisará ter um entendimento sólido do que você está tentando
realizar, portanto, essa abordagem pode exigir que você também crie especificações e
requisitos de desenvolvimento para que o processo seja eficiente e eficaz.

Se o seu protótipo estiver sendo usado para testes iterativos, certifique-se de comunicar quais
partes do protótipo você está focando para testes e, portanto, exigirá que as mudanças
sejam implementadas rapidamente. É aconselhável passar algum tempo com o desenvolvedor
durante o processo de desenvolvimento e identificar as principais áreas do código que devem
ser sinalizadas (com comentários no código) como suscetíveis a alterações. Certifique-se de
permanecer envolvido com seu desenvolvedor durante o desenvolvimento do protótipo para
manter as linhas de comunicação abertas e garantir a precisão do resultado.

Nota Para obter mais detalhes sobre uma variedade de abordagens de prototipagem,
consulte o próximo livro, A Practitioner's Guide to Prototyping, de Todd Zaki Warfel (Rosenfeld
Media, a ser publicado em 2009: www.rosenfeldmedia.com/ books/ prototyping).

Exemplos de protótipos
Os exemplos simples e fáceis de executar de prototipagem neste capítulo estão longe de
ser um conjunto completo de abordagens que você deve usar para cada situação. Para
destacar alguns usos da prototipagem no mundo real, Keith Tatum e Jon Hadden generosamente
compartilharam suas experiências.

Keith Tatum, estrategista sênior de experiência do usuário da Slingthought (www


.slingthought.com), criou o protótipo de papel na Figura 12.5 para explicar os links de
navegação à esquerda e identificar as hierarquias e categorizações de navegação para
seus parceiros de colaboração na Align Interactive (www
.aligninteractive.com). Além disso, o processo de prototipagem em papel permitiu que ele
ignorasse a fase do wireframe e passasse para o design visual e o layout (Figura 12.6).

EXEMPLOS DE PROTÓTIPO 217


Machine Translated by Google

Figura 12.5 Protótipo de papel usado para explicar Figura 12.6 Design de site ao vivo baseado em
conceitos de navegação para a equipe de desenvolvimento protótipo de papel

Keith aproveitou o entendimento comum de sua equipe sobre as tarefas de design


e desenvolvimento para criar rapidamente um design em dois dias úteis. Isso permitiu
que a equipe prosseguisse com o desenvolvimento rapidamente após a aprovação do
conceito de design visual.

Figura 12.7 Protótipo funcional de uma ferramenta de calendário, simulada usando XHTML, CSS e
JavaScript de alta fidelidade; cortesia de Jon Hadden

218 CAPÍTULO 12: PROTOTIPAGEM


Machine Translated by Google

Jon Hadden (www.jonhadden.com), designer visual sênior do Yahoo, criou um


protótipo da funcionalidade de calendário para uma ferramenta que ele está construindo
chamada Project Manager. O Project Manager é uma plataforma colaborativa baseada na Web
aplicativo para gerenciamento de projetos. Ele começou como wireframes OmniGraffle e
foi então construído como um protótipo XHTML de alta fidelidade para ajudar a determinar
se a funcionalidade era utilizável e acessível.

A acessibilidade é um ponto importante: em alguns casos, partes de uma aplicação ou


projeto podem ser testadas no protótipo para verificar se a funcionalidade é rentável. Se o
custo de criação de funcionalidade se tornar uma preocupação e o desenvolvimento do
protótipo exceder as expectativas de tempo e materiais, talvez seja necessário avaliar a
viabilidade do seu projeto.

O que acontece após a prototipagem?


Depois de concluir o processo de prototipagem, você precisará sintetizar seus resultados
e transformá-los em algo acionável. Se você estivesse prototipando em papel, talvez
fosse necessário começar a criar wireframes digitais com base no feedback recebido.
Se você já estiver no modo wireframe digital, pode ser necessário atualizar seus wireframes
e prosseguir com o processo do projeto. Ou talvez você precise receber seu feedback e
atualizar seu protótipo para outra rodada de análises.

Todd Zaki Warfel, presidente da Messagefirst (www.messagefirst.com), compartilhou o


seguinte:

Os protótipos são uma forma de atingir um ou mais dos seguintes objetivos:


Trabalhe em um design
Crie uma plataforma de comunicação comum
Venda suas ideias de design internamente (por exemplo, para seu chefe, outros designers, etc.)

Testar viabilidade técnica


Teste conceitos de design com usuários/clientes finais
A prototipagem serve como um mecanismo de feedback. Através da prototipagem, você
pode determinar se deseja continuar com uma direção de design específica ou explorar
uma direção diferente, antes de passar para as próximas fases do seu projeto.

Lembre-se: independentemente de onde você esteja no processo, a prototipagem é apenas


uma parte do processo e, como acontece com qualquer outra parte, você precisa estar
ciente de quando atingiu o ponto de eficácia máxima e está pronto para passar para o
próxima etapa do processo de experiência do usuário.

O QUE ACONTECE APÓS A PROTOTIPAGEM? 219


Machine Translated by Google

13 Teste de design
com usuários
Afaste-se do que você pensa que é
Saiba – e descubra como eles pensam

No Capítulo 6, abordamos diversas técnicas de design UX que podem

ajudá-lo a entender seus grupos de usuários – suas necessidades,

atitudes e preferências relacionadas ao assunto geral representado

por seu site.

Este capítulo discute técnicas que ajudarão você a reunir

informações do usuário sobre projetos ou elementos de projetos

específicos. Vamos nos concentrar em técnicas exploratórias

frequentemente usadas no início da fase de design e em testes de

usabilidade, que podem ser usados em vários pontos do seu projeto.

Primeiro, vamos falar sobre como explorar conceitos de design com seus usuários.

Carolyn Chandler

67
Machine Translated by Google

Exploração de conceito
Conceito é geralmente a palavra usada para descrever uma ideia abstrata, como
felicidade, colaboração ou eficiência. No campo do design UX, conceito
também é usado para se referir a elementos de design que pretendem representar
uma ou mais ideias abstratas para a equipe do projeto ou para um usuário potencial.
Neste sentido da palavra, um elemento de design conceitual pode ser visual (por
exemplo, uma foto de uma máquina para representar o conceito de eficiência) ou pode
ser baseado em texto (por exemplo, uma pequena coleção de frases escritas para
expressar um foco da empresa na eficiência, usando palavras como oportuna e responsiva). Conceito
também pode significar a exploração de wireframes, maquetes de design visual ou
protótipos brutos destinados a expressar a mensagem geral do site (consulte o
Capítulo 12 para obter mais informações sobre prototipagem).

A exploração de conceito normalmente acontece no início do processo de design,


depois de você ter definido seus grupos de usuários, mas antes de entrar nos detalhes
de cada página ou tela. A pesquisa pode fornecer inspiração para designers e reduzir
alguns dos riscos de lançar um novo produto no mercado, porque você poderá ouvir (e
planejar) os tipos de reações que poderá obter de usuários em potencial.

O objetivo principal da exploração de conceito é compreender os tipos de respostas e


ideias que são extraídas de seus grupos de usuários quando confrontados com um
conjunto de elementos de design.

A exploração de conceitos pode consistir em discussões individuais ou pode ocorrer


em grupo, mas inclui algumas atividades individuais destinadas a reunir e discutir uma
variedade de pontos de vista. Este último pode ser configurado como um grupo focal, com
uma parte do tempo dedicada a atividades de teste de conceitos, seguida de uma
discussão em grupo (ver Capítulo 6 para mais informações sobre grupos focais).

Vejamos um exemplo de exploração de conceito realizada para uma organização de


microfinanças sem fins lucrativos.

EXPLORAÇÃO DE CONCEITO 221


Machine Translated by Google

Potenciais armadilhas da exploração de conceitos


Henry Ford disse uma vez: “Se eu perguntasse aos meus clientes o que eles queriam, eles teriam

pedido um cavalo mais rápido”. Embora você possa obter ótimas ideias explorando conceitos com

usuários em potencial, você não quer contar com eles para substituir designers. Afinal de contas, os designs

mais memoráveis são muitas vezes muito diferentes dos anteriores e os participantes na investigação

podem não se sentir confortáveis com um grande grau de mudança.

As respostas dos participantes estarão enraizadas em seu entendimento atual. O que você está coletando

são reações, não previsões do que eles irão ou não querer no futuro. Lembre-se também de que muitos

outros fatores fora do design em si influenciarão o comportamento futuro (como o boca a boca positivo).

Evite pedir aos participantes que façam escolhas diretas (como “Qual conceito é melhor,

ou B?”); em vez disso, ouça como eles usam suas próprias palavras para descrever os conceitos

apresentados. Os resultados devem ser considerados como uma contribuição para o processo de design e

não como um mandato para os designers.

Para uma excelente visão geral das possíveis armadilhas dos conceitos de
design de teste e para recomendações sobre como usar bem a técnica, dê uma
olhada neste artigo no site da AIGA: “Design Meets Research”, de Debbie
Millman e Mike Bainbridge: http: //www.aiga.org/content.cfm/design-meets-research

O microfinanciamento é o financiamento de empréstimos muito pequenos para empresários em


países empobrecidos. Esses empréstimos podem permitir que os mutuários construam negócios

e, como resultado, melhorar a vida das suas famílias e comunidades. Os fundos do empréstimo
provêm de indivíduos que se reúnem para emprestar ou doar pequenas quantias para
compensar um empréstimo maior (por exemplo, 25 dólares cada para financiar um empréstimo
de 800 dólares necessário ao proprietário de uma loja no Quénia). Os empresários pagam o
empréstimo à medida que o negócio cresce.

O modelo de financiamento é muito poderoso, mas a organização por vezes achou difícil explicar o
conceito em termos simples.

Além de ter o desafio de descrever as microfinanças, a organização também não tinha certeza
sobre como lidar com as mensagens e o design no que diz respeito à religião. Esta organização
de microfinanciamento específica foi inspirada pela fé dos fundadores e funcionários. Muitos na
organização queriam fazer

222 CAPÍTULO 13: TESTE DE PROJETO COM USUÁRIOS


Machine Translated by Google

esta inspiração era evidente no design do site, mas eles não tinham certeza sobre como
encontrar o equilíbrio certo: se a apresentação de mensagens religiosas fosse demasiado
forte, poderia alienar potenciais doadores que não fossem membros dessa fé.
Muito sutil, e a organização não representaria verdadeiramente seus valores.

Os designers de UX do projeto decidiram explorar as possíveis maneiras pelas quais


imagens e textos poderiam ser usados para explicar o modelo de microfinanças e
representar a inspiração religiosa da organização sem alienar potenciais doadores.
Para isso, escolheram fotos e palavras que pudessem ser usadas para explicar
conceitos relacionados ao modelo (como autossuficiência e investimento), e outros
que representassem vários graus de mensagem religiosa (por exemplo, fé e
espiritualidade).

Os grupos focais foram então planejados com participantes que se enquadravam


nos grupos de usuários-alvo do site. Foram incluídos dois grupos de usuários: aqueles
que indicaram doar como expressão de suas crenças religiosas e aqueles que não o fizeram.

Para cada grupo, o facilitador explicou o modelo de doação (não dizendo nada sobre
religião). Em seguida, cada participante recebeu uma folha de cartolina, um conjunto
de fotos e um conjunto de palavras para usar, além de cartões em branco adicionais para
preencher com suas próprias palavras, se assim o desejassem. Eles foram convidados
a criar uma colagem que exibisse as imagens e palavras que usariam para explicar o
modelo aos amigos e familiares. Ao finalizarem, os participantes se reuniram novamente
para apresentar suas colagens, explicando por que escolheram determinadas imagens
e textos e por que optaram por não incluir outros. A Figura 13.1 mostra um exemplo
de colagem criada neste exercício.

Figura 13.1 Um exemplo de colagem criada por


um participante durante o teste de conceito

A equipe do projeto obteve informações valiosas com essas colagens e com a discussão
que se seguiu. Informações incluídas

Os participantes evitaram imagens que representassem sucesso em termos


“ocidentais” (por exemplo, ternos e pastas). Eles queriam melhorar a vida dos
empreendedores sem mudar a sua cultura.

EXPLORAÇÃO DE CONCEITO 223


Machine Translated by Google

Todos os grupos de usuários concordaram que o foco do site deveria estar no objetivo da
organização (fornecer aos empreendedores o financiamento para crescer e prosperar) e
não na motivação por trás dela (inspiração religiosa).
Os participantes acreditaram que era importante que a organização permanecesse fiel a quem
era, mas que essas mensagens pudessem ser fornecidas numa área reservada para
descrever a própria organização (como uma área Sobre Nós).

As atitudes e interesses que surgiram ajudaram a equipe a decidir sobre uma direção para as
mensagens do site — e forneceram um bom exemplo do valor dos testes de conceito!

Dicas para explorar modelos de design visual


Em algum momento do projeto, você poderá ter maquetes que representem o potencial
design das páginas do site. Se você decidir explorar designs com os participantes, é melhor
ter duas ou mais variações disponíveis para eles compararem e contrastarem. Com apenas
um, é mais provável que você obtenha o viés “legal”: as pessoas não querem parecer
excessivamente críticas em relação ao modelo porque não querem ferir os sentimentos do designer.
No entanto, com dois ou mais modelos, eles geralmente se sentirão mais confortáveis em ser
críticos porque estão mais focados em comparar projetos do que em criticá-los diretamente.

Você pode entregar cada desenho aos participantes separadamente (em um monitor ou impresso
em papel) e fazer uma série de perguntas. Por exemplo, você pode pedir aos participantes que
observem cada design por um minuto e depois escolham pelo menos três termos de uma
lista que melhor descrevam o design. Eles poderiam circular suas escolhas em uma folha com
20 palavras como chato, moderno, conservador, barulhento, seguro e assim por diante em ordem
aleatória.

Também poderiam ser coletadas respostas a perguntas abertas. Por exemplo, você poderia dar
aos participantes cinco linhas em branco para anotarem suas impressões gerais sobre o
design.

Algumas das informações que você pode coletar incluem

Associações de marca comuns feitas por seus participantes:


“A Pseudo Corporation é o Rolls Royce dos fabricantes de widgets: parece ótimo, mas
provavelmente você não pode pagar por isso.”

224 CAPÍTULO 13: TESTE DE PROJETO COM USUÁRIOS


Machine Translated by Google

Ajuste de design e estilo de vida:

“Acho que não deixaria meu filho ir a este site. Ele tem apenas 8 anos e essas imagens parecem
adultas demais para ele.”

Eficácia de um modelo específico na explicação de um novo conceito:


"Ah, entendi - este site é como um registro de casamento, mas você está se registrando para
doações de caridade em vez de louças."

Maneiras como os participantes definem alguns dos termos-chave que você está usando:
“Quando vejo a palavra solução neste site, penso que vou encontrar todos os produtos e serviços
de que preciso para rastrear minhas remessas.”

Perguntas ou preocupações sobre como um determinado conjunto de ferramentas seria utilizado ou


o impacto da sua introdução (a secção seguinte ilustra vários exemplos de preocupações dos
participantes).

Os designers podem usar essas respostas para julgar se as reações que estão obtendo estão de
acordo com o que pretendiam ou se podem precisar tentar outra abordagem.

Tenha em mente que os participantes (e as partes interessadas do projeto, aliás) muitas vezes
escolhem diferentes elementos de diferentes designs: “Gosto desta parte do conceito A e gosto desta
parte do conceito B.” Esta é uma reação natural, mas não deve ser interpretada literalmente. Você não
quer uma fusão não natural de duas direções de design diferentes. Se o designer visual achar que os
elementos populares combinam bem, vá em frente. Mas deixe espaço para ela dizer que é menos
“chocolate e manteiga de amendoim” do que “chocolate e picles”.

No geral, não existem regras rígidas para as atividades incluídas no con-

exceto testes ou os tipos de elementos que você pode testar. Em vez disso, a chave é garantir que
você estabeleça as expectativas corretas com a equipe do projeto sobre o tipo de informação que sairá
dos testes e como essa informação será usada para informar as decisões de design sem sufocar a
criatividade.

Testando usabilidade
O teste de usabilidade é um dos métodos de teste de design UX usados com mais frequência. É
também o mais conhecido entre aqueles que não são designers de UX, portanto, as partes
interessadas do seu negócio e a equipe do projeto já podem estar familiarizados com ele. O conceito
em si é elegantemente simples: crie um conjunto priorizado

TESTANDO USABILIDADE 225


Machine Translated by Google

de tarefas para o seu site, peça a alguns usuários para realizá-las e anote onde eles
tem problemas e sucessos.

Teste de usabilidade vs. teste de aceitação do usuário


Algumas pessoas na sua organização podem ter a ideia errada de que os testes de usabilidade
só acontecem perto do final do desenvolvimento ou início da implantação, quando há uma versão
funcional do site ou aplicativo – talvez algo em modo beta. Essa impressão também pode estar
relacionada à prática comum de conduzir testes de aceitação do usuário (UAT) neste momento
posterior. A semelhança dos nomes pode confundir os dois.

Para aplicativos que passam por um processo formal de controle de qualidade, o UAT é um dos
estágios posteriores do teste e raramente é conduzido por usuários reais. O principal objetivo do
UAT é muitas vezes servir como uma verificação final sobre se a aplicação atendeu aos requisitos
funcionais estabelecidos pelas partes interessadas; ele também pode capturar quaisquer erros ou
bugs relatados pelos participantes.

Embora o UAT possa trazer à tona problemas de usabilidade, ele não deve ser considerado o único
método para detectá-los em um projeto. Como ocorrem tão tarde no processo, as alterações
baseadas no feedback do UAT são muito mais dispendiosas. É muito melhor identificar os
principais problemas no início do processo, antes que muito tempo seja gasto no desenvolvimento.
Os testes de usabilidade são projetados para fornecer informações de desempenho mais reais no
início do processo.

As seções a seguir discutem etapas comuns envolvidas em testes de usabilidade,


como

Escolhendo uma abordagem

Planejando a pesquisa

Recrutamento e logística

Escrevendo guias de discussão

Facilitando

Análise e apresentação de resultados

Criando recomendações

226 CAPÍTULO 13: TESTE DE PROJETO COM USUÁRIOS


Machine Translated by Google

Antes de começar, considere os objetivos do seu projeto. Eles o ajudarão a manter o foco
o tempo todo, mas serão especialmente úteis nos estágios iniciais, à medida que você escolhe
uma abordagem e planeja o teste.

Escolhendo uma abordagem


As abordagens de pesquisa são frequentemente descritas como quantitativas ou
qualitativas. A pesquisa quantitativa concentra-se em dados numéricos e tem como
objetivo fornecer resultados repetíveis e de alta confiança entre o seu grupo de usuários-
alvo. Depende da inclusão de um conjunto grande o suficiente de usuários dentro desse
grupo (chamado de tamanho da amostra) para que você possa tirar conclusões desse
conjunto menor e fazer inferências sobre a maneira como o grupo de usuários como um
todo responderá, dentro de um determinado intervalo de tempo. erro. No geral, é uma
abordagem mais científica para a pesquisa, com uma formalidade para o desenho e análise
do teste. O foco está na avaliação do design atual – em particular, em relação a outras
iterações do site, em relação aos concorrentes ou em relação a um conjunto de benchmarks.

Realizar pesquisas quantitativas significa envolver um número maior de participantes para


levar em conta as variações que você encontrará de indivíduo para indivíduo, como
velocidade de digitação, familiaridade com sites semelhantes e assim por diante. Os
inquéritos são um exemplo de um método de recolha de informação que pode ser alargado
a um público mais vasto, resultando em dados quantitativos – isto é, se fizer as perguntas
certas (ver Capítulo 6 para obter mais informações sobre inquéritos).

A pesquisa qualitativa , por outro lado, não está tão focada no nível de confiança
els e repetibilidade, mas sim na obtenção de contexto e percepção sobre o comportamento do
usuário. Baseia-se na interpretação das descobertas, na intuição e no bom senso do
designer. (A investigação contextual, discutida no Capítulo 6, é um exemplo de pesquisa
qualitativa.) Uma abordagem qualitativa permite uma abertura para testes que conduz à
exploração de ideias e à obtenção de insights; a discussão com o usuário é tão importante
quanto seu desempenho, ou até mais. O foco está em melhorar o design atual – obter
insights e reações ao que é apresentado para gerar ideias.

Então, o teste de usabilidade é um método quantitativo ou qualitativo? Essa é uma das


discussões mais antigas na área de design UX.

Qualquer abordagem é possível e pode trazer resultados úteis. Os defensores de uma


abordagem mais quantitativa dizem:

TESTANDO USABILIDADE 227


Machine Translated by Google

Ele permite a definição de benchmarks mensuráveis que podem ser testados em iterações
posteriores, mostrando o progresso em direção a uma meta (por exemplo, reduzir o tempo
necessário para finalizar a compra em 20% ou detectar 80% dos problemas de usabilidade em
um site). Isso também o torna uma boa abordagem quando você deseja realizar uma comparação
formal de dois sites ou avaliar um site específico.

Fornece resultados que podem ser validados estatisticamente, o que pode ser importante
quando as recomendações precisam ser defendidas às partes interessadas que
confiar em decisões baseadas em dados.

Isso reduz a probabilidade de o preconceito de um designer UX individual afetar os


resultados.

Proporciona um maior grau de confiança de que os resultados obtidos serão refletidos nos
resultados de toda a base de usuários.

Ele oferece um método numérico e claro para validar uma descoberta (por exemplo, quantos
usuários encontraram o mesmo problema).

Os defensores dos testes qualitativos de usabilidade dizem:

A pesquisa qualitativa constrói experiência e empatia no designer, promovendo soluções


criativas focadas no usuário.

Depende muito da intuição do designer de UX para fazer recomendações razoáveis, o que é em


grande parte o motivo pelo qual ela está na equipe.

Para testes de usabilidade em particular, uma abordagem qualitativa é muitas vezes


menos dispendiosa do que uma quantitativa, tanto porque são necessários menos
utilizadores como porque a investigação qualitativa não requer um conhecimento de concepção e
análise científica formal (como estatística).

É muito fácil analisar incorretamente os resultados de estudos quantitativos, mentindo (mesmo que
involuntariamente) com os dados, portanto, uma abordagem quantitativa pode, na verdade,
introduzir mais riscos do que um teste qualitativo, se não for executado corretamente.

Embora as descobertas não sejam validadas numericamente, elas podem ser validadas por um
designer, que tomará a decisão sobre o provável impacto do problema usando seu
justificativa informada e construir o caso com histórias de usuários.

O teste qualitativo de usabilidade é a abordagem mais acessível para aqueles que não tiveram
treinamento em métodos científicos formais e fornece uma rica fonte de dados para informar o
design. Por essas razões, nos concentraremos no projeto de testes qualitativos no restante
deste capítulo.

228 CAPÍTULO 13: TESTE DE PROJETO COM USUÁRIOS


Machine Translated by Google

Quantos usuários são “suficientes”?


Perguntar “Quantos usuários são suficientes?” participar de um grupo de designers de UX é como trazer à

tona a religião em um comício político – é um assunto de debate acalorado.

É também uma questão que não pode ser evitada, porque você precisará de uma estrutura para

começar a planejar sua pesquisa. Está vinculado à abordagem que você usa: quantitativa ou qualitativa.

Para dar uma resposta curta, aqui estão as diretrizes que parecem ter obtido maior consenso na área

de UX, fornecidas por Jakob Nielsen:

Para um teste quantitativo, planeje um número maior de participantes: 20 participantes por rodada de

pesquisa (consulte http://www.useit.com/alertbox/quantitative_testing.html).

Para um teste qualitativo, geralmente são suficientes cinco a oito usuários por grupo para cada

rodada de pesquisa. Idealmente, mais de uma rodada de pesquisa é conduzida para descobrir

questões que podem estar “ocultas” sob outras questões ou introduzidas involuntariamente no novo

design (ver http://www.useit.com/alertbox/20000319.html).

Planejando a Pesquisa
Ao projetar um teste de usabilidade, há algumas perguntas que você deve responder
antecipadamente para fornecer foco e escopo. Isto poderia ser fornecido como um documento
escrito e discutido com a equipe do projeto e as principais partes interessadas, muitas vezes
chamado de plano de pesquisa do usuário. O plano deve delinear a sua abordagem conforme
escolhido acima.

Por que você está testando?

Escreva uma declaração clara descrevendo os objetivos do teste, com base em um ou mais
objetivos do projeto geral. Consulte o Capítulo 2 para obter exemplos de objetivos de design e
como eles variam de acordo com o tipo de projeto.

Quem você está testando?

Depois de criar seu modelo de usuário (veja os Capítulos 6 e 7), você poderá usá-lo como base
para suas decisões sobre quais usuários testar. Se ainda não o fez, reúna-se com a equipe do
projeto e as partes interessadas relevantes para priorizar os grupos de usuários. Essas
informações serão inseridas em sua triagem (discutida em “Recrutamento e Logística”).

TESTANDO USABILIDADE 229


Machine Translated by Google

Este ponto também é onde você deve escolher os grupos de usuários a serem representados
e o número de usuários a incluir em cada grupo.

O que você está testando?

A questão sobre o que você está testando inclui duas questões inter-relacionadas: Qual método
você usará para representar o site ou aplicativo? e quais tarefas você planeja incluir?

Se você tiver um aplicativo existente para reformulação, poderá optar por executar primeiro o
teste inteiro na versão atual para encontrar os principais problemas de usabilidade a serem resolvidos.

Se estiver trabalhando com um novo design, você pode usar esboços ou protótipos de papel
(por exemplo, um pacote de wireframes impressos) para representar novos elementos de
interface, como páginas. Essas representações de baixa fidelidade da UI permitem gerar e discutir
ideias rapidamente entre a equipe do projeto e iterá-las rapidamente com os participantes
(consulte os Capítulos 10 e 11 para obter mais informações sobre esboços e wireframing).

Quando você estiver trabalhando com um novo design que inclua elementos altamente interativos,
talvez seja melhor criar um protótipo que simule o fluxo de navegação do design de forma realista,
mas que ainda possa ser criado rapidamente, antes que o desenvolvimento em grande escala
comece (consulte o Capítulo 12 para saber mais sobre prototipagem).

As páginas que você incluir estarão intimamente ligadas às tarefas que você escolher. Se você
planeja usar protótipos para testar com usuários, precisará planejar as páginas principais da tarefa,
bem como páginas intermediárias e caminhos alternativos. Talvez você não precise detalhar cada
um deles, mas precisará planejar uma resposta se um usuário seguir nessa direção. Às vezes,
isso pode ser tão simples quanto uma página que informa que um determinado caminho não está
disponível e solicita que o usuário retorne à página anterior para tentar novamente.

As especificidades de suas tarefas serão incluídas no guia de discussão (discutido abaixo),


mas como o escopo pode variar muito dependendo do tipo de tarefas incluídas, é útil ter a lista
delineada durante o planejamento.

230 CAPÍTULO 13: TESTE DE PROJETO COM USUÁRIOS


Machine Translated by Google

Mergulho Profundo

Para obter mais informações sobre design iterativo e testes com esboços, bem
como insights verdadeiramente inspiradores sobre a criatividade no processo de design, leia
Sketching User Experiences: Getting the Design Right and the Right Design, de Bill Buxton
(Morgan Kaufmann, 2007).

Para obter mais informações sobre técnicas de prototipagem em papel, consulte Prototipagem
em papel: a maneira rápida e fácil de projetar e refinar interfaces de usuário, de Carolyn Snyder
(Morgan Kaufman, 2003).

Se a lista for muito longa e você não tiver certeza de como priorizar, aqui estão algumas
prioridades possíveis a serem consideradas:

Áreas onde o design quebra algumas convenções estabelecidas. Você está chamando isso
de “sacola de guloseimas” em vez de “carrinho de compras”? Provavelmente é uma boa ideia
ver se isso está claro para seus usuários.

Áreas onde as decisões de design são politicamente carregadas. Você pode ter uma forte
sensação de que uma determinada direção de design é a correta, mas sabe que há muitas
divergências entre as partes interessadas ou outros membros da equipe do projeto. Ver
é crer.

Áreas onde os problemas de usabilidade podem ter consequências críticas, como perda de
vendas ou, no pior dos casos, perda de vidas (as aplicações de cuidados de saúde que
envolvem dosagem de medicamentos são um bom exemplo disso).

A seguir, você determinará as informações que ele deseja coletar enquanto o usuário tenta
executar cada tarefa.

Que informações você está coletando?

Estamos nos concentrando em testes qualitativos de usabilidade, que tendem a ter um conjunto
menor de medidas. Na maioria das vezes, você deseja compreender os problemas que os
usuários podem encontrar, os diferentes níveis de frustração que podem enfrentar e a gravidade de
um problema específico. Por exemplo, talvez haja um problema intermitente (não vivenciado por
todos os usuários) que resulta na perda irrecuperável de uma história postada. Definitivamente,
esse deve ser um problema de grande preocupação em seu relatório!

TESTANDO USABILIDADE 231


Machine Translated by Google

Para obter alguma perspectiva dos usuários que você está testando ou das rodadas de testes,
há algumas medidas a serem consideradas como parte do teste. Novamente, se você
estiver conduzindo um teste qualitativo com um número menor de usuários, não leve esses
números muito longe (calcular um número médio não faz muito sentido se você estiver
testando apenas cinco usuários), mas o As medidas a seguir podem ajudá-lo a compreender a
gravidade de alguns dos problemas que os usuários estão enfrentando.

Sucesso—O grau em que um usuário foi capaz de concluir uma tarefa. Se estiver analisando
usuários, você também pode se referir à “taxa de sucesso” – o número de usuários que
conseguem concluir a tarefa com êxito. Parece simples, mas isso significa que você precisa
definir o significado de sucesso!

Para testes menos formais, você pode dizer que uma tarefa foi bem-sucedida se o usuário
atingir o estado final (por exemplo, um editor aprova uma história com sucesso). Você pode
acompanhar o sucesso de forma mais formal, observando os diferentes níveis de
intervenção necessários ao facilitador:

Solicitação de nível 1: O facilitador do teste responde à pergunta de um participante, mas


não fornece nenhum detalhe adicional. Por exemplo, um participante pergunta: “Acho que seria
este botão, devo clicar nele?” e o facilitador responde: “Vá
adiante e experimente.” Um prompt de Nível 1 por si só não significa uma tarefa com falha,
mas é bom observar porque o participante provavelmente está enfrentando alguma incerteza
nesse ponto. (Embora se esta for a primeira tarefa, também pode ser que ele não esteja
familiarizado com testes de usabilidade).

Se um usuário não precisar de aviso para concluir a tarefa ou precisar apenas de um ou dois
avisos de nível 1, você poderá considerar essa etapa um sucesso, a menos que sinta que a
quantidade de tempo que o usuário levou foi muito além do nível de paciência provável para o
seu usuário. Usuários.

Aviso de nível 2: O facilitador do teste vê que um participante está com dificuldades e dá uma
dica em resposta a uma pergunta. Este nível não inclui dar a resposta diretamente, mas a
resposta pode afetar a abordagem do usuário. Por exemplo, o facilitador pode dizer: “Há mais
alguma coisa nesta página que você acha que pode estar relacionada a esta tarefa?” Aqui
você pode definir um limite de quantos prompts de Nível 2 podem ser dados antes que a tarefa
seja marcada como falhada (por exemplo, no segundo prompt) ou como “bem-sucedida com
dificuldade”.

232 CAPÍTULO 13: TESTE DE PROJETO COM USUÁRIOS


Machine Translated by Google

Alerta de nível 3: O participante desistiu por frustração ou lutou a ponto de provavelmente desistir
se enfrentasse a tarefa na vida real.
Neste caso, o facilitador dá uma resposta direta a parte da tarefa – por exemplo, dizendo: “Para
aprovar esta história, você clicaria no botão Enviar”. Se um participante exigir um prompt de Nível
3, a tarefa normalmente será marcada como falhada.

Satisfação do usuário: claro, ele concluiu a tarefa com êxito, mas como se sentiu em relação
a isso? Pode ser útil incluir algumas perguntas de acompanhamento após cada tarefa (com o
cronômetro desligado) para que você possa entender o quão felizes ou frustrados seus usuários
ficam depois. Se você encontrar alguém que não gosta de conversar, esta pode ser a principal
janela que você terá para a alma dessa pessoa.

A Tabela 13.1 mostra exemplos de algumas das perguntas pós-tarefa que você poderia
incluir.

TABELA
TABELA 13.1 13.1: Perguntas sobre satisfação do usuário

FORTEMENTE DISCORDO NENHUM CONCORDAR FORTEMENTE

DISCORDO CONCORDO NEM CONCORDAR

DISCORDO

A tarefa demorou mais para 12345


terminar do que eu esperava

A tarefa foi fácil 12345


de concluir
Fiquei frustrado ao tentar 12345
concluir esta tarefa

Perguntas de satisfação do usuário

Declarações do usuário – Esta não é uma métrica, mas o que os usuários oferecem é um conjunto
importante de detalhes a serem coletados. Adicionar citações de usuários a um relatório é uma
maneira poderosa de trazer o elemento humano aos resultados, para que as partes interessadas
não apenas interpretem os dados, mas entendam as percepções que levam a insights. Durante o
teste você pode apenas marcar as afirmações como perguntas ou comentários; iremos dividi-los no
relatório (consulte a seção posterior “Gerando insights”).

Recrutamento e Logística
Agora que você tem o esboço da pesquisa e sabe quantos participantes são necessários em cada
grupo, é hora de agendar alguns testes!

TESTANDO USABILIDADE 233


Machine Translated by Google

Gerando uma lista

Ao criar seu plano de pesquisa, você descreveu os tipos de usuários que deseja incluir. Você pode
usar esse esboço como foco para gerar uma lista de participantes potenciais. Idealmente, você está
procurando nomes, endereços de e-mail e números de telefone. Aqui estão algumas das fontes que
você pode usar para reunir essa lista:

Usuários registrados de um site de empresa relacionado

Informações de contato do cliente

Respostas a postagens sobre a pesquisa enviadas a sites ou grupos relevantes ao seu tema de
pesquisa. Isso pode ser amplo, como postagens no Craig-slist, ou direcionado, como grupos
de discussão centrados no setor da sua empresa.

E-mails para conhecidos com ligação ao assunto da prova.


Você deseja pedir-lhes que encaminhem o convite para outras pessoas que possam estar
interessadas, pois usar pessoas que você conhece pessoalmente pode distorcer os resultados.
Esse tipo de boca a boca é uma ótima maneira de encontrar grupos de participantes em
potencial, mas lembre-se de que esses candidatos ainda precisam ser selecionados. (Se você
ou outras pessoas da equipe conhecem bem as pessoas, pode ser tentador deixá-las escapar.)

Solicitações na forma de pesquisas curtas que pré-qualificam os participantes, seja em espaço


publicitário em sites relevantes ou no site da empresa

Afixação ou questionários de pré-qualificação em locais públicos onde possam ser encontrados


potenciais participantes. Para sites com uma forte associação a um local físico, você
também pode fazer a maior parte da triagem e do agendamento no local.

Empresas de recrutamento terceirizadas, que também podem realizar sua triagem para
você e ajudar no agendamento. Essa pode ser uma opção cara, mas se você estiver procurando
um tipo específico de participante que seja difícil de recrutar ou precise recrutar muitas
pessoas, poderá economizar muito tempo terceirizando essa parte do processo. Algumas
empresas também se especializam em determinadas áreas (como a médica) e podem fornecer
dicas sobre como incentivar uma alta taxa de participação.

234 CAPÍTULO 13: TESTE DE PROJETO COM USUÁRIOS


Machine Translated by Google

Esteja preparado para ser criativo aqui. Use suas habilidades empáticas para pensar como
seus usuários-alvo: onde você pode encontrá-los e o que pode motivá-los a aderir?
Esta última pergunta nos leva ao próximo tópico.

Escolhendo a compensação

O que motivará os membros do seu grupo de usuários a participar da pesquisa?


Pode ser dinheiro ou não, mas os participantes querem algo de valor pelo seu tempo.

Se estiver trabalhando em um site para usuários internos, você precisará demonstrar esse
valor aos gerentes que precisam aprovar o uso do tempo da empresa para participação em
pesquisas. Nesse caso, você pode se concentrar em como um sistema melhor se relaciona
diretamente com os benefícios para o grupo dele ou dela.

Se você estiver trabalhando com possíveis usuários externos, aqui estão algumas variáveis
que você deve ter em mente ao determinar como você compensará:

Quão geral ou específico é o público? Para um site de comércio eletrônico amplamente


utilizado, seu público provavelmente será geral e muitas vezes você pode oferecer uma taxa
de compensação mais baixa na forma de cheque ou cartão-presente. Para um aplicativo
utilizado por advogados, sua remuneração precisará ser de alto valor, e muitas vezes é
melhor usar algo diferente de dinheiro como compensação (por exemplo, acesso a um
serviço premium). Nesses casos, um cheque pode realmente parecer um insulto –
alguém que fatura US$ 250 por hora provavelmente não participará por dinheiro. Se você
estiver trabalhando com clientes de itens caros, trate-os como um público específico e
recompense-os bem.

Quanto interesse o tópico provavelmente gerará? Alguns participantes participarão


porque querem ver o que está por vir na área que você está testando. Se for uma área de
grande interesse, talvez você não precise fornecer muita compensação extra – a recompensa
é ter acesso a algo que ninguém mais pode ver ainda. Mas seja realista aqui: você pode estar
entusiasmado com o assunto, mas seus usuários estarão?

As pessoas participarão principalmente porque querem contribuir com algo para a


causa? Alguns grupos serão motivados por propósitos altruístas e poderão ser desanimados
pela oferta de dinheiro para participar. Se você estiver testando algo que melhore a comunidade
(on-line ou off-line), poderá obter mais participação—
e participantes mais felizes - se a experiência for sobre união, em vez de

TESTANDO USABILIDADE 235


Machine Translated by Google

do que ser pago. Neste caso você pode demonstrar seu agradecimento com reconhecimento
público e informando, uma vez concluído o site, a contribuição que puderam dar ao participar.

Quão inconveniente será a participação? Se os participantes precisarem viajar até o seu


local, esteja preparado para oferecer uma compensação maior. Se eles estiverem participando
de testes remotos no conforto de sua casa ou escritório, será necessário menos. O tempo
também entra nesta equação, é claro, e as pessoas esperam ser compensadas mais por 2
horas do que por 30 minutos.

Possíveis formas de compensação


Sua situação pode variar, mas aqui estão algumas coisas que você pode oferecer:

US$ 50 para um teste remoto de meia hora com um grupo de usuários geral

US$ 80 a US$ 120 para um teste presencial de uma hora com um grupo de usuários em geral

US$ 180 a US$ 250 para um teste de uma hora com um grupo de usuários específico que você

determina que responderá bem à compensação monetária

Serviço gratuito por três meses, produtos gratuitos fabricados pela empresa (de preferência

aqueles que ainda não estão disponíveis para todos), adesão a um grupo exclusivo por seis meses

e similares para um grupo específico de usuários que provavelmente não ficará impressionado. um

cheque, por exemplo, advogados, médicos e executivos de vendas

Aqui, novamente, é onde ajuda ser criativo e focar em suas personas. O que motivará seu grupo de

usuários?

Triagem

Um screener é um tipo de questionário que você pode usar com participantes em potencial antes
de agendá-los. Isso garante que eles se encaixem na sua definição de usuário representativo.
As perguntas destinam-se a

Certifique-se de que o entrevistado seja um usuário atual dos recursos que você está
testando ou um provável usuário futuro

Determine se ele se enquadra em um ou mais grupos de usuários

Ajudá-lo a obter uma boa combinação de participantes nesse grupo de usuários

236 CAPÍTULO 13: TESTE DE PROJETO COM USUÁRIOS


Machine Translated by Google

Exclua entrevistados específicos que possam ter experiência que possa distorcer seus resultados

Reúna os principais detalhes que você precisa saber antes da chegada de um participante
(opcional)

Seu avaliador deve incluir um roteiro introdutório que seu recrutador possa ler por telefone, junto
com instruções sobre quando qualificar o participante (se for adequado) ou encerrar a chamada (se
não for adequado).

Os usuários finais do seu screener serão as pessoas que recrutarão seus participantes -
ou o potencial participante se você estiver usando um formulário on-line para triagem. Qualquer
um pode funcionar, mas geralmente é melhor reunir uma lista dos interessados por meio de um
formulário ou e-mail e depois analisá-los por telefone. Por que? Porque, infelizmente, é geralmente
mais fácil para as pessoas se apresentarem falsamente no papel do que quando respondem
diretamente a alguém, e não é incomum que alguém tente participar de um estudo mesmo que não
se qualifique para isso. Especialmente se houver compensação envolvida!

Seu avaliador também deve eliminar aqueles que possuem conhecimentos que possam afetar
seus resultados. Por exemplo, uma pergunta comum a ser feita é se o entrevistado trabalha na
área de pesquisa de mercado, porque provavelmente está muito familiarizado com a pesquisa
em geral e, como resultado, não é tão provável que lhe dê reações genuínas. Você também
pode excluir aqueles que trabalham para concorrentes se houver preocupações sobre o
compartilhamento de informações de design.

A seguir estão alguns exemplos de perguntas que você pode ver em uma tela para um aplicativo de
pedidos pela Web business-to-business. Nesse caso, nosso alvo é um grupo de usuários que se
sente confortável em usar e comprar pela Web e que provavelmente também o fará por conta
própria. Observe que algumas perguntas têm como objetivo selecionar participantes dentro ou fora,
enquanto outras (como a pergunta 4) são mais voltadas para colocar participantes qualificados no
grupo de usuários correto.

1. Em que faixa etária você se enquadra? [mistura de idades acima de 18]

a. Menores de 18 anos TERMINAR

b. 18–24

c. 25–34

d. 35–44

e. 45–54

f. 55 ou superior

TESTANDO USABILIDADE 237


Machine Translated by Google

2. Com que frequência você usa a Internet em casa?


a. Nunca TERMINAR

b. Menos de uma vez por mês TERMINAR

c. Algumas vezes por mês

d. Pelo menos uma vez por semana

e. Várias vezes por semana

f. Uma vez por dia ou mais

3. Quando foi a última vez que você fez uma compra pessoal de um produto online?

a. No último mês

b. 1–3 meses atrás

c. 3–6 meses atrás

d. 6–12 meses atrás TERMINAR

e. Há mais de 12 meses TERMINAR

f. Nunca fiz uma compra pessoal on-line TERMINAR

4. Quando foi a última vez que você visitou pseudocorporation.com? [O Grupo A é


usuários pouco frequentes ou não; Grupo B são usuários frequentes]

a. Nunca visitei o site VERIFIQUE para o GRUPO A

b. No último mês VERIFICAR para o GRUPO B

c. 1–3 meses atrás VERIFICAR para o GRUPO B

d. 3–6 meses atrás VERIFICAR para o GRUPO B

e. 6–12 meses atrás VERIFIQUE se há A ou B

f. Há mais de 12 meses VERIFIQUE para o GRUPO A

238 CAPÍTULO 13: TESTE DE PROJETO COM USUÁRIOS


Machine Translated by Google

Você foi encerrado


Terminar é uma palavra que soa dura. Significa que a chamada deve ser encerrada porque
o respondente não se enquadra no teste. Você não quer que o entrevistado se sinta mal
com isso, mas também não quer que ela perca tempo fazendo perguntas complementares
quando sabe que ela não se encaixa. Existem muitas maneiras de lidar com isso. Uma das
favoritas é simplesmente dizer que o grupo para o qual ela se qualifica já foi preenchido e
perguntar se você pode contatá-la no futuro se houver outro teste no qual ela esteja interessada.

Planejamento de espaço e equipamentos

Nesse ponto, você sabe se está testando remotamente ou pessoalmente e quanto tempo
precisa para cada participante. Aqui estão algumas das outras decisões que você deve
finalizar:

Onde você está testando: Em um espaço alugado com sala de observação, em uma sala
de conferências nas instalações da empresa ou no local onde estarão possíveis usuários?
Planeje um local tranquilo que possa acomodar confortavelmente duas ou três pessoas
junto com a configuração do computador que você testará.

De que pessoal você precisará além do facilitador: Você pode economizar


tempo e aumentar a precisão tendo um anotador registrando as informações durante o
teste, por exemplo. Outras possibilidades incluem um recepcionista (para receber os
participantes, distribuir questionários enquanto as pessoas esperam e acompanhar os
participantes para dentro e para fora da sala de teste) e alguém para fornecer suporte
de TI caso algo aconteça durante o teste.

Como você gravará o teste: Você pode usar vários métodos, mas softwares como
Morae e Camtasia Studio da TechSmith facilitam a gravação de tela, e Morae possui
recursos adicionais de integração de áudio e vídeo de webcam.

Escrevendo guias de discussão


Finalmente, você precisará montar os materiais necessários para o teste em si. Você tem
suas tarefas gerais listadas no plano de pesquisa; agora você precisa finalizar o texto e as
instruções reais para a tarefa. Você terá pelo menos dois pacotes aqui – um para o
facilitador do teste e outro para o participante (com cópias suficientes para cada teste
para incluir uma de cada).

TESTANDO USABILIDADE 239


Machine Translated by Google

Comece com um roteiro introdutório que o facilitador possa ler para o participante. Muitos bons
exemplos estão disponíveis em http://usability.gov/templates.

Surfar
Usabilidade.gov é um site desenvolvido pelo Departamento de Saúde dos EUA

e Serviços Humanos como parte de uma iniciativa para incentivar o desenvolvimento de


sites acessíveis a um público amplo. Possui um excelente conjunto de materiais de referência

para ajudar com o design centrado no usuário, incluindo um exemplo de formulário de


consentimento de vídeo (em formato Microsoft Word), que você deve fazer com que os
participantes assinem antes de gravá-los: http://www.usability.gov/templates/docs/release. documento

Suas instruções devem incluir todas as informações específicas que o participante precisa para
concluir com sucesso a tarefa ou tarefas que você está testando.

Se suas tarefas exigem muita entrada de dados e personalização, configure algumas informações
com antecedência e forneça aos participantes dados predeterminados para uso. Por exemplo, se
um login estiver envolvido, você provavelmente fará com que todos os participantes usem o mesmo
conjunto de credenciais de login. Certifique-se de que as instruções da tarefa incluam todas essas
informações de forma clara para que seja fácil de preencher.

Aqui está um exemplo de como uma tarefa para um editor de conteúdo se torna mais específica no
guia de discussão. A tarefa original do plano é

“Encontre um artigo que esteja pronto para edição.”

No guia de discussão, isso se torna o seguinte:


INTRODUÇÃO

Seu gerente pediu que você assumisse uma nova função: editar e aprovar artigos postados por
escritores que contribuem para o site da empresa. Assim que você aprovar um artigo, ele será
postado no site na área Notícias.

Você e três outros editores aprovarão os itens para garantir que eles correspondam à mensagem da
empresa. Você recebeu as seguintes informações de login para a ferramenta de edição:

Nome de usuário: grossertson

Senha: come2gether

240 CAPÍTULO 13: TESTE DE PROJETO COM USUÁRIOS


Machine Translated by Google

Leia cada tarefa em voz alta e conclua-a usando a ferramenta de edição.


Tarefa 1

Faça login na ferramenta e abra um artigo pronto para edição.

Como você pode ver acima, alteramos um pouco a tarefa para terminar com um estado final
claro – um artigo aberto. Esse tipo de ajuste será comum à medida que você passa para
esse nível de detalhe e pensa em como medirá o sucesso.
Você também pode acompanhar cada tarefa com as questões de satisfação do usuário
discutidas na seção de planejamento. Em geral, é melhor dar a cada tarefa sua própria página
para que o usuário não fique tentado a olhar para frente.

Em resumo, seus materiais de teste devem incluir o seguinte:

Formulário de consentimento para gravação de vídeo (veja a barra lateral Surf na página
anterior para mais informações)

Guia de discussão para o facilitador, com roteiro introdutório

Guia de discussão para o participante, com tarefas detalhadas e perguntas sobre satisfação
do usuário

Um formato para anotações, caso você tenha alguém dedicado a isso. Isso pode variar
desde uma ferramenta de registro incorporada no software de teste até uma planilha para
digitar respostas a um modelo impresso para verificar informações importantes (como tipos
de prompts necessários). Gastar um pouco mais de tempo antes do teste para configurar isso
garantirá resultados consistentes e economizará muito tempo na revisão de gravações.

Opcionalmente, um questionário. Às vezes, os participantes chegam mais cedo e têm um


pouco de espera – esta é uma excelente oportunidade para reunir um pouco mais de
informação. Se você já criou uma pesquisa anteriormente, por que não reutilizá-la aqui?

A forma de compensação a ser entregue ao participante no final do teste (dinheiro em


envelope, um cartão-presente amplamente aceito, como um cartão-presente Visa, etc.). Se
você escolheu uma compensação como serviços gratuitos, em que nada é distribuído após o
teste, assegure ao participante que ele receberá acompanhamento o mais tardar no dia
seguinte.

Se estiver usando prototipagem em papel durante o teste, você também terá esses materiais
para trabalhar. Certifique-se de ter os conjuntos preparados para fácil manuseio antes do
início do primeiro teste.

TESTANDO USABILIDADE 241


Machine Translated by Google

Facilitando
O trabalho do facilitador é apresentar o processo ao participante, responder às suas
perguntas iniciais e, em seguida, colher os insights que você puder, ao mesmo tempo que tenta
permitir que o participante aja da forma mais natural possível.

Certifique-se de pedir aos usuários que pensem em voz alta durante o teste, como se estivessem
falando sozinhos (e lembre-os gentilmente de fazer isso se começarem a trabalhar silenciosamente).
A técnica “pensar em voz alta” é a forma como você obtém o máximo de insights sobre o
comportamento dos usuários. Você aprenderá muito sobre a solução de problemas e os
processos de pensamento deles se ouvir falar deles durante a tarefa em si, em vez de pedir
aos participantes que os recriem mais tarde, quando suas lembranças não forem tão precisas.

Além disso, tome cuidado para não dar ao participante a resposta “certa” muito rapidamente! Uma
das partes mais difíceis de conduzir um teste de usabilidade é observar o participante
cuidadosamente selecionado lutar intensamente com uma tarefa e simplesmente deixá-lo lutar.

Afinal, você provavelmente está nesta área porque é uma pessoa empática.
Você quer ajudar as pessoas. Portanto, pode parecer um pouco sádico ver alguém ficar cada vez
mais frustrado, pedir ajuda a você e depois responder: “O que você faria se estivesse tentando
isso sozinho?”

Sempre que um participante fizer uma pergunta enquanto trabalha, espere alguns segundos
antes de responder. É mais provável que os participantes façam perguntas logo no início do
teste, especialmente se se sentirem desconfortáveis em trabalhar com você sentado ao lado
deles. Quando eles perceberem que você está ali mais para observar do que para conversar, eles
muitas vezes começarão a se concentrar mais na tarefa do que na conversa.
sua presença.

Aqui estão alguns exemplos de perguntas dos participantes e respostas sugeridas:

Participante: “Parece que pode ser esta aba, devo ir aqui?”

Facilitador: “Vá em frente e experimente.”

Participante: “Eu deveria ir aqui?”

Facilitador: “É isso que você acha que faria neste momento?”

Participante: “É esta a forma de enviar comentários?”

Facilitador: Silêncio. Tem uma expressão amigável e relaxada no rosto enquanto sorri para o
participante e depois olha para a tela com expectativa.

Então, quando você intervém?

242 CAPÍTULO 13: TESTE DE PROJETO COM USUÁRIOS


Machine Translated by Google

Se o usuário já se esforçou mais do que você imagina que ele faria ao trabalhar sozinho, e você sente
que aprendeu por que ele acabou no caminho errado, é hora de seguir em frente - especialmente
se você tiver mais tarefas para realizar e você não quer que ele carregue sua frustração pelo
resto do teste.

No Capítulo 6 mencionamos a importância de evitar perguntas indutoras nas entrevistas com usuários.
O mesmo se aplica aqui também. Se você acha que está muito próximo do design e que as críticas
podem fazer você reagir defensivamente, considere treinar outra pessoa para facilitar enquanto você
faz anotações.

Analisando e Apresentando Resultados


Você concluiu todos os testes e agora tem uma montanha de dados para percorrer

através. Mas há algumas descobertas importantes que você já considera relevantes, e sua equipe de
projeto está morrendo de vontade de saber como foi.

Você pode agendar uma visão geral verbal casual das principais conclusões da equipe. Isso pode
ajudá-lo a verbalizar algumas das tendências que você percebeu e ajudar a preparar o terreno
para seu relatório posterior. Certifique-se de comunicar que essas são impressões iniciais e que você
precisará de tempo para analisar seus dados com mais detalhes. Você não quer necessariamente
entrar nas recomendações aqui antes de ter uma visão completa de onde podem estar os problemas.

Assim que tiver tempo para analisar os dados, revise-os com algumas coisas em mente:

A quantidade de tempo que você tem para análise. É fácil se perder nos detalhes e tentar incluir
tudo. Como sempre, fique de olho no seu teste e nos objetivos enquanto revela as descobertas
importantes. Se você tem dez horas de gravação de testes e cinco dias para escrever o relatório
completo, provavelmente não vai querer perder tempo assistindo ao vídeo de cada teste. Confie no
seu anotador e volte aos vídeos principalmente para ter certeza de que as principais citações que
você lembra foram registradas corretamente.

Como seus resultados serão usados. Este é um detalhe importante que muitas vezes pode ser
subestimado. Você pode criar um lindo relatório de 20 páginas, mas é provável que apenas uma
dessas páginas tenha bastante aproveitamento: o resumo executivo.

TESTANDO USABILIDADE 243


Machine Translated by Google

Se as partes interessadas do seu negócio quiserem ver os detalhes, o próprio relatório pode
ser a principal forma de comunicar os resultados. Se você acha que precisará de dois níveis
de detalhe — um para as partes interessadas e outro para a equipe do projeto —
considere também a criação de uma versão de apresentação do relatório, que atinja as
principais conclusões de uma forma mais visível, digerível e priorizada. Aqueles que estiverem
interessados em mais detalhes podem consultar o relatório completo.

Priorizando Problemas

No final do teste você terá potencialmente uma longa lista de problemas de usabilidade para
entender e priorizar. Aqui estão algumas características que irão ajudá-lo
determinar a gravidade de um erro:

Consequências. Os resultados negativos de encontrar o problema. Por exemplo, se um


participante perder dados devido a um problema de usabilidade, isso justifica um Alto
avaliação. Digamos que ela gaste dez minutos preenchendo um formulário complexo e
acidentalmente escolha um link que a leva para outra página. Se ela clicar no botão Voltar do
navegador, seus dados desaparecerão?

Recuperabilidade. O grau em que o participante pode se recuperar depois de


encontrar o problema – por exemplo, ele é capaz de voltar facilmente por um caminho
alternativo?

Freqüência de ocorrência. Como você não está trabalhando com um grande número de
pessoas, isso não é considerado um sinal de severidade. Mas se cinco pessoas cometem
o mesmo erro e isso as leva a um caminho menos ideal, é um bom sinal de que você deve
considerar torná-lo uma prioridade mais alta.

Causa racional. Se o problema não foi encontrado com frequência, mas foi causado por
alguém que se enquadra no seu grupo de usuários, ela o fez por um motivo racional e havia uma
causa clara para o erro, esse problema deve ser considerado como
você faz suas recomendações.

Gerando insights

Além das questões coletadas, você terá diversas declarações feitas por usuários que
podem trazer insights valiosos para a equipe do projeto. Como
descrito no Capítulo 6, um exercício de diagramação de afinidades é uma excelente maneira
de reunir essas afirmações e identificar padrões de forma colaborativa.

244 CAPÍTULO 13: TESTE DE PROJETO COM USUÁRIOS


Machine Translated by Google

Aqui estão algumas maneiras de categorizar as declarações do usuário (veja o


Seção “Investigação Contextual” no Capítulo 6 para obter mais detalhes):

Metas

Modelos mentais

Ideias e solicitações de recursos

Frustrações

Soluções alternativas

Declarações de valor

Delícias (não deixe isso de fora - você não quer perder as coisas boas!)

Expectativas (especialmente quando são perdidas)

Tanto nos insights quanto nas recomendações, certifique-se de incluir também as descobertas
positivas. Os relatórios de testes de usabilidade são muitas vezes vistos como muito negativos,
principalmente porque o pesquisador prioriza a discussão das coisas que precisam ser corrigidas em
detrimento das coisas que estão indo bem. Reservar um tempo para discutir as coisas boas tornará
a experiência geral do relatório melhor para todos.
Também ajuda a equipe de design a se envolver com os resultados e a ficar entusiasmada para
tornar o design ainda melhor.

Criando recomendações
Mesmo antes de iniciar a análise, você provavelmente já tem algumas boas ideias em mente para
corrigir os problemas encontrados no teste. Esboce-os ao longo do caminho à medida que você
identifica problemas e insights, para não perdê-los.
Apenas tome cuidado para que uma única ideia não assuma o controle muito cedo e influencie sua
visão sobre outras abordagens potenciais que podem resolver mais problemas.

Uma boa recomendação deve

Resolva mais de um problema, se possível. Você pode querer agrupar os problemas em uma
recomendação maior, dependendo de quão detalhado e específico você for com as descrições
dos problemas.

Seja acionável e simples, evitando projetos detalhados prematuramente.

TESTANDO USABILIDADE 245


Machine Translated by Google

Use palavreado que seja direto, mas não condescendente. Recebendo


a crítica é algo difícil, especialmente para aqueles que estiveram diretamente
envolvidos no projeto testado. Não subestime as questões, mas tenha em
mente que suas palavras precisam soar construtivas e respeitosas.

Lembre-se de que as recomendações precisam ser direcionadas aos usuários


finais, tanto quanto o sistema. Ao finalizar seu relatório, volte e pergunte-se se os
objetivos originais foram alcançados e como fornecer melhor seus resultados para
a variedade de pessoas que os utilizarão: partes interessadas, designers e
desenvolvedores.

Falando em desenvolvedores, é hora de trazê-los novamente à frente. No próximo


capítulo, abordaremos o que você deve ter em mente durante a transição do
design para o desenvolvimento e além.

246 CAPÍTULO 13: TESTE DE PROJETO COM USUÁRIOS


Machine Translated by Google

14 Transição: Do Design para


Desenvolvimento e além
Para onde vamos daqui?

As fases de Definição e Design do seu projeto terminaram.

O que agora? Um bom processo de design de experiência do usuário nunca

termina. Depois de passar por tanta definição e design, como você

permanece engajado para garantir que a entrega final do projeto seja a

experiência do usuário que você projetou – e para onde ir a partir daí?

Russ Unger

247
Machine Translated by Google

Este é o fim…
…do livro.

Este é o último capítulo.

No entanto, não é o fim do processo de design da experiência do usuário, embora possa


parecer superficialmente. Depois de passar por todas as fases anteriores de um projeto,
você pode pensar que seu trabalho está concluído e que não tem mais nada com que contribuir.
Em muitos casos, os esforços de design UX acabam como tarefas no plano de projeto de alguém
em algum lugar, e depois que seu produto de trabalho é entregue ao resto da equipe, você
invariavelmente é transferido para outro projeto.
É hora de fechar a porta e começar algo novo, certo? Muito errado!

Você ainda pode fazer muito para garantir que o melhor design de experiência do usuário possível
seja produzido.

Design visual, desenvolvimento


e garantia de qualidade
Em alguns casos, trabalhar com uma equipe de design ou desenvolvimento que recebe seu
produto de trabalho baseado em projeto é perfeito. Às vezes, os parceiros de trabalho posteriores
contam com você para responder perguntas, fornecer informações e ajudá-los com alguns dos
conceitos de design nos quais estão trabalhando. (Isso pode até parecer muito com
prototipagem para você!) Nesses ambientes de trabalho, o design da experiência do usuário
já está sendo adotado, e a equipe provavelmente teve a visão de lhe dar tempo para realizar
essas tarefas de consultoria.

Em muitas organizações, entretanto, as funções de designers de experiência do usuário,


arquitetos de informação, designers de interação e assim por diante ainda são muito novas.
Como gerenciar essas funções pode não ser claro, e a decisão sobre o quão engajado você
deve estar pode recair sobre alguém que não entende totalmente o design da experiência do
usuário. Pode ser que você decida encontrar maneiras de permanecer continuamente engajado.

248 CAPÍTULO 14: TRANSIÇÃO: DO DESIGN AO DESENVOLVIMENTO E ALÉM


Machine Translated by Google

Aqui estão algumas sugestões:

1. Compre-lhes um exemplar deste livro, por favor.

2. Não seja tímido.

3. Leia o restante deste capítulo e procure oportunidades nas quais você possa se envolver e ser
útil.

4. Peça para se engajar e esteja pronto para defender seu pedido.

Há outros casos em que você pode descobrir que a equipe de design visual ou de desenvolvimento
é o rei da empresa e de seus projetos, e pode ser um desafio permanecer engajado. Você pode
acabar tentando derrubar barreiras apenas para poder revisar o trabalho e garantir a conformidade.
Nem sempre é assim, mas acontece.

Christopher Fahey, sócio fundador da Behavior (www.behaviordesign.com), conhece bem a


superação desse desafio. Ele oferece este conselho:
Algumas organizações são fortemente compartimentadas. Para continuar engajado no
desenvolvimento do projeto após a conclusão das fases iniciais de design, você precisará ser
proativo e exigir a oportunidade de dar feedback e correções às equipes de design visual e
desenvolvimento. Muitas vezes, eles simplesmente nem pensam em pedir que você esteja
presente.

Idealmente, você fará isso durante as fases de planejamento e orçamento do projeto. Caso
contrário, talvez você precise literalmente oferecer seus serviços como voluntário para garantir
que o design não se degrade durante o desenvolvimento subsequente.

Um truque é simplesmente pedir para ser adicionado, mesmo que informalmente, à equipe
de Garantia de Qualidade (supondo que você tenha uma – se não, definitivamente
pergunte isso aos designers visuais e desenvolvedores!) e receber acesso e senhas para
qualquer desenvolvimento. locais e ferramentas de rastreamento de bugs. Então você será
capaz de adicionar suas críticas e desvios à mesma fila de correção de bugs que os
desenvolvedores analisam todos os dias.

É claro que muitos projetos não terão o luxo de ter uma equipe de garantia de qualidade.
Num mundo perfeito, todo projeto teria uma equipe assim; entretanto, na realidade, o controle
de qualidade nem sempre está disponível. Às vezes, os próprios desenvolvedores realizam
o controle de qualidade à medida que desenvolvem. Além de fazer você se encolher, saber disso
deve fazer você se esforçar ainda mais para trabalhar com desenvolvedores.

DESIGN VISUAL, DESENVOLVIMENTO E GARANTIA DE QUALIDADE 249


Machine Translated by Google

A Arte da Negociação
A arte da negociação pode se tornar um aspecto crítico de sua função como designer de
experiência do usuário. Parceiros de trabalho posteriores, como designers visuais e desenvolvedores,
podem tomar liberdades com suas alterações em seu trabalho sem perceber como isso afeta partes
importantes da experiência do usuário. Caso alguém lhe diga que algo “não pode” ser feito, você
deve estar preparado para elaborar um Plano B.
Boas habilidades de negociação o ajudarão a defender sua decisão de design (que deve ser baseada
na pesquisa que você fez) e a convencer outras pessoas de que a experiência do usuário pode ser
realizada. Alternativamente, essas habilidades irão ajudá-lo a trabalhar com seus parceiros para
criar uma abordagem satisfatória do Plano B que atenda ao maior número possível de necessidades
de todos.

Para obter informações adicionais sobre negociação, consulte Getting to Yes: Negotiating
Agreement Without Giving In, de Roger Fisher, William L. Ury e Bruce Patton (Penguin, 1991) e
Selling to the VP of No, de Dave Gray (XPLANE Corp. , 2003).

Isso é especialmente verdadeiro em muitas pequenas empresas: o controle de qualidade é


um luxo. O controle de qualidade é “realizado por todos, mas especialmente pelo desenvolvedor”,
diz Troy Lucht, diretor e diretor de desenvolvimento da Ascend Realty Solutions (www.
.ascendrealtysolutions.com).

Todos tentam — e querem — contribuir, mas sem recursos dedicados à criação de scripts de
teste, pode ser impossível informar as pessoas sobre o que devem testar quando o
desenvolvimento é frequentemente realizado até o último minuto possível. Em muitos casos, nosso
designer interno é a pessoa que conhece o aplicativo tão bem quanto eu, portanto, ele é capaz
de fornecer um feedback mais informado.
Adicionar um designer de experiência do usuário à mistura realmente completaria as coisas para
nossa pequena equipe.

Embora seu produto de trabalho de design de experiência do usuário possa não incluir a criação
de scripts de teste, em alguns casos você pode testar os wireframes e as anotações que você criou
para garantir que todos os elementos sejam considerados e todas as chamadas para ação definidas
estejam funcionando corretamente. Esta situação não é perfeita, mas é uma abordagem que pode
ser útil quando não existe controle de qualidade.

A principal conclusão aqui é que o design da experiência do usuário não termina apenas
porque você entregou seu produto de trabalho e realizou uma transferência de conhecimento.
Sua função pode assumir temporariamente uma natureza mais consultiva, mas você está
longe de terminar.

250 CAPÍTULO 14: TRANSIÇÃO: DO DESIGN AO DESENVOLVIMENTO E ALÉM


Machine Translated by Google

Teste de design com usuários (de novo)


Já não fizemos testes com usuários?

Esperamos que você possa responder sim a esta pergunta, mas isso nem sempre acontece.
Infelizmente, nem esta etapa específica de teste, que é designada para testar o site final,
projetado e desenvolvido com usuários reais antes do lançamento.

Isso permite que você dê uma última olhada no site e encontre os bugs e erros de última
hora que você pode ter esquecido durante os testes de controle de qualidade.
Depois de identificar seu conjunto-alvo de usuários, você poderá testar o site em relação a
quaisquer cenários que pareçam ser de alto risco ou que possam ter problemas em iterações
anteriores do site. Esta rodada de testes pode fornecer as informações necessárias para
determinar se o seu site está ou não pronto para ser lançado. Se
Se houver problemas significativos descobertos durante esta rodada de testes, pode ser
importante fazer atualizações e testar novamente.

10, 9, 8, 7, 6, 5, 4, 3, 2, 1… Lançamento!
"Se você construir, eles virão. ...”

Essa teoria é muito mencionada – e refutada com quase a mesma frequência. Você pode
criar o aplicativo mais bonito, satisfatório e utilizável possível, lançá-lo ao mundo e descobrir, dois
meses depois, que quase ninguém o está adotando.

O que da?

A adoção do usuário é o grau em que a base de usuários que você está almejando acaba usando
o site ou aplicativo. Alguns problemas de adoção podem ser evitados se você seguir boas
práticas de otimização de mecanismos de busca (Capítulo 8) para garantir que seus usuários
possam encontrar o novo site.

A adoção do usuário também significa que um bom design de experiência do usuário não para
quando o projeto termina — ou que fica limitado ao projeto em que você está trabalhando.

Você pode ajudar as equipes de marketing, suporte ao cliente, relações públicas e treinamento
a garantir uma implantação tranquila e uma base de usuários entusiasmada com o site ou projeto,
ajudando-os com três fatores que geralmente afetam a adoção do usuário:

Vantagem pessoal

10, 9, 8, 7, 6, 5, 4, 3, 2, 1… LANÇAMENTO! 251


Machine Translated by Google

Apoiar

Opinião da rede

Vamos dar uma olhada mais de perto em cada um deles.

Vantagem Pessoal
Uma das perguntas mais importantes a serem respondidas pelos usuários será “O que isso traz
para mim?”

Por melhor que seu site seja, se você não conseguir explicar rapidamente o benefício exclusivo
que ele traz para um tipo específico de usuário (ou uma das personas que você identificou), você
poderá ter dificuldades para envolver os usuários.

Algumas vantagens são diretas: “Ao usar este recurso de câmera, você pode postar fotos em
sua conta online com o clique de um botão”.

Algumas são indiretas: “Ao usar esta ferramenta de quadro de horários, a empresa pode controlar
mais facilmente o tempo gasto em cada projeto.”

Você gastou um tempo valioso obtendo insights sobre seus usuários; agora use esse insight
para ajudar o departamento de marketing a adaptar suas mensagens.

Apoiar
Quando seus usuários precisam de ajuda com o site, como eles a conseguem? Além da
assistência contextual que seus excelentes esforços de design de experiência do usuário se
esforçarão para fornecer, a resposta a essa pergunta também inclui treinamento e suporte ao
cliente.

Você acha que seus usuários podem responder melhor ao treinamento em sala de aula do que
ao treinamento on-line? Alguns de seus usuários ignorarão o treinamento e esperarão ter tudo o
que precisam no próprio site? O chat ao vivo é uma opção importante para seus usuários no
suporte ao cliente ou eles ficarão satisfeitos com o suporte por telefone e e-mail?

Os esforços de suporte são complicados e compreender os usuários permite que você seja
eficaz no auxílio ao suporte ao cliente e aos departamentos de treinamento.

252 CAPÍTULO 14: TRANSIÇÃO: DO DESIGN AO DESENVOLVIMENTO E ALÉM


Machine Translated by Google

Opinião da Rede
O boca a boca é o influenciador mais importante que existe. Que tipo de reputação a empresa
do seu cliente e seu site atual têm dentro dos grupos de usuários-alvo?

Mesmo que a resposta aqui seja positiva, isso não significa que nenhum esforço seja
necessário – a manutenção é sempre importante quando se trata de reputação.
Não use uma resposta positiva como desculpa para pular para a próxima seção: O esforço
envolvido na manutenção não precisa ser substancial, mas o esforço
necessário para se recuperar de uma queda na reputação pode ser surpreendente. Um
pouco de TLC pode ajudar muito, então continue lendo.

Se a resposta for negativa, então devem ser feitos esforços sérios para melhorar as
percepções. Talvez seja necessário entrar em contato com a comunidade de usuários e
identificar quem são os influenciadores, como eles preferem se comunicar e como influenciam
seu público – e então envolvê-los. Há muitas maneiras de envolver seus usuários por meio de
redes sociais e influenciar as opiniões sobre seu cliente, sua empresa e seu site. Ajude
seu cliente a identificar oportunidades para envolver essas comunidades e tentar orientá-las
em uma direção positiva.

Se todos esses três fatores estiverem presentes e você ainda notar um baixo grau de uso,
considere como e o que seus concorrentes estão fazendo para atender às necessidades
dos usuários. Como você pode diferenciar o produto ou site?

Atividades pós-lançamento
Os tempos em que vivemos são interessantes: muitas empresas estão lançando elas
mesmas — ou seus produtos — em estado “beta”. Uma versão beta
o lançamento normalmente significa que usuários reais e não filtrados serão o público-alvo
dos testes ao vivo do site para ajudar a identificar bugs, erros, falhas ou quaisquer outros
problemas. Antigamente, os betas eram normalmente oferecidos apenas para desenvolvedores,
mas agora se tornou uma prática comum abrir os betas para a comunidade de usuários
como um todo.

Durante a fase beta, é imperativo que os métodos de comunicação sejam configurados


para registrar e relatar quaisquer problemas que os usuários possam ter. Qualquer tipo de
mau funcionamento do sistema que ocorrer deverá ser registrado e disponibilizado ao projeto

ATIVIDADES PÓS-LANÇAMENTO 253


Machine Translated by Google

equipe. Também deve haver um mecanismo para permitir que os usuários relatem os problemas que

encontrarem aos membros apropriados da equipe do projeto. Se esse tipo de comunicação não acontecer – se os

designers de experiência do usuário, designers visuais e desenvolvedores não souberem o que está acontecendo

durante a fase beta, muitas vezes rigorosa e acelerada – o site poderá ser atualizado e redefinedo. aplicado

aos usuários sem grande parte da estratégia implementada.

Análise pós-lançamento
Depois de lançar seu site, uma das primeiras coisas que você deve fazer é começar a acumular dados sobre o uso

do site. A melhor fonte para isso é o arquivo de log do seu site. Infelizmente, os designers de experiência do

usuário provavelmente não estão no topo da lista para receber ou revisar essas informações, então procure
quem está

encarregado de hospedar o site e aplicar suas habilidades de negociação.

A análise do site pode fornecer algumas informações sobre os visitantes do seu site.

Entre outros aspectos, você pode entender

Quem são os novos visitantes do site

Quem são os visitantes recorrentes do site

Número de visualizações de página

Duração da visualização da página

Profundidade da página

Onde os visitantes saem do site (quais páginas)

Duração da sessão

Impressões de publicidade

Termos de pesquisa usados, resultados e pesquisas

Essas informações podem ajudá-lo a entender onde os usuários estão tendo problemas, destacando

pontos problemáticos no site. Embora a análise possa parecer seca e com números pesados, os dados e insights

ajudarão você a reunir as perguntas apropriadas ao fazer seus testes pós-lançamento.

Nota Para obter mais informações sobre análise de sites, o livro Web Analytics: An Hour a Day
(Sybex, 2007) de Avinash Kaushik é um bom lugar para começar.

254 CAPÍTULO 14: TRANSIÇÃO: DO DESIGN AO DESENVOLVIMENTO E ALÉM


Machine Translated by Google

Teste de design pós-lançamento com


Usuários (de novo, de novo)
Depois de acumular dados da análise do seu site e coletar informações do suporte ao
cliente ou de outros departamentos que interagem com os usuários, você pode começar a
compilar uma lista de perguntas para usar em outra rodada de testes de design com
usuários. Em outras palavras, use os dados coletados para criar um novo conjunto de
perguntas a serem feitas aos usuários do site e use as habilidades que você aprendeu no
Capítulo 13.

Um dos benefícios desta rodada de testes é que você tem a oportunidade de testar o
mesmo grupo de usuários com quem trabalhou anteriormente para determinar se suas
opiniões mudaram após o lançamento e maior uso do site.
Isso pode ser bastante útil: se você testar novamente o mesmo lote de usuários (ou
uma parte dele), poderá fazer novamente algumas das perguntas originais (opiniões sobre
funcionalidade, capacidade de realizar tarefas específicas e assim por diante) e analisar o
variação nas respostas ao longo do tempo.

Esse potencial de variação pode ajudá-lo a descobrir novas áreas de melhoria no site,
bem como obter alguns insights sobre a curva de aprendizado dos usuários, com base em
rodadas anteriores. Como benefício adicional, a análise das diferenças nas respostas
também pode ajudá-lo a identificar novas questões que não foram consideradas
anteriormente.

Tudo feito, certo?


Não.

Assim como começar de novo…


Através da coleta de dados analíticos e testes de projeto com dados de pesquisa, você
pode começar a compilar uma lista de melhorias e aprimoramentos que seriam benéficos
para o site. Depois de compilá-los completamente, você poderá elaborar uma nova
proposta (Capítulo 3) com base em suas recomendações. Esta proposta pode levá-lo a
um projeto totalmente novo, que pode levá-lo de volta à definição de um novo conjunto
de objetivos do projeto (Capítulo 4) e requisitos de negócios (Capítulo 5). Você pode

ASSIM COMO COMEÇAR DE NOVO… 255


Machine Translated by Google

em seguida, avance para pesquisas adicionais (Capítulo 6), criando personas


(Capítulo 7) para alvos recém-identificados, aprimorando seu SEO (Capítulo 8),
atualizando ou criando novos mapas de sites e fluxos de tarefas (Capítulo 10),
atualizando ou criando novos wireframes e anotações (Capítulo 11), lançamento
em rodadas adicionais de prototipagem (Capítulo 12) e mais testes de design com
usuários (Capítulo 13)…

Você entendeu a ideia.

Os projetos não devem morrer. Eles devem ser o trampolim para novos projetos
voltados para a melhoria contínua do design da experiência do usuário.

256 CAPÍTULO 14: TRANSIÇÃO: DO DESIGN AO DESENVOLVIMENTO E ALÉM


Machine Translated by Google

atributos
Índice comparando 90
priorizando e definindo 89–91
A Recursos da ferramenta de
caminho absoluto, usando no protótipo HTML 213 prototipagem Axure RP do 215
Site 167
reconhecimento e aprovação, inclusive nas propostas 53–
54
B
ACSI (Índice Americano de Satisfação do Cliente) 103
Site da Babyhold 118
Equilíbrio do site BabyNames 118,
atividades, planejamento 162-164
alcançando 6–7 em design UX
Uso de lápis e
Ferramenta de prototipagem Balsamiq Mockups,
papel no Caminho Adaptativo em 189–190
características de 216
Site 168
Baty, Steve 12, 95
custos e taxas adicionais, inclusive em propostas
Site de comportamento 249
50
lançamento beta, taxa de faturamento
Ferramenta de prototipagem de PDFs Adobe
Acrobat, recursos de 214–215 definida de 253–254, determinando 51

Site do Adobe Illustrator 167 black hat


definido 130–131
Site do Adobe InDesign 167 defensores,
contra chapéu branco 141-142
prioridades de 150–151, 154 diagramação de
afinidade aplicada a funcionalidade do blog, mapa do site para 166, 191
Site Sabor Azul 167
conflitos de recursos 160–161 etapas para 99–100
usando em testes de Blueprint CSS Web site 167 linguagem

usabilidade 244 abordagens ágeis corporal, interpretação em grupos focais 106

visão geral de 63-64 bot, explicou 129 sites de

recurso para 65 presença de marca descritos


11
Site da FAMÍLIA 51
exemplos de 13
Ajax, problemas com 132
características de 12–13
Alinhe os atributos alt 217 do site interativo,
metas para estrategista/
usando 139
administrador de marca de 13 a 14 anos, função de 26 a 27 anos
Índice Americano de Satisfação do Cliente (ACSI) 103
Brooks, Marcos 200–201

disponibilidade de
propriedade do edifício, sistema para 183

ferramentas analíticas de 24
Buley, Leah 189–190, 201 defensora

benefícios de 254 empresarial

anotações preocupações de 154

visão geral de 187 versus defensores do desenvolvimento e dos usuários


155
ferramentas para 189–190
função de análise de
e wireframes 186–187, 193–194, 201
negócios de 27 a 28
Site da agência de talentos Aquent 51 setas e
uso de wireframes em 188
conectores, definidos 170
requisitos de negócios 73
Site 250 da Ascend Reality Solutions
Consulte também coleta de requisitos,
Ash, Equipe 16
esclarecimento 68–69,
Ashton, Jônatas 143
coalescência 82–84,
Ask.com, pesquisas realizadas por 128 suposições,
condução de análise heurística para 70–73
inclusive nas propostas 47–48

criando planos para reuniões 78–79

ÍNDICE 257
Machine Translated by Google

requisitos de negócios (continuação) criação compensação, determinando para grupos de usuários


de planilhas para 153 definidos 68 235.241
concorrentes, comparando 61
exemplo de 83 exploração de conceito. Veja também exemplos de
reunindo responsabilidades para 75–76 reunindo projetos visuais de 222–224
partes interessadas para 76–77 para a página armadilhas potenciais de 222
inicial da Global Cruises 195–196 propósito de 221
condições, definido 170 conflito,
herança pelo defensor do gerenciamento durante a
desenvolvimento 157 priorização 158–162 conexões,
ouvir ideias para 81 perceber negligência de 171 conectores e setas,
conflitos entre 83–84 priorizar 151–152 conduzir definido 170
reuniões de forma eficaz 80– conflitos de consenso, gerenciando na
81 para wireframes 189 priorização 160
consumidores, influenciando 5
parte interessada do negócio, definida 75 contente

Buxton, projeto de lei 231 práticas recomendadas para 138–


139 importância de 135–136
C manter atualizados 138
ferramenta de calendário, protótipo funcional de criadores de conteúdo, uso de wireframes por 188
217.219
campanhas. Veja sites de campanha de marketing sistemas de gerenciamento de conteúdo, visão geral
de 133–134
classificação de
cartões classificação fechada 110 matriz de conteúdo, aplicando sistema de numeração a
173
explicou 93
sites de origem de conteúdo
classificações de grupo
descrito 11
110 visão geral de 107–108
características de 16 a 17
realizando teste de 109 processos
de 108–110 fornecendo metas para 17
tarefas associadas a 17
instruções para 109 classificações
remotas 110 usando analistas de negócios para 28
usando classificação de cartões em
clientes, uso de wireframes por 188 cloaking,
108 estrategista de conteúdo, função de 28–
explicado 131–132 visão geral da
29 design contextual, recurso para 101
clonagem
de 142 investigação contextual
explicada 92
prevenção 138 não
informações obtidas de 98
intencional 133
processo de 98–99
colagens, uso em exemplo de
microfinanças 223–224 usando diagrama de afinidade em redator 99–101,
comunicação, importância para função de 29–30
priorização 160 empresas Site da Coroflot 51
aplicando custos e taxas (adicionais), incluindo nas
análise SWOT a 61–62 comparando propostas 50
crawlers
concorrentes 61 hierarquia da cultura
da empresa de 36– capacidades de 131

37 história de 34–35 detecção via camuflagem 132


logística de 37 explicadas 129
Site Creative Commons 50

258 ÍNDICE
Machine Translated by Google

estrutura de diretórios, importância de 134 guias de


Linha tracejada D , representando condições com 170 discussão, redação para testes de usabilidade 239–241
pontos de decisão, definidos 169
Fases de definição e design, sobreposição documentação, planejamento de 162 a 164
entre 145 domínios, incluindo palavras-chave em 134 páginas

resultados, inclusive nas de entrada, visão geral de 142 pontos, uso em


propostas 48–49. diagrama de afinidade 161
Consulte também metas Dreamweaver CS4, recurso Live View em 209–210
de design de
produtos para sites de presença de conteúdo duplicado, evitando 138 URLs
marca 13 para sites de origem de conteúdo 17 dinâmicos, evitando em sistemas de
para sites de comércio eletrônico 19 gerenciamento de conteúdo 133

para aplicações de e-learning 20 para sites


de campanhas de marketing 15–16 configuração
Sites de comércio eletrônico , metas de design
10 para
para 19 microsites com foco em educação, exemplo
aplicações de redes sociais 21 para aplicações
de 15 aplicativos de e-learning, metas de design
baseadas em tarefas 18–19
para 20
erros de projeto
emoção versus lógica 7
falta de numeração de páginas 173–174
Habilitar seção do Processo PURITE 46
objetos desalinhados 172 texto
equipamento, planejamento para testes de usabilidade 239
mal colocado 172–173 conexões
Evans, testamento 122, 123, 181, 197–201
desleixadas 171 objetos espaçados
experiência, tangível versus digital 4–5
desigualmente 172 designs, melhorando
227 desenvolvedores obtendo F
protótipos a
Fahey, Christopher 249
partir de 217 uso de wireframes por 188
Favreau, Jean Marc 40
defensores do desenvolvimento
características
versus empresas e usuários
idealizando e visualizando 146–147

defensores 155 gerenciando conflitos relacionados a 160–162


mecanismo de feedback, protótipos de 219 taxas e
comunicação e acompanhamento 158
preocupações de 154 custos (adicionais), inclusive nas propostas 50

objetivos e responsabilidades de 157 herança


Finck, Nick 167
de requisitos 157–158 envolvimento de 158
Ferramenta de prototipagem Fireworks CS4, recursos de
215–216
qualidades de 156 Flash, recursos de 130–132
equipes de desenvolvimento, fornecendo feedback para
Ferramenta de prototipagem Flash e Flash Catalyst,
249
recursos do 216
ativos digitais, otimização para 138
Conteúdo Flash, incorporado em camadas
experiências digitais, design de 5 a 6 estáticas 131
prototipagens digitais. Veja também prototipagem de formato de
público para 208 discussão de grupos focais para 105–106
Editores HTML versus WYSIWYG 209–
explicado 93
214
interpretação da linguagem corporal em 106
recursos necessários para 209
moderação 107 processo
cronograma para 208
de 105–107 uso em
wireframe versus protótipos
microfinanças exemplo 223 uso 104–105
realistas 207–209
rodapé, design 196
Site da Revista Digital Web 167

ÍNDICE 259
Machine Translated by Google

links de rodapé, popularidade do link de 140


desenvolvedores front-end, função de 31 I ideias, unindo 82–84 recursos de
modelo de financiamento, aplicação para microfinanças ideação e visualização 145–147
222
Site do ilustrador 167

mapas de imagem, usando no protótipo HTML 213 tag de


G
imagem, usando no protótipo HTML 213
Garrett, Jesse James 168
Site do InDesign 167 páginas
Global Cruises, projetando a página inicial para
indexadas, separando 137–138 sites de indexação
195–201
131 loops infinitos, evitando
sistemas de gerenciamento de conteúdo
Ferramentas analíticas do Google 24
133–134
Sistema PageRank 139 diretrizes
informação, buscando 17 arquitetos
de qualidade para webmasters 142 de informação

equilíbrio com outras funções 248–249 função de


pesquisas realizadas por 128
22–23, 25
grade, usando em aplicações 172
Site 51 do Information Architecture Institute, instruções
formato
167,
de discussão em grupo para 105–106
finalizando para testes de usabilidade 239–241
explicado 93
interpretação da linguagem corporal em 106 designers de interação
moderação 107 processo equilibrando-se com outras funções 248–249 função
de 105–107 uso em de 23, 25
microfinanças exemplo 223 uso 104–105 entrevistas. Veja entrevistas com usuários

Site da iStockphoto 117


Seção de iteração do processo PURITE 46
H iterações, wireframes como exercício em 201
Hadden, Jon 217–219
design iterativo, recurso para 231 testes iterativos,
cabeçalho/navegação, projetando meta tag de
uso de protótipos para 217
195 cabeçalhos, permitindo 137 benefícios de
análise heurística para J.
coleta de requisitos 73 visão geral de 70–71 JavaScript, problemas com o site jQuery 132–133
214
justificativa para 71

etapas envolvidas na hierarquia K


72–73, impacto nos projetos da empresa Ferramenta de prototipagem Keynote, recursos de 214
36–37
chaves, incluindo em mapas de sites 175
Hinton, André 177
ferramentas de pesquisa de palavras-chave,
Hofstede, Geert 36 home
disponibilidade de 135 pesquisas orientadas por palavras-
page projetando chave,
192 projetando para comportamento de 135 palavras-
Global Cruises 195–201 projetando wireframe para chave, incluindo em domínios 134
197–200 exemplo de 194 convenções de nomenclatura para 136 usando na estrutura de URL 134–1
Knemeyer, Dirk 12
Protótipo HTML de 212 links,
popularidade de 140 L
Protótipos HTML lançou sites, análises pós-lançamento de 254 links de
detalhando o código para 213–214, verificando navegação à esquerda, protótipo para 217–218
erros de digitação em 210, criando
210–212 legendas, inclusive em mapas de sites 175

260 ÍNDICE
Machine Translated by Google

trabalho licenciado, definido 49–50 N


meta tag de texto âncora do link, explicada a nomes, proporcionando negociação de
popularidade do link 137 personas 118, arte de 250
distribuição de 139–140 opiniões de rede, impacto na adoção do usuário
explicado 139 links 253
de rodapé 140 Persona Nicolle, descrita 115-116
links cruzados no conteúdo 141 Nielsen, Jakob 71
manipulação 143 spam atributo de link nofollow, usando 140 meta
de links 143 lista de tag noindex, explicado 137
usuários participantes,
gerando 234–235 O
Live View, usando no Dreamweaver CS4 209 lógica objetivos
versus emoção 7 logística, aplicando análise SWOT para 61-62 difuso
impacto nos projetos da empresa 37 etapa logística versus sólido 58-60 importância
do teste de usabilidade 233–239 de 57-58 entradas de
Ar, Tróia 250 designers UX em 60-62 medindo 58, 60
objetos conectando
M
sites de campanha de corretamente 171 grades de contagem
marketing descritos 11 entre 172 desalinhamento de 172
exemplos de 14 espaçamento irregular de
características de 14 172 observações, fazendo
metas para mercados de para análise heurística 72-73
15 a 16 anos, construindo relacionamentos com 26 a 27 anos
Melzer, Tiago 182 Recursos da ferramenta de
Estudo de prototipagem OmniGraffle de 215

caso 115 da Messagefirst Personas Site 167


Site 219 Site do OpenOffice Draw 167
tag de meta descrição, explicada 137 meta Visão geral do site OptimalSort
palavras-chave tag 109, inclusive nas propostas 44–45 propriedade
explicada 136–137 spam e direitos, inclusive nas propostas 49–50
com 142 meta tags,
disponibilidade da metodologia 136–137,
importância de 62 microfinanças, definido
222 microsite, definido 15 Numeração de páginas P , falta de meta
tag de título de página de 173–174,
Site do Microsoft PowerPoint 167 sistema PageRank explicado 136, explicado
Site do Microsoft Visio 167 139–140 páginas. Veja
erros também clonagem de
sites 142–143 definidos 168
falta de numeração de páginas 173–174
objetos desalinhados 172 indexação separadamente pilha de
texto mal colocado 172–173 137–138 páginas, definição
conexões desleixadas 171 de 169 papel e lápis, usando para wireframes
189-190, 201
objetos espaçados desigualmente
“cultura do papel”, compreensão 37
172 abordagens modificadas, seguindo 64–65
movimento, representando 170
MSN, pesquisas realizadas por 128

ÍNDICE 261
Machine Translated by Google

prototipagem de papel 206–207 Site do PowerPoint 167


exemplo de 217–218 PR (PageRank), explicado 139–140
HTML como 209 Preparar seção de precificação do Processo 45
para conceitos de navegação 218 do PURITE, estruturação para projetos 51–52
observação passiva, definiu 99 processo de priorização
caminhos, identificando nos fluxos de aplicado a testes de usabilidade 244–245
tarefas 180 cronogramas de balanceamento de funções
pagamento, inclusive nas propostas 52–53 em 154 facilitação 150–
lápis e papel, usando para wireframes 154 importância da comunicação para 160
189-190, 201
gerenciamento de conflitos durante 158–162
pessoas fluxo de processo, exemplo de 181–182
idade de 118 produtos, sucesso de 5.
anos biografia de 119 Veja também entregas
estudo de caso 115 projeto aborda ágil 63–
definido 113 64 importância
nível de escolaridade de 120 de 66 incluindo nas
pontos de entrada ou gatilho para clientes propostas 45–47 modificadas 64–65
120 encontrar informações para
114 informações incluídas em 116 passos para 62–63
localização para 119 cachoeira 63
maximizando o uso de 125 direção do projeto, falta de alinhamento no
nível de conforto móvel de 121 gerenciamento de projetos 160, uso de wireframes
motivações para usar clientes, marcas ou em 188
projetos 121 objetivos do projeto
nomeando 118 aplicando análise SWOT para 61–62
ocupação de 119 difuso versus sólido 58–60
atividades offline de 120 importância de 57–58
atividades on-line de 120 contribuições de designers de UX em 60–62
visão geral da planilha mestre para 122 medindo 58, 60 visão
citação pessoal de 120 fotos de geral do projeto, inclusive nas
117–118 justificativa propostas 44–45
para 113–114 preços do projeto, inclusive nas
salário ou faixa salarial de 120 nível propostas 51–52
de conforto social de 121 requisitos do projeto, etapas envolvidas em 69
público-alvo 123 público-alvo patrocinador do projeto, equipe de
grupo 124 público-alvo individual 124 projeto definida 75, termos do
nível de conforto técnico 121 projeto definidos 75, diagrama de 80
práticas
tipos de 113 recomendadas de projetos
objetivos de usuário para 191 impacto da história da empresa em
de 121 fontes de fotos, obtendo para personas 117 34–35 fluxo de processo de
Post-its, usando em diagramação 181–182 componentes da
de afinidade 161 testes proposta reconhecimento e aprovação 53 –54
de design pós-lançamento 255. custos e taxas adicionais 50
Veja também testes; etapas de teste de premissas 47–48 resultados
usabilidade distância de potência, 48–49
ferramenta de prototipagem PowerPoint definida 36, propriedade e direitos 49–50
recursos de 214
cronograma de pagamento 52–53

262 ÍNDICE
Machine Translated by Google

abordagem do projeto 45–47 visão garantia de qualidade, uso de wireframes para 188
geral do projeto 44–45 precificação pesquisas quantitativas, aplicação em testes de
do projeto 51–52 histórico de usabilidade 227–229
revisões 44 escopo do questionários, incluindo em guias de discussão
trabalho 47 declarações 241 perguntas.
de trabalho 54–55 Consulte também rastreadores para

página de título 42–43 planejamento de atividades 162–164

propostas, importância de 40–41 para remuneração de grupos de


usuários 235–236
acessibilidade
para planejamento de documentação 162–164
de protótipos de 219
para grupos focais 105 para
aplicações de 219 da
storyboards 148 para pesquisas
ferramenta de calendário 217, 219
102 para testes de
alterando wireframes para 210
usabilidade 242 para entrevistas
conclusão de 219 criação
com usuários 97
com editores WYSIWYG 209–214
para satisfação do usuário 233

exemplos de 217–219 como


mecanismo de feedback 219 R
Site do gerador de nomes aleatórios 118
metas de 219 para
recomendações, criando para usabilidade
testes iterativos 217 obtenção
testando 245–246 etapa
de desenvolvedores 217 wireframes
de recrutamento do teste de
versus realistas 207–209
usabilidade 233–239
prototipagem. Veja também as melhores práticas
redirecionamentos, configurando
de prototipagem digital para 205–206
o caminho relativo 135, usando no protótipo HTML 213
visão geral de 205
Seção de renderização do processo PURITE 46
papel 206–207
requisitos, definidos 66 coleta de
ferramentas de prototipagem
requisitos, encurtamento 74
PDFs do Adobe Acrobat 214–215
Consulte também processo de requisitos
Axure RP 215
de negócios, incentivando 74 pesquisas, planejando
Modelos Balsamiq 216 testes de usabilidade 229–233
Fogos de artifício CS4 215–216

Flash e Catalisador Flash 216 técnicas de pesquisa


Palestra 214 classificação de cartões 93, 107–
OmniGraffle 215 110 investigação contextual 92, 98–101
PowerPoint 214 grupos focais 93, 104–107 personas
Visio 215 121 pesquisas 92,
Processo PURITO 45–46 101–104 testes de usabilidade
93, 110–111 entrevistas com usuários
Q 92, 95–97 recursos. Veja também
pesquisa qualitativa, aplicada à usabilidade recursos do site
testando 227–229 testes
diagramação de afinidade 161
qualitativos de usabilidade, coletando
abordagens ágeis 65 análises
informações para 231–232
254 linguagem
documentos de garantia de qualidade, aplicando
corporal 106 design
sistema de numeração a 174
contextual 101
equipe de garantia de qualidade
alternativa a 250 Google 128
HTML (linguagem de marcação de hipertexto)
participando em 249
214

ÍNDICE 263
Machine Translated by Google

recursos (continuação) omitindo a estrutura de numeração de 173


design iterativo 231 negociação
250 abordagens de exemplo simples de 174 versus

prototipagem 217 aplicações de redes fluxo de tarefas 166

sociais 20 ferramentas 167 usando 138


usando classificação de cartões para
teste de usabilidade 231 108 usando fluxos de tarefas com
responsabilidades, delineando o histórico tipo de site 178, identificando 11
de 75 a 76 revisões, incluindo nas propostas 44 funções sites. Veja também as
páginas que
balanceamento no processo de indexam 131 escrevendo texto
priorização 154 no modelo 29–30 de seis páginas,
combinação e comutação 156 usando 190 site do Slingthought 217
gerenciamento 248–249 aplicativos de redes sociais
descrito 20

metas de design para 21


Tamanho da amostra S , escopo O bebê popular da Administração da Previdência Social
de trabalho definido 227, incluindo nas propostas 47 Nomes 118

rastreadores, usando em testes de Inventário de medição de usabilidade de software


usabilidade 236–239. (SUMI) 103
Veja também questões SOW (declaração de trabalho), conteúdo de 54–
de navegação com script, problemas 55
com 132–133 espaço, planejamento para testes de usabilidade 239
comportamento de pesquisa, compreensão 135 spam com meta palavras-chave 142 Spencer,
Iniciante em otimização de mecanismos de pesquisa Donna 17, 109 spider, explicado
Guia 129
129 Spool, Jared 125 SRA
motores de busca, evolução de 129 resultados International Inc. Site 182
de busca, influenciando 142 buscas por
mês, estatística relacionada a 128 partes interessadas

definido 75
cabeçalhos de seção, permitindo 137
reunindo 76–77 ouvindo
Seiden, Josh 113
81 camadas estáticas,
SEO (otimização de mecanismos de pesquisa)
incorporando conteúdo Flash em 131
definido 127
impacto da UX em 134 pontos de adesivo, usando diagrama
importância dos recursos 127– de afinidade 161 Site
128 para 129 Stock.XCHNG 117
Métodos de SEO, chapéu branco versus chapéu storyboard, processo de 147–150 pontos fortes
preto 141–142
e fracos, compreensão 61
Especialistas em SEO, uso de wireframes por 188
aprovação e reconhecimento, incluindo nas propostas SUMI (Medição de Usabilidade de Software
53–54 análises de sites, Inventário) 103
ferramentas para 24 mapas de sites rede de apoio, edifício 32–33.
exemplos Veja também funções de design UX

avançados de 175–176 para funcionalidade pesquisas


de blog 166, 191 quebrando o molde de explicaram 92 visão
177 definido 166 geral de 101
processo de 102–104 versus
entrevistas com usuários 102

264 ÍNDICE
Machine Translated by Google

SWFobject, usando 131 raias, Caminhos de URL, evitando em sistemas de gerenciamento


exemplo de 182–184 de conteúdo 133
Estruturas de URL
Análise SWOT, aplicada aos objetivos do projeto
61–62 evitando em sistemas de gerenciamento de
conteúdo 134 usando
palavras-chave em 134–135
Etiquetas T. Consulte Testando usabilidade
metatags para usuários-alvo, descrevendo 113. escolhendo a abordagem para 227–228 explicou
Veja também usuários
a visão geral 93 de
fluxos de tarefas 110–111
aplicando sistema de numeração a 173 criando 178 etapas de teste de usabilidade 236–239.
exemplos de 178– Consulte também testes de design pós-
180 visão geral de 166
lançamento; testando, analisando e
apresentando resultados 243–245
fluxo do processo 181–182 versus
escolher a abordagem 227–228 criar
mapas do local 166 raias 182–
184 recomendações 245–246 avaliar 250 facilitar 242–243
planejar pesquisas 229–
usando com mapas do site 178
233 recrutamento e logística
sites de aplicativos baseados em tarefas
descrito 11 233–239 escrever guias de discussão
239–241 Usabilidade.gov 240 impacto da adoção
recursos e metas para 18 a 19 anos usando
pelo usuário das opiniões da rede em 253 influências
analistas de negócios para 28
Tatum, Keith 217-218 em 251–252

Taylor, Dave 214 estrutura


técnica, construtor de 31

modelos, usando wireframes 190 tensão, equilibrando


vantagem pessoal de 252 fornecer apoio
entre defensores 154–162
para 252 defesa do usuário assumindo

rescisão, usando materiais de teste em testes de usabilidade papel para 150-151

239, escrevendo para testes de usabilidade 241 construindo rede de 32-33 versus defesa
de negócios e desenvolvimento 155
Seção de teste do Processo PURITE 46 preocupações 154
testes, usabilidade versus aceitação
do usuário 226.
Consulte também testes de design pós-lançamento; atributos do usuário
etapas de teste de usabilidade
comparando 90
texto
priorizando e definindo o comportamento do
finalizando para testes de usuário 89–91, ganhando contexto para 227 experiência
usabilidade 239–241 mau
do usuário (UX). Veja UX (experiência do
posicionamento de 172–173 escrita em usuário)
sites 29–30 página de título, grupos de
incluindo nas propostas 42–43 tag de título, usando no usuários definindo
protótipo HTML 213 ferramentas, disponibilidade de 167– 87 atributos de listagem de 87 a 89
168 Site de engenharia de interface do usuário 125 entrevistas
com usuários
EM
explicado 92 dicas
UAT (teste de aceitação do usuário), objetivo de 226
de entrevista 97 processo de
95–96 versus pesquisas 102
Entenda a seção do Processo PURITE 45

ÍNDICE 265
Machine Translated by Google

modelos de usuário, projetados a partir de 91 Ferramenta de prototipagem do Visio, recursos do 215


pesquisas de usuários Site do Visio 167
atividades 93–94 equipe de design visual, fornecendo feedback para 249
completando 111
planejamento 94 designers visuais

etapas para conduzir 86 técnicas envolvidos na criação de wireframes 203 função de

92 plano de pesquisa 30–31

de usuário, desenvolvendo 229–233 pesquisador de uso de wireframes por 188 designs


usuário, função de 23–25 visuais. Veja também exploração de conceito aplicando
satisfação do usuário sistema de numeração a 174 mock-ups 224 de

determinação de 233 wireframes 200–201


ferramentas de medição 103
declarações do usuário Condições de definições do vocabulário
visual 170
categorização em testes de usabilidade 245
conectores e setas 170
avaliando o sucesso
de 233 usuários, determinando 232–233 usuários. ponto de decisão 169

Consulte também usuários-alvo páginas 168–169 pilha

escolhendo o número para testes de usabilidade de páginas 169


229 visualização e criação de recursos 145–147 vocabulário,
identificando tipos de 88-89 uso de compartilhamento para requisitos de
wireframes por 188 aspectos digitais negócios 80–81

de UX (experiência do
EM
usuário) de 6 impactos no
SEO 134 design de UX, WAMMI (Análise e Medição de Sites
Inventário) 103
definiu 3 funções de design de
Warfel, Todd Zaki 115, 124, 217, 219 abordagem
UX. Consulte também estrategista/administrador de
em cascata modificada
marca de rede de suporte 26–27 analista de
65
negócios 27–28 escolhendo 31
fases de 63
estrategista de
Webmasters, diretrizes de qualidade para 142
conteúdo 28–29 redator 29–30
Ajuda para webmasters/proprietários de sites 129
desenvolvedor front-end 31
Análise do site e inventário de medição
arquiteto de informações 22–23
(WAMMI) 103
Recursos do site 28.
designer de interação 23 Veja também recursos
responsabilidades de 25 ACSI (American Customer Satisfaction
pesquisador usuário 23–24 Índice) 103
designer visual 30-31 Caminho Adaptativo 168
Designers de experiência do usuário Adobe Ilustrador 167
equilíbrio com outras funções 248–249 empatia de Adobe InDesign 167
156 contribuições sobre FAMÍLIA 51
os objetivos do projeto 60–62 organizações para Alinhar Interativo 217
7–8 função na priorização 151 Agência de talentos Aquent 51
características de 6–7 Ascend Soluções de Realidade 250
Axure RP Pro 167

Equipe bebê 118


Nomes de bebês 118
Validação V , buscando 191 propostas Comportamento 249
de valor antecipadas, apresentando 15

266 ÍNDICE
Machine Translated by Google

Sabor Azul 167 Engenharia de interface do usuário 125


Projeto CSS 167 ferramentas de medição de satisfação do
“Experiência da Marca e a Web”, 12 usuário 103

Brooks, Marcos 201 Abordagens de design UX 24


planilha de classificação de cartões 109–110 Organizações UX 8
Coroflot51 Pesquisa UX 95
Creative Commons 50 Visio 167

Digital Web Magazine 167 porta WAMMI (Análise de Sites e


páginas 142 Inventário de Medição) 103

Evans, testamento 181 Ajuda para webmasters/proprietários de sites 129


WebSort 109
Código do Google para encontrar conteúdo estático
131 WebTendências 24

Hadden, Jon 219 análise Yahoo! Site da Biblioteca de Interface 214 Site
heurística 71 WebSort 109

Prototipagem HTML 214 Site WebTrends 24


Ilustrador 167 chapéu branco versus chapéu preto 141-142

mapas de imagem 213–214 quadro branco, storyboard em 149 wireframes


InDesign 167
Instituto de Arquitetura da Informação 51, e anotações 186–187, 193–194, 201
167
busca de informações 17 jQuery aplicar sistema de numeração a 173 abordagens
214 ferramenta em direção a 201 mudar para

de pesquisa de palavras-chave 135 protótipos 210 comparar e contrastar


sites de campanha de marketing 16 200 criar 189, 198–199 projetar para a
Mensagem primeiro 219 página inicial 197–200 como
PowerPoint 167 exercícios em iterações 201
Microsoft Visio 167
nomes para personas 118 obtendo informações de clientes para a visão geral
OmniGraffle 167 de 192–193 de 186–187

OpenOffice Sorteio 167 apresentando 202–203 versus


OptimalSort 109 tipos protótipos realistas 207–209 começando 192–
de persona 113 recursos 193, 201 como “dispositivo de
fotográficos 117 pensamento”, 198 ferramentas
PowerPoint 167 para 189–190
Gerador de nomes aleatórios 118 usuários de 188

Iniciante em otimização de mecanismos de pesquisa design visual de 200–201


Guia 129 trabalho contratado, fluxo de
SEO (otimização de mecanismos de pesquisa) 143 trabalho definido 49, storyboard 149
Pensamento de estilingue 217 planilhas, criação para requisitos de
Popular da Administração da Segurança Social negócios 153
Nomes de bebês 118 Editores WYSIWYG, criando protótipos com 209–214
SRA International Inc.
SUMI (Medição de Software
Inventário) 103 Y
ferramentas 167 Yahoo, pesquisas realizadas por 128 Yahoo!
scripts de teste de usabilidade 240 Site da Biblioteca de Interface 214
Usabilidade.gov 240

ÍNDICE 267
Machine Translated by Google

Obtenha acesso online


gratuito a este livro por 45 dias!
E tenha acesso a milhares de outros inscrevendo-se
para uma avaliação gratuita do Safari Books Online!

Com a compra deste livro você tem acesso on-line instantâneo


e pesquisável por 45 dias no Safari Books Online!
E enquanto estiver lá, não deixe de conferir a biblioteca digital sob
demanda do Safari Books Online e sua oferta de teste gratuito (um
processo de inscrição separado). Os assinantes do Safari Books Online
têm acesso a milhares de informações técnicas, criativas e de negócios
livros, vídeos instrutivos e artigos de todo o mundo

principais editoras.

Basta visitar www.peachpit.com/safarienabled e inserir o código


FJGSLZG para experimentar hoje mesmo.

Você também pode gostar