Elements of User Experience - Traduzido PDF

27/09/2016
Semttulo
Pgina1
Pgina2
OSELEMENTOS
DO
EXPERINCIADEUSURIO
SEGUNDAEDIO
PROJETOUSER CENTERED
PARAAWEBEALM
Escritoeilustradopor
JesseJamesGarrett
pgina3
https://translate.googleusercontent.com/translate_f
1/153
27/09/2016
Semttulo
OselementosdaExperinciadoUsurio:DesignCentradonoUsurioparaaWebealm,
Segundaedio
JesseJamesGarrett
NewRiders1249EighthStreet
Berkeley,CA94710
510/5242178
510/5242221(fax)
EncontrenosnaWebem:www.newriders.com
Parareportarerros,porfavorenvieumanotaparaerrata@peachpit.com
NewRidersumamarcadaPeachpit,umadivisodaPearsonEducation.
Copyright2011porJesseJamesGarrett
ProjetodoEditor:MichaelJ.Nolan
EditordeDesenvolvimento:RoseWeisburd
EditordeProduo:TraceyCroom
EditordeTexto:DougAdrianson
Revisor:GretchenDykstra
Indexador:ValeriePerry
CoverDesigner:ArenHowellStraiger
Designerdeinteriores:KimScott
Compositor:KimScott
AvisodeDireitos
Todososdireitosreservados.Nenhumapartedestelivropodeserreproduzidaoutransmitidadequalquerformapor
qualquermeio,eletrnico,mecnico,fotocpia,gravaoououtro,semaprvia
permissoporescritodoeditor.Parainformaessobrecomoobterapermissoparareimpressese
trechos,entreemcontatopermissions@peachpit.com.
AvisodeResponsabilidade
Asinformaescontidasnestelivrodistribudo"talcomoest"semgarantia.enquantotodos
precauotenhasidotomadanapreparaodolivro,nemoautornemPeachpitdeve
temqualquerresponsabilidadeperantequalquerpessoaouentidadecomrespeitoaqualquerperdaoudanocausadooualegado
asercausadosdiretaouindiretamentepelasinstruescontidasnestelivrooupelocomputador
softwareehardwareprodutosdescritosnamesma.
marcascomerciais
Muitasdasdesignaesusadasporfabricantesevendedoresparadistinguirseusprodutosso
marcasregistradas.Ondeessasdesignaesaparecemnestelivro,ePeachpitestavaciente
deumpedidodemarcaregistrada,asdesignaesaparecemcomosolicitadopelotitulardamarca.
Todososoutrosnomesdeprodutoseserviosidentificadosaolongodestelivrosousadosemeditorial
nicaeparaobenefciodetaisempresas,semintenodeviolaodamoda
marcacomercial.Semasuautilizaoouousodequalquernomecomercial,destinadosatransmitirendossoou
outraafiliaocomestelivro.
ISBN13:9780321683687
ISBN10:0321683684
987654321
ImpressoeencadernadonosEstadosUnidosdaAmrica
page4
Paraminhaesposa,RebeccaSangueGarrett,
2/153
27/09/2016
Semttulo
quefaztodasascoisaspossveis.
page5
iv
OSELEMENTOSdaexperinciadousurio
ndice
CAPTULO1
ExperinciadoUsurioeporquepreciso
misriascotidianas
2
3
UserExperienceApresentando
4
DoProdutoDesigndeExperinciadoUsurioProjeto 7
Projetando(para)Experincia:UseMatters
8
ExperinciadousurioedaWeb
Boaexperinciadousurioumbomnegcio
Cuidandodeseususurios
CAPTULO2
ConheaosElements
Oscincoavies
Oplanodasuperfcie
9
12
17
18
19
20
3/153
27/09/2016
Semttulo
OesqueletoPlane
OplanoEstrutura
OPlanombito
OPlanodeEstratgia
Construodebaixoparacima
Adualidadebsica
20
20
21
21
21
25
Oselementosdaexperinciadousurio
OPlanodeEstratgia
OPlanombito
OplanoEstrutura
OesqueletoPlane
Oplanodasuperfcie
Usandooselementos
28
28
29
30
30
30
31
page6
CAPTULO3
OPlanodeEstratgia
Objectivosdeprodutosenecessidadesdousurio
34
DefiniodaEstratgia
Objetivosdoproduto
objetivosdenegcio
Identidadedamarca
SucessoMetrics
Asnecessidadesdoutilizador
Segmentaodousurio
UsabilidadeeusurioResearch
criandoPersonas
36
37
37
38
39
42
42
46
49
PapisdaequipeeProcesso
52
CAPTULO4
OPlanombito
Especificaesfuncionaiserequisitosdecontedo
56
Definiodombito
Razo#1:Entovocsabeo
Vocestconstruindo
Razo#2:Entovocsabeo
VocnoConstruindo
Funcionalidadeecontedo
58
definiodeRequisitos
Especificaesfuncionais
Escreverparabaixo
Requisitoscontedo
65
68
69
71
59
60
61
4/153
27/09/2016
Semttulo
priorizandoRequisitos
74
page7
vi
CAPTULO5
OplanoEstrutura
InteractionDesigneArquiteturadeInformao
DefinindoaEstrutura
Designdeinterao
Modelosconceituais
Tratamentodeerros
Arquiteturadeinformao
contedoestruturao
abordagensdearquitetura
organizarPrincpios
LinguagemeMetadados
CAPTULO6
OesqueletoPlane
InterfaceDesign,Designerdenavegao,
eDesigndaInformao
78
80
81
83
86
88
89
92
96
98
101
106
Definindooesqueleto
108
ConvenoeMetfora
designdeInterface
designdenavegao
110
114
118
designdainformao
wayfinding
124
127
wireframes
128
page8
5/153
27/09/2016
Semttulo
CAPTULO7
Oplanodasuperfcie
projetosensorial
vii
132
Quedefinemasuperfcie
MakingSensedosSentidos
Cheiroesabor
Tocar
Audio
Viso
134
135
135
135
136
136
SigaoEye
Contrasteeuniformidade
Coernciainternaeexterna
Paletasdecoresetipografia
ProjetoCompseGuiasdeEstilo
137
139
143
145
148
CAPTULO8
OElementsAplicada
Fazendoasperguntascertas
AMarathoneaSprint
ndice
152
157
159
164
page9
viii
Sobreoautor
JesseJamesGarrettumdosfundadoresdaAdaptivePath,uma
consultoriaexperinciadousuriocomsedeemSanFrancisco.Desde1995,
JessetemtrabalhadoemprojetosWebparaempresascomoaAT&T,
6/153
27/09/2016
Semttulo
Intel,Boeing,Motorola,HewlettPackard,ePblicaNacional
Rdio.Suascontribuiesparaocampodaexperinciadousurioincluira
Fotopor:ColinPeckVocabulriovisual,umsistemadenotaoabertoparaarquiinformaes
documentaotecturequeagorausadopororganizaesdetodo
omundo.Seusitepessoalnawww.jjg.netumdosWeb
amaioriadosdestinosmaispopularesparaosrecursosdaarquiteturadainformao,
eeleumoradorfreqenteemarquiteturadeinformaoedeusurio
questesexperincia.
page10
ix
Agradecimentosparaasegundaedio
MichaelNolanpassouanoscutucandomeafazerumasegundaedio.Dele
persistnciaeseuengenhonafinalmentechegandocomumaofertaqueeu
nopodiadeixarpassarsoasrazesqueexisteemtudo.
Nonovospilotos,aequipedeRoseWeisburd,TraceyCroom,eKim
Scottmemantevenocaminhocerto.NancyDavis,CharleneWill,HilalSala,e
MimiVitettaajudaramafazerascoisasvo.GraastambmaSamantha
BaileyeKarlrpidoparaoseuapoio.
Minhaesposa,RebeccaSangueGarrett,continuaaseromeuprimeiro,ltimoemais
confiveleditor,conselheiroeconfidente.
Novasadiesaopartituramusical,destavezforamJapo
bolos,mono,Maserati,Tarentel,sonopessoas,cdigosnas
Nuvens,e(especialmente)ExplosionsintheSky.Agradecimentoespecial
7/153
27/09/2016
Semttulo
paraSteveScarboroughdaMaseratiparaorientaomusical.
Agradecimentosparaaprimeiraedio
Nodeixequeonmerodenomesnacapaenganareletemummonte
depessoasparafazerumlivroacontecer.
Primeiro,tenhodeagradeceraosmeusparceirosnaAdaptivePath:PistaBecker,
JaniceFraser,MikeKuniavsky,PeterMerholz,JeffreyVeen,e
IndiYoung.atravsdasuaindulgnciaqueeueracapazdeassumir
esteprojectoemtudo.
Entohtodosemnovospilotos,particularmenteMichaelNolan,
KarenWhitehouse,VictoriaElzey,DeborahHittelShoaf,John
Rahm,eJakeMcFarland.Suaorientaofoiessencialparaesta
processo.
page11
KimScotteArenHowellemprestouumolhoafiadoeatenoaodetalhe
paraoprojetodestelivro.Suapacinciacomsugestesdo
autorfoiespecialmentelouvvel.
MollyWrightSteensoneDavidHofferfornecidainestimvel
introspecoemsuarevisodomeumanuscrito.Cadaautordeveser
sortudo.
JessMcMullinacabouporseromeucrticomaisduroemmuitosaspectos,
eestelivroimensamentemelhoradapelasuainfluncia.
Graastambmsodevidosaosautoresmaisexperientesquederam
meconselhossobrecomolidarcomumprojetocomoesteemanteromeu
sanidade:JeffreyVeen(denovo),MikeKuniavsky(denovo),SteveKrug,
JunhoCohen,NathanShedroff,LouisRosenfeld,PeterMorville,e
(especialmente)SteveChampeon.
Outrosqueseofereceramvaliosassugestesousimplesmentebonsmoral
apoioincluiuLisaChan,GeorgeOlsen,ChristinaWodtke,
JessamynOcidental,SamanthaBailey,EricScheid,MichaelAngeles,
JavierVelasco,AntonioVolpon,VukCosic,ThierryGoulet,e
DennisWoudt.Elespensadoemcoisasqueeunofiz,equefaz
lhesomelhortipodecolegas.
Acompanhamentomusicalparaoprocessodeescritafoifornecidopor
ManorAstroman?,PellMell,Mermen,DirtyThree,TransAm,
Tortoise,TuringMachine,DonCaballero,Mogwai,Ui,sombrio
8/153
27/09/2016
Semttulo
Homensemumplanetasombrio,faaSayPense,e(especialmente)
GodspeedYouBlackEmperor!
page12
XI
Finalmente,htrspessoassemosquaisestelivro
nuncaaconteceu:DinahSanders,queemumafestaumamorna
Texasnoiteinsistiuquenoeraalgumqueeutinhadecumprirminhaesposa,
RebeccaSangue,quemefazmaisforteemaissbioemtodosossentidos
eDanielGrassam,semcujaamizade,incentivo,
eapoioeunopoderiaterencontradoomeucaminhoparaestenegcioem
todos.Obrigado.
9/153
27/09/2016
Semttulo
page13
Estapginafoiintencionalmentedeixadaembranco
page14
10/153
27/09/2016
Semttulo
Introduo
Segundaedio
Vamosdiretoaoponto:asegundaedio.Oquediferente?
Aprincipaldiferenaentreestaedioeaprimeiraqueeste
livrojnoapenassobreossites.Sim,amaioriadosexemplosso
AindaWebrelacionados,masnogeral,ostemas,conceitoseprincpios
aplicamaosprodutoseserviosdetodosostipos.
Hduasrazesparaisso,tantoquetemavercomoqueestacon
teceuaolongodosltimosdezanos.UmdelesoqueaconteceucomElements,
eumoqueaconteceucomaprpriaexperinciadousurio.
Aolongodosanos,tenhoouvidode(ououviufalarsobre)aspessoasquetm
aplicaramomodeloElementsaosprodutosquenotmnadaavercom
ateia.Emalgunscasos,elesforamosWebdesignersconvidadosarecebera
algonovo,comoumaaplicaomvel.Emoutroscasos,eleseram
osdesignersdeoutrostiposdeprodutosquedealgumaformamedeparei
Elementoseviuumaconexocomseuprpriotrabalho.
page15
xiv
INTRODUO
Enquantoisso,ocampodaexperinciadousurioampliouseushorizontes.
Profissionaisdeagorafalarregularmentesobreoimpactoeovalordeutilizador
designdeexperinciaemreasmuitoalmdombitolimitadodo
Weboumesmodetelabaseadaemaplicaesinteractivasquedominaram
aconversadevoltaquandoestelivrofoiescrito.
Estanovaediodolivrotemumasemelhantevisoampla.Ateia
aindacentralparaolivro,seapenasdereconhecerasrazesdomodelo
nessemeio.Masestelivronorequerconhecimentodeuminsider
bordadecomoodesenvolvimentoWebaconteceporissomesmoquevocnocria
comeusitesdaWeb,vocdevesercapazdevercomoaplicaressasidiasem
oseuprpriotrabalho.
Apesardetudoisso,aquelesdevocsqueleramaprimeiraediodeve
tercerteza:Estanoumareinvenoradical.umbrunimentoe
11/153
27/09/2016
Semttulo
refinamentodomodelofamiliarElementsvocsabe(eHope
totalmenteama),comasmesmasideiascentraisefilosofiaintacta.o
pequenascoisasmudam,masosgrandesrealmentenosei
Continuogratificadoehumilhadoporondeaspessoastmtomado
Elementos.Eunopossoesperarparaveroqueaconteceaseguir!
JesseJamesGarrett
novembro2010
page16
Introduoa
PrimeiraEdio
Estenoumlivrodeinstrues.Hmuitos,muitoslivroslfora
queexplicamcomoossitessotomadas.Estenoumdeles.
Estenoumlivrosobretecnologia.Nohumanicalinhade
cdigoaserencontradaentreestastampas.
Estenoumlivroderespostas.Emvezdisso,estelivrosobrepediro
perguntascertas.
Estelivrovailhedizeroquevocprecisasaberantesdeirler
essesoutroslivros.Sevocprecisardeumaimagemgrande,sevocprecisardeCompreenso
resistiraocontextoparaasdecisesqueaexperinciadousuriopraticantes
nersfazer,estelivroparavoc.
12/153
27/09/2016
Semttulo
Estelivrofoiconcebidoparaserlidofacilmenteemapenasalgumashoras.Sevocsso
umrecmchegadoaomundodaexperinciadousurio,talvezvocum
executivoresponsvelpelacontrataodeumaequipedeexperinciadousurio,outalvez
vocumescritoroudesignerapenasencontraroseucaminhoparaestecampopresente
livrovailhedarabasenecessria.Sevocjestfamiliarizao
iarcomosmtodosepreocupaesdocampodaexperinciadousurio,
page17
xvi
INTRODUO
estelivrovaiajudloacomuniclasdeformamaiseficazao
aspessoascomquemtrabalha.
AhistriaportrsdoLivro
Porquemeperguntammuitosobreisso,aquiestahistriadecomooelemento
mentosdaexperinciadousurioveioaser.
Nofinalde1999,torneimeoprimeiroarquitetodeinformaocontratadopara
umaconsultoriadedesignWebdelongadata.Demuitasmaneiras,euestava
responsvelpordefiniraminhaposioeeducaraspessoastanto
sobreoqueeufiz,ecomoeleseencaixacomoqueelesfizeram.Inicialmente,
elesforam,talvez,cautelososeumpoucocuidadoso,maslogoeleschegarama
reconhecerqueeuestavalparafazerseutrabalhomaisfcil,nomais,e
queaminhapresenanosignificavaasuaautoridadefoidiminuda.
Aomesmotempo,euestavacompilandoumacoleopessoaldelinha
materialrelacionadoaomeutrabalho.(Esteacabariaporencontraroseucaminho
paraaWebcomominhapginaarquiteturarecursosinformaesem
www.jjg.net/ia/.)Enquantoeuestavafazendoestapesquisa,euestavacontinuamente
frustradoscomautilizaoarbitrriaealeatriadediferentes
termosparaosconceitosbsicosnocampo.Oqueumafontechamada
designdeinformaopareciaseromesmoqueoutrachamada
arquiteturadainformao.Umterceirotudorolouemconjuntosob
designdeinterface.
Aolongodofinalde1999eJaneirode2000,euluteiparachegar
emumconjuntodeautoconsistentededefiniesparaestaspreocupaeseencontraruma
maneiradeexpressarasrelaesentreeles.Maseuestavaocupadocom
realpagandotrabalho,bemcomo,eomodeloqueeuestavatentandoformular
noestavarealmentetrabalhandoforadequalquermaneiraassimatofinaldejaneiroeutinha
desistidodetodaaidia.
13/153
27/09/2016
Semttulo
page18
xvii
IssoMaroIviajouparaAustin,Texas,paraoSulanual
InteractiveFestivalSudoeste.Foiumaenvolventeepensamento
provocandosemanaduranteaqualeunoconseguidormirmuito,ocon
cronogramadeatividadesdiurnasenoturnasdeconfernciacomeaaseassemelharaum
maratonadepoisdeumpardedias.
Nofinaldasemana,comoeuandeiatravsdoterminaldo
aeroportoemAustinpreparandoparaembarcarnoaviodevoltaparaSanFran
cisco,abruptamentesurgiunaminhacabea:amatriztridimensional
quecapturoutodasasminhasideias.Espereipacientementeatnsembarcamos
oavio.Assimquechegueiaomeuassento,euretireiumcadernoe
esboadotudoparafora.
ApsomeuregressoaSanFrancisco,euestavaquasequeimediatamentecolocouse
comumacabeafriaenervante.Passeicercadeumasemanadeslizandoparadentroe
foradeumdelriofebril.Quandosentiparticularmentelcido,eutrabalheiem
transformandomeuesboonotebookemumdiagramaconcludoqueseencaixam
ordenadamentesobreumafolhadetamanhocartadepapel.Chameilhe"TheElementsof
Experinciadousurio."Maistardeeuiriaouvirsobrecomo,paramuitaspessoas,
essettuloevocoumemriasdetabelasperidicaseStrunkebranco.
Infelizmente,nenhumadessasassociaeseraemminhamentequandoeu
escolheuessettuloIescolheuelementosforadeumaenciclopdiaparasubstituiro
componentesmaisdifceisetcnicossom.
Em30demaro,euposteioprodutofinalnaWeb.(Eleaindaestl
podeencontrarodiagramaoriginalemwww.jjg.net/ia/elements.
pdf.)Odiagramacomeouareceberalgumaateno,emprimeirolugardePeter
MerholzeJeffreyVeen,quemaistardesetornariameusparceirosno
AdaptivePath.Logodepois,faleicommaispessoassobreissono
primeirainformaoSummitArchitecture.Eventualmenteeucomeceiaaudio
odepessoasdetodoomundosobrecomoeleshaviamusadoo
page19
xviii
INTRODUO
diagramaparaeducarosseuscolegasdetrabalhoedarassuasorganizaes
umvocabulriocomumparadiscutirestasquestes.
14/153
27/09/2016
Semttulo
Noanoseguinteelefoilanado,"TheElementsofUsuriorincia
rincia"foibaixadosdomeusitemaisde20.000vezes.Eu
comeouaouvirsobrecomoeleestavasendousadoemgrandesorganizaes
epequenosgruposdedesenvolvimentodaWebparaajudlosatrabalharecomu
nicardeformamaiseficaz.Porestaaltura,euestavacomeandoaformular
aidiaparaumlivroqueiriaatenderaessanecessidademelhordoqueumnico
folhadepapelpodia.
OutraMarochegou,emaisumavezeuestavaemAustin
paraSouthbySouthwest.LeuconheciMichaelNolandenovospilotos
Apublicaoedisselheaminhaideia.Eleestavaentusiasmado,e
Felizmente,seuschefesacabouporserassim.
Assim,tantoporsortecomopelainteno,estelivroencontrouseucaminhopara
suasmos.Esperoqueoquevocfazcomasideiasapresentadasaqui
toesclarecedoregratificanteparavoccomocoloclosjuntos
nestelivrotemsidoparamim.
JesseJamesGarrett
jul2002
page20
15/153
27/09/2016
Semttulo
page21
1
captulo
Experinciadeusurio
eporque
matria
16/153
27/09/2016
Semttulo
page22
Temosumarelaodedoisgumescomosprodutoseser
vciosqueusamos.Elesnoscapacitarenosfrustrarelessimplificare
complicarnossasvidaselesnossepararenosaproximar.
Masmesmoqueinteragircomumainfinidadedeprodutoseservios
todososdias,nsfacilmenteesquecerqueelessofeitosporpessoas,eque
algum,emalgumlugardeveobterocrditoquandoelesfuncionambempara
nosouobteraculpaquandonoofazem.
misriascotidianas
Todos,devezemquando,temumdaquelesdias.
Vocsabeotipodediaqueestoufalando:vocacordaatSUN
streamingdeluzemsuajanelaemeperguntoporqueseudespertador
notenhaidoainda.Vocolhaparaverqueoseurelgiopensaque
3:43Voctropeaforadacamaparaencontrarumoutrorelgio,quediz
quevocaindapodefazloparatrabalharemtempo,sevocdeixarem
10minutos.
17/153
27/09/2016
Semttulo
page23
CAPTULO1experinciadousurioeporqueimportante
Vocligaacafeteiraeagitaoparasevestir,masquando
vocvaiparaobterasuadosedecafenadesustentaodavida,noh
cafnopote.Nohtempoparadescobrirporquevoctemdeobter
trabalhar!
Voccomeacercadeumquarteirodesuacasaquandovocpercebequea
carroprecisadegs.Nopostodegasolina,voctentarusaraumabombaque
levacartesdecrdito,masdestavezelenovaiaceitaroseu.Entovoctem
parairparadentroepagarnocaixa,masprimeirovoctemqueesperarnafila
enquantoocaixaajudamuitolentamentetodomundonafrentedevoc.
Voctemquefazerumdesvioporcausadeumacidentedetrnsito,demodoaunidade
levamaistempodoqueoesperado.oficial:Apesardetodososseusesforos,
agoravocestatrasadoparaotrabalho.Finalmente,vocfazasuamesa.Voc
agitado,atormentado,cansado,eirritadioeseudianotemsequer
realmentecomeouainda.Evocaindanotivenenhumcaf.
UserExperienceApresentando
Parecequeumasriedemsorte,apenasumdaquelesdias.Masvamos
rebobinar,essasriedeeventos,olharmaisdeperto,everse,dealgumaforma,todos
queamsortepoderiatersidoevitado.
Oacidente:Oacidentenaestradaaconteceuporqueo
motoristatirouosolhosdaestradaporummomentoparaligarordio
baixa.Eletinhaqueolharparabaixoporqueeraimpossvelidentificar
queeraocontroledevolumeporsistoque.
Oregisto:Alinhanoregistonaestaodegsmoveuto
lentamente,porqueacaixaregistadoraeracomplexoeconfuso,e
amenosqueofuncionriopagaextraatenoenquantoestavamtocandoalgo
page24
se,eleiriacometerumerroeterquecomeartudodenovo.Seo
18/153
27/09/2016
Semttulo
registotinhasidomaissimpleseolayouteascoresdosbotes
diferente,quealinhanuncateriaformado.
Abomba:Vocnoteriaqueficarnessalinhaemtudose
abombatinhaaceitadooseucarto.Eleoteriafeitosevoctivesse
virouocartoemtornodaoutramaneiraderoubar,masnadana
abombaindicouocaminhoqueocartodevesertransformado,evoc
estavamcomtantapressaquevocnopensouemtentaracadaorientao.
Acafeteira:acafeteiranofazerocafporque
vocnoempurrarparabaixoobotodeenergiaportodoocaminho.Amquina
nofaznadaparaquevocsaibaqueelefoiativado:no
luz,nenhumsom,nenhumaresistnciavocpodesentirquandoobotodemarcas
contato.Vocpensouquetinhatransformaram,masvocestavaerrado.
Oproblemapoderiatersidoevitadasetivessedefinidoo
cafeteiraparacomearafabricaodecervejaautomaticamenteaprimeiracoisanamorn
ing,masvocnuncaaprendeuausaressafuno,sevocsabiaque
existido.Ovisornapartedafrenteaindaestiverpiscando12:00.
Orelgio:Eagorachegamosaofatorqueiniciouatoda
cadeiadeeventos:odespertador.Oalarmenodisparouporque
otempoestavaerrado.Otempoestavaerrado,porqueoseugatopisou
norelgionomeiodanoiteeredefinilaparavoc.(Seeste
soaplausvelparavoc,norirlomeaconteceu.
Eutivequeirparacomprimentossurpreendentesparaencontrarumrelgioqueimpermissvel
rioraintromissocat.)Umaconfiguraoligeiramentediferentedebotes
teriaimpedidoogatodeacertarorelgio,econse
tementequeteriasidoforadacamacombastantetempono
precisaseapressaremtudo.
page25
Emsuma,cadaumdoscasosanterioresde"msorte"poderiater
sidoevitadosealgumfezescolhasdiferentesnaconcepodeum
produtoouservio.Estesexemplosdemonstramtodosafaltadeateno
oexperinciadousurio:aexperinciadoprodutocriapara
aspessoasqueoutilizamnomundoreal.Quandoumprodutoestsendo
desenvolvido,aspessoaspagamumagrandedosedeatenoaoqueelefaz.Doutilizador
experinciaooutro,muitasvezesesquecido,ladodoequation
comoelefunciona,quemuitasvezespodefazeradiferenaentreumaaspirao
produtocessfuleumfracasso.
Aexperinciadousurionosobreofuncionamentointernodeumprodutoouser
vcio.Aexperinciadousuriosobrecomoelefuncionanoexterior,onde
19/153
27/09/2016
Semttulo
umapessoaentraemcontatocomele.Quandoalgumlheperguntaoque
comousarumprodutoouservio,elesestoperguntandosobreousurio
experincia.difcilfazercoisassimples?fcildedescobrir?
Qualasensaodeinteragircomoproduto?
Essainteracofrequentementeenvolveempurrarummontedebotes,comono
casodeprodutosdetecnologia,comodespertadores,cafeteiras,
oucaixasregistadoras.svezes,apenasumaquestodeumsimplesfsi
mecanismodecal,comoobondegsemseucarro.Noentanto,todos
produtoqueusadoporalgumcriaumaexperinciadeusurio:livros,
ketchup,poltronasreclinveis,camisolasdocasaco.
Paraqualquertipodeprodutoouservio,soaspequenascoisasquecontam.
Terumcliquedebotoquandovocempurrloparabaixonoparece
muito,masquandoessecliquefazadiferenaentreget
caftingenotomarcaf,eletemumagrandeimportncia.Mesmose
vocnuncapercebeuqueaconcepodequeobotofoicausandolhe
problemas,comovocsesentesobreumamquinadecafquevocera
capazdeutilizarcomxitoapenasumapartedotempo?Comovocsesentiria
page26
sobreofabricante?Quercompraroutroprodutoapartirdesse
empresanofuturo?Provavelmenteno.Assim,porfaltadeumboto
queclica,umclienteestperdido.
DoProdutoDesigndeExperinciadoUsurioProjeto
Quandoaspessoaspensamsobreodesigndoproduto(seelespensamsobre
designdeprodutoemtodos),quemuitasvezespensarnissoemtermosdeesttica
apelar:umprodutobemprojetadoaquelequepareceserbomparaoolho
esesentebemaotoque.(Ossentidosdoolfatoepaladarno
entramemjogoparaamaioriadosprodutos.Osommuitasvezesesquecido,mas
podeserumaparteimportantedoapeloestticodeumproduto.)
Seacurvadocorpodeumcarrodesportivoouatexturadeuma
Oapertodebrocadepotncia,adimensoestticadodesigndeprodutoum
certezadechamariz.
Outramaneiracomoaspessoascomunspensamsobreodesigndoprodutoestem
termosfuncionais:Umprodutobemprojetadoaquelequefazoque
prometefazer.Eumprodutomalprojetadoaquelequedealgumaforma
no:tesourasquenocortammesmoqueaslminassontidas,
umacanetaquenoescrevemesmoqueelecheiodetinta,umaimpressoraque
constantementecongestionamentos.
20/153
27/09/2016
Semttulo
Todosestespodemcertamenteserfalhasdedesign.Essesprodutos
podeparecergrandeetrabalharbemfuncionalmente,masprojetarduto
cadodecomaexperinciadousuriocomoumresultadoexplcitasignificaolhar
almdofuncionalouesttica.
Algumaspessoasresponsveispelacriaodeprodutosnopodepensarem
termosdedesignemtudo.Paraeles,oprocessodecriaodeumproduto
sobreodesenvolvimento:constantementeconstruindoeaperfeioandoascaractersticas
page27
easfunesdoprodutoatqueelessesomamaalgovivel
nomercado.
Inthisview,osbyitsprodutodesignoftheisdictatedfunctionality
ou,comodesigners,porvezes,coloclo,"aformasegueafuno."Este
abordagemfaztodoosentidoparaofuncionamentointernodeumproduto,
aspartesescondidoapartirdeumutilizador.Masquandosetratadeaspartes
umprodutoquefcildeviradaparaosbotes,displays,etiquetase
assimpordiante,aforma"correta"noditadapelafuncionalidadeemtudo.
Emvezdisso,eleditadapelapsicologiaecomportamentodosusurios
simesmos.
Designdeexperinciadousurio,muitasvezeslidacomquestesdecontexto.
Concepoestticatornaseobotodeligaramquinadecafuma
formaatraenteetextura.Designfuncionalgarantequedesenca
gersaaoapropriadanodispositivo.Designdeexperinciadousurio
garanteosaspectosestticosefuncionaisdobotodetrabalho
nocontextodorestodoproduto,fazendoperguntascomo:"
obotopequenodemaisparaumafunotoimportante?"rinciadousurio
projetorinciatambmgaranteobrasnobotonocontextoda
oqueousurioesttentandorealizar,fazendoperguntascomo:"
obotonolugarcertoemrelaoaooutrocontrolaousurio
estariausandoaomesmotempo?"
Projetando(para)Experincia:UseMatters
Qualadiferenaentreaconcepodeumprodutoeconcepodeum
experinciadeusurio?Depoisdetudo,todososprodutosdestinadosasereshumanostem
umusurio,ecadavezqueumprodutousado,eleproporcionaumaexperincia.
Considereseumprodutosimples,talcomoumacadeiraouumamesa.Parautilizaro
cadeiraquevocsentasobreeleparausaratabelaquevoccoloqueoutrosobjetossobreela.Dentro
21/153
27/09/2016
Semttulo
page28
ambososcasos,oprodutopodedeixardeentregarumaexperinciasatisfatria:
Seacadeiranoirsuportaropesodeumapessoa,porexemplo,ou
atabelainstvel.
Masosfabricantesdecadeirasemesastendemanoempregarusurio
experinciadesigners.Nestescasosmaissimples,asnecessidadesde
proporcionarumaexperinciadeusuriodesucessosoconstrudosnadefinio
doprodutoemsi:Emcertosentido,umacadeiravocnopodesentarsenonoum
cadeiraemtudo.
Comosprodutosmaiscomplexos,noentanto,asexignciasparaproporcionarum
experinciadeutilizadorbemsucedidasoindependentesdadefiniodo
produto.Umtelefonedefinidopelasuacapacidadedecolocare/oureceber
chamadasmasnosopraticamenteinfinitasvariaessobreotelefone
quepodemcumprirestabsicodedefinio,comgrandevariao
grausdeexperinciadousuriocomsucesso.
Eomaiscomplexodeumproduto,maisdifcilsetorna
identificarexatamentecomoentregarumaexperinciadesucessoparaousurio.
Cadaadicionalrecurso,funoouetapanoprocessodeutilizaodeum
produtocriaumanovaoportunidadeparaaexperinciadeficaraqum.
Umtelefonecelularmodernotemmuitas,muitasmaisfunesdoqueuma
telefonedemesade,digamos,adcadade1950.Comoresultado,oprocessodecriao
umprodutodesucessotemquesercompletamentediferente.Issoondeoproduto
projetotemdeserapoiadapordesigndeexperinciadousurio.
ExperinciadousurioedaWeb
Aexperinciadousuriovitalparatodosostiposdeprodutoseservios.este
livroprincipalmentesobreaexperinciadousuriodeumtipoparticular
deproduto:Websites.(Euestouusandootermositeaquiparasereferiraambos
produtosWeborientadaacontedoseaplicaesWebinterativas.)
page29
10
22/153
27/09/2016
Semttulo
NaWeb,aexperinciadousuriotornaseaindamaisimportantedoque
paraoutrostiposdeprodutos.Masasliesqueaprendemoscom
criarexperinciasdeusurionaWebpodeseraplicadomuitoalmdesua
fronteiras.
Websitessopeascomplicadasdetecnologia,ealgo
engraadaacontecequandoaspessoastmproblemasparausarpeascomplicadas
datecnologia:Elesculpamasimesmos.Elessesentemcomoelesdevem
terfeitoalgoerrado.Elessesentemcomoelesnoestavamprestando
atenosuficiente.Elessesentirestpido.Claro,irracional.Depoisdetudo,
noculpasuaositenofuncionadamaneiraqueelesesperamqueele.
Maselessesentirestpidodequalquermaneira.Esevocpretendeafastaraspessoas
apartirdoseusite(ouqualquerproduto),difcilimaginarumamaiseficaz
aproximarsedefazlossesentirestpidoquandoelesuslo.
Independentementedotipodesite,empraticamentetodososcasos,umsitedaWeb
umprodutoselfservice.Nohmanualdeinstruesparaler
deantemo,noseminriodetreinamentoparaparticipar,noservioaocliente
representanteparaajudaraorientarousurioatravsdosite.Existeapenas
ousurio,defrenteparaositesozinhocomapenassuaintelignciaerinciapessoal
rinciaparaguila.
Confrontadoscomumagrandevariedade
deopes,ousurio
deixouaseusprpriosdispositivos
paradeterminarquaisosqueapresentamorecurso
turasdeumsiteiratender
elaprecisa.
page30
11
ruimosuficientequeelafoipresanaposiodeterde
descobrirolocalporcontaprpria.Ofatodequeamaioriadossitesnemsequer
reconhecersuacondiodedesamparospioraascoisas.
Apesardaimportnciaestratgicavitaldaexperinciadousurioparaasuco
cessodeumWebsite,osimplesquestodeentenderoqueaspessoas
quereprecisatemsidoumaprioridadebaixaparaamaiorpartedahistriada
omdio.
Seaexperinciadousurioumapartevitaldequalquersite,porqueto
muitasvezesnegligenciadanoprocessodedesenvolvimento?Muitossitesso
construdocomaidiadequeseroprimeironomercadoachaveparaosucesso.
23/153
27/09/2016
Semttulo
NosprimeirosdiasdaWeb,sitescomooYahoo!construdanoincioleads
que,maistardeconcorrenteslutouparasuperar.empresasestabelecidas
correuparaconfigurarsitesdaWeb,nodeterminadodeserpercebidocomocaindo
paratrsostempos.Masnamaioriadoscasos,asempresasconsideradameramente
terimplantadoositeumagranderealizaoseosite
efectivamentetrabalhadasparaaspessoasera,namelhordashipteses,umareflexotardia.
Paraganharquotademercadocontraestesprimeirosmotores,osconcorrentesmuitasvezes
adicionarmaisemaiscontedoefuncionalidadenaesperanadeDraw
INGnovosclientes(etalvezroubaralgunsclientesde
acompetio).Estacorridaparaempinarmaisrecursosemprodutos
quaseexclusivoparaaWebdesderelgiosdepulsoparatelefonesmveis,
featuritisendmicaparamuitascategoriasdeprodutos.
Tendomaiscaractersticas,noentanto,tornaseapenasumatemporria
fontedevantagemcompetitiva.Comacomplexidadeadicionalque
vemcomumconjuntoderecursos,sempreemexpanso,ossitessetornamcada
vezmaispesado,difcildeusarepoucoatraenteparaoprprioprimeiro
temporizadoresquesupostoparadesenhar.Eainda,muitasorganizaes
dopoucaatenoaoqueosusurioscomo,encontrarvaliosas,ousorealmente
capazdeutilizar.
page31
12
Maisemaisempresastmagoradereconhecerqueprestadores
ingumaexperinciadequalidadeumaconcorrnciaessencial,sustentvel
vantagem,notivaapenasparasitesdaWeb,masparatodosostiposdeprodutos
eservios.aexperinciadousurioqueformaimpresdocliente
siondeofertasdeumaempresaaexperinciadeusurioquediferenciado
atesumaempresadeseusconcorrenteseexperinciadousurioque
determinaseoseuclientenuncavaivoltar.
Boaexperinciadousurioumbomnegcio
Talvezvocnovenderqualquercoisaemseusite.Tudooquevocfornece
informaessobreasuaempresa.Podeparecerquevoctemum
monopliosobreessainformaoseaspessoasqueremisso,elestmdeobter
lodevoc.Vocnotemaconcorrnciadamesmaformaqueum
livrariaonlinefaz.Noentanto,vocnopodedaraoluxodenegligenciara
experinciadousuriodoseusite.
SeoseusiteconsisteprincipalmentedoqueWebprschamarquecontedo,
informaesemseguida,umadasprincipaismetasdoseusitecom
faculteessainformaodeformatoeficazquantopossvel.Noosuficiente
apenasparacoloclolfora.Temqueserapresentadadeumaformaqueajuda
24/153
27/09/2016
Semttulo
pessoasabsorvloecompreendlo.Casocontrrio,ousurionopode
nuncadescobrirquevoctemaofereceroservioouprodutoqueestprocurando
para.Emesmoseelesconseguemencontraressainformao,elesso
propensosatiraraconclusodeque,seoseusitedifciltrabalhar
com,suaempresaprovavelmenteestbem.
MesmoqueoseusiteumaplicativobaseadonaWebqueaspessoaspodemutilizarpara
realizardeterminadastarefas(comoacompradebilhetesdeaviooumanag
ingcontasbancrias),acomunicaoeficazumfatorchavena
page32
13
sucessodeseuproduto.Funcionalidademaispoderosadomundo
vacilaefalhaseosusuriosnoconseguemdescobrircomofazlofuncionar.
Simplificando,seosusuriostmumaexperinciaruim,elesnovir
costas.SeelestmumaexperinciaOKcomoseusite,masumamelhor
experinciacomositedoseuconcorrente,elesvovoltaraessecom
concorrente,novoc.Caractersticasefunessempreimporta,masousurio
experinciatemumefeitomuitomaiornalealdadedocliente.Todoseu
tecnologiasofisticadaemensagensdemarcanovaitrazeros
clientesvoltarumasegundavez.Aboaexperinciadousuriovaie
vocnoficarmuitodeumasegundachanceparafazeracoisacerta.
Alealdadedoclientenoanicamaneiraquecentrandosenaexpeusurio
rinciadoseusitepodepagar.Asempresascomumolhonobot
linhadetomquersabersobreoretornodoinvestimento,ouROI.
ROIgeralmentemedidoemtermosdedinheiro:Paracadadlarquevoc
gastar,quantosdlaresdovalorquevocestficandoparatrs?Essaa
ROI.Masoretornodoinvestimentonotemdeserexpressoem
termosestritamentemonetrios.Tudoquevocprecisaumamedidaquemostra
queseudinheirovaisairsetraduzemvalorparasuaempresa.
Umamedidacomumderetornodoinvestimentoataxadeconverso.
Todavezquevocquerincentivarseusclientesadaroprximo
passonaconstruodeumrelacionamentocomvocsequeenvolva
algotocomplexocomoapersonalizaodositecomassuaspreferncias
outosimplescomoseinscreverparareceberumemailboletiml
umataxadeconversovocpodemedir.Aomanterocontroledoqueper
percentualdeusuriosquevocconverterparaoprximonvel,vocpodemediroquo
eficazmenteoseusiteestcumprindoseusobjetivosdenegcio.
25/153
27/09/2016
Semttulo
page33
14
Ataxadeconversoum
formacomumdeme
suringaeficcia
deumaexperinciadeusurio.
3desubscrioinscries
36visitantes
=
taxadeconverso8,33%
taxadeconversotornaseaindamaisimportantenocasodecom
sitesdeMerce.Muitomaispessoasnavegaremumsitedecomrciodoquecomprarde
isto.Umaexperinciadeusuriodequalidadeumfactorchavenaconversodestes
navegadorescasuaisemcompradoresativos.Mesmoumpequenoaumentoemseu
taxadeconversopodesetraduziremumsaltodramticonareceita.No
page34
15
26/153
27/09/2016
Semttulo
incomumparaumamudananataxadeconversotopequenoquantoumdcimode
umporcento,pararesultarnumaumentodereceitadedezporcentooumais.
Emqualquersiteondeosusuriostmaoportunidadededarlhealgum
dinheiro,voctemumataxadeconversomensurvel,sevocsell
inglivros,comidadegato,ouassinaturasparaocontedodositeemsi.
taxadeconversopodedarlheummelhorsentidodoretornodoseu
userinvestimentoexperinciadoqueosnmerosdevendassimples.Asvendaspodemsufi
fer,sevocnoforbemsucedidoemobterapalavrasobreoseusite.
faixasdetaxadeconversocomovocbemsucedidonaobtenodequem
visiteagastaralgumdinheiro.
MesmoseoseusitenoseprestafacilmenteaumamtricaROIcomo
taxadeconverso,issonosignificaqueoefeitodaexperinciadousurioem
seunegciomenossignificativo.Seelessousadospeloseu
clientes,seusparceirosouseusfuncionrios,sitesdaWebpodetertodos
tiposdeefeitosindirectossobrealinhadefundo.
Ningumforadasuaempresanuncapodeverositequevocexecute(como
nocasodeumaferramentainternaouumaintranet),masoutilizadorrincia
ciaaindafazumaenormediferena.Muitasvezes,issopodesignificaradife
rnciaentreumprojetoquecriavalorparaaorganizaoeuma
projetoquesetornaumpesadeloqueconsomemrecursos.
Qualqueresforoexperinciadousuriotemoobjetivodemelhoraraeficincia.estebasi
camentevememduasformasprincipais:ajudaraspessoasatrabalharmaisrpidoeajuda
ingloscometermenoserros.Melhoraraeficinciado
ferramentasquevocusamelhoraaprodutividadedonegciocomoumtodo.
Quantomenostempoquelevaparacompletarumadeterminadatarefa,maisvoc
podeserfeitoemumdia.Deacordocomaantiganoodequeotempo
dinheiro,pouparoseutempoempregadossetraduzdiretamenteempoupana
seudinheirodonegcio.
page35
16
Eficincianoafetaapenasalinhadefundo,porm.Pessoascomo
seustrabalhosmaisquandosuasferramentassonaturaisefcildeusar,no
frustranteedesnecessariamentecomplexa.Seessapessoavoc,estestipos
deferramentasfazeradiferenaentrevoltarparacasasatisfeitono
finaldodiaevoltandoparacasaexaustoeodiaroseutrabalho.
(Oupelomenos,sevocestvindoemcasaexausto,paraadireita
razes,noporquevocestlutandocomsuasferramentas.)
produtosdetecnologia
27/153
27/09/2016
Semttulo
quenofuncionamdamaneira
aspessoasesperamfazer
lossentirstupid
mesmoque,emltimainstncia
realizaroqueeles
propusemosafazer.
page36
17
Seessapessoaseuempregado,fornecendoessestiposdeferramentas
aumentanosaprodutividade,mastambmasuasatisfaonotrabalho,
fazendocomqueoempregadomenospropensosaprocurarumnovoemprego.Istoporsuavez,
significaquevoceconomizaremcustosderecrutamentoetreinamento,almdevocbeneficiar
domaiselevadonveldequalidadequeamaisdedicada,experiente
empregadotrazparaoseutrabalho.
Cuidandodeseususurios
Aprticadecriarexperinciasdeusurioatraenteseficientes
chamadodedesigncentradonousurio.Oconceitodedesigncentradonousurio
muitosimples:levarousurioemcontacadapassodocaminhoenquanto
loadesenvolverseuproduto.Asimplicaesdesteconceitosimples,
Noentanto,sosurpreendentementecomplexo.
Tudoasexperinciasdeutilizaodeveseroresultadodeumaconscincia
decisodesuaparte.Realisticamente,vocpodeterquefazerumcom
prometeraquieali,porcausadotempooucustoenvolvido
nacriaodeumasoluomelhor.Masumprocessodedesigncentradonousurio
garantequeessescompromissosnoacontecemporacaso.De
28/153
27/09/2016
Semttulo
pensarsobreaexperinciadousurio,dividiloemsuacom
Ponentelementos,eolhandoparaeledevriasperspectivas,voc
podegarantirquevocsabetodasasramificaesdesuasdecises.
Amaiorexperinciadousuriorazodeveimportaparavocqueele
questesparaosusurios.Sevocnofornecloscomumpositivo
experincia,elesnovousaroseuproduto.Esemqueosusurios,todos
voctemumservidorWebempoeirado(ouarmazmcheiodeprodutos)
emalgumlugar,debraoscruzadosesperandoparaatenderaumasolicitaoquenuncavir.
Paraosusuriosquevm,vocdevedefiniraproporcionarlhes
comumaexperinciaquecoesaeintuitiva,etalvezatmesmo
prazerosaumaexperinciaemquetudofuncionadamaneiraque
devemos.Noimportacomoorestodoseudiasepassou.
page37
2
captulo
Conheao
elementos
29/153
27/09/2016
Semttulo
page38
19
Oprocessodedesigndeexperinciadousurioapenasdeassegurarquenenhuma
aspectodaexperinciadousuriocomoprodutoacontecesem
suaconscincia,comaintenoexplcita.Issosignificalevaremconta
todasaspossibilidadesdecadaaoqueousurioprovvelquetomarecompreenso
estandoasexpectativasdousurioemcadapassodocaminhoatravs
esseprocesso.Soacomoumgrandetrabalhoe,emalgunsaspectos,.Mas
quebrandootrabalhodeelaboraodaexperinciadousurioparabaixoemseu
elementoscomponentes,podemosentendermelhoratarefacomoumtodo.
Oscincoavies
Amaioriadaspessoas,umavezououtra,tercompradoumfsico
produtoatravsdaWeb.Aexperinciapraticamenteomesmo
cadavez:Vocvaiparaosite,vocencontraroitemdesejado(talvez
usandoummotordebuscaoutalvezpelavisualizaodeumcatlogo),vocd
ositeoseunmerodecartodecrditoeoseuendereo,eosite
confirmaqueoprodutoserenviadoavoc.
page39
30/153
27/09/2016
20
Semttulo
CAPTULO2CONHEAOSELEMENTOS
Issopuro,experinciaarrumadanaverdaderesultadeumconjuntode
decises,algunspequenos,algunsdegrandesobreaaparnciadosite,como
elesecomporta,eoquelhepermitefazer.Estasdecisesbasearse
unsaosoutros,informareinfluenciartodososaspectosdoutilizadorrincia
rincia.Sedescascarascamadasdessaexperincia,podemoscomear
paraentendercomoessasdecisessotomadas.
Oplanodasuperfcie
NasuperfcievocvumasriedepginasdaWeb,compostadeimagens
etexto.Algumasdestasimagenssocoisasquevocpodeclicar,per
formandoumaespciedefuno,comolevloaumcarrinhodecompras.
Algumasdestasimagenssoapenasilustraes,talcomoumafotografiade
umprodutoparaavendaouologotipodositeemsi.
OesqueletoPlane
Porbaixodasuperfciequeoesqueletodolocal:acolocaode
botes,controles,fotoseblocosdetexto.Oesqueletoconcebido
paraoptimizaroarranjodosreferidoselementosparaoefeitomximo
eeficinciademodoquevocselembradologotipoepodeacharque
carrinhodecomprasbotoquandovocprecisardele.
OplanoEstrutura
Oesqueletoumaexpressoconcretadamaisabstratoestrutura
dolocal.Oesqueletopodedefiniroposicionamentodainterface
elementosnanossapginadecompraaestruturairiadefinircomo
usurioschegouaessapginaeondeelespoderiamirquandoelesestavamfin
tadal.Oesqueletopodedefiniroarranjodenavegao
elementosadicionaisquepermitamaosusuriosnavegarcategoriasdeprodutos
aestruturairiadefiniroqueessascategoriasforam.
pgina40
21
OPlanombito
Aestruturadefineaformaemqueasvriascaractersticase
funesdolocalencaixam.Apenasoqueessascaractersticase
funessoconstituiombitodolocal.Porexemplo,alguns
sitesdecomrciooferecemumrecursoquepermiteaosusuriossalvaranteriormente
endereosdeentregausadosparaqueelespossamserutilizadosnovamente.seisso
recurso,ouqualquercaractersticaestincludoemumsiteumaquestodeescopo.
31/153
27/09/2016
Semttulo
OPlanodeEstratgia
Ombitofundamentalmentedeterminadapelaestratgiadosite.
Estaestratgiaincorporanosoqueaspessoasexecutandoo
localquersairdela,masoqueosusuriosqueremsairdo
sitetambm.Nocasodonossoexemploarmazenamento,algumadaestratgica
objetivossobastantebvias:osusuriosqueremcomprarprodutos,ens
quervendlos.Outrosobjetivos,taiscomoopapelqueblicidade
ingoucontedoproduzidopornossosusuriosdesempenhanonossomodelodenegcio,
porexemplo,podenosertofcildearticular.
Construodebaixoparacima
Estesestratgiaaviescinco,mbito,aestrutura,oesqueleto,esuperfcie
fornecerumquadroconceptualparafalarsobreaexperinciadousurio
problemaseasferramentasqueusamospararesolvlos.
Emcadaplano,asquestesquetmdelidarcomatornarseumpoucomenos
abstratoeumpoucomaisconcreto.Noplanomaisbaixo,nsnosomos
emcausacomaformafinaldolocal,doproduto,ounoservio
tudoquessepreocupamcomaformacomoositevaicaberemnossaestratgia(enquanto
atendendosnecessidadesdenossosusurios).Noplanomaisalto,estamosapenas
emcausacomosdetalhesmaisconcretodaaparnciado
produto.Planoporplano,asdecisesquetmdefazerseum
poucomaisespecficoeenvolvernveismaisfinosdedetalhes.
page41
22
Concreto
Abstrato
Cadaaviodependentedosplanosabaixodela.Assim,asuperfcie
dependedoesqueleto,oquedependedaestrutura,que
32/153
27/09/2016
Semttulo
dependedoalcance,aqualdependedaestratgia.Quandoo
escolhasquefazemosnosealinhamcomaquelesacimaeabaixo,projectos
descarrilar,osprazossoperdidos,eoscustoscomeamasubirrapidamentecomoo
equipededesenvolvimentotentajuntarcomponentesquenofazer
naturalmenteapto.Piorainda,quandooprodutofinalmenteforlanado,
osusuriosmuitasvezesodeioisso,porquenooferecerumaexperinciasatisfatria.
Estadependnciasignificaqueasdecisessobreoplanodeestratgiaser
tmumaespciede"efeitocascata"todoocaminhoatacadeia.Poroutrolado,
asopesdisponveisparansemcadaplanosolimitadospela
decisesquetomamossobreproblemasnosplanosabaixodela.
page42
23
gamadeopesdisponveisnoprximoavio Asescolhasquevocfaz
emcadaplanoafectar
asopesdisponveispara
vocnoprximoavio
acimadela.
aopoescolhida
gamadeopespossveis
Esteefeitocascata
significaqueaescolhadeum
opo"foradoslimites"
emumplanosuperior
vaiexigirrepensar
decisessobremenor
avies.
33/153
27/09/2016
Semttulo
page43
24
Issonosignifica,noentanto,quequalquerdecisosobreummenor
planodeveserfeitaantesdeoaviodecimaquepodeserdirigida.
Dependnciasexecutadoemambasasdirees,comasdecisestomadasnapartesuperior
avies,porvezes,forandoumareavaliao(ouumaavaliaofeitapara
pelaprimeiravez!)dequestessobreplanosinferiores.Emcadanvel,fazemos
decisesdeacordocomoqueaconcorrnciaestfazendo,amelhordaindstria
prticas,oquesabemossobrenossosusurios,evelholisocomum
sentido.Essasdecisespodemterumefeitocascataemambasasdirees.
Aexignciadetrabalhosobre
cadaavioparaterminar
antesdotrabalhona
seguintepodecomearlevaa
resultadosinsatisfatrios
paravoceseususurios.
esforo
Tempo
Umaabordagemmelhor
detertrabalhoemcada
planodechegadaantesdotrabalho
naprximapodeterminar.
esforo
Tempo
Sevocconsiderarassuasdecisessobreplanosinferioresasergravadanapedra
antesdeassumirsuasdecisesemplanossuperiores,vocvaiquase
certamenteestarjogandosuaprogramaoedeprojeto,possivelmente,asuco
cessodoseuperigodoprodutofinal,em.
Emvezdisso,vocdeveplanejarseuprojetoparaqueotrabalhoemqualquerplano
nopodeterminarantesdotrabalhoemplanosinferioresterminou.oimpor
tantconsideraoaquinoconstruirotelhadodacasaantes
vocsabeaformadesuafundao.
page44
34/153
27/09/2016
Semttulo
25
Adualidadebsica
claro,hmaisdoqueapenascincoelementosdaexperinciadousurio,
ecomoemqualquercampoespecializado,esteevoluiuumvocabulrio
todososseusprprios.Paraalgumencontrandoocampoparaoprimeirotempo,
experinciadousuriopodeaparecerparaserumnegciocomplicado.Todosestes
aparentementetermosidnticossoatiradosaoredor:designdeinterao,
designdeinformao,arquiteturadainformao.Oqueelesqueremdizer?
Qualquercoisa?Ousoapenaschavesdaindstriamaissemsentido?
Paracomplicaraindamaisascoisas,aspessoasvousarosmesmostermosem
jeitosdiferentes.Umapessoapodeusaro"designdeinformao"parasereferir
paraoqueooutrosabecomo"arquiteturadainformao."Eoque
adiferenaentre"designdeinterface"e"designdeinterao?"
Existeum?
QuandoaWebcomeou,eratudosobreainformao.Aspessoaspodiam
criardocumentos,eelespoderiamliglosaoutrosdocumentos.
TimBernersLee,oinventordaWeb,criouacomoumaformade
pesquisadoresnacomunidadedefsicadealtaenergia,queeram
espalhadosportodoomundo,paracompartilharereferemseunsaosoutrosde
descobertas.ElesabiaqueaWebtinhaopotencialparasermuitomaisdoque
isso,masalgunsoutrosrealmenteentendeucomograndeoseupotencialera.
PessoasoriginalmenteapreendidosnaWebcomoumnovomeiodepublicao,
mascomotecnologiaavanadaenovosrecursosforamadicionadosparaWeb
browserseservidoresWebdamesmaforma,aWebassumiuumnovofuncional
capacidades.ApsaWebcomeouapegarnaInternetmaior
comunidade,eladesenvolveuummaiscomplexoerobustoconjuntoderecursosque
permitiriaWebsitesnoapenasparadistribuirinformao,masa
recolheremanipullobem.Comisso,aWebtornousemais
page45
26
interactiva,respondendoentradadosutilizadoresdeummodoqueconstrudassobre
esvezessemudouparaalmdasaplicaestradicionaisdedesktop.
ComoadventodosinteressescomerciaisnaInternet,estaaplicao
funcionalidadeoencontrouumavastagamadeutilizaes,taiscomoeletrnica
commerce,mdiassociaiseserviosfinanceiros,entreoutros.
Enquantoisso,aWebcontinuouaflorescercomoummeiodepublicao,
35/153
27/09/2016
Semttulo
cominmerossitesdejornaiserevistasaumentandoa
ondadeblogssdeWebe"ezines"serpublicado.nologia
giacontinuouaavanaremambasasfrentescomotodosostiposdesitesfeitos
atransiodecoleesestticasdeinformaesquemudou
raroparasitesdinmicos,bancodedadosorientadoqueestavamconstantemente
evoluindo.
QuandoaexperinciadacomunidadedeusuriosdaWebcomearamaseformar,oseu
membrosfalavaduaslnguasdiferentes.Umgrupoviucadaprobabilidade
lemcomoumproblemadedesigndoaplicativo,eaplicadaaresoluodeproblemas
seaproximadosoftwaredesktopedemainframetradicional
osmundos.(Estes,porsuavez,foramenraizadasemprticascomunsaplicadas
paraacriaodetodosostiposdeprodutos,desdecarrosparatnisdecorrida).A
outrogrupoviuaWebemtermosdedistribuiodeinformaoe
recuperaoeaplicadaaresoluodeproblemasseaproximadatradio
mundosadicionaisdepublicao,mdiaecinciadainformao.
Istotornouseumgrandeobstculo.Muitopoucoprogressopodeser
feitaquandoacomunidadenopoderiamesmochegaraacordosobreterminologiabsica
gia.AsguasforamaindamaisturvapelofatodequeamaioriaWeb
locais,nopoderiamserperfeitamentecategorizadoscomoaplicaofuncional
esourecursosdeumainformaodenmeroenormepareciaserumaespcie
dehbrido,incorporandoqualidadesdecadamundo.
page46
27
ParafazerfaceaestadualidadebsicananaturezadaWeb,vamosdividir
nossoscincoaviesnomeio.esquerda,vamoscolocaressesele
mentosespecficosparaaWebcomoumaplataformaparaafuncionalidade.No
bem,vamoscolocaroselementosespecficosdaWebcomoumainformao
mdio.
produtonaformadeprodutodefuncionalidadecomoinformaes
ctionality
Concreto
superfcie
esqueleto
elet
36/153
27/09/2016
Semttulo
estrutura
UCT
escopo
policial
estratgia
taxa
Abstrato
page47
28
Doladodafuncionalidade,estamosprincipalmentepreocupadoscomastarefas
Asetapasenvolvidasemumprocessoecomoaspessoaspensamsobrecom
pletinglos.Aqui,consideramosoprodutocomoumaferramentaouconjuntodeferramentas
queoutilizadorempregapararealizarumaoumaistarefas.
Noladooposto,anossapreocupaoqueasinformaesdoproduto
ofereceeoqueissosignificaparaosnossosusurios.Criandoumainformaorico
experinciadousuriocapacitaraspessoasparaencontrar,absorverefazer
sentidodasinformaesquefornecemos.
Oselementosdaexperinciadousurio
Agorapodemosmapearessagamaconfusainteirodetermosno
modelo.Aoquebrarcadaavioparabaixoemseuselementoscomponentes,
nsvamossercapazesdedarumaolhadamaisdepertocomotodasaspeasseencaixam
nocursodecriaodetodaaexperinciadeutilizador.
OPlanodeEstratgia
Asmesmaspreocupaesestratgicasentramemjogoparaambosfunctionality
produtosorientadoserecursosorientadaparaainformao.Asnecessidadesdoutilizador
soasmetasparaositequevmdeforadonossoorganizao
especialmentedaspessoasqueiroutilizaronossosite.Devemossubestimar
suportaroqueonossopblicoquerdensecomoissoseencaixacom
outrasmetasqueelestm.
Equilibradacontraasnecessidadesdousuriosoosnossosprpriosobjectivosparaosite.
Estesobjetivosdoprodutopodeserobjetivosdenegcio("Make$1000000
37/153
27/09/2016
Semttulo
emvendaspelaWebesteano")ououtrostiposdeobjetivos("Informe
oseleitoressobreoscandidatosnaprximaeleio").NoCaptulo3
vamosentraremmaisdetalhessobreesteselementos.
page48
29
ctionality
projetosensorial
superfcie
Concreto
DesigndeInterfacedesigndenavegao
projeto
ND
esqueleto
designdainformao
o
Interao
o
Emformao
ati
projeto
Arquiteturar
estrutura
Funcional
onal
Contedo
en
escopo
Especificaes
ons requisitos nt
usurioNe
estratgia
Objetivosdoproduto
tObj
Abstrato
OPlanombito
Doladodafuncionalidade,aestratgiatraduzidaemescopo
atravsdacriaodeespecificaesfuncionais:adetalhada
descriodo"conjuntoderecursos"doproduto.Combasenasinformaes
lado,oescopoassumeaformaderequisitosdecontedo:umadescrio
dosvrioselementosdecontedoqueseronecessrias.Captulo4vontade
cobriroselementosdeescopo.
page49
38/153
27/09/2016
30
Semttulo
OplanoEstrutura
Ombitodeaplicaodeterminadaestruturanoladodafuncionalidadeatravs
designdeinterao,emquesedefinecomoosistemasecomporta
emrespostaaoutilizador.Pararecursosdeinformao,aestrutura
aarquiteturadeinformao:oarranjodeelementodecontedo
mentosparafacilitaracompreensohumana.Vocencontrarmaisdetalhes
sobreestesnoCaptulo5.
OesqueletoPlane
Oavioesqueletodivideseemtrscomponentes.Em
ambososlados,temosdeabordarodesigndeinformao:aapresentao
odeinformaesdeumaformaquefacilitaacompreenso.Para
produtosorientadosparaafuncionalidade,oesqueletotambmincluiinter
desenhodaface,ouarranjarelementosdeinterfaceparapermitiraosutilizadores
interagircomafuncionalidadedosistema.Ainterfaceparauma
fontedeinformaooseudesigndenavegao:oconjuntodetela
elementosquepermitemaousuriomoverseatravsdainformao
arquitetura.HmaissobreoplanodeesqueletonoCaptulo6.
Oplanodasuperfcie
Porfim,temosasuperfcie.Independentementedesaberseestamoslidando
comumprodutoorientadoparaafuncionalidadeouaumrecursodeinformao,
nossapreocupaoaquiomesmo:aexperinciasensorialcriadopor
oprodutoacabado.maiscomplicadodoqueparecevocpodedescobrir
tudosobreelenoCaptulo7.
pgina50
31
Usandooselementos
Estemodelo,divididoemcaixaspuraseavies,umconveniente
maneiradepensarsobreproblemasdeexperinciadousurio.Narealidade,claro,
aslinhasentreessasreasnosotoclaramentedesenhado.frequentemente,
39/153
27/09/2016
Semttulo
elapodeserdifcildeidentificarseumaexperinciadeutilizadorespecfico
problemamelhorresolvidoatravsdaatenoaumelemento,emvez
deoutro.Podeumamudanaparaovisualfazerotruque,ouserquea
designdenavegaosubjacentetemqueserreformulado?algunsprobabilidade
blemasrequerematenoemdiversasreasdeumasvez,ealgunsparecem
escarrancharasfronteirasidentificadasnestemodelo.
Algunsprodutosouservioscairexclusivamentedeumladodestemodelo
ouooutro.Dentrodecadaavio,oselementosdevemtrabalharjuntos
paraatingirobjetivosquedoavio.Separarosefeitosdasdecises
vocfazsobreumelementodetodososoutroselementosnoplano
muitodifcil.Porexemplo,designdeinformao,designdenavegao,
edesigndeinterfacedefinirconjuntamenteoesqueletodeumproduto.Todos
elementosemcadaplanotemumafunocomumnadeterminao
aexperinciainmaiordeusuriosNestecaso,adefiniodoproduto
esqueleto,mesmoseelesexecutaressafunodediferentesmaneiras.
Asorganizaesmaneiradelegararesponsabilidadedeexperinciadousurio
questesmuitasvezescomplicaaindamaisascoisas.Emalgumasorganizaes,voc
vaiencontrarpessoascomcargoscomoarquitetodeinformaoou
designerdeinterface.Nofiqueconfusocomisso.Essaspessoasgeral
aliadotemexperinciaabrangendomuitosdoselementosdoexperimentousurio
cia,noapenasaespecialidadeindicadaporseuttulo.Nonecessrio
paraterummembrodesuaequipequeumespecialistaemcadaumadelas
reasemvezdisso,vocstemquegarantirquealgumgastapelomenos
partedeseutempopensandosobrecadaumadessasquestes.
page51
32
Umpardefatoresadicionaisentraremmoldaroutilizadorfinalrincia
ciadequevocnovaiencontrarcobertoemdetalhesaqui.Oprimeirodestes
contedo.Ovelhoditado(bem,idadeemanosWeb)que"ocontedo
rei"naWeb.Istoabsolutamenteverdadeiro,onicoemaisimpor
coisatantamaioriadossitespodemofereceraosseususuriosocontedoque
essesusuriosvoencontrarvaliosas.
Osusuriosnovisitarsitesparaexperimentaraalegriadenavegao.o
contedoqueestdisponvelparavoc(ouquevoctemrecursosparaobter
egerenciar)irdesempenharumgrandepapelnaformaodeseusite.Nocaso
deumalojaonline,quepodedecidirquequeremosqueosusuriossejam
capazdeverasimagensdascapasdetodososlivrosquevendem.Senspodeobtlos,
Serquevamosterumaformadecataloglas,mantlasemant
losatdata?Esenopodemosobterfotosdoabranlivro
ersemtudo?Estasquestesdecontedosoessenciaisparaousuriofinal
experinciadolocal.
40/153
27/09/2016
Semttulo
Emsegundolugar,atecnologiapodesertoimportantequantoocontedonacria
Atingaousurioumaexperinciabemsucedida.Emmuitoscasos,anaturezado
aexperinciaquevocpodeofereceraosseususurioslargamentedeterminado
portecnologia.NosprimeirosdiasdaWeb,asferramentasparaseconectar
Websitesparabancosdedadosforambastanteprimitivoelimitado.medidaqueo
Atecnologiatemavanado,noentanto,asbasesdedadossetornarammais
amplamenteutilizadoparaconduzirsites.Esteporsuavez,permitiuquemaise
maissofisticadasabordagensdeexperinciadousurio,comoadinmica
sistemasdenavegaoquemudamemrespostaformacomoosusuriossemovem
atravsdosite.Atecnologiaestsempremudando,enocampoda
experinciadousuriosempretemdeseadaptaraele.Noentanto,ofunda
elementosmentaisdaexperinciadousuriopermanecemosmesmos.
page52
33
Emboraeudesenvolveuomodelodeelementosnodecorrerdomeutrabalho
emsitesdaWeb,outros,desdeento,aplicouaumaamplagamadeduto
dutoseservios.SevoctrabalhanaWeb,tudonestelivro
seaplicaavoc.Sevoctrabalharemoutrostiposdeprodutosdetecnologia,
vocverfortesparaleloscomconsideraesfamiliares.Mesmosevoc
aelaboraodosprodutosouserviosquenotmnadaavercomnologia
gia,vocpodemapearessesconceitosparaseusprpriosprocessos.
Orestantedestelivroanalisaesseselementos,planoporplano,em
maiordetalhe.Vamosdarumaolhadaemalgumasdasferramentasetecnolo
nicascomumenteusadoparatratardecadaelemento.Pelocaminho,
vamosvercomoesseselementosentramemjogoemprodutosquenoso
Websitesemtudo.Vamosveroqueoselementosemcadaplanotemem
comum,oquetornacadaumdiferente,ecomoelasafetamcada
outrosparanosajudaracriaraexperinciatotaldousurio.
41/153
27/09/2016
Semttulo
page53
3
captulo
aEstratgia
Avio
Objectivosdeprodutosenecessidadesdousurio
42/153
27/09/2016
Semttulo
page54
Superfcie
Esqueleto
Estrutura
Afundaodeumaexperinciadeusuriodesucesso
umaestratgiaclaramentearticulada.Sabendotantooque
Escopo
queremosqueoprodutoarealizarparaanossaorgani
Estratgia
zaoeoquensqueremosquerealizarparaanossa
usuriosinformaasdecisesquetemosdefazersobre
todososaspectosdaexperinciadousurio.masResposta
ingestasperguntassimplespodesermaiscomplicadodoque
projetosensorial
parece.
ND
designdainformao
Interao Emformao
ati
projeto Arquitetura
r
Funcional Contedo
en
Especificaes
requisitos
nt
Objetivosdoproduto
pgina55
36
CAPTULO3AESTRATGIADEAVIO
DefiniodaEstratgia
ArazomaiscomumparaafalhadeumWebsitenologia
logia.Noaexperinciadousuriotambm.sitesmaisfrequentementefalham
43/153
27/09/2016
Semttulo
porque,antesdaprimeiralinhadecdigofoiescrito,oprimeiropixel
foiempurrado,ouoprimeiroservidorfoiinstaladoningumsepreocupouem
responderaduasquestesbsicas:
.Oquensqueremossairdesteproduto?
.Oquenossosusuriosqueremsairdela?
ctionality
escopo
estratgia
Objetivosdoproduto
Aoresponderaprimeirapergunta,nsdescrevemosoprodutoobjec
vasprovenientesdointeriordaorganizao.Asegundaquesto
abordaasnecessidadesdousurio,objetivosimpostasaoprodutoda
ladodefora.Juntos,osobjetivosdoprodutoeasnecessidadesdosutilizadoresformaratgia
avioegy,abaseparatodasasdecisesemnossoprocessocomons
projetaraexperinciadousurio.Noentanto,surpreendentemente,muitosexperinciadousurio
projetosnocomeamcomumaclaracompreenso,explcitodo
estratgiasubjacente.
pgina56
37
Apalavrachaveaquiexplcita.Quantomaisclaramentepodemosarticular
exatamenteoquequeremos,eexatamenteoqueosoutrosqueremdens,o
maisprecisamentepodemosajustarnossasescolhasparaatenderaessasmetas.
Objetivosdoproduto
Aprimeirapartedetornaranossaestratgiaexplcitaestaexaminarnossaprpria
objectivosparaoprodutoouservio.Demasiadasvezes,osobjetivosdoproduto
existemapenascomoumentendimentotcitoentreaquelesaconstruodo
produto.Quandoesseentendimentonofalado,diferente
muitasvezesaspessoastmidiasdiferentessobreoqueoprodutoapoio
posoupararealizar.
objetivosdenegcio
44/153
27/09/2016
Semttulo
Aspessoasgeralmenteusamtermoscomometasdenegciosoudriversdenegcio
paradescreverosobjetivosestratgicosinternos.Vouusarotermo
objetivosprodutos,porqueestesoutrostermossoambosmuitoestreitoe
muitoamplo:muitoestreita,porquenemtodososmetainternaumnegcio
objetivo(afinal,nemtodaorganizaotemosmesmostiposdeobjetivos
queasempresasfazem),emuitoamplo,porqueanossapreocupaoaquirealmente
identificarnostermosmaisespecficospossveloqueesperamosqueo
prprioprodutoderealizar,independentementedorestodonossonegcio
actividades.
Amaioriadaspessoascomeadescrevendoosobjetivosparaosseusprodutosem
termosmuitogerais.Nocasodesites,elesfundamentalmente
servirumdosdoispropsitos:fazercomqueodinheirodaempresaouparaeconomizar
odinheirodaempresa.svezesambos.Mas,exatamentecomoestes
sitessosupostofazerissonemsempreclara.
page57
38
Poroutrolado,osobjectivosquesodemasiadoespecficonofazeradequadamente
descreveraspreocupaesestratgicasemquesto.Porexemplo,declarandoque
umdeseusobjetivos"forneceraosusuriosumacomtextoemtemporeal
ferramentanicaes"noexplicacomoessaferramentaajudaaavanar
osobjectivosdasuaorganizao,oucomoeleajudaasatisfazerasnecessidades
deseususurios.
Natentativadeencontrarumequilbrioentresermuitoespecficoesendo
muitogeral,queremosevitarsaltarfrenteparaidentificarsolues
quandonsaindanocompreendemostotalmenteosproblemas.Paracriarumasuco
experinciadousuriocessful,temosquetercertezadequetodasasdecises
fazemosestenraizadaemumaslidacompreensodassuasconsequncias.
Definirclaramenteascondiesparaosucesso,semdefiniro
caminhoparachegarlasseguraquensnochegarfrentedensmesmos.
Identidadedamarca
Umaconsideraoessencialnaformulaodosobjectivosdequalquer
produtoaidentidadedamarca.Quandoamaioriadensverapalavrademarca,
pensamosemcoisascomologotipos,paletasdecoresetipografia.Enquanto
estesaspectosvisuaisdamarcasoimportantes(vamosrevisitarlosem
maisdetalhesquandochegarmosaoplanodasuperfcienoCaptulo7),o
conceitodemarcaseestendemuitoalmdovisual.Marcaaidentidadea
conjuntodeassociaesconceituaisouemocionaisreaesimportante
porqueinevitvel.Nasmentesdeseususurios,umaimpresso
sobreasuaorganizaoestinevitavelmentecriadoporsuasinteraes
45/153
27/09/2016
Semttulo
comoseuproduto.
Vocdeveescolherseessaimpressoaconteceporacidenteou
comoresultadodeescolhasconscientesvocfeznaconcepodoseu
produto.Amaioriadasorganizaesoptarporexerceralgumcontrolesobreo
page58
39
percepodesuamarca,queamarcaporcomunicar
identidadeumobjectivomuitocomumproduto.Marcarnoapenaspara
entidadescomerciais,queratodasasorganizaescomumsitedaWeb,
defundaessemfinslucrativosparaasagnciasgovernamentaisparaindivduos,
criaumaimpressoatravsdaexperinciadousurio.Aocodificaro
qualidadesespecficasdeessaimpressocomoumobjectivoexplcito,voc
aumentarsuaschancesdequeserumaimpressopositiva.
SucessoMetrics
Raastmlinhasdeacabamento.Umaparteimportantedacompreensodeseu
objetivosentendercomovocvaisaberquandovoctem
osalcanou.
Estessoconhecidoscomomtricasdesucesso:indicadorespodemospistadepois
oprodutofoilanadoparaverseeleestcumprindoonosso
prpriosobjectivosenecessidadesdenossosusurios.Definindoboasmtricasdesucesso
nosinfluenciaasdecisestomadasaolongodoprojecto
atingilosforneceprovasconcretasdovalordousurio
esforosdeexperinciasevocseencontradiantedeumpblicoctico
quandosebuscaaaprovaodooramentoparaoseuprximoprojetoexperinciadousurio.
svezes,essasmtricasestorelacionadascomoprodutoemsiecomo
usado.Quantotempoousuriomdiogastaemseusite
Durantecadavisita?(Ferramentasdeanlisepodeajudaradeterminarisso.)Se
vocquerincentivarseususuriosasesentirconfortvelcomosite,
saireexploraroquevoctemparaoferecer,vocvaiquerervero
vezporaumentovisita.Poroutrolado,sevocquiserfornecer
rapidamente,obtenhaingetoutacessoinformaoefuncionalidade,
podequererdiminuirotempoporvisita.
46/153
27/09/2016
Semttulo
pgina59
40
mtricasdesucessoso
10
indicadoresconcretosde
comoefetivamenteousurio
9
experinciaestacumprir
8
objetivosestratgicos.Nisso
exemplo,medio
7
onmerodevisitas
porusurioregistradopor 6
msindicacomo
5
valiosadosite
seuncleoaudincia.
4
alvo
3
2
lanamentode
novosite
Jan fevereiro
estragar
abrilPodejunhojulhoagosto
setembro
outubro
novembro
dezembro
visitasporms(somenteparausuriosregistrados)
Parasitesquedependemdereceitaspublicitrias,impresseso
nmerodevezespordiaqueumanncioexibidoparaumusurioumincred
iblymtricaimportante.Masvoctemquetercuidadoparaequilibraroseu
objetivoseasnecessidadesdeseususurios.Adicionandovriascamadasde
pginasdenavegaoentreapginainicialeosusuriosdecontedo
quervaicertamenteaumentarsuasimpressesdeanncios,masservir
necessidadesdousurio?Provavelmenteno.E,alongoprazo,eleirmostrar:Comoseu
usuriosficamfrustradosedecidirnovoltar,suasimpresses
cairdequeinicialaltaeprovavelmentevaiacabarmaisbaixodoque
elesestavamquandovoccomeou.
pgina60
41
Nemtodasasmtricasdesucessotemqueserderivadadiretamentedeseusite.
possvelmedirosefeitosindiretosdositetambm.Seoseusite
fornecesoluesparaproblemascomunsaspessoassedeparamcom
47/153
27/09/2016
Semttulo
seuproduto,onmerodetelefonemasqueentramemsuaadua
linhasdeapoioTomerdeveirparabaixo.Umaintraneteficazpodepro
videoprontoacessoaferramentaserecursosquepodemreduziro
tempoquelevaparaosseusvendedoresparafecharumavendaoque,porsuavez,
setraduzdiretamenteemaumentodereceita.
Paramtricasdesucessoparaimpulsionarsignificativamenteaexperinciadousuriodeci
ses,essasmtricasdevemestarclaramenteligadaaaspectosdecomportamentodousurio
quepodesermoldadapornossasescolhasdedesign.Claroque,quandoumrede
assinaroslanamentoseasreceitasdiariamentedastransaesonlinesalta40
porcento,fcilverarelaoentrecausaeefeito.
Masparamudanasqueacontecemaolongodeumperodomaislongodetempo,pode
serdifcilidentificarseessasalteraesresultamdeoutilizador
experinciaoudeoutrosfatores.
Porexemplo,aexperinciadousuriodoseusitenopodefazermuitoporsis
paratrazernovosusuriosparaoseusite,poisvoctemqueconfiarnapalavrade
bocaouseusesforosdemarketingparaisso.Masaexperinciadousurio
temummontedeinflunciasobreseessesvisitantesvoltar.
Mediroretornodevisitaspodeserumatimamaneiradeavaliarsevocest
atenderasnecessidadesdousurio,mastenhacuidado:svezesosusuriosno
voltarporqueseuconcorrentelanouumapublicidadegigantesca
campanhaouporqueasuaempresastemalgumamimprensa.Qualquer
mtricaconsideradaisoladamentepodeserenganosanoseesqueadedarumpasso
paratrseolharparaoqueestacontecendoforadoWebsiteparacertificarsede
vocestrecebendotodaahistria.
pgina61
42
Podeserfcilcairnaarmadilhadepensarqueestamosprojetando
nossoprodutoouservioparaumusurio,algumidealizadoexatamentecomo
nos.Masnoestamosprojetandoparansmesmosestamosprojetandoparaoutra
pessoas,eseasoutraspessoasvogostareusaroquens
criar,precisamosentenderquemelessoeoqueelesprecisam.
Aopassarotempopesquisandoessasnecessidades,nspodemossairdonosso
prpriaperspectivalimitadaeverolocaldopontodevistada
osusurios.
Identificarasnecessidadesdousuriocomplicadoporqueosusuriospodemserbastante
diversificada.Mesmoseestamoscriandoumsiteparausodentrodenossaorga
48/153
27/09/2016
Semttulo
nizao,nsaindapodeterquelidarcomumaamplagamadenecessidades.Sens
estcriandoumaplicativomveldestinadoaumpblicoconsumidor,a
possibilidadesaumentarexponencialmente.
Parachegaraofundodessasnecessidades,temosquedefinirapenasquem
nossosusuriosso.Umavezquesabemosquemestamostentandoalcanar,nspodemos
realizarpesquisascomeles,emoutraspalavras,fazerlhesperguntas
eobservarseucomportamento.Essapesquisapodenosajudaradefinire
priorizaroqueaspessoasprecisamquandoelesusamnossoproduto.
Segmentaodousurio
Nspodemosquebraressamassadeusurioprecisaparabaixoemgerencivel
pedaospormeiodesegmentaodousurio.Dividimosonossopblicoem
gruposmenores(ousegmentos)constitudosporusurioscomcertachave
caractersticasemcomum.Hquasetantasmaneirasdesegmentos
gruposdeusuriosmentocomoexistemtiposdeusurios,masaquisoumcasal
dasabordagensmaiscomuns.
pgina62
43
segmentaodousurio
nosajudaacompreender
usurioprecisamelhor,
dividindoatotalidade
audinciaemmenor
gruposdepessoascom
necessidadespartilhadas.
Pesquisadoresdemercadocomumentecriarsegmentosdepblicocombaseem
49/153
27/09/2016
Semttulo
demogrficascritrios:sexo,idade,graudeinstruo,estadocivil,
renda,eassimpordiante.Estesperfisdemogrficospodeserbastantegeral
(homens1849)ou(,mulherescomformaouniversitriamuitoespecficassolteiros
2534fazendomaisdeUS$50.000porano).
pgina63
44
Demografianosoanicamaneiraquevocpodeolharparaosseususurios.
Psicogrficosperfisdescrevemasatitudesepercepesque
seususuriostmsobreomundoousobreoassuntode
seusiteemparticular.Psicografiamuitasvezessecorrelacionamfortementecom
Dadosdemogrficos:Aspessoasnamesmafaixaetria,localizaoerenda
nvelmuitasvezestmatitudessemelhantes.Mas,emmuitoscasos,demographi
camenteaspessoasidnticostmmuitodiferentesformasdevereinter
agindocomomundo.(Bastapensaremtodosquevocfoiparaaalta
escolacom.)porissoquedescobrirapsicografiadoseu
osusuriospodemlhedarinsightsquevocnopodecomearapartirdedadosdemogrficos.
Aodesenvolverumsiteoudequalquerprodutodetecnologia,h
outroconjuntomuitoimportantedeatitudesaconsiderar:atidosusurios
tudesemdireoWebetecnologiaemsi.Quantotempo
seususuriosgastamusandoaWebacadasemana?atecnologiadeumaparteda
suasvidasdirias?Serqueelesgostamdetrabalharcomprodutosdetecnologia?
Serqueelessempreterosprodutosmelhoresemaisrecentes,oueles
atualizaosomentequandoelestmque?Technophobeseusuriosavanados
SitesabordagemWebdeformasmuitodiferentes,enossosdesignsprecisa
acomodlos.Respostasaperguntascomoestaspodemnosajudar
fazerexatamenteisso.
Almdacompreensodefamiliaridadeeconfortodosnossosusurios
nvelcomatecnologia,precisamosentenderoqueequanto
elessabemsobreoassuntodonossosite.Vendendopanelas
aspessoassaprendemseucaminhoemtornodeumacozinhadevesermanuseado
muitodiferentedevenderparacozinheirosprofissionais.Damesmaforma,umStock
aplicaodenegociaoutilizadosporaquelesnofamiliarizadoscomomercadodeaes
vaiexigirumaabordagemdiferentedeumparainvestidoresexperientes.
Essasdiferenasnaexperinciaouconhecimentospodemformarabasepara
segmentandoonossopblico.
50/153
27/09/2016
Semttulo
pgina64
45
Aformacomoaspessoasusamainformaomuitasvezesdependedesuacondiosocialou
papelprofissional.Asnecessidadesdeinformaodospaisdeumestudante
aplicarparaafaculdadesodiferentesdaquelesdaprpriaestudante.
Identificarosdiferentespapisdeusuriosdoseuprodutopodeajudlo
separloseanalisarassuasdiferentesnecessidades.
Depoisdeterrealizadoalgumapesquisasobreosgruposdeusurios,voc
Talvezsejanecessrioreverossegmentosquevocesttrabalhando.Paraaprova
plo,sevocestpesquisando2534anosdeidade,asmulherescomformaosuperior,
vocpodeacharqueasnecessidadesdosjovensde3034anosdiferir
aquelesdogrupode2529anos.Seadiferenaforgrandeosuficiente,voc
podequerertratloscomogruposseparados,emvezdeanica
2534grupocomquecomeou.Poroutrolado,sea1824
grupoparecebastantesemelhanteaodogrupo2534,talvezvocpossa
combinlos.Criandosegmentosdeusuriosapenasummeioparaofim
dedescobrirasnecessidadesdousurio.Vocrealmentesprecisacomomuitosdiferente
segmentoscomovoctemdiferentesconjuntosdenecessidadesdousurio.
Humaoutrarazoimportanteparacriarsegmentosdeusurios:Nos
vontadediferentesgruposdeusuriostmnecessidadesdiferentes,massvezes
essasnecessidadesestaroemoposiodireta.Leveoploanterior
pledopedidodenegociaodeaes.Osnoviosprovavelmenteseria
melhorservidoporumaaplicaoquerompeuoprocessoemum
seqnciadepassossimples.Paraosespecialistas,noentanto,umatalsequncia
seriaumobstculo.Osperitosprecisamdeumainterfaceunificadaque
permiteoacessorpidoaumaamplagamadefunes.
Obviamente,nsnopodesatisfazerambososconjuntosdenecessidadesdousuriocomumanicasoluo
o.Nossasopesnestemomentosoparaseconcentraremumsegmentodeusurio
aexclusodooutro,ouparafornecerduasformasseparadasparausurios
pgina65
46
paraaproximaramesmatarefa.Independentementedocursoqueescolhemos,estetgia
51/153
27/09/2016
Semttulo
decisoTegicterconsequnciasparacadaescolhaadicional
quefazemossobreaexperinciadousurio.
UsabilidadeeusurioResearch
Paraentenderoquenossosusuriosprecisam,primeirotemosqueterumanoode
quemelesso.Ocampodepesquisadousuriodedicadorecolhado
dadosnecessriosparadesenvolveresseentendimento.
Algumasferramentasdetalpesquisacomoinquritos,entrevistas,ouseconcentrargrupos
soosmaisadequadosparaarecolhadeinformaessobreasatitudesgerais
easpercepesdeseususurios.Outrasferramentas,taiscomopesquisadeusurio
Testesoucampodeestudossoosmaisadequadosparaacompreensoespe
aspectosespedocomportamentodousurioeinteraocomoproduto.
Geralmente,quantomaistempovocpassarcomcadausurioindividual,o
maisdetalhadaainformaoquevocvaicomearapartirdoestudodepesquisa.
Noentanto,essetempoadicionalgastocomcadausurio,necessariamente,
significaquevocnosercapazdeincluiromaiornmerodeusuriosnoestudo(se
apenasporqueoprodutoouserviotemdelanareventualmente).
Mtodosdepesquisademercado,comopesquisasegruposdefocopodeser
fontesvaliosasdeinformaesgeraissobreseususurios.Estes
mtodossomaiseficazesquandovocarticularclaramenteparasimesmo
quaisasinformaesquevocesttentandosairdelas.Vocquer
descobriroqueseususuriosestofazendoquandoelesusamumFEAespecial
turadoseuproduto?Outalvezvocjsabedisso,masvocprecisa
saberporqueelesestofazendoisso.Quantomaisclaramentevocpodedescrever
oquevocquer,omaisestreitoeeficazvocpodeformular
asperguntasquevocpedirparagarantirquevocobtenhaasinformaescorretas.
pgina66
47
Investigaocontextualrefereseaumconjuntodemtodosque,col
lectively,formamoconjuntodeferramentasmaispoderosaeabrangentepara
acompreensodeseususuriosnocontextodasuavidaquotidiana
(Daonome).Estastcnicassoderivadosdosmtodos
usadopelosantroplogosparaestudarasculturasesociedades.aplicadasobre
menorescala,osmesmosmtodosusadosparaexaminar,porexemplo,
comofuncionaumtribonmade,tambmpodeserusadoparaexaminarcomo
pessoasquecompramfunodepeasdeaeronaves.Anicadesvantagemque
investigaocontextualpodesermuitodemoradoemuitopesas
sive.Sevoctemosrecursos,eseuproblemarequerumaprofunda
compreensodeseususurios,umestudodeinvestigaocontextualfullblown
poderevelarsutilezasdocomportamentodousurioquenopodemserdescobertos
52/153
27/09/2016
Semttulo
atravsdeoutrosmtodos.
Emoutroscasos,osmtodoscontextuaispodeserleveeinex
pensativo,no,emboraelestendemaproduziracompreensoprofunda
deumapesquisacompleta.Umexemplodeummtodointimamenterelacionadocom
investigaocontextualanlisedetarefas.Aidiaportrsanlisedetarefas
queainteraodecadausuriocomumprodutoocorreno
contextodealgumatarefaqueousurioestrealizando.Porvezes,atarefa
muitofocado(taiscomoacompradebilhetesdecinema)esvezes
maisamplo(comoaprendersobreocomrciointernacionalderegulao
es).anlisedetarefasummtododeexaminardepertoapreciso
ospassosusuriospercorrernarealizaodessastarefas.esteexame
opodeserfeitopormeiodeentrevistasemquevoccomeausurios
paradizerlhehistriassobresuasexperinciasouatravsdeobservaodirecta
onocampo,estudandoosusuriosemseuhabitatnatural.
Testedeusurioaformamaiscomumenteutilizadadeusurio
pesquisa.testedeusurionosobreotestedeseususuriosemvezdisso,
sobreaobtenodeseususuriosparatestaroquevocproduziu.Asvez
pgina67
48
testesdeutilizadortrabalharcomumprodutoacabado,querempreparaoparauma
redesenharouparaerradicarquaisquerproblemasdeusabilidadeantesdolanamento.emoutra
casos,osusuriospodemtestarumtrabalhoemandamento,oumesmoumprottipospero
doprodutoacabado.
CasovoctenhafeitoqualquerleiturasobreWebdesignemtudo,voctemprobabilidade
habilmentesedepararcomoconceitodeusabilidade.Estapalavrasignificadiferente
coisasparapessoasdiferentes.Algumaspessoasusamparasereferirprtica
detestardesignscomosutilizadoresrepresentativos.Paraoutros,issosignifica
adotarumametodologiadedesenvolvimentomuitoespecfico.
Cadaabordagemparaausabilidadevisatornarosprodutosmaisfceisdeusar.
Muitasdefinieselistasderegrasdiferentesaintenodecodificaroque
constituiumprojetodoWebsiteutilizvel.Algunsdelesatmesmoconcordarcom
entresi.Mastodoselestmomesmoprincpioemseuncleo:Osusurios
precisadeprodutosutilizveis.anecessidadedousuriouniversal,acimadetudo.
Testescomumsitetotalmenteoperacionalpodesermuitoamplooumuito
estreitasemseuescopo.Talcomoacontececompesquisasougruposdefoco,melhorsevoc
terumanooclaradoquevocdesejainvestigarantesdesesentar
secomosusurios.Issonosignifica,noentanto,queumtestedeusuriotem
aserestritamentelimitadaaavaliarograudesucessousurioscompleta
umatarefaestritamentedefinido.testedeusuriotambmpodeinvestigarmaisamplo,
53/153
27/09/2016
Semttulo
menosproblemasdeconcreto.Porexemplo,umtestedeutilizadorpoderiaserusadoparalocalizar
descobrirseasalteraesaoprojectoreforarouenfraquecera
mensagemdemarcadaempresa.
Outraabordagemparatestesdeusuriosterosusuriostrabalhamcompro
totypes.Estespodemassumirumavariedadedeformas,desdeesboossobre
papel,para"lofi"mockupsusandoprojetosdeinterfaceenxuta,
a"clickthrough"prottiposquecriamailusodeumaacabado
produto.projectosdemaiordimensoempregamdiferentestiposdeprottipos
pgina68
49
emdiferentesestgiosderecolheraentradadousuriotodoocaminhoatravsdo
processodedesign.
svezestestesdeutilizadornoenvolvemositeemtudo.Vocpoderecrutar
aosusuriosexecutarumavariedadedeexercciosquepodemdarlheinsights
emcomoelesabordamoassuntodoseusite.parainfor
sitesvoltadosparamao,cardsortingummtodoutilizadoparaexplorar
comoosusurioscategorizarouelementosdeinformaogrupo.Ousurio
dadaumapilhadefichas,cadaumdosquaistemonome,adescrio
o,ouaimagemdeumapeaoutipodecontedonele.Ousurio,emseguida,classifica
oscartesempilhasdeacordocomosgruposoucategoriasquesesentem
maisnatural.Analisandoosresultadosdetiposdecartorealizadascom
vriosusuriospodemnosajudaraentendercomoelespensamsobreo
informaesnossositeoferece.
criandoPersonas
Coletandotodosostiposdedadossobreseususuriospodeserextremamentevaliosa
capaz,massvezesvocpodeperderdevistaaspessoasreaisportrsdetudo
asestatsticas.Vocpodetornarseususuriosmaisreal,transformandoas
empersonas(svezeschamadodemodelosdeusuriosouperfisdeusurio).Um
personaumpersonagemfictcioconstrudopararepresentarasnecessidades
detodaumagamadeusuriosreais.Aocolocarumrostoeumnomena
pedaosdesconectadosdedadosdesuapesquisadousurioeasegmentao
trabalho,personaspodeajudaragarantirquevocmantenhaosusuriosemmente
duranteoprocessodedesign.
Vejamosumexemplo.Suponhaqueonossositeprojetadoparafornecer
informaoparaaspessoasqueestocomeandoseusprpriosnegcios.Ns
sabemosdenossapesquisaqueonossopblicocaiprincipalmentena3045
faixaetria.NossosusuriostendemaserbastanteconfortvelcomaWebe
tecnologiaemgeral.Algunsdelestmmuitaexperinciana
54/153
27/09/2016
Semttulo
pgina69
50
mundodosnegciosparaosoutros,istoasuaprimeiraexposioatodoo
questesenvolvidasnagestodeumaempresa.
Nestecaso,podeserapropriadoparacriarduaspersonas.Bem
chamaroprimeiroJanet.Ela42anosdeidade,elacasada,eela
temdoisfilhos.Elapassouosltimosdoisanoscomovicepresidente
emumagrandeempresadecontabilidade.Elasetornoufrustradocomtrabalho
paraoutraspessoas,eagoraelaquerconstruirumaempresadesuaprpria.
AsegundapersonaFrank.Ele37anosdeidade,casadoecom
umacriana.CarpintariatemsidoumhobbydefimdesemanadeFrankde
muitosanos.Algunsamigosdeleficaramimpressionadoscomalgunsmveis
elefez,entoeleestpensandoqueelepoderiaentrarnonegcioparaele
autovendendoseutrabalho.Elenotemcertezaseelevaiterquepararseutrabalhocomoum
motoristadenibusescolar,afimdelanaroseunovonegcio.
Ondequetodaestainformaovem?Bem,nasuamaiorparte,
nsofizemosacima.Queremosqueosnossospersonasparasercoerentecomoquens
sabersobreosusuriosdenossapesquisa,masosdetalhesespecficosde
nossaspersonassoinvenesdefico,usadosparadarvidaaestes
personagensquevaificarnoparanossosusuriosreais,aovivo.
JaneteFrankrepresentamagamadenecessidadesdosutilizadoresqueteremosde
manteremmentequeestamosatomardecisessobreaexperinciadousurio
donossosite.Paranosajudaralembrarloseassuasnecessidades,vamospegaruma
pardefotosparadarJaneteFrankumpoucomaisdeidentidade,
ecombinarasfotoscomasinformaessobreelesnstemos
coloquejunto.Essesperfispodemserimpressoseafixadosemtorno
oescritriodemodoque,quandotemosdecisesatomar,podemosperguntarnosso
eus(eentresi):"SerqueotrabalhodeJanet?Comoseria
Frankreagiraisso?"Aspersonasnosajudaramanternossosusuriosemmente
cadapassodocaminho.
pgina70
51
55/153
27/09/2016
Semttulo
Personassofictcios
caracteresextradas
apesquisadousurioque
"Eunotenhotempopararesolveratravsdeumasriede
servircomoexemplooscasos
emformao.Euprecisoderespostasrpidas."
Duranteaexperinciadousurio
Janetestfrustradocomotrabalhoemumambientecorporativo
desenvolvimento.
equercomearsuaprpriaprticacontbil.
Janet
Idade:42
FichaTcnica:BastanteconfortveiscomatecnologiaDell
Ocupao:Contabilidadevicepresidentefirme
laptop(cercadeumanodeidade)comoWindows5Mbit
Famlia:
Casado,doisfilhos
Conexodeinternet1520horas/semanaonline
Rendafamiliar:$180.000/ano
OusodaInternet:75%emcasanotciaseinformaes,
compras
sitesfavoritos:
WSJ.com
Salon.com
Travelocity.com
franco
"Estematerialtudonovoparamim.Queroumsite
quevaiexplicartudo."
Frankestinteressadoemaprendercomoelepodetransformarsua
hobbydefazermveisemumnegcio.
Idade:37
FichaTcnica:Umpoucodesconfortvelcomatecnologia
:Ocupaomotoristadenibusescolar
AppleiMac(cercadedoisanosdeidade)DSLligaoInternet
Famlia:
Casado,umfilho
810horas/semanaonline
Rendafamiliar:$60.000/ano
AutilizaodaInternet:100%emcasaentretenimento,compras
sitesfavoritos:
ESPN.com
moviefone.com
eBay.com
pgina71
52
questesestratgicasafetamtodososenvolvidosnaexperinciadousurio
processodedesign.Mas,apesardisso(outalvezporcausadela),
aresponsabilidadededesenvolverestesobjectivos,muitasvezesatravsdequedas
asrachaduras.Empresasdeconsultoria,porvezes,vaiempregarestrategistas
emprojetosdeclientesparagerirestasquestes,masporquetaisrar
perciaefiedtendeasercaros,eporquenosoestrategistas
diretamenteresponsvelpelaconstruodequalquerpeadoprprioprodutoisto,
itemdelinhamuitasvezesumdosprimeirosasercortadosapartirdeumoramentodoprojeto.
56/153
27/09/2016
Semttulo
Estrategistasvaifalarcommuitaspessoasemtodaaorganizao
obteromaiornmeropossveldeperspectivassobreasquestesdeduto
UCTobjetivosenecessidadesdousurio.Aspartesinteressadassodecisessnior
decisoresquesoresponsveisporpartesdaorganizaoqueir
serafectadopeladirecoestratgicafinaldoproduto.Para
exemplo,nocasodeumsitedaWebconcebidaparaforneceraosclientes
comacessoainformaesdesuportedoproduto,aspartesinteressadaspoderiam
incluirrepresentantesdecomunicaesdemarketingeadua
serviodeTomer,bemcomogerentesdeproduto.Dependedaformais
estruturadetomadadedecises(easrealidadespolticasinformais)de
aorganizao.
Umgrupofrequentementenegligenciadonaformulaodeumaestratgiaaclassificao
earquivosresponsveispormanteraorganizao
funcionandonumabasediaadia.Masessaspessoasmuitasvezestmumame
ternoodoquefuncionaeoquenofuncionadoqueosseusgestores
Faz.Elespodeminformaraestratgiademaneirasdecisoresseniores
nopode,especialmentequandosetratadenecessidadesdousurio.Ningumsabeoque
osclientesestotendoproblemascommelhordoqueaspessoasque
conversarcomosclientestodososdias.Muitasvezessousurpreendidocomoquo
pgina72
53
raramentefeedbackdoclienteencontraoseucaminhoparaodesigndeproduto
easequipesdedesenvolvimentoquedelenecessitam.
objetivosdoprodutoeasnecessidadesdosutilizadoressofrequentementedefinidosdeformaformal
documentodeestratgiaoudocumentodeviso.Estedocumentonoapenasum
listadeobjetivosdepropiciarumaanlisedasrelaesentre
osdiversosobjectivosedecomoessesobjetivosseencaixamnamaior
contextodaorganizao.Osobjectivoseassuasanlisesso
muitasvezesapoiadosporcitaesdiretasdeinteressados,rankandfile
funcionrioseosprpriosusurios.Estascitaesilustramvividamentea
questesestratgicasenvolvidasnoprojeto.Asnecessidadesdoutilizadorso,porvezes
documentadaemumrelatriodepesquisadeusurioseparada(emboraexistam
certasvantagensemtertodasassuasinformaesemumslugar).
Maiornonecessariamentemelhorquandosetratadedocumentaroseu
estratgia.Vocnotemdeincluirtodosospontosdedadosecadaapoio
portarcitaoparaobterasuaideiadedimetro.Mantloconcisoediretoao
ponto.Lembresequemuitaspessoasquevoserexpostosaodoc
umentonotemtempoouinteresseparapercorrercentenasde
pginasdematerialdeapoio,emuitomaisimportantedoqueeles
entenderaestratgiadoqueelesficarimpressionadocomovolume
deverborragiaquevocproduziu.Umdocumentodeestratgiaeficazno
57/153
27/09/2016
Semttulo
sservecomoummarcoparaodesenvolvimentoexperinciadousurio
equipeeletambmpodeserusadoparaconstruiroapoioparaoprojetoemoutro
partesdaorganizao.
Apiorcoisaquevocpodefazercomseudocumentodeestratgia
limitaroacessodesuaequipeparaele.Odocumentonofoicriadoparaser
arquivadosemalgumlugaroucompartilhadoapenascomumpunhadodealtos
membrosseopessoaldoesforoquefoiparaelevaipagar,
odocumentotemdeserusadoativamenteduranteoprojeto.Todos
pgina73
54
participantesdesigners,desenvolvedores,gerentesdeprojetoanecessidade
documentodeestratgiaparatomardecisesinformadassobreoseutrabalho.
documentosdeestratgia,muitasvezescontmmaterialsensvel,masorganizao
espodeirlongedemaisemanteraestratgiadedistnciadoresponsvel
equipe,oquecomprometeasuacapacidadederealizlo.
Estratgiadeveseroinciodeseuprojetoexperinciadousurio
processo,masissonosignificaqueasuaestratgiadeveserdefinidoempedra
antesqueoprojetopossaavanar.EmboratentandobaterumdosMOVIMENTOS
ingalvopodeserumtremendodesperdciodetempoerecursos(parano
mencionarumaenormefontedefrustraointerna),asestratgiaspodeme
deveevoluireserrefinado.Quandorevistoerefinadosistema
ticamente,otrabalhodeestratgiapodeserumafontecontnuadeinspirao
todooprocessodedesigndeexperinciadousurio.
58/153
27/09/2016
Semttulo
pgina74
pgina75
59/153
27/09/2016
Semttulo
4
captulo
Oescopo
Avio
Especificaesfuncionaise
Requisitoscontedo
pgina76
Superfcie
Esqueleto
Comumanooclaradoquequeremosequeonosso
Estrutura
osusuriosquerem,podemosdescobrircomosatisfazeratodosaqueles
60/153
27/09/2016
Semttulo
Escopo
objetivosestratgicos.Estratgiatornaescopoquando
loatraduzirasnecessidadesdosutilizadoreseobjectivosdoprodutoem
Estratgia
requisitosespecficosparaocontedoefunciona
alityoprodutovaiofereceraosusurios.
projetosensorial
ND
designdainformao
Interao Emformao
ati
projeto Arquitetura
r
Funcional Contedo
en
Especificaes
requisitos
nt
Objetivosdoproduto
pgina77
58
CAPTULO4OPLANOSCOPE
Definiodombito
Fazemosalgumascoisasporquenohvalornoprocesso,comoJOG
gingoupraticandoescalasnopiano.Nsfazemosoutrascoisas,porque
nohvalornoproduto,comofazerumbolodequeijoouafixaodeum
carro.Definindooescopodoseuprojetoaomesmotempo:umprocessovalioso
queresultanumprodutovalioso.
Oprocessovaliosoporqueoobrigaaabordarpotenciais
conflitosemanchassperasnoproduto,enquantoacoisatoda
aindahipottica.Podemosidentificaroquepodemosenfrentaragorae
oquevaiterqueesperaratmaistarde.
Oprodutovaliosoporqueeledtodaaequipeumareferncia
pontoportodootrabalhoaserfeitodurantetodooprojetoeumcom
linguagemcomumparafalarsobreessetrabalho.Definindoseurequisito
mentosimpulsionaambiguidadeforadoprocessodedesign.
Certavez,trabalheiemumaplicativodaWebquepareciaestaremumestado
debetaperptuo:quase,masnocompletamente,prontopararolarparaforaparareal
usurios.Ummontedecoisasforamerradocomanossaabordagemanologia
61/153
27/09/2016
Semttulo
giaerainstvel,noparecemsaberalgosobrenossosusurios,
eeueraanicapessoaemtodaaempresaquetevequalquer
experinciaemtudocomodesenvolvimentoparaaWeb.
Masnadadissoexplicaporquenoconseguimosobteroprodutopara
lanamento.Ograndeobstculofoiumafaltadevontadeparadefinir
requisitos.Afinaldecontas,eraummontedeproblemasparaescrevertudo
parabaixoquandotodosnstrabalhamosnomesmoescritriodequalquermaneira,ealmdisso,
ogerentedeprodutonecessrioparaconcentrarsuaenergiaemesbarracom
novascaractersticas.
pgina78
59
Oresultadofoiumprodutoqueeraumamiscelneademutaode
caractersticasemvriosestgiosdecompletude.Cadanovoartigoalguns
corpolerouacadanovopensamentoqueveiojuntoquandoalgum
estavabrincandocomoprodutoinspirouumaoutracaractersticadeconsidervel
o.Houveumfluxoconstantedetrabalhoemcurso,masnohouve
horrio,nohaviamarcos,enohaviafimvista.
Porqueningumsabiaoescopodoprojeto,comoalgumpoderia
saberquandoestvamosterminou?
Hduasrazesprincipaisparasepreocupamemdefinirrequisitos.
Razo#1:Entovocsabeoquevocestconstruindo
Issoparecemeiobvio,masveiocomoumasurpresaparaaequipe
construiresseaplicativoWeb.Sevocarticularclaramenteexatamenteoque
vocestdefinindoaconstruir,todomundovaisaberoqueoprojeto
objetivossoequandoelesforamatingidos.Asparagensdoprodutofinal
sendoumaimagemamorfanacabeadogerentedeproduto,e
tornasealgodeconcretoquetodosemtodososnveisda
organizao,desdealtosexecutivosparaengenheirosdenveldeentrada,pode
trabalharcom.
Naausnciaderequisitosclaros,oprojetoprovavelmente
revelarsecomoumjogodeescolade"Telephone"cadapessoa
aequiperecebeumaimpressodoprodutoatravsdapalavradaboca,e
Adescriodetodomundoacabaumpoucodiferente.Ou,piorainda,
todomundoassumequeoutrapessoaestgerenciandooprojetoedesen
mentodealgumaspectocrucialdoproduto,quandonaverdadeningum.
62/153
27/09/2016
Semttulo
pgina79
60
CAPTULO4OPLANOSCOPE
Terumconjuntodefinidoderequisitospermiteparcelar
responsabilidadepelotrabalhodeformamaiseficiente.Vendotodooescopo
mapeoupermiteverasconexesentreosdiferentes
requisitosquepossamnoseraparente.Porexemplo,
emdiscussesiniciais,adocumentaodesuporteeoproduto
folhasdeespecificaopodeterparecidorecursosdecontedoseparadas,mas
definindooscomorequisitospodetornarevidentequenoh
umagrandequantidadedesobreposioequeomesmogrupodeveserresponsvel
paraambos.
Razo#2:Entovocsabeoqueestnourbanizveis
Lotesdascaractersticassoarcomoboasidias,maselesnonecessariamente
alinharcomosobjetivosestratgicosdoprojeto.Almdisso,todos
ostiposdepossibilidadesderecursossurgemdepoisqueoprojetoestbem
andamento.Tendorequisitosclaramenteidentificadosfornecelhe
comumaestruturaparaavaliarasidiasquevmjunto,
ajudandovocaentendercomo(ouse)elesseencaixamoquevoc
jsecomprometeuaconstruir.
Saberoquevocnoestconstruindotambmsignificasaberoquevoc
noconstruiragora.Ovalorrealparaarecolhadetodososgrandes
ideiasvemdeencontrarmeiosadequadosparaencaixlosemseu
planosdelongoprazo.Aoestabelecerconjuntosconcretosderequisitose
armazenamentosolicitaesquenoseencaixamcomopossibilidadesparafuturoslanamentos,
vocpodegerenciartodooprocessodeumaformamaisdeliberada.
pgina80
63/153
27/09/2016
Semttulo
Janeiro(agora) abril
julho
verso1.0
61
requisitosque
Outubro (Aolado)janeiro
nopodemsercumpridasna
atualpodeagendar
formarabaseparaa
prximomarcoemsua
ciclodedesenvolvimento.
verso1.1
Sevocnocontrolarconscientementesuasnecessidades,vocvaiter
pegonotemido"aumentodoescopo."Aimagemtrazsempre
menteparamimaboladenevequerolaparafrenteumapolegadae,emseguida,
outrapegandoumpoucodeneveextracomcadaturnoatqueseja
Roldodesceromorro,ficandomaioremaisdifcildeparartodoo
caminho.Damesmaforma,cadaumrequisitoadicionalpodenoparecer
assimmuitotrabalhoextra.Mascoloclostodosjuntos,evoc
tenhoumprojetocontinueaandarsemcontrolo,esmagandoprazose
estimativasoramentaisnoseucaminhoemdireoaumaquedafinalinevitvel.
Funcionalidadeecontedo
Noplanoescopo,partimosdaquestoabstratade"Por
estamosfazendoesteproduto?"quetratmosjnaestratgia
avioeconstruirsobreelecomumanovapergunta:"Oquevamos
fazer?"
pgina81
62
CAPTULO4OPLANOSCOPE
ctionality
estrutura
Funcional
escopo
Especificaes
Contedo
requisitos
estratgia
64/153
27/09/2016
Semttulo
AseparaoentreaWebcomoumveculoparaafuncionalidadeea
Webcomoummeiodeinformaocomeaachegaremjogona
avioescopo.Doladodafuncionalidade,nsestamospreocupadoscomoque
seriaconsideradooconjuntoderecursosdoprodutodesoftware.Em
ladodainformao,estamosalidarcomocontedo,otradicional
domniodegruposdecomunicaoeditoriaisedemarketing.
Contedoefuncionalidadeparecemquasetodiferentescomodois
ascoisaspoderiamser,masquandosetratadedefiniroescopo,elespodemser
tratadosdeformasmuitosemelhantes.Aolongodestecaptulo,vouusar
otermorecursoparasereferiraambasasfunesdesoftwareecontedo
ofertas.
Nodesenvolvimentodesoftware,oescopodefinidoatravsfuncional
requisitosouespecificaesfuncionais.algumasorganizaes
usaressestermosparasignificardoisdocumentosdiferentes:requisitos
noinciodoprojetoparadescreveroqueosistemadeve
fazer,eespecificaesnofimdedescreveroqueelerealmentefaz.
Emoutroscasos,asespecificaessodesenvolvidoslogoapso
pgina82
63
requisitos,preencherdetalhesdeimplementao.Masamaiorpartedo
tempo,essestermossointercambiveisnaverdade,algumaspessoasusamo
termoespecificaoderequisitosfuncionaisapenasparasecertificarqueelestm
cobriutodasasbases.Vouusarespecificaesfuncionaisparasereferir
documentoemsi,erequisitosparasereferiraoseucontedo.
Alinguagemdestecaptuloprincipalmentealinguagemdosoftware
desenvolvimento.Masosconceitosaquiaplicamseigualmenteparaocontedo.
desenvolvimentodecontedomuitasvezesenvolveumaRequisitosmenosformal
processodedefiniodoqueosoftwarefaz,masosprincpiossubjacentes
soosmesmos.Umdesenvolvedordecontedovaisentareconversarcom
pessoasouporesobrematerialdeorigem,quequerserumbancodedadosou
umagavetacheiaderecortesdenotcias,afimdedeterminaroqueinfor
maoprecisadeserincludonocontedoqueestemdesenvolvimento.este
processoparadefinirosrequisitosdecontedonorealmentetudooque
diferentedotecnlogodebrainstormingrecursoscomATOR
titularesereveradocumentaoexistente.Ospropsitose
abordagenssoomesmo.
65/153
27/09/2016
Semttulo
exignciasdecontedomuitasvezestmimplicaesfuncionais.Estes
dias,sitesdecontedopurossogeralmentetratadasatravsdeumcontedo
sistemadegesto(CMS).Estessistemasvmemtodasasformas
etamanhosdesistemasmuitograndesecomplexasquedinamicamente
gerarpginasdeumadziadediferentesfontesdedadosparaleve
ferramentasotimizadasparaagestodeumtipoespecficoderecursodecontedo
aformamaiseficiente.Vocpodeoptarporcomprarumproprietrio
sistemadegerenciamentodecontedo,useumdosmuitosopensource
alternativas,ouatmesmoconstruirumdozero.Emqualquercaso,ser
tomaralgunsajustesparaadequarosistemasuaorganizaoe
seucontedo.
pgina83
64
CAPTULO4OPLANOSCOPE
Agestodecontedos
sistemapodeautomatizar
ofluxodetrabalhonecessrio
paraproduzireentregar
contedoaosusurios.
editordecontedo Editordecpia
escritor
doutilizador
daspartesinteressadas
advogado
Afuncionalidadequevocprecisaemseusistemadegerenciamentodecontedo
vaidependerdanaturezadocontedoquevocestarcontrolando.Vontade
vocsermanterocontedoemvriosidiomasouformatosdedados?
OCMSterdesercapazdelidarcomtodosostiposdecontedo
elementos.SerquetodasasnecessidadesdeimprensaaseraprovadoporseisExec
vicepresidentesutiveeumadvogado?OCMSterodeapoiar
essetipodeprocessodeaprovaoemseufluxodetrabalho.Serqueocontedoelementos
serrecombinadosdinamicamentedeacordocomasprefernciasdecada
usurioouodispositivoqueelesestousando?OCMSterdesercapazde
atingiressenveldeentregacomplexo.
Damesmaforma,osrequisitosfuncionaisdequalquerprodutodetecnologia
terimplicaesdecontedo.Haverinstruesnarncia
teladeconfiguraorncias?Comosobremensagensdeerro?Alguns
corpotemqueescreveresses.Todavezquevejoumamensagemdeerroemum
Websitecomo"exceocampodeentradanulo,"Euseiquealgumengenheirode
mensagemdeespaoreservadotornounoprodutofinalporqueningum
fezessamensagemdeerroaexignciadecontedo.inmerosalegadamente
projetostcnicospoderiatersidomelhoradoimensamenteseo
desenvolvedoressimplesmentetinhatidotempoparateralgumolharparao
66/153
27/09/2016
Semttulo
aplicaocomumolhoparaocontedo.
pgina84
65
definiodeRequisitos
Algunsrequisitosaplicveisaoprodutocomoumtodo.marca
requisitossoumexemplocomumdestecertatcnica
requisitos,comonavegadoresesistemasoperacionaissuportados,
sooutra.
Outrosrequisitosseaplicamapenasaumrecursoespecfico.Amaioriados
momentoemqueaspessoassereferemaumrequisito,elesestopensandodeum
brevedescriodeumanicacaractersticadoprodutoobrigadoater.
Onveldedetalheemsuasnecessidades,muitasvezes,dependemda
mbitoespecficodoprojeto.Seoobjetivodoprojetoimplementar
mentumsubsistemamuitocomplexo,ummuitoelevadonveldedetalhe
podesernecessrio,mesmoqueombitodoprojectorelativoaos
ositemaiorpodeserbastantepequena.Poroutrolado,umamuitograndeescala
projetodecontedopodeenvolverumabase,talhomogneadecontedo
(TalcomoumgrandenmerodePDFfuncionalmenteidnticasdeprodutos
manuais)queosrequisitosdecontedospodesermuitogeral.
Afontemaisprodutivapararequisitossersempreasua
osprpriosusurios.Mas,maisfrequentemente,suasnecessidadesvir
daspartesinteressadas,aspessoasemsuaorganizaoquetmalgoadizer
sobreoquesepassaemseuproduto.
Emambososcasos,amelhormaneiradedescobriroqueaspessoasqueremsimplesmente
perguntarlhes.AstcnicasdepesquisadousuriodescritosnoCaptulo3
tudopodeserusadoparaajudloaobterumamelhorcompreensodostipos
derecursosqueosusuriosqueremveremseuproduto.
Sevocestdefinindorequisitoscomaajudadestakehold
ersdentrodesuaorganizaoouquetrabalhamdiretamentecomosusurios,o
pgina85
67/153
27/09/2016
66
Semttulo
CAPTULO4OPLANOSCOPE
exignciasquevmdeforadoprocessovaicairemtrsge
CategoriasGerais.Primeiro,emaisbvio,soascoisasqueaspessoasdizem
elesquerem.Algumasdelassomuitoclaramenteboasideiaseencontraro
seucaminhoparaoprodutofinal.
svezes,ascoisasqueaspessoasdizemquequeremnosoascoisasqueeles
realmentequerem.Noincomumparaqualquerum,quandosedeparam
algumadificuldadecomumprocessoouumproduto,imaginarumasoluo.
svezes,essasoluoinvivel,oueleabordaumsintoma
emvezdeacausasubjacentedoproblema.Aoexplorar
estassugestes,vocpodesvezeschegaracompletamentediferente
requisitosqueresolvemoproblemareal.
Oterceirotipodeexignciaacaractersticadaspessoasnosabe
elesquerem.Quandovoclevaraspessoasafalardeobjectivosestratgicos
enovasexignciasquepossamcumprilas,svezeselesvo
bateuemcimadegrandesidiasquesimplesmentenotinhaocorridoaningumdurante
amanutenopermanentedoproduto.Estes,muitasvezessair
debrainstormingexerccios,quandoosparticipantestmaoportunidadedefalar
atravseexploraraspossibilidadesparaoprojeto.
Ironicamente,porvezes,aspessoasmaisprofundamenteenvolvidonacriao
etrabalharcomumprodutosoosquetmmenoscondiesdeimaginarnova
direesparaele.Quandovocgastatodooseutempoimersoemteno
tenodeumprodutoexistente,muitasvezesvocpodeesquecerquedoseu
constrangimentossoreais,equesosimplesmenteprodutosdehistrico
escolhas.Porestarazo,assessesdegrupodebrainstormingquetrazem
juntospessoasdediversaspartesdaorganizaoourepresentar
diversosgruposdeusuriospodemserferramentasmuitoeficazesemabrirasmentes
departicipantespossibilidadesquenoteriaconsideradoantes.
Obtendoumengenheiro,umagentedeservioaocliente,eummarketing
pessoaemumquartojuntosparafalarsobreomesmoWebsitepodeser
pgina86
67
esclarecedorparatodos.Auditivosdesconhecidasperspectivase
teraoportunidadederesponderlhesincentivaaspessoasa
pensaremtermosmaisamplos,acercadosproblemasenvolvidosnodesenvolvimento
odoprodutoeaspossveissolues.
Qualquerdispositivoqueestamosprojetandoparaouseestamosprojetandoo
dispositivoemsi,onossoconjuntoderecursosterdeteremcontahardware
68/153
27/09/2016
Semttulo
requisitosWare,tambm.Odispositivotemumacmera?GPS?
sensoresdeposiogiroscpicos?Estasconsideraesirinformare
restringirsuaspossibilidadesfuncionais.
requisitosgerandomuitasvezesumaquestodeencontrarmaneirasde
removerimpedimentos.Porexemplo,suponhaquevoctenhaumusurio
quejtenhadecididoacomprarumproduto,elessimplesmentenotm
decidiuseoseuprodutooqueelesvocomprar.Oquepodeoseusite
fazerparatornaresteprocessoprimeiroselecionarseuprodutoe,emseguida,comprar
ingseuprodutomaisfcilparaeles?
NoCaptulo3,vimosatcnicadecriaodecharficcional
acterschamadopersonasparanosajudaracompreendermelhorasnecessidadesdousurio.Dentro
requisitosdeterminao,podemosusaressaspersonasnovamenteput
tingnossospersonagensfictciosempequenashistriaschamadocenrios.Um
cenrioumanarrativacurta,simplesdescrevendocomoumapersonapode
irsobreatentarcumprirumadessasnecessidadesdousurio.Aoimaginaro
processarosnossosutilizadorespossampassar,quepodeviratcompotencial
requisitosparaajudarasatisfazerassuasnecessidades.
Nstambmpodeolharparaosnossosconcorrentesparaainspirao.Qualqueroutrapessoaem
omesmonegcioquasecertamentetentarcumpriromesmousurio
necessidadese,provavelmente,esttentandorealizarprodutosemelhanteobjec
tivasbem.Temumconcorrenteencontrouumrecursoparticularmenteeficaz
paraatenderumdestesobjectivosestratgicos?Comoelesdirigida
osmesmoscompromissosecompromissosqueenfrentamos?
pgina87
68
CAPTULO4OPLANOSCOPE
Mesmoprodutosquenosoconcorrentesdiretospodemservircomofrtil
fontesparaeventuaisnecessidades.Algumasplataformasdejogos,para
exemplo,ofereceraosusuriosacapacidadedecriargrupossociaisdecompanheiro
jogadoras.Adotaroucombasenasuaabordagemaoescopodeum
recursosemelhanteparaonossogravadordevdeodigitalpodenosdarumavanta
Tagesobreanossaconcorrnciadirecta.
Especificaesfuncionais
especificaesfuncionaistmalgodeumamreputaona
determinadosbairros.Osprogramadoresgeralmenteodeioespecificaesporqueelestendem
serterrivelmenteaborrecido,eotempodeleituradelestemponecessrio
longedaproduodecdigo.Comoresultado,especificaesirnolida,oque
porsuavez,reforaaimpressodequeproduzilosumdesperdcio
detempo,porque!Amabordagemsespecificaestornaseumauto
profeciacumprindo.
69/153
27/09/2016
Semttulo
Umareclamaosobreespecificaesfuncionaisqueelesnofazem
refletiroprodutoreal.Ascoisasmudamduranteaimplementao.
Todomundoentendeisso,anaturezadotrabalhocomlogia
logia.svezesalgoquevocpensouqueiriatrabalharnofez,ou
maisprovvelnofuncionoudamaneiraquevocpensavaqueseria.Este,
noentanto,noumarazoparaabandonarescreverespecificaescomoumacausaperdida.
Emvezdisso,eledestacaaimportnciadeespecificaesquerealmentefuncionam.
Quandoascoisasmudamduranteaimplementao,arespostano
vomitarsuasmosedeclararainutilidadedeescreverespecificaes.o
respostafazercomqueoprocessodedefiniodasespecificaesleves
osuficienteparaqueaespecificaonosetorneumprojetoseparadododesen
volveroprodutoemsi.
pgina88
69
Emoutraspalavras,adocumentaonovairesolverosseusproblemas.definio
ovai.Nosetratadevolumeoudetalhes.Tratasedeclarezaepreciso
atrevido.Specsnotemqueincorporamtodososaspectosdoprodutodeapenas
osquenecessitamdefinioparaevitarconfusonaconcepoe
processodedesenvolvimento.Easespecificaesnoprecisacapturaralgunsideal
izedestadofuturoparaosprodutodeapenasasdecisesquetmsido
feitanodecursodasuacriao.
Escreverparabaixo
Noimportaquograndeoucomplexooprojetopodeser,algunsgeral
regrasseaplicamaescreverqualquertipodeexigncias.
Sejapositivo.Emvezdedescreverumacoisaruimosistemanodeve
no,descrevaoqueelevaifazerparaevitarquealgoruim.Porexemplo,
emvezdisso:
Osistemanopermitirqueousurioacomprarumapipasem
linhadepipa.
Issoseriamelhor:
Osistemairdirecionarousurioparaapginadelinhadepipaseousuriotenta
paracomprarumapipasemcorda.
Sejaespecfico.Deixandoomnimopossvelabertointerpretao
anicamaneiraquenspodemosdeterminarseumaexignciatemsido
realizada.
Compareessesexemplos:
70/153
27/09/2016
Semttulo
1.Osvdeosmaispopularesserodestacadas.
2.Osvdeoscommaisvisualizaesnasemanapassadaaparecerono
topodalista.
pgina89
70
CAPTULO4OPLANOSCOPE
Oprimeiroexemplopareceidentificarumaexignciaclara,maselefaz
Notomemuitainvestigaoparacomearabrindoburacosnele.Oqueconta
topopular?Vdeoscommaiscomentrios?Aquelescomo
mais"como"votos?Eoqueconstituidestacandolos?
Osegundoexemplodefineonossoobjetivoemdetalheespecfico,definindo
oqueentendemosporpopularesedescrevendoummecanismodealta
iluminao.Aoeliminarapossibilidadedeinterpretaesdivergentes,
Osegundorequisitoordenadamentecontornaostiposdeargumentosprovveis
asurgirduranteouapsaimplementao.
Evitelinguagemsubjetiva.Istorealmenteapenasumaoutramaneirade
sendoespecficoeremoodeambiguidadee,porconseguinte,apossibili
dadeparaerrosdeinterpretaodosrequisitos.
Aquiestumaexignciaaltamentesubjetivo:
Ositeterumquadril,estilochamativo.
Requisitosdeveserfalsificvel,isto,deveserpossvel
demonstrarquandoumrequisitonofoiatendido.difcil
demonstrarsequalidadessubjetivascomohipechamativotm
foicumprida.Aminhaideiademodernidadeprovavelmentenocoincidecomoseu,
e,provavelmente,oCEOtemumaoutraidiainteiramente.
Issonosignificaquevocnopodeexigirqueoseusiteestarnamoda.Vocapenas
temqueencontrarmaneirasdeespecificarquaisoscritriosqueseroaplicados:
OsiteirsatisfazerasexpectativashipnessdeWayne,osecretriomail.
Wayne,normalmente,notmnadaadizersobreoprojeto,masanossa
patrocinadordoprojetorespeitaclaramenteoseusentidodemodernidade.Esperemosqueseja
nomesmosentidonossosusuriostm.Masaexignciaaindabastante
pgina90
71/153
27/09/2016
Semttulo
71
arbitrriaporqueestamoscontandocomaaprovaodeWayne,emvezdecri
triosquepodesermaisobjetivamentedefinido.Ento,talvezesterequisito
mentoseriaomelhordetudo:
Aaparnciadositeestardeacordocomasdiretrizesdaempresadebranding
documento.
Todooconceitodemodernidadejdesapareceuinteiramenteapartirde
orequerimento.Emvezdisso,temosumarefernciaclara,inequvoca
comasdiretrizesestabelecidas.Paracertificarseasdiretrizesdemarcaso
suficientementequadril,oVPdemarketingpodeconsultaroemailWayne
caixeiro,ouelapodeconsultarsuafilhaadolescente,ouelaaindapode
consultaralgunsresultadosdepesquisadousurio.Cabeaela.Masagorapodemos
dizerdefinitivamenteseorequisitofoiatendido.
Tambmpodeeliminarasubjetividadeatravsdadefiniodealgunsrequisitos
quantitativamente.Assimcomomtricasdesucessofazermetasestratgicasquan
tifiable,definindoumaexignciaemtermosquantitativospodenosajudar
identificarsensjnosconhecemosaexigncia.Porexemplo,emvez
deexigirqueosistematem"umaltonveldedesempenho,"ns
podeexigirqueosistemaserconcebidoparasuportarpelomenos1000
usuriossimultneos.Seoprodutofinalspermitequeousuriodetrsdgitos
nmeros,podemosdizeraexigncianofoicumprida.
Requisitoscontedo
Grandepartedotempo,quandofalamosdecontedo,estamosreferindosea
texto.Masasimagens,deudio,devdeoepodesermaisimportantedoqueo
respectivotexto.Estestiposdecontedodiferentestambmpodetrabalhar
juntosparacumprirumnicorequisito.Porexemplo,umteor
pgina91
72
CAPTULO4OPLANOSCOPE
recursocobrindoumeventoesportivopodeterumartigoacom
nhadosdefotografiaseclipesdevdeo.Identificartodososcontedos
tiposassociadoscomumrecursopodeajudloadeterminaroque
recursosseronecessriosparaproduzirocontedo(ousepode
serproduzidoemtudo).
72/153
27/09/2016
Semttulo
Noseconfundaentreoformatodeumapeadecontedoesua
finalidade.Aodiscutirosrequisitosdecontedocomaspartesinteressadas,
umadasprimeirascoisasqueeucostumoouvir:"DevemosterFAQs."Mas
otermoFAQrealmentesserefereaumformatodecontedo:umasriesimples
deperguntaserespostas.OvalorrealdeumFAQparaosusuriosque
eleforneceacessoimediatoainformaescomumentenecessrio.Deoutros
exignciasdecontedopodecumpriressemesmofimmasquandoo
focosobreoformato,aprpriafinalidadepodeseresquecido.mais
Muitasvezes,FAQsnegligenciaraparte"freqentemente"daequao,
oferecendoemvezdissorespondeaquaisquerperguntasoprovedordecontedo
poderiapensarparasatisfazeraexignciaFAQ.
Otamanhoesperadodecadaumdosseusrecursosdecontedotemumaenorme
influnciasobreasdecisesdeexperinciadousurioquevocterquefazer.
Osseusrequisitosdecontedodevemfornecerestimativasaproximadasdo
tamanhodecadarecurso:contagemdepalavrasderecursosdetexto,dimensesdepixels
paraimagensouvdeoetamanhosdeficheirosparadownload,standalone
elementosdecontedo,comoarquivosdeudiooudocumentosPDF.Estasestitamanho
matesnotemqueserprecisosaproximaessomuitobem.Nsapenas
temquerecolherasinformaesessenciaisnecessriasparaprojetarumforcaso
veculodissoparaessecontedo.Criaodeumsiteparaforneceracessoa
pequenasimagensemminiaturadiferentedaconcepodeumsiteparafornecer
acessoafotosemtelacheiaconhecerdeantemootamanhode
pgina92
73
oselementosdecontedoquetemosparaacomodarnospermitefazer
,decisesinformadasinteligentesaolongodocaminho.
importanteidentificarquemserresponsvelporcadacontedo
elementotocedoquantopossvel.Depoisdetersidovalidadocontraanossa
objetivosestratgicos,qualquerrecursodecontedoinevitavelmentesoacomoum
idiarealmenteboa,contantoquealgumresponsvelpelacriao
emantla.Seficarmuitoprofundamentenoprodesenvolvimento
cessosemidentificarquemserresponsvelporcadaexigida
Orecursodecontedo,estamospropensosaacabarcomburacosemnossosite
porqueaquelesrecursostodosameiquandoelesestavamhipoteticamente
calacabouporsermuitotrabalhoparaquetodospossamrealmenteassumir.
Eissooqueaspessoasmuitasvezesesquecemaodesenvolverrequisitos
mentos:Ocontedotrabalhoduro.Vocpodesercapazdecontrataremcontrato
recursos(ou,maisprovavelmente,ficaralgumparabaixoemmarketingcom
otrabalho)paracriarocontedoemtempoparaolanamentoinicial,masquem
73/153
27/09/2016
Semttulo
irmantloatualizado?Contentbem,ndiceeficaz,dequalquermaneira
requermanutenoconstante.contedoaproximandocomosevocpode
postloeesqueclolevaaumsiteque,aolongodotempo,fazumcres
vezmaispobrestrabalhodeatendersnecessidadesdousurio.
porissoque,paracadarecursodecontedo,vocdeveidentificarcomo
frequentementeeleseratualizado.Afrequnciadeatualizaesdeveser
derivadadeseusobjetivosestratgicosparaosite:Baseadoemseuproduto
objetivos,quantasvezesvocquiserqueosusuriosvoltar?Baseadoem
asnecessidadesdeseususurios,quantasvezeselesesperamatualizadasinformaes
o?Noentanto,tenhaemmentequeafreqnciaidealdeatualidadespara
seususurios("Euquerosabertudoinstantaneamente,24horaspordia!")
podenoserprticoparaasuaorganizao.Vocvaiterquechegara
pgina93
74
CAPTULO4OPLANOSCOPE
umafrequnciaquerepresentaumcompromissorazovelentreo
expectativasdeseususurioseseusrecursosdisponveis.
Seseusitetemparaserviramltiplospblicoscomnecessidadesdivergentes,
saberqualpblicoumapeadecontedodestinadoalata
ajudloatomarmelhoresdecisessobreaformadeapresentaressecontedo.
Informaesdestinadoacrianasrequerumaabordagemdiferente
apartirdeinformaesdestinadoaseuspaisinformaoparaambos
umdelestemaindaumaterceiraabordagem.
Paraosprojetosqueenvolvemotrabalhocomummontedecontedoexistente,
grandepartedasinformaesqueiroalimentarosseusrequisitos
registradaemuminventriodecontedo.Tomandouminventriodetodoo
contedoemseusiteexistentepodeparecerumtediosoprocessoe
quenormalmente.Masteroinventrio(quegeralmentetomaa
formadeumasimples,emboramuitogrande,folhadeclculo)importanteparao
mesmarazoqueterrequisitosconcretosimportante:assim
todosnaequipesabeexatamenteoqueelestmdetrabalharcom
nacriaodaexperinciadousurio.
priorizandoRequisitos
Recolhadeideiasparapossveisrequisitosnodifcil.Quase
todosquevemregularmenteemcontactocomumprodutose
elesestodentrodoorganismoouforaseterpelomenosuma
idiaparaumrecursoquepodeseradicionado.Apartedifcilclassificarparafora
quaisrecursosdevemserincludosnombitodeseuprojeto.
74/153
27/09/2016
Semttulo
pgina94
75
svezes,umaestratgica
objectivoresultarna
mltiplosrequisitos
(esquerda).Emoutroscasos,
Umrequisitopode
servirmltiplosestratgica
objetivos(direita).
realmentebastanteraroquevocverumsimplesonetoonecorrelao
entreseusobjetivosestratgicosesuasnecessidades.Alguns
vezesumrequisitopodeseraplicadoparamltiplosestratgica
objetivos.Damesmaforma,umobjectivo,muitasvezes,serassociadocom
vriosrequisitosdiferentes.
Comooescopoconstrudosobreaestratgia,vamosprecisarparaavaliar
possveisnecessidadesbaseadasemsecumpriranossaestratgica
metas(ambososobjetivosdoprodutoeasnecessidadesdousurio).Emadioaos
duasconsideraes,quedefineombitoacrescentaumterceiro:Comovivel
vaiserpararealmentefazerisso?
75/153
27/09/2016
Semttulo
pgina95
76
CAPTULO4OPLANOSCOPE
Algunsrecursosnopodemserimplementadasporqueelessotecnicamente
impossvel,porexemplo,simplesmentenohmaneiradepermitirqueosusurioscheiram
produtosatravsdaWeb,noentanto,noimportaoquantoelespodemquerer
essacapacidade.Outrascaractersticas(emespecialnocasodecontedo)
nosoviveisporqueiriaexigirmaisrecursoshumanos
oufinanceiradoquetemosnossadisposio.Emoutroscasos,apenasuma
questodetempo:Orecursolevariatrsmesesparaimplementar,
mastemosumrequisitoexecutivoparalanaremdois.
Nocasodelimitaesdetempo,vocpodeempurrarrecursosparaumposterior
liberaroumarcodoprojeto.Pararestriesderecursos,tecnolgico
oumudanasorganizacionaispodem,svezes,mas,maisimportante,no
semprereduziracargaderecursos,permitindoumrecursoaserimple
tadas.(Noentanto,ascoisasimpossveispermanecerimpossvel.Desculpe.)
Existempoucosrecursosnovcuo.Atmesmorecursosdecontedoemumsite
contarcomosrecursosaoseuredorparainformarousuriosobreamelhorforma
usarocontedofornecido.Istoconduzinevitavelmenteaconflitosentre
caractersticas.Algunsrecursosvaiexigircompensaescomosoutros,afim
paraproduzir,umtodocoerentecoerente.Porexemplo,osusuriospodem
querumonepassodoprocesso,masaapresentaofimdoemaranhadodelegado
basesdedadosdosusosdositenopodeacomodartodososdadosdeumasvez.isso
prefervelircomumprocessodevriasetapas,ouvocdeveretrabalho
osistemadebancodedados?Dependedeseusobjetivosestratgicos.
Mantenhaseatentoparasugestesderecursosqueindicampossveismudanas
naestratgiaquenoforamevidentesduranteodesenvolvimentodo
documentodeviso.TantofazNosugestoderecursodeacordocomopro
estratgiaect,pordefinio,foradoescopo.Masseumrecursosugerido
quecaiforadombitodeaplicaonoseencaixaemnenhumdostiposderestries
pgina96
77
acimaeaindasoacomoumaboaidia,vocpodequererreexaminar
algunsdeseusobjetivosestratgicos.Sevocseencontrarevisitando
muitosaspectosdasuaestratgia,noentanto,vocprovavelmentepulou
nadefinioderequisitosdemasiadocedo.
76/153
27/09/2016
Semttulo
Seasuaestratgiaoudocumentodevisoidentificaumahierarquiaclarade
prioridadesentreseusobjetivosestratgicos,estasprioridadesdevem
serosprincipaisfactoresnadeterminaodaprioridadedesugerido
caractersticas.Porvezes,noentanto,aimportnciarelativadosdois
objetivosestratgicosdiferentesnoclara.Nestescasos,se
caractersticasacabamnoescopodoprojeto,muitasvezes,seresumea
polticacorporativa.
Quandoaspartesinteressadasfalarsobreestratgia,elesgeralmentecomeamcom
apresentamideias,edepoisterdeserpersuadidodevoltaparaosubjacente
fatoresestratgicos.Porqueaspartesinteressadas,muitasvezestmdificuldadeparaseparar
caractersticasdeestratgia,certascaractersticas,muitasvezes,tmcampees.
Assim,oprocessodedefinioderequisitostornaseumaquestodenego
ciaoentreaspartesinteressadasmotivados.
Agestodesteprocessodenegociaopodeserdifcil.Aomelhor
abordagempararesolverumconflitoentreaspartesinteressadasapelarpara
aestratgiadefinida.Concentreseemobjetivosestratgicos,meiosnopropostas
derealizlos.Sevocpodegarantirumadaspartesinteressadascomela
coraoconjuntosobreumdeterminadorecursoqueoobjectivoestratgicoorecurso
destinaseacumprirpodemsertratadasdeoutromodo,elanovai
sentirasnecessidadesdosseusconstituintesestosendonegligenciadas.certoque,
estamuitasvezesmaisfcildedizerdoquefazer.Demonstrandoempatiacomo
necessidadesdaspartesinteressadasessencialpararesolverconflitosderecursos.Quem
diztrabalhadorestecnologianoprecisadehabilidadesdepessoas?
pgina97
5
captulo
Aestrutura
Avio
77/153
27/09/2016
Semttulo
DesigndeInteraoe
pgina98
Superfcie
Esqueleto
Estrutura
Apsosrequisitosforamdefinidose
priorizados,temosumaimagemclaradoqueser
Escopo
includanoprodutofinal.Osrequisitos,
Estratgia
noentanto,nodescrevemcomoaspeasseencaixam
paraformarumtodocoeso.Esteoprximonvel
dombitodeaplicao:odesenvolvimentodeumaestruturaconceitualpara
osite.
projetosensorial
ND
designdainformao
Interao Emformao
ati
projeto Arquitetura
r
78/153
27/09/2016
Semttulo
Funcional Contedo
en
Especificaes
requisitos
nt
Objetivosdoproduto
pgina99
80
CAPTULO5OPLANOESTRUTURA
DefinindoaEstrutura
Oreinodaestruturaoterceirodoscincoavies,eforcaso
quadaopontoemqueasnossaspreocupaesdeslocarsedamais
questesabstratasdeestratgiaealcanceaosfactoresconcretosque
vaideterminaroqueosusuriosfinalmenteexperimentar.Masalinhaentre
concretoabstratoepodeserobscura,emboramuitodoquens
decidiraquiterumainflunciaperceptvel,tangvelsobreafinal
produto,asprpriasdecisesaindaenvolvem,emgrandeparteconceitual
assuntos.
ctionality
esqueleto
Interao
projeto
estrutura
Emformao
Arquitetura
escopo
Nodesenvolvimentodesoftwaretradicional,adisciplinaenvolvidaem
criandoumaexperinciaestruturadaparaousurioconhecidocomointerao
projetoo.Elacostumavaseragrupadosobottulode"Interface
design",masodesigndeinteraoagorareconhecidocomoumseparado
disciplina.
79/153
27/09/2016
Semttulo
pgina100
81
Nodesenvolvimentodecontedo,estruturandoaexperinciadousurioumaquesto
odaarquiteturadainformao.Estecampobaseiaseemumnmero
dedisciplinasquehistoricamentetmsepreocupadocomoorga
nizao,agrupamento,ordenaoeapresentaodecontedo:biblioteca
cincia,jornalismoecomunicaotcnica,entreoutros.
designdeinteraoearquiteturadeinformaosharenfase
nadefiniodepadresesequnciasemqueasopesseropr
tantesparaosusurios.designdeinteracorefereseasopesenvolvidasem
executarecompletartarefas.ofertasdearquiteturadeinformao
comasopesenvolvidasnatransmissodeinformaesaumusurio.
designdeinteraoesomarquiteturadeinformaocomoesotrico,
reasaltamentetcnicas,masestasdisciplinasnosorealmentesobre
tecnologiadetodo.Elesestoprestesacompreensodaspessoasamaneira
elessecomportamepensam.Aoconstruiresseentendimentoparao
estruturadonossoproduto,vamosajudaragarantirumaexperinciabemsucedida
paraaquelesqueuslo.
Designdeinterao
designdeinteraoestpreocupadocomadescriopossveldousuriotamento
ioredefinindocomoosistemairacomodareresponderaos
essecomportamento.Todavezqueumapessoausaumproduto,umaespciededana
passaentreosdois.Ousuriomoveaoredor,eo
sistemaresponde.Emseguida,outilizadormoveemrespostaaosistema,
eassimadanacontinua.Masamaneiratpicadequeosoftwaretem
foidesenvolvidonorealmentereconheceressadana.opensamento
pgina101
82
parecetersidoadequesecadaaplicaodanouumpoucodife
ferentlyqualquermaneira,noerarazovelesperarqueousurioseadaptar.
Osistemapoderiaapenasfazerasuacoisa,esealgunsdedosdospsfoipisado,
80/153
27/09/2016
Semttulo
bem,issoerapartedoprocessodeaprendizagem.Mascadabailarinavai
dizerlhequeparaadanarealmentefuncione,cadaparticipantedeve
anteciparosmovimentosdooutro.
Osprogramadorestmtradicionalmentefocadoesepreocupavammaiscom
doisaspectosdosoftware:oquefazecomoelefazisso.Hum
boarazoparaisso,precisamenteasuapaixoporestesdetalhes
quefazcomqueosprogramadoresbonsnoquefazem.Masessefoco
significavaqueosprogramadoresgravitaremtornodeconstruodeumsistema
damaneiraqueeratecnicamentemaiseficientesemlevaremconta
oquefuncionoumelhorparaosusurios.Especialmenteparatrsquandoopoderdecomputao
foiumrecursolimitado,amelhorabordagemfoiaqueobteveo
trabalhofeitodentrodessaslimitaestcnicas.
Aabordagemquefuncionamelhorparaatecnologiaquasenunca
aabordagemquefuncionamelhorparaapessoaqueusalo.Assim,osoftware
adquiriuareputaoquetemassombradoqueparaamaioriadesuaexistncia:
Softwarecomplicado,confusoedifcildeusar.Issoporque,
duranteanos,"alfabetizaoinformtica"teachingpessoassobreointerior
funcionamentodecomputadoresfoiamplamenteconsideradocomoanicamaneira
parafazerosusuriosesoftwaresedobem.
Demoroumuitotempo,mascomonsaprendemosmaissobrecomoaspessoascostumavam
tecnologia,finalmente,comeamostravandosobreaideiadeque,
aoinvsdeprojetarumsoftwarequefuncionamelhorparaamquina,
nspoderamosprojetarsoftwarequefuncionamelhorparaaspessoasqueusam
pgina102
83
lo,ignorando,assim,todoessenegciodeenviodearquivistasde
aulasdeprogramaoparamelhorarasualiteraciainformtica.Onovo
disciplinaquesurgiuparaajudarosdesenvolvedoresdesoftwarequeissochamado
designdeinterao.
Modelosconceituais
impressesdecomooscomponentesinterativosquecriamosdosusurios
vaisecomportarsoconhecidoscomomodelosconceituais.Porexemplo,faz
osistemadetratamentodeumacaractersticaparticular,comoumacoisaqueousurioconsome,
Umlugarqueousuriovisita,ouumobjetoosadquireusurio?locaisdiferentes
assumirdiferentesabordagens.Conhecendooseumodeloconceitualpermite
loatomardecisesdedesignconsistentes.Noimportase
oelementodecontedoumlugarouumobjetooqueimportaqueo
81/153
27/09/2016
Semttulo
localcomportasedeformaconsistente,emvezdetrataroelementocomoumlugar
porvezes,eumobjetoemoutrosmomentos.
Porexemplo,omodeloconceitualparaocarrinhodecomprascompo
nentedeumlocaltpicoecommerceadeumrecipiente.estemeta
phoricalinflunciasconceitotantoaconcepodocomponentee
alinguagemqueusamosnainterface.UmrecipientecontmobjectosComo
resultado,"colocarascoisasem"e"levarascoisasfora"do"carrinho"
eosistemadevefornecerfunespararealizaressastarefas.
Suponhaqueomodeloconceitualparaocomponentefosseumadife
entanalgicadomundoreal,comoumformulriodepedidocatlogo.Osistema
podefornecerumafunodeedioqueiriasubstituirtantooadd
eremoverfunesdocarrinhotradicional,eemvezdeusarum
metforacheckoutparaconcluiroprocesso,osusuriospodemenviarassuas
encomendasem.
pgina103
84
Tantoomodelodelojadevarejoeomodelodecatlogoparecerperfeitamente
adequadoparapermitirqueosusuriosafazerencomendasatravsdaInternet.quea
escolher?OmodelodelojadevarejotoamplamenteutilizadonaWebque
tomadosobreoestadodeumaconveno.Seseususuriosfazerummontede
comprasemoutrossites,vocprovavelmentevaiquerermanteramesma
conveno.Usandomodelosconceptuaisaspessoasjestofamiliarizados
comotornamaisfcilparaelesparaseadaptaraumlocaldesconhecido.Do
Evidentemente,nohnadadeerradocomrompercomconvenes
quercontantoquevoctenhaumaboarazoparafazloeteruma
modeloconceitualalternativaqueiratendersnecessidadesdeseususuriosenquanto
continuaafazersentidoparaeles.modelosconceituaisdesconhecidossoapenas
eficazquandoosusuriospossamentendercorretamenteeinterpretlos.
Ummodeloconceptualpodereferirseaapenasumcomponentedeumsistemaou
paraosistemacomoumtodo.QuandoositedenotciasecomentriosSlate
lanado,oseumodeloconceitualeraumarevistadomundoreal:Osite
tinhaumafrenteeumparatrs,ecadapginatinhatantoumnmerodepgina
eelementosdeinterfacequepermiteaousurio"virarapgina".Como
Aconteceque,omodeloconceitualrevistanosetraduzmuito
eficazmenteparaaWeb,eSlatefinalmentedeixoucair.
Notemosdecomunicarosnossosmodelosconceptuaisparanossosusurios
explicitamentenaverdade,svezesissosconfundeosusurios,emvez
deajudlos.maisimportantedoqueosmodelosconceituaisso
utilizadodeformaconsistentedurantetodoodesenvolvimentodainteraco
82/153
27/09/2016
Semttulo
design.Compreenderosusuriosprpriosmodelostrazerparaa
local(Serquefuncionacomoumalojadevarejo?Serquefuncionacomoumcatlogo?)
ajudanosaescolherosmodelosconceituaisqueirotrabalharmaisefi
pectivamente.Idealmente,osusuriosnoterodeserditooconceitual
pgina104
85
modeloqueestamosseguindoelesvopegarneleintuitivamentecomoelesusam
ositeporqueocomportamentodositeircorresponderasuaimplcita
expectativas.
Baseandonossosmodelosconceptuaisemmetforasenvolvendonomundoreal
anlogossfunesdosistemapodemservaliosas,masimportanteno
deassumirasnossasmetforasmuitoliteralmente.Ahomepagedositepara
SouthwestAirlinesusadaparaconsistirapenasdeumaimagemdeumcliente
servicedesk,comumapilhadefolhetosparaumlado,telefone
paraooutrolado,eassimpordiante.Duranteanos,olocaleratidacomoum
exemplodeummodeloconceitualidolongedemais,colocandoumreserva
opodeseranlogaafazerumtelefonema,masissonofaz
significaqueosistemadereservasdeverealmenteserrepresentadoporum
Telefone.Southwestdevetersecansadodeserusadocomoummau
exemploseulocalposteriormentetornouseluzsobremetforaecon
velmentemaisfuncional.
OvelhoSouthwest
sitedecompanhiasareasumclssico
exemplodeconceitual
modelosqueestosendoamarradosdemasiado
atentamenteasdomundoreal
homlogos.
83/153
27/09/2016
Semttulo
pgina105
86
Tratamentodeerros
Umagrandepartedequalquerprojetodedesigndeinteraoenvolvelidarcom
erroemqueousuriofazosistemafazquandoaspessoascometemerros,
eoqueosistemapodefazerparaevitaresseserrosdeacon
Peningemprimeirolugar?
Aprimeiraemelhordefesacontraoserrosaconcepodosistema,demodo
queoserrossosimplesmenteimpossvel.Umbomexemplodestetipode
defesapodeservistoemqualquercarrocomumatransmissoautomtica.
Iniciandoocarroenquantoatransmissoestenvolvidapodedanificaro
mecanismodetransmissosensvelecomplexaAlmdisso,ocarro
norealmentecomear,masemvezbalanaafrenteabruptamente.Mau
paraocarro,ruimparaomotorista,epossivelmenteruimparauminocente
transeuntequeacontecedeestarnocaminhodocarrocambaleando.
Paraevitarisso,qualquercarrocomumatransmissoautomticaprojetado
demodoqueomotordearranquenovaiseenvolvermenosqueatransmissodesengatada.
Porqueimpossvelligarocarrocomatransmisso
contratado,oerronuncaacontece.Infelizmente,noto
fcildefazeramaioriadoserrosdeutilizadorimpossveldestamaneira.
Aprximamelhorcoisaafazererrosimpossvelfazlos
apenasdifcil.Masmesmocomessasmedidasemvigor,algunserros
estoprestesaacontecer.Nesteponto,osistemadevefazeroque
podeajudarafiguradousuriooerroecorrigilo.Emalgunscasos,o
sistemapodeatmesmocorrigiroerroemnomedousurio.Mastenhacuidado
algunsdoscomportamentosmaisirritantedeprodutosdesoftwareresultados
deesforosparacorrigiroserrosdousuriobemintencionado.(Sevocj
usouoMicrosoftWord,vocsabeexatamenteoqueeuestoufalando.
pgina106
87
Cadacamadadeerro
manipulaoemsua
84/153
27/09/2016
Semttulo
designdeinterao
queasseguraumamaior
porcentagemdeusurios
terpositiva
experincias.
preveno
correo
recuperao
pgina107
88
Palavraofereceinmerosrecursosdestinadosacorrigirerroscomuns
invariavelmente,encontromemudarlosforaparaqueeupossaparardecorrigir
ascorreeseobteralgumtrabalhofeito.)
mensagensdeerrovotoseinterfacesfceisdeinterpretarpodemajudar
usuriospegarmuitostiposdeerrosdepoisdeteremacontecido.Masalguns
aesdousuriopodenoparecemsererrosatquesejatardedemaisparao
sistemaparapeglos.Nestescasos,osistemadeveproporcionaruma
maneiraparaosusuriosrecuperardoerro.Oexemplomaisconhecidode
Estaafamosafunodesfazer,masarecuperaodeerropodelevarmuitos
diferentesformas.Paraerrosquenopodemserrecuperados,fornecendo
abundnciadeavisoonicomeiodeprevenoosistemapode
85/153
27/09/2016
Semttulo
fornecer.Claro,esteavisoseficazquandoosusuriosreal
aliadonotar.Incluindomuitos"Temcerteza?"Confirmaes
podecausarosrealmenteimportantesaseresquecidoemuitasvezes
irritamaisusuriosdoqueajuda.
arquiteturadeinformaoumaidianova,masumaprticaindeidade
verdade,vocpoderiadizerquetoantigaquantoacomunicaohumanaemsi.Para
enquantoaspessoastiveraminformaesparatransmitir,elestiveramde
fazerescolhassobrecomoelesestruturaressasinformaesparaoutra
aspessoaspossamentendereuslo.
Porqueaarquiteturadainformaoestpreocupadocomaformacomoaspessoas
informaesdoprocessocognitivo,arquiteturadeinformaoconsi
raessurgiremqualquerprodutoqueexigequeosusuriosfazemsentido
dasinformaesapresentadas.Obviamente,essasconsideraesso
page108
89
crticanocasodeprodutosorientadosparainformao(comocorporativa
sitesdeinformao),maselespodemterumenormeimpactoaindamais
orientadaparaosprodutosdefuncionalidade(comoumtelemvel).
contedoestruturao
Emsitesdecontedo,arquiteturadeinformaoestpreocupadocomcreat
ingprogramasdeorganizaoedenavegaoquepermitemaosusurios
percorrerocontedodositedeformaeficienteeeficaz.Emformao
arquiteturanaWebestintimamenterelacionadocomodomniodainformao
recuperao:odesigndesistemasquepermitemaosusuriosencontrarinformaes
ofacilmente.MasarquiteturasWebsitessomuitasvezeschamadoafazer
maisdoqueapenasajudaraspessoasaencontrarcoisasemmuitoscasos,elestmde
educar,informaroupersuadirosusurios.
Maiscomumente,arquiteturadeinformaoproblemasrequeremcreat
ingesquemasdecategorizaoquecorrespondemnossaprpriaobjectividade
tivasparaosite,ousurioprecisapretendemosatender,eocontedo
quevaiserincorporadonolocal.Podemosabordaracriaodetais
umesquemadecategorizaodeduasmaneiras:decimaparabaixo,ouapartirde
baixoparacima.
Aabordagemtopdownaarquiteturadainformaoenvolvecria
Atingaarquiteturadiretamentedeumacompreensodaestratgia
86/153
27/09/2016
Semttulo
consideraesavio:objetivosdoprodutoeasnecessidadesdousurio.Iniciando
comascategoriasmaisamplasdepossvelcontedoefuncionalidade
necessrioparaatingiressesobjetivosestratgicos,que,emseguida,quebrarocat
catebaixoemsubseeslgicas.Estahierarquiadecategorias
esubcategoriasservecomoaconchavazianaqualocontedo
efuncionalidadevaiserencaixados.
pgina109
90
Aabordagembottomupparaaarquiteturadeinformaestambmderiva
categoriasesubcategorias,masflocombaseemumaanlisede
ocontedoerequisitosfuncionais.Comeandocomafonte
materialqueexiste(ouquevenhamaexistirnomomentoemqueositelana),
nsagruparitensemcategoriasdebaixonveledepoisdogrupo
aquelesemcategoriasdenvelsuperior,construindoemdireoaumaestruturaque
refletenossosobjetivosprodutoeasnecessidadesdousurio.
Atopdown
arquitetnico
abordagemimpulsionadopor
consideraesapartirda
planodeestratgia.
Categorias
contedo
Abottomup
arquitetnico
abordagemimpulsionadopor
consideraesapartirda
avioescopo.
Categorias
contedo
Nenhumaabordagemmelhordoqueooutro.Aproximandosedoarqui
tecturedecimaparabaixo,porvezes,podecausardetalhesimportantes
sobreoprpriocontedoaseresquecido.Poroutrolado,uma
abordagembottomupsvezespoderesultaremumaarquiteturademodo
precisamenteajustadaeequipadocomocontedoexistentequenoestflexo
velosuficienteparaacomodarasmudanasouadies.Golpeandoumbrio
anceentretopdownepensamentodebaixoparacimaanicamaneirade
certifiqueseoresultadofinalpodeevitaressasarmadilhas.
87/153
27/09/2016
Semttulo
pgina110
91
Nonecessrioparaaderiraumdeterminadonmerodecategorias
emqualquernvelouemqualquerseodaarquitetura.ascategorias
apenastemqueserasmaisadequadasparaosseususuriosesuasnecessidades.Alguns
pessoasfavorecemacontagemdonmerodepassosnecessriosparacompletaruma
tarefaouonmerodeestalidosquelevaparaqueumutilizadorparaalcanarumadeterminada
dedestinocomoumaformadeavaliaraqualidadedeumaestruturalocal.o
maisimportantesinaldequalidade,noentanto,noquantospassos
oprocessolevou,massecadaetapafaziasentidoparaousurioe
seguidosenaturalmenteapartirdaetapaanterior.Osusuriosiro
favoreceminvariavelmenteumprocessodeseteetapasclaramentedefinidasaolongodeumconfus
vezmaiscomprimidoalternativodetrspassos.
Websitessoentidadesvivas.Elesexigemcuidadosconstantesefeedback
ing.Inevitavelmente,elescrescememudamaolongodotempo.Namaioriadoscasos,uma
algunsnovosrequisitosadquiridosaolongodocaminhonodeveexigir
repensaraestruturageraldosite.Umtraodeumeficaz
estruturaasuacapacidadeparaacomodarocrescimentoeadaptarsemudana.
Masaacumulaodenovoscontedos,eventualmente,exigirumare
examedosprincpiosorganizadoresquetrabalhamnolocal.Para
exemplo,aarquiteturaquepermitiaaosusuriospginaatravsdaimprensa
lanamentosdodiaadiapodetersidobomquandovoctinhaapenasalguns
Penademeses,masorganizandoosportpicopodesermaispr
CALdepoisdealgunsanos.
Aexperinciadoutilizadorinteiro,incluindoaestruturadolocal,
construdosobreumacompreensodeseusobjetivoseasnecessidadesdoseu
usurios.Seoquevocqueralcanarcomositeredefinidoou
asnecessidadesquevocpretendeolocalparaatenderamudana,estarpreparadopararetrabalhar
aestruturadoseusiteemconformidade.Anecessidadedetalestrutural
alterarraramenteseanunciacomantecedncia,emborafrequentemente,pelo
vezquevocpodedizerquevocprecisarefazeraarquitetura,oseu
osusuriosjestosofrendo.
pgina111
92
88/153
27/09/2016
Semttulo
umadaptvel
arquiteturapode
aacomodar
adiodenovoscontedos
dentrodeumaseco(topo)
bemcomotodanova
sees(parteinferior).
abordagensdearquitetura
Aunidadebsicadeestruturasdeinformaoon.Umnpode
correspondeaqualquerpeaougrupodeinformaoquepodesertopequeno
comoumniconmero(comoopreodeumproduto)outograndequantoum
todaabiblioteca.Aolidarcomns,emvezdecomaspginas,documentar
mentos,oucomponentes,podemosaplicarumalinguagemcomumeuma
conjuntocomumdeconceitosestruturaisparaumavariadagamadeproblemas.
Aabstraodenstambmnospermitedefinirexplicitamenteonvelde
detalhe,vamosestarpreocupadoscom.AmaioriaWebsitedaarquitecturapro
ECTSsestopreocupadoscomoarranjodaspginasdosite
identificandoapginacomoonossondenvelbase,podemostornloexplcito
quenovaiserlidarcomqualquercoisamenor.Seapginaemsi
pgina112
93
pequenodemaisparaoprojetoemmos,podemostercadacorrespondemn
atodaumaseodosite.Seapginamuitogrande,podemosdefinir
nscomoelementosdecontedoindividuaisdentrodapginaenapgina
comoumgrupodenodos.
Estesndulospodemserdispostasdevriasmaneirasdiferentes,masestes
estruturasrealmentecairemapenasalgumasclassesgerais.
Emumhierrquicoestrutura,svezeschamadodeumarvoreouhuband
falouestruturadenstmrelaespai/filhocomoutra
nsrelacionados.nsfilhosrepresentamconceitosmaisestreitosdentrodo
89/153
27/09/2016
Semttulo
categoriamaisvastarepresentadapelonpai.Nocadan
temfilhos,mascadantemumpai,levandotodoocaminhoat
paraonpaidetodaaestrutura(ouaraizdarvore,
sevocpreferir).Porqueoconceitoderelaeshierrquicas
bementendidopelosutilizadoresdesoftwareeporquetendeafuncionarem
hierarquiasdequalquermaneira,estetipodeestrutura,delonge,omais
comum.
Estruturahierrquica.
Amatrizdeestruturapermiteaousuriomoverdenemn
aolongodedoisoumaisdimenses.estruturasdematrizsofrequentementeusar
fulparapermitirqueusurioscomdiferentesnecessidadesdenavegaratravsdo
mesmocontedo,porquecadaumadasnecessidadesdoutilizadorpodeserassociadacomum
pgina113
94
eixodamatriz.Porexemplo,sealgunsdeseususuriosrealmentequerem
paraprocurarprodutosporcor,masoutrosprecisamnavegarportamanho,
umamatrizpodeacomodarambososgrupos.Umamatrizdemaisde
trsdimensespodecausarproblemas,noentanto,sevocesperaqueosusurios
paracontarcomelecomosuaferramentadenavegaoprimria.Ocrebrohumano
simplesmentenoestmuitobemequipadaparavisualizaromovimentoemquatroou
maisdimenses.
Estruturamatriz.
Orgnicasestruturasnotenteseguirqualquerpadroconsistente.
Nssoconectadosjuntosemumabasecasoacaso,ea
arquiteturanotemumconceitofortedesees.estruturasorgnicas
sobonsparaexplorarumconjuntodetemascujarelaonoclara
90/153
27/09/2016
Semttulo
ouemevoluo.Masestruturasorgnicasnoforneceraosusuriosuma
fortesentidodeondeelesestonaarquitetura.Sevocquiser
paraincentivarumsentimentodeexploraodeformalivre,comoemalguns
entretenimentoousiteseducacionais,umaestruturaorgnicapodeserum
boaescolhanoentanto,podeapresentarumdesafio,seosusuriosprecisam
paraencontrarcomfiabilidadeoseucaminhodevoltaparaomesmopedaodecontedonovamente.
page114
95
estruturaorgnica.
Seqenciaisestruturassoosqueestomaisfamiliarizadoscom
deofflinemedianaverdade,vocestexperimentandoumagora.
Ofluxosequencialdelinguagemotipomaisbsicodeinformaes
arquiteturaoqueexiste,easfaculdadesnecessriasparaprocessloso
construdoparaadireitaemnossoscrebros.Livros,artigos,udioevdeoso
tudoprojetadoparaservividadeumaformasequencial.Sequencial
estruturasnaWebsousadoscommaisfreqnciaparamenorescalatrutura
turas,taiscomoartigosouseesindividuaissequencialemlargaescala
estruturastendemaserlimitadosaaplicaesemqueaordemde
apresentaodecontedoessencialparaatendersnecessidadesdousurio,comoem
materialdeinstruo.
estruturaseqencial.
91/153
27/09/2016
Semttulo
pgina115
96
organizarPrincpios
Nsemumaestruturadeinformaosoorganizadasdeacordocomorga
princpiosnizing.Emseunvelmaisbsico,oprincpioorganizador
ocritriopeloqualpodemosdeterminarquaisnssoagrupados
emconjuntoeosquaissomantidosseparados.Diferentepioorganizadora
cpiosseroaplicadasemdiferentesreaseemdiferentesnveisde
osite.
Porexemplo,nocasodeumsitedeinformaocorporativa,poderamos
tercategoriaspertodotopodanossarvorecomo"Consumidor","Busi
ness"e"Investidores."Aestenvel,oprincpioorganizadoro
audinciaparaqueocontedosedestina.Outrositepodeter
categoriasdenvelsuperiorcomo"AmricadoNorte","Europa"e"frica".
Usandogeografiacomoumprincpioorganizadorumaabordagempara
atendersnecessidadesdeumpblicoglobal.
Geralmente,osprincpiosdeorganizaoqueempregamaomaisalton
elsdoseusiteestointimamenteligadasaosobjectivosdoprodutoedousurio
precisa.Emnveisinferioresdaarquitetura,asquestesespecficasdoscon
tendaerequisitosfuncionaiscomeamaterumamaiorinfluncia
sobreosprincpiosdeorganizaoquedevemserusados.
Porexemplo,umsitecomcontedovoltadoparanotcias,muitasvezes,tm
cronologiacomoseuprincpioorganizadormaisproeminente.oportunidade
ofatormaisimportanteparaosusurios(que,afinal,olharpara
sitesdenotciasparaobterinformaessobreeventosatuais,nodehistria),bemcomo
paraoscriadoresdosite(quedeveenfatizaraoportunidadedos
seucontedo,afimdesemanteremcompetitivas).
pgina116
97
92/153
27/09/2016
Semttulo
Noprximonvelnaarquitetura,outrosfatoresmaisestreitamente
amarradoparaocontedoentramemjogo.Paraumsitedenotciasesportivas,ocontedo
podeserdivididaemcategoriascomo"Baseball","tnis",e
"Hquei"umsitemaisdeinteressegeralpodetercategoriascomo
"NewsInternational","JornalNacional"e"NewsLocal."
Qualquerrecolhadeinformaes,quersejacompostopordoiselementos,
200,ou2.000temumaestruturaconceptualinerente.Naverdade,
temgeralmentemaisdeum.Issopartedoproblemaquetemosde
resolver.Odesafionocriarumaestrutura,masacriaododireito
estruturaparaosnossosobjectivoseasnecessidadesdenossosusurios.
Porexemplo,suponhaqueonossositecontinhaumrepositriodeinformaes
osobrecarros.Umprincpioorganizadorpossvelarranjaria
ainformaodeacordocomopesodocarroemquesto.assim
aprimeiracoisaqueousurioveriaseriainformaessobreo
carromaispesadononossobancodedados,entoosegundomaispesadoeparabaixo
paraomaisleve.
Paraumsitedeinformaodoconsumidor,estaprovavelmenteamaneiraerrada
paraorganizarainformao.Amaioriadaspessoas,namaioriadasvezes,noso
emcausacomopesodeumcarro.Organizarainformao
deacordocomamarca,modelooutipodecarroseriaprovavelmentemais
apropriadaparaestepblico.Poroutrolado,senossosusuriosso
profissionaisquelidamdiariamentecomonegciodotransporte
carrosnoexterior,depesosetornaumfatormuitoimportante.Paraestes
pessoas,qualidadescomoaeconomiadecombustveletipodemotorsoconsi
habilmentemenosimportante,seimportaemtudo.
pgina117
98
Estesatributos,nalinguagemdacinciadabiblioteca,soconhecidoscomo
facetas,eelespodemfornecerumconjuntosimples,flexveldeorganizar
princpiosparaquasequalquercontedo.Mas,comonoexemploprecedente
shows,usandoasfacetaserradopodeserpiordoquenousandonenhumfacetas
emtudo.Umarespostacomumparaesteproblemaposicionarcada
facetaconcebvelcomoumprincpioorganizadoredeixarqueosusuriosescolher
oqueimportanteparaeles.
Infelizmente,amenosquevocestlidandocominformaesmuitosimples
queconsisteemapenasalgumasfacetas,estaabordagemlogosetransformaoarqui
93/153
27/09/2016
Semttulo
turaemumaconfusopesado.Osusuriostmtantasopespara
classificaratravsdequeningumpodeencontrarqualquercoisa.Acarganodeve
estarnousurioparaclassificaratravsdetodososatributoseescolheroque
importante,acargaestemns.Aestratgianosdizoqueo
osusuriosprecisam,eoescopodiznosquaisasinformaesqueatendamaessas
precisa.Aocriaraestrutura,identificamososaspectosespecficosda
queainformaoquesermaisimportantenamentedosusurios.Asuco
experinciadousuriocessfulaqueleemqueasexpectativasdousurioso
antecipadosecontabilizados.
LinguagemeMetadados
Mesmoqueaestruturaumarepresentaoprecisadaperfeitamente
formacomoaspessoaspensamsobreoassunto,osusuriosnoser
capazdeencontraroseucaminhoemtornodaarquitetura,seelesnopodemenfraquecer
estarsuanomenclatura:asdescries,etiquetas,eoutros
TerminologiaOsiteusa.Porestarazo,essencialparaouso
linguagemdeseususuriosefazlodeumaformaconsistente.o
ferramentaqueusamosparafazervalerqueaconsistnciachamadodecontrolada
vocabulrio.
pgina118
99
Umvocabulriocontroladonadamaisdoqueumconjuntodepadro
termosdeusodosite.Estaoutrareaemqueapesquisadousurio
essencial.Falandoaosusurioseentendercomoelescomu
nicaramaneiramaiseficazdedesenvolverumsistemadenomenclatura
quevaisesentirnaturalparaeles.Criandoeaderindoaumacontrolada
vocabulrioquerefletealinguagemdeseususuriosamelhormaneira
paraevitarojargointernodaorganizaoapartirrastejando
osite,ondeelesirconfundirosusurios.
vocabulrioscontroladostambmajudaracriarconsistnciaemtodaasua
contedo.Seaspessoasresponsveispelaproduodecontedo
sentarseaoladounsdosoutrosouemescritriosemcontinentesseparados,o
vocabulriocontroladoforneceumrecursodefinitivoparagarantirque
todomundoestfalandooidiomadousurio.
Umaabordagemmaissofisticadaparacontrolarovocabulrioacria
comeuumthesaurus.Aocontrriodeumasimpleslistadetermosaprovados,umthesau
rustambmvaidocumentartermosalternativosquesocomumenteusados
masnoaprovadoparausonosite.Comumdicionrio,vocpode
Roteirojargointerno,taquigrafia,griasousiglasaoseu
homlogosaprovados.Umdicionriopodetambmincluiroutrostipos
94/153
27/09/2016
Semttulo
derelaesentreostermos,fornecendorecomendaespara
maisamplos,maisestreitos,outermosrelacionados.Documentandoestesrelacionamento
osnaviospodemdarlheumaimagemmaiscompletadetodaagamade
conceitosencontradosemseucontedo,queporsuavezpodesugeriradi
abordagensdearquiteturaadicionais.
Terumvocabulrioouthesauruscontroladapodeserespecialmenteajuda
fulsevocdecidirconstruirumsistemaqueincluimetadados.Otermo
metadadossignificasimplesmente"informaosobreainformao."Referesea
umaabordagemestruturadaparadescreverumadeterminadapartedocontedo.
pgina119
100
Suponhaqueestvamoslidandocomumartigosobrecomooseumaisrecente
produtoestsendousadoporbombeirosvoluntrios.Algunsdos
metadadosparaesseartigopodeincluir
.Onomedoautor
.Adataemqueapeafoipostada
.Otipodepea(porexemplo,umestudodecasoouartigo)
.Onomedoproduto
.Otipodeproduto
.Indstriadocliente(porexemplo,bombeirosvoluntrios
departamento)
.Tpicosrelacionados(porexemplo,rgosmunicipaisou
serviosdeemergncia)
Tendoestainformaopermitenosconsiderarumasriedepossveis
abordagensarquitetnicasqueseriadifcil(senofrancamente
impossvel)paraimplementarsemele.Emsuma,amaisdetalhada
informaoquevoctemsobreoseucontedo,maisflexibilidade
voctememestruturao.Seosserviosdeemergnciamostrarepente
potencialcomoumnovomercadolucrativoparaaempresaaexpandirsepara,
tendoestemetadadosnospermitircriarrapidamenteumanovaseo
paraatendersnecessidadesdessesusurioscomocontedoquejtemos.
Masacriaodesistemastcnicosparacoletareacompanhartudoissometa
dadosnovainosajudarseosdadosemsinoconsistente.Issoeonde
vocabulrioscontroladosentrar.Aousarapenasumtermoparacada
conceitonicoemseucontedo,vocpodecontarcomautomaopara
ajudaradefinirasconexesentreseuselementosdecontedo.Seu
sitepodedinamicamenteunirtodasaspginassobreumtpicoespecfico
semqueningumtenhaquefazernadamaisdoqueusaramesma
95/153
27/09/2016
Semttulo
denominardeformaconsistenteemseusmetadados.
pgina120
101
Almdisso,boametadadospodeproporcionarummaisrpidoemaisfivel
caminhoparaosseususuriosaencontrarinformaessobreoseusitedoqueuminteirobsico
textomotordebuscapodefornecer.Osmotoresdebuscapodeserpoderoso,
masemgeralelessomuito,muitodumblhedarlhesumasriede
personagens,eelespraticamenteirprocuradeexatamenteessacadeia
decaracteres.Elesnoentendemoquequalquerumquesignifica.
Ligaroseumotordebuscacomumdicionriodesinnimosefornecendo
metadadosparaoseucontedopodeajudaratornaromotormaisesperto.o
motordebuscapodeusarodicionriodesinnimosparamapearumabuscaporumdisal
prazolowedaumtermopreferidoemseguida,elepodeverificarosmetadadospara
otermopreferido.Emvezdeficarnenhumresultadoemtudo,ousuriorecebe
altamentesegmentados,resultadoserelevantestalvezatmesmoalgunsreco
daesparaoutrosassuntosrelacionadosquepossamserdeinteresse.
Osdocumentosnecessriosparadescreveraestruturadeumsitedo
detalhesespecficosdenomenclaturaemetadadosparaoretratograndede
arquiteturadeinformaoglobaleinteraodesignpodevariar
substancialmente,dependendodacomplexidadedoprojecto.parapro
ECTSenvolvendoumagrandequantidadedecontedoemumaestruturahierrquica,simples
esboosdetextopodemserumamaneiraeficazparadocumentaraarquitetura.
Emalgunscasos,comoferramentasdefolhasdeclculoebasesdedadosvaiserpressionado
emservioparaajudaracapturarasnuancesdeumaarquiteturacomplexa.
Masoprincipalinstrumentodedocumentaoparaaarquiteturadeinformaoou
designdeinteraoodiagrama.Representandoavisuestrutura
aliadoaformamaiseficienteparanoscomunicarosramos,
gruposeinterrelaesentreoscomponentesdonossosite.
pgina121
102
96/153
27/09/2016
Semttulo
estruturasWebsitesocoisasinerentementecomplicadastentando
transmitiressacomplexidadeempalavraspraticamentegarantequenenhum
umvaillos.
NosprimeirosdiasdaWeb,essetipodediagramafoichamadodeumsite
mapamasporcausamapadositetambmumtermousadoparaumtipoparticularde
ferramentadenavegaoemumsite(quevocvailermaissobrenoCap
ter6),arquiteturadiagramaagoraotermopreferidoparaaferramentaque
usarinternamenteparadescreveraestruturadosite.
Odiagramanotemdedocumentarcadalinkemcadapgina
emseusite.Defacto,namaioriadoscasos,queonveldedetalheserveapenas
paraconfundireobscurecerasinformaesaequiperealmenteprecisa.Est
maisimportantedocumentarrelaesconceituais:QualCat
cateandamjuntos,equecontinuamaserseparado?Comofazerospassos
emumadeterminadaseqnciadeinteraoseencaixam?
Noinciodeminhacarreira,euencontreimeterdeexpressaramesmabase
estruturasdeinteraoumaeoutravezdeprojetoparaprojeto.
Comotempo,comeceiapadronizaraformacomoeuilustradominhasideiasem
meusdiagramasdosite.Euestabelecimeemumdeterminadoconjuntodeformasqueeuusei,
edefinidooquecadaumadessasformassignificava.
OsistemaqueeucrieiparadiagramarestruturasdositechamadodeVisual
Vocabulrio.DesdequeeuposteiissoprimeiroparaaWebem2000,informa
arquitetosoedesignersdeinteraoemtodoomundotm
adotaram.Vocpodeaprendermaissobreovocabulriovisual,consulte
diagramasdeamostraeferramentasdedownloadparauslonomeusite:
www.jjg.net/ia/visvocab/.
pgina122
103
casa
Informaomediaprodutos
apoio
casa
Ovocabulriovisual
umsistemade
diagramao
arquiteturasvariando
desdeosimples
(Topo)paraaprpria
complexo(parteinferior).
vejawww.jjg.net/ia/
visvocab/pormais
detalhes.
97/153
27/09/2016
Semttulo
comunicadosdeimprensa
produtos
Arquivo
arquivo
escritrio
produtos
continueapartirde: fluxodelogin
casa
pginadeentrada
(2a)
ltimasnotcias
(2c)
continuaa:
listademembros
tcnico
papis
pgina123
104
Muitasorganizaesempregamemtempointegraldaexperinciadousuriodesenhadores
quesoresponsveispelasquestesestruturais.Emoutrasorganizaes,
noentanto,aresponsabilidadepelaestruturaaterrafrequentementenocolodealgum
porpadro,emvezdeatravsdeumplanejamentoconsciente.Quemacaba
responsvelpelaestruturamuitasvezesdependedaculturadaorga
nizaoouanaturezadoprojecto.
Parasitesdecontedopesadoouemorganizaesemqueacriaodeum
presenanaWebfoiinicialmentevistocomoumaatividadedemarketing,
aresponsabilidadeparaadeterminaodaestruturadolocalpossui
residianocontedodesenvolvimento,editorialoucomcomercializao
gruposmunicaes.Seaorganizaohistoricamentetemsidoliderada
porpessoastcnicasoutinhaumaculturainternaorientadaparaatecnologia,
responsabilidadepelaestruturatemcomumentecadoaotcnico
gerentedeprojetotrabalhandonoWebsite.
Cadaprojetopodesebeneficiardeterumespecialistaemtempointegraldedicao
cadoaquestesestruturais.svezes,essapessoapassaotrabalho
ttuloDesignerinteraco,masoutrospreferemaserreferidocomoum
98/153
27/09/2016
Semttulo
arquitetodeinformao.Nodeixequeottuloconfundilo,embora
verdadequealgunsarquitetosdeinformaoespecializadaexclusivamenteem
acriaodeesquemasorganizacionaiseestruturasdenavegaopara
sitesdecontedo,maisfrequentementedoqueno,umarquitetodeinformaoser
tmalgumgraudeexperinciacomquestesdedesigndeinteraoe
viceversa.Comoaarquiteturadeinformaoedesigndeinterao
questessomuitasvezestointimamenterelacionados,aexperinciadousuriodesignertem
tornarseumttulomaiscomumparaalgumcomestashabilidades.
Asuaorganizaopodenoterovolumedetrabalhosemcursopara
justificaracontrataodeumemtempointegralexperinciadousuriodesignercomoumapermanente
membrodesuaequipe.SeosseusesforosdedesenvolvimentoWebsonasuamaioria
pgina124
105
limitadoamanterocontedoquevoctemuptodateevocnofaz
fazermuitonovodesenvolvimentoentreosprojectosderedesenhodetodoosite
acadadoisanos,umdesignerdeexperinciadousurioequipeprovavelmenteno
umaboamaneiradegastaroseudinheiro.Massevoctemumfluxoconstante
denovoscontedosefuncionalidadesqueestsendoadicionadoaoseusite,umusurio
experinciadesignerpodeajudloagerenciaresseprocessodamaneira
quesermaiseficazparaatendersnecessidadesdeseususuriose
parasatisfazerseusprpriosobjetivosestratgicos.
Sevoctemumespecialistaparalidarcomaspreocupaesestruturaisno
importante,masimportantequeestaspreocupaessoabordadospor
algum.Seusiteterumaestruturaounovocplanejar
Fora.Ossitesquesoconstrudosdeacordocomumplanoestruturalclaratendem
aseraquelesquerequeremrevisesmenosfreqentes,produzircon
resultaCretaparaosseusproprietrios,esatisfazerasnecessidadesdosseusutilizadores.
99/153
27/09/2016
Semttulo
pgina125
6
captulo
Oesqueleto
Avio
InterfaceDesign,Designerdenavegao,
eDesigndaInformao
pgina126
100/153
27/09/2016
Semttulo
Superfcie
Esqueleto
Estrutura
Aestruturaconceitualcomeaadarformaa
amassaderequisitosdecorrentesdanossaestratgica
Escopo
objetivos.Noplanoesqueleto,nsrefinaraindamais
Estratgia
essaestrutura,identificaraspectosespecficosdasinter
rosto,navegaoedesigndeinformaoqueir
fazeraestruturadeconcretointangvel.
projetosensorial
ND
designdainformao
Interao Emformao
ati
projeto Arquitetura
r
Funcional Contedo
en
Especificaes
requisitos
nt
Objetivosdoproduto
pgina127
108
CAPTULO6OESQUELETOAVIO
Definindooesqueleto
Oavioestruturacobertanocaptuloanteriordefinecomo
nossoprodutovaifuncionaroplanoesqueletodefineaformaqueessa
funcionalidadeirtomar.Almdeabordarmaisconcreto
questesdeapresentao,oavioesqueletolidacomassuntosque
envolvemumnvelmaisrefinadodedetalhes.Noplanoestrutura,ns
101/153
27/09/2016
Semttulo
olhouparaasquestesdegrandeescaladaarquiteturaeinteraoem
oplanodeesqueleto,nossaspreocupaesexistemquaseexclusivamenteno
menorescaladecomponentesindividuaisesuasrelaes.
Doladodafuncionalidade,nsdefinimosoesqueletopormeiodeinterface
projetaroreinofamiliardebotes,campos,eoutrainterface
componentes.Masprodutosdeinformaotemumconjuntoexclusivodeprobabilidade
lemsprpria.designdenavegaoaformaespecializadade
designdeinterfacesobmedidaparaapresentarespaosdeinformao.Finalmente,
ocruzamentodosdoislados,temosdesigndeinformao,aapresentao
deinformaesparaumacomunicaoeficaz.
ctionality
superfcie
projeto
esqueleto
designdainformao
estrutura
pgina128
109
Estestrselementosestointimamenteligadasentresi,maisdoque
qualquerumdosoutroselementosabordadosnestelivro.Noobst
monaserconfrontadoscomproblemasdeprojetodenavegaoquecomeamadiluir
eminformaoproblemasdedesign,ouparaencontrarperguntassobre
designdeinformaoqueacabamporsermatriadedesigndeinterface.
Mesmoqueaslinhascomeamsvezesembaada,identificandooscomo
reasseparadasdepreocupaonosajudaaavaliarmelhorsenstemos
liquidadaemumasoluoadequada.Umbomdesigndenavegaonopodecorrigir
designdeinformaoruim.Senopodemosdizeradiferenaentreo
tiposdeproblemas,nopodemosdizersensrealmenteresolvidolos.
Seenvolveforneceraosusuriosacapacidadedefazerascoisas,inter
desenhodaface.Ainterfaceomeiopeloqualosusuriosrealmente
entraremcontactocomafuncionalidadedefinidanaespecificao
eseestruturadanodesigndeinterao.
Seenvolveforneceraosusuriosacapacidadedeiralugares,nave
102/153
27/09/2016
Semttulo
projetogao.Aarquiteturadainformaoaplicadaumaestruturapara
osrequisitosdecontedoquedesenvolvemosodesigndenavegao
alenteatravsdaqualousuriopodeverqueaestrutura,eo
meiopeloqualousuriopodemoveratravsdele.
Sesetratadecomunicaridiasparaousurio,informao
design.Esteomaisamplodostrselementosnesteplano,
potencialmenteincorporaroucombaseemaspectosdequase
tudooquetenhovistoatagoraemambososladosdafuncionalidadee
ladodainformao.designdeinformaoatravessaafronteira
entreafuncionalidadeorientadaatarefasedosistemadeinformaoorientada
temsporquenemdesigndeinterfacenemdesigndenavegaopodemser
totalmentebemsucedidosemumbomdesigninformaesparaapoilos.
page129
110
ConvenoeMetfora
Hbitoereflexsoabaseparagrandepartedanossainteraco
comomundodefato,senoforamcapazesdereduzirtanto
oquefazemoscomreflexo,nsconseguirumloteinteiromenosacadadia.
Vocpodeimaginarsedirigirumcarronuncaficoumaisfcildoqueera
aprimeiravezquetentoufazlo?Suacapacidadededirigir,cozinharumarefeio,ou
usarumtelefonesemmvelsendocompletamenteexaustopela
tremendaconcentraonecessriaparaatarefadependedo
acmulodelotesdepequenosreflexos.
Convenonospermiteaplicaressesreflexosemcircunstnciasdiferentes
posturas.Eucostumavaterumcarroqueinvariavelmentecausadoproblemasquando
nuncaqualquerumdosmeusamigosdirigilo.Quandoelescomearamocarro,o
primeiracoisaquefezfoilavaroprabrisa.Estenofoiporque
elespensaramqueoprabrisaestavasujo(emboraelaprovavelmentefoi)
emvezdisso,eraporqueelesestavamtentandoacenderosfaris.
Oscontrolesnomeucarroeramdiferentesdasconvenesque
foramutilizadas.
Telefonessooutrobomexemplodaimportnciadaconveno
o.Detemposemtempos,osfabricantestmexperimentado
desviosdoesquemapadrodetrsporquatroparaosbotes
notelefone,talcomoduasfilasdeseisbotesdecadaum,outrslinhas
dequatro.arranjoscircularesaindaaparecerdevezemquando,mas
estesestosetornandocadavezmaisraroscomoostelefonescomseletorgiratrioem
quesebaseiamdesaparecernasnvoasdoesquecimentotecnolgico.
Parecequeolayoutnodevefazermuitadiferena,
103/153
27/09/2016
Semttulo
maselefaz.Sevocmediuotempoqueousuriogastatentandodescobrir
pgina130
111
aqualbotoparaempurraremumtelefoneforadopadro,pode
viraseralgocomotrssegundosporchamada.NoqueoBig
umadiferena,masparaousurio,essestrssegundosnosoapenasperdeu
Tempo.Essastrssegundossopreenchidoscompurafrustrao,comoum
tarefareflexivatornasedolorosamentelentosimplesmenteporqueotapetede
convenofoipuxadodebaixodepsdousurio.
Naverdade,trsporquatromatrizdotelefonededgitostobem
entranhadoquesetornouopadroparaoutrosdispositivosque
notemnadaavercomtelefones,comofornosdemicroondas
oucontrolesremotos.Curiosamente,otecladodotelefonenoanica
padronestarea:opadro"10key",usadaporidadeadicionando
mquinas,oqualinverteaordemdosdgitosnotelefone
teclado,utilizadoemcalculadoras,teclados,caixaseletrnicos,caixasregistradorase
emaplicaesdeentradadedadosespecializadas,taiscomosistemasdeinventrio.
Porqueambosospadresdeusarumamatrizdetrsporquatro,aspessoaspodem
adaptarseaqualquerumcomrelativafacilidade,emboraumpadronicoseria
realmenteseramelhorsoluodetodos.
Issonoquerdizerquearespostaparacadaproblemainterface
adernciaservilsconvenes.Emvezdisso,vocdevesimplesmenteser
cautelososobredesviandoconvenesefazloapenasquandoum
abordagemdiferenteoferecebenefciosclaros.Criandoumusuriobemsucedida
experinciaexigeterrazesexplicitamentedefinidasparacada
escolhaquevocfaz.
Efectuarasuainterfaceconsistentecomosoutrosqueseususuriosso
jestfamiliarizadocomimportante,masaindamaisimportante
fazerasuainterfaceconsistentecomelemesmo.Omoconceitual
elsparaascaractersticasdeseuprodutopodeajudloagarantirinterna
page131
104/153
27/09/2016
112
Semttulo
consistncia.Sevoctemduascaractersticascomomesmoconceitual
modelo,elessosusceptveisdeterrequisitosdeinterfacesemelhantes.utilizao
asmesmasconvenesemambososlugarespermitequeumusurioqueestejafamiliarizado
comumaadaptarserapidamenteparaooutro.
Mesmoondeosmodelosconceptuaisdecaractersticasdiferentes,idiasque
aplicamseatravsdeumavariedadedemodelosconceituaisdevemsertratados
semelhante(senoidntica)ondequerqueapaream.conceitoscomo
"Iniciar","acabamento","voltar"ou"salvar"podeserencontradoemumaamplagamade
contextos.Dandoaestesumtratamentoconsistenteaolongopermitequeosusurios
aplicaroquejsabedeterusadooutraspartesdo
sistema,levandoosaosseusobjetivosmaisrapidamenteecommenoserros.
Assimcomovocnodevetomarosmodelosconceituaissubjacentesasua
designdeinteraomuitoliteralmente,vocdeveresistiraoimpulsode
construiroseuprodutoemtornodeumasriedeconcretometforas.
Metforasparaascaractersticasdeseuprodutobonitoedivertido,mas
elesquasenuncafuncionatobemcomoparecequeelesdeveriam.Naverdade,eles
muitasvezesnofuncionaemtodos.
Emalgunscasos,vocpodeestarinclinadoapadrododesigndeinterface
paraumadeterminadafunoapsainterfacedeumobjetodomundoreal.
Lembresedenavegaodeardsiaemquevocpoderia"virar"aspginas
assimcomoemumarevistareal?Amaioriadasinterfacesenavegao
dispositivosnomundorealsooprodutodasrestriesda
mundoreal:fsica,aspropriedadesdosmateriais,eassimpordiante.Tela
produtosbaseadostaiscomositesdaWebeoutrossoftwarestmalgunsdos
mesmasrestries.
pgina132
113
Analogiasentreascaractersticasdoseusiteeexperincias
aspessoastmnomundorealpodeparecerumaboamaneiradeajudar
aspessoasobterumaalasobreoqueessascaractersticassotudo.Contudo,
estetipodeabordagemgeralmenteobscureceanaturezadafuncionalidade
emvezderevelar.Emboraaassociaoentreo
apresentamesuarepresentaometafricaclaroparavoc,apenas
105/153
27/09/2016
Semttulo
umdequalquernmerodeassociaesdeseususuriospossamaplicarespe
cialmenteseessesusuriosvmdeumfundoculturaldiferente
Vocfaz.Oqueissopequenaimagemdeumtelefonesignifica?Vontade
quemepermitafazerumachamadatelefnica?Verificarmeucorreiodevoz?pagaraminha
contadetelefone?
claro,ocontedodoseusitedeveforneceralgumgraude
contextoparaajudarosusuriosatomarmelhorespalpitessobreoquecaracterizasua
metforaspretendemrepresentar.Masquantomaisdiversificadafora
gamadecontedosefuncionalidadesquevocoferece,amenosconfivelestes
suposiestornarsee,dequalquermodo,algumapartedeseupblico
sempreindoparaadivinharincorretamente.Seriamelhor(emaissimples)
paraeliminaressaadivinhaocompletamente.
Usandometforasefetivamenterealmenteapenassobreareduodomental
esforonecessrioparaqueosusuriosselocomovereutilizarafuncionalidade
deseuproduto.Tendoumconedeumlivrodetelefonepararepresentarum
diretriorealdenmerosdetelefonepodesermuitobemtendo
umaimagemdeumalojadecafpararepresentarsuareadebatepapoumpoucomais
problemtico.
pgina133
114
designdeInterface
designdeinterfacetudosobrecomoselecionaroselementosdainterfacedireita
paraatarefaqueousurioesttentandorealizareorganizandoos
nateladeumamaneiraqueserfacilmentecompreendidaefacilmente
usava.Tarefas,muitasvezes,esticaremvriastelas,cadaconteno
ingumconjuntodiferentedeelementosdeinterfaceparaoutilizadordeenfrentar.
Quaisasfunesacabamemquetelasumaquestodeinterao
projetarparabaixonoplanodeestruturacomoessasfunessoreal
zadanatelaoreinododesigndeinterface.
interfacesdesucessosoaquelesemqueosusuriosnotarimediatamente
ascoisasimportantes.materialsemimportncia,poroutrolado,nofaz
obternotado,svezes,porquenol.Umdos
maioresdesafiosdasinterfacesprojetandoparasistemascomplexos
descobrirquaisaspectososusuriosnoprecisamparalidarcome
reduzirasuavisibilidade(oudeixandoosporcompleto).
106/153
27/09/2016
Semttulo
Paraaspessoascomumfundonaprogramao,estemododepensar
ingpodeexigiralgumajuste.Muitasvezesmuitodiferentedoque
elessousadospara.Bonsprogramadoressemprelevaremcontao
amaioriadoscenriosimprovveis(chamados"casosextremos"noJARprogramao
grados).Afinaldecontas,arealizaofinalparaprogramadores
acriaodeumsoftwarequenuncaquebramasaprogramaoqueno
contaparacasosextremossusceptveldefazerexatamenteissosobos
circunstnciasextremas.Assim,osprogramadoressotreinadosparatratartodosos
casoigualmente,seelerepresentaumusuriooumil.
Estaabordagemnofuncionaparadesigndeinterface.Umainterface
dumpequenonmerodecasosextremosomesmopesoqueasnecessidades
pgina134
115
dagrandemaioriadosusuriosacabamalequipadaparafazerqualquer
pblicofeliz.Umainterfacebemconcebidoreconheceoscursos
deusuriosdeaosomaispropensosatomarefazcomqueaquelesdeinterface
elementosmaisfceisdeacessareusar.
Issonosignificaqueasoluoparatodososproblemasdeinterface
parafazerosusuriosdobotosomaispropensosaempurraromaiordeles.
projetosdeinterfacepodeempregarumavariedadedetruquesparafacilitarosusuriosaolongo
ocaminhoparaseusobjetivos.Umtruquesimplespensarcuidadosamentesobre
asopespadroselecionadasquandoainterfaceapresentadopelaprimeiraveza
ousurio.Seasuacompreensodasatribuiesdosseususuriosemetasleads
quevocpenseamaioriadelesprefereresultadodebuscasdetalhadassobre
brevesqueridos,deixandooMostrememaisdetalhescaixadeseleomarcadapor
defaultsignificaquemaispessoasseroautomaticamentefelizcomoque
querecebem,independentementedeelestomouotempoparalerortulo
nacaixadeverificaoetomarumadecisoporsimesmos.Aindamelhor
umsistemaquememorizaautomaticamenteasopesdeumutilizadorseleccionou
altimavezqueparadopor,masissosvezesexigemais
acrobaciastcnicasdoqueparecesernecessrionasuperfcie,
ecomoresultado,impraticvelparaalgumasequipesdedesenvolvimentoparaimplementar
mentocomsucesso.
ferramentasdetecnologiaequadrostmcontcnicainerente
restriquelimitamasopesdeinterfacedisponveisparans.Esteefectiva
aliadomausebons.ruimporquelimitaasnossasoportunidades
deabordagensinovaoalgumainterfacequepodeserpossvel
usandocertastecnologiaspodeserimpossvelderealizarcomou
107/153
27/09/2016
Semttulo
ers.Masestasituaotambmbom,porqueosusuriosqueaprendem
paratrabalharcomumrelativamentepequenoconjuntodecontrolespadropodeaplicaresse
conhecimentoatravsdeumaamplagamadeprodutos.
pgina135
116
convenesdeinterfaceparecequeelesnodevemmudar,maseles
fazer,semuitolentamente.Asnovastecnologias,porvezesanecessidadedetrazer
reexaminarconvenesexistentesouchegaraalgumasnovas.
experinciadousuriodesignerscontinuamaprocurarnovasconvenespara
tecnologiascomocontrolesgestuaisedispositivostouchscreen.Amaioria
doscontrolospadrovemosatravsdeumaamplagamadetelabasede
produtosoriginadoscomossistemasoperacionaisdecomputadoresdesktop,comoo
MacOSouWindows.Essessistemasoperacionaisoferecemumpunhadode
Oselementosdainterfacepadro:
Ascaixasdeverificaopermitemaosusuriosselecionaropesindependentementeumdo
outro.
Botesderdiopermitemqueosusuriosselecionemumaopoentreumconjunto
opesdemutuamenteexclusivos.
Oscamposdetextopermitemqueosusuriosesperarporelaaentrartexto.
pgina136
108/153
27/09/2016
Semttulo
117
Listassuspensasfornecemamesmafuncionalidadecomobotesderdio,
masfazloemumespaomaiscompacto,permitindoquemuitosmais
opesparaserapresentadosdeformaeficiente.
Caixasdelistagemfornecemamesmafuncionalidadecomocaixasdeseleo,maseles
fazloemumespaomaiscompacto(porquecaixasdelistaderolagem).Talcomoacontececom
dropdowns,issopermitequeacaixadelistagemparasuportarfacilmenteumgrandenme
berdeopes.
Botesdeaopodefazermuitascoisasdiferentes.Tipicamente,eles
dizeraosistemaparatomartodasasoutrasinformaesqueousuriotem
fornecidaatravsdeoutroselementosdainterfaceefazeralgotake
acocomlo.
Algumastecnologiasdeforneceressemesmoconjuntodeelementosbsicos,masno
designersdeforaparafurarauslos,permitindoummaiorgrau
deflexibilidadenomodocomoainterfacepoderesponderaoutilizador.con
sequentemente,estasinterfacesenvolvemmuitomaisescolhasaseremfeitas
duranteoprocessodedesign,eelestendemasermaisdifcildeacertar.
pgina137
118
listassuspensaspode
impedirusurios,ocultando
opesimportantes
dopontodevista(esquerda).Rdio
botesexibirfacilmente
109/153
27/09/2016
Semttulo
todasasopesdisponveis
(Direita),maseleslevam
maisespaono
Malabarismotodososdiferenteselementosdainterfaceeescolherapartirde
interface.
entreeles,inevitavelmente,envolvetradeoffs.verdade,quesuspenso
vocvaieconomizaralgumespaonoecremrelaoaumconjuntoderdio
botes,masquetambmiresconderasopesdisponveisapartirdousurio.
Terpessoasdigitarascategoriasquedesejapesquisarpoder
colocarmenoscargasobreobancodedados,mascolocamaiscargasobreousurioEse
Existemapenasseisparaescolherqualquermaneira,talvezalgumascaixas
seriamelhor.
designdenavegao
ProjetandonavegaopelaWebpareceserumnegciosimples:ponha
linksemtodasaspginasquepermitemaosusuriosdaravoltanosite.Sevocs
arranharasuperfcie,noentanto,ascomplexidadesdedesigndenavegao
tornamseaparentes.Odesigndenavegaodequalquersitedeveacom
plishtrsobjetivossimultneos:
.Emprimeirolugar,eledeveforneceraosusuriosummeioparaaobtenodeum
pontoparaoutronosite.Porquenormalmenteimpraticvel
cal(emesmoquandoprtico,quegeralmentenoumaboaidia)
paraconectarseatodasaspginasdecadaoutrapgina,elementodenavegao
mentostmdeserselecionadoparafacilitarusuriorealcomportamento
epelamaneira,issosignificaqueesseslinkstemquerealmente
trabalhar,tambm.
pgina138
119
.Emsegundolugar,odesigndenavegaodevecomunicarorela
laoentreoselementosqueelecontm.Noosuficiente
deoferecerapenasumalistadelinks.Oqueessasligaestmde
vercomaoutra?Algumassomaisimportantesdoqueoutros?
Quaissoasdiferenasrelevantesentreeles?estecom
caonecessriaparaosusuriosaentenderoqueescolhas
estodisponveisparaeles.
.Emterceirolugar,odesigndenavegaodevecomunicarorelacionamento
navioentreoseucontedoeapginaqueousurioestatualmente
visualizao.Oquealgumdestematerialtemavercomo
Euestouolhandoagora?Comunicarestaajudaosusurios
entenderquaisasopesdisponveispodemmelhorsuporte
atarefaoumetaqueestperseguindo.
MesmoparaprodutosquenosoorientadosinformaoounosoWeb
110/153
27/09/2016
Semttulo
locaisdetodoessastrsconsideraesentramemjogo.Amenosquetodos
asuafuncionalidadeseencaixaemumanicainterface,vocvaiprecisardealgum
navegaoparaajudarosusuriosaencontraroseucaminho.Emumespaofsico,
aspessoaspodemconfiaremalgumgrau,umsensoinatodedireopara
orientarse.(Claro,algumaspessoassimplesmenteparecemserperpetuao
aliadoperdido.)Masosmecanismosemnossocrebroquenosajudamaencontraronosso
voltanomundofsico("Vamosver,achoqueaentrada
ondeeuvimdeveseratrsdemimeesquerda")sototalmente
inteisparanosajudaraencontraronossocaminhoemtornodeumespaodeinformao.
porissoquedeimportnciavitalquecadapginadeumsitedaWeb
comunicarclaramenteaosusuriosondeelesestonositeeonde
elespodemir.Paraqueosusuriosmedidaorientarseeminformaes
espaosumaquestodealgumdebate:Algumaspessoasfavorecemfortementea
noodequeosusuriosfazerpequenosmapasemsuascabeasquandoelesvisitam
websites,assimcomoelesfazememlojasdeferragensebibliotecasoutras
pgina139
120
usuriosafirmamdependemquaseinteiramentedanavegaoewayfind
ingpistasnafrentedeles,comosecadapassoquedavamatravsdosite
desapareceudesuamemrialogodepoisquetomou.
difcilparanssaberoquo(ouquanto)aspessoasmantero
estruturadesitesemsuascabeas.Semesseconhecimento,o
melhorabordagemassumirqueosusurioscarregamnenhumconhecimentocom
losdeumapginaparaoutra.(Afinal,seummotordebuscapblico,como
Googleindexaoseusite,qualquerpginapodeserumpontodeentradaparaoseu
sitedequalquermaneira.)
Amaioriadossitesrealmentefornecervriossistemasdenavegao,cada
cumprindoumpapelespecialemquepermiteaoutilizadornavegarnosite
comsucessonumavariedadedecircunstncias.Vriostiposcomunsde
sistemasdenavegaosurgiramnaprtica.
navegaoglobal.
Navegaoglobalforneceacessoaumaamplavarreduradetodoo
local.Ousodotermoglobal,aquinoimplicanecessariamenteque
estanavegaoapareceemtodasaspginasnositedeapesardeque
111/153
27/09/2016
Semttulo
noumamideia.(Usamosotermopersistenteparasereferiranavegao
elementosqueaparecememtodoositeNovamente,tenhaemmenteque
elementospersistentesnosonecessariamenteglobal.)Emvezdisso,global
navegaoreneoconjuntodechavesdepontosdeacessoqueosusurios
Talvezsejanecessriocomearapartirdeumaextremidadedolocalparaooutro.Navegao
pgina140
121
barescomlinksparatodasasprincipaisseesdeumsitesoumexemploclssico
denavegaoglobal.Emqualquerlugarvocpodequererir,vocpodeobter
l(eventualmente)comnavegaoglobal.
navegaolocal.
Navegaolocalforneceaosusuriosacessoaoqueest"nasproximidades"
naarquitectura.Emumaarquiteturaestritamentehierrquica,locais
navegaopodeforneceracessoamedeumapgina,irmose
crianas.Sesuaarquiteturaconstrudopararefletirasmaneiras
usuriospensamsobreocontedodosite,navegaolocalsertipicamente
fazermaisusodoqueoutrossistemasdenavegao.
suplementar
navegao.
NavegaoSuplementarofereceatalhosparacontedosrelacionados
quepodenoserfacilmenteobtidasatravsdanaveglobaloulocal
gao.Estetipodeesquemadenavegaooferecealgunsdosbenefcios
daclassificaofacetadadiscutidonoCaptulo5(permitindoaosusurios
mudarofocodesuaexploraodocontedoseminiciar
sobrenoincio),enquantopermiteaindaositeparamanteruma
arquiteturaprincipalmentehierrquica.
112/153
27/09/2016
Semttulo
pgina141
122
navegaocontextual.
Navegaocontextual(svezeschamadodenavegaoinline)
incorporadanocontedodapginaemsi.Essetipode
denavegao,porexemplo,umlinkdentrodotextodeumapginase
muitasvezessubutilizadosoumisutilized.Quandoelesestolendootexto
muitasvezesosutilizadoresmomentodecidemqueprecisamumapeaadicionalde
emformao.Emvezdeforarosusuriosadigitalizarapginaparao
certoelementoouanavegaopior,enviandooscorrendoparao
motordebuscaporquenocolocarolinkrelevanteali?
Atingindotodoocaminhodevoltaparaoplanodeestratgia,omelhorquevoc
entenderseususuriosesuasnecessidades,maiseficazmentevoc
podeimplantaranavegaocontextual.Seelenosuportaclaramenteasua
tarefaseobjetivosdosusuriosseotextorepletadetantos
hiperlinksqueosusuriosnopodemescolheroquerelevanteparasuanecessidades
navegaocontextual(comrazo)servistocomodesordem.
Navegaocortesiaforneceacessoaitensqueosusuriosno
preciso,numabaseregular,masquesonormalmentefornecidoscomoumcon
venience.Nomundofsico,umalojadevarejonormalmenteirpublicarasua
horasdeoperaonasuaentrada.Paraamaioriadosclientes,amaiorpartedo
tempo,estainformaonotudooquetil:Qualquerpessoapodedizermuito
rapidamenteseounoalojaestabertaparaonegcio.massaber
queainformaoestprontamentedisponvelajudalosquandoelesfazem
precisodisso.Linksparainformaes,formulriosdefeedbackepolticaentreemcontato
declaraessocomumenteencontradosnanavegaodecortesia.
pgina142
123
navegaocortesia.
113/153
27/09/2016
Semttulo
Algunsdispositivosdenavegaonosoincorporadosdentrodaestrutura
desuaspginas,masficarporcontaprpria,independentedocontedo
oufuncionalidadedoseusite.Estessodenavegaoremotosferramentas
queosusuriossevoltamparaquandoelesficamfrustradoscomaoutranavegao
sistemasadicionaisquevocforneceu,ouquandoelestomaramumaolhada
seussistemasdenavegaoerapidamentechegouconclusodeque
elessomelhornemtentarentendlos.
Ummapadositeumaferramentadenavegaoremotocomumquedaosusuriosuma
concisa,umapginainstantneodaarquiteturageraldosite.Osite
mapanormalmenteapresentadocomoumesboohierrquicodosite,pro
necerlinksparatodasasseesdenvelsuperiorcomlinksparaasprincipaissegunda
seesdenvelrecuadoabaixodeles.Osmapasdelocalnormalmentenomostram
maisdoquedoisnveisdehierarquiaparaalmdissomaisdetalhe
queosusuriosnormalmenteprecisam(esenofor,hprovavelmentealgo
erradocomsuaarquiteturadealtonvel).
Umndiceumalistaalfabticadetpicoscomlinkspararelevantes
pginas,bemcomoondicenapartedetrsdeumlivro.Estetipodeferramenta
maiseficazparaoslocaisquetmumagrandequantidadedecontedoqueabrangeum
variadagamadeassuntos.Namaioriadosoutroscasos,ummapadositeeumabem
arquiteturaplanejadadevesersuficiente.Osndicesso,porvezes,
desenvolvidoparaseesindividuaisdeumsite,emvezdetentar
paracobrirtodaavarreduradecontedodositeestaabordagempodeser
tilquandovoctiverseesdestinaaservirdiferentespblicos
cominformaodivergenteprecisa.
pgina143
124
designdainformao
designdeinformaopodeserdifcildecolocarodedosobre.mas
muitasvezesservecomoacolaquemantmosoutroscomponentesda
criarjuntos.Emtodososcasos,odesigndainformaoseresumea
tomadadedecisessobrecomoapresentarainformaoparaqueaspessoas
podeuslooucompreendlomaisfacilmente.
svezesodesigndeinformaovisual.umatortadetraaromelhorcaminho
paraapresentaressesdados,ouseriaumtrabalhogrficodebarrasmelhorparaosnossosusurios?
OconebinculostransmitiradequadamenteoconceitodeProcurar
ingosite,ouseriaumalupasermelhorcompreendida?
svezesodesigndeinformaoenvolveagrupamentoouorganizao
114/153
27/09/2016
Semttulo
peasdeinformao.Costumamosfazeresteaspectodoprojetopara
concedidoporqueestamosacostumadosaverinformaocomum
agrupadasemdeterminadasmaneiras.Porexemplo,olheparaestalistadeitens:
.Estado
.Ttulodotrabalho
.Nmerodetelefone
.Endereodarua
.Nome
.CEP
.Organizao
.Cidade
.Email
pgina144
125
Pareceumpoucoconfuso,porquenormalmenteseparececomisso:
.Nome
.Ttulodotrabalho
.Organizao
.Endereodarua
.Cidade
.Estado
.CEP
.Nmerodetelefone
.Email
Mesmoestearranjopodeserdeixadoaindamaisclara:
.Asinformaespessoais
.Nome
.Ttulodotrabalho
.Organizao
.Asinformaessobreendereo
.Endereodarua
.Cidade
.Estado
115/153
27/09/2016
Semttulo
.CEP
.Outrasinformaesdecontato
.Nmerodetelefone
.Email
pgina145
126
Esteexemploparecebastantesimples,masumpoucodiferente
listadeitensiriaprovarmaisdesafiador:
.Limitedepotncia
.TamanhoRotor
.Acapacidadedotanque
.Tipodetransmisso
.VelocidadeangularMediana
.EstiloChassis
.Sadamxima
Achave,naturalmente,ogrupoeprovidenciaroselementosdeinformao
deumaformaquerefletecomoosusuriospensameapoiaassuastarefas
eobjetivos.Asrelaesconceituaisentreesseselementos
realmenteascenderaarquiteturadainformaoemnvelmicroemformao
projetoentraemjogoquandotemosparacomunicarquetrutura
turanapgina.
Odesigndainformaodesempenhaumpapelemproblemasdedesigndeinterface,porque
ainterfacenodeveapenascoletarinformaesdousurio,mas
comunicarasinformaesaousurio,bem.Asmensagensdeerrosoum
clssicoproblemadedesigndeinformaonacriaodeinterfacesbemsucedidas
fornecendoinformaesinstrutivasoutra,mesmoporque
omaiordesafiofazercomqueosusuriosrealmentelerainstruo
es.Semprequeosistematemquedaraosusuriosalgumasinformaes
paraqueelesutilizamainterfacecomsucessoseporque
elescometeramumerroouporqueestamosapenascomeandoque
umproblemadedesigndeinformao.
116/153
27/09/2016
Semttulo
pgina146
127
wayfinding
Umafunoimportantequeodesigndeinformaoenavegao
trabalhodedesignemconjuntoparaexecutarestapoiandowayfinding
ajudandoaspessoasaentenderondeelesestoeondeelespodemir.
Aideiadewayfindingvemdaconcepodeespaospblicosem
omundofsico.Parques,lojas,estradas,aeroportoseestacionamentos
todosbeneficiardaincorporaodedispositivoswayfinding.Parque
garagensing,porexemplo,svezesusamcodificaodecoresparadar
sugestespessoasparaajudlosaselembrarondedeixouseuscarros.Dentro
aeroportos,sinais,mapaseoutrosindicadoresdeajudaraspessoasaencontraroseu
caminhodevolta.
EmsitesdaWeb,wayfindinggeralmenteenvolvetantoodesigndenavegao
edesigndeinformao.Ossistemasdenavegaoutilizadosporumsite
nostemqueproporcionaroacessosdiferentesreasdosite,
elestambmtmquecomunicaressasescolhasclaramente.Bomcaminho
constataopermiteaosusuriosobterrapidamenteumaimagemmentaldeondeeles
so,ondeelespodemir,equeasescolhasvailevlosparamaisperto
osseusobjectivos.
Ocomponentededesigndeinformaodewayfindingenvolvepginaele
mentosquenoexecutamumafunodenavegao.Porexemplo,apenas
comoemparquesdeestacionamento,algunssitestmsidomuitobemsucedida
nousodecodificaodecoresparaindicarqualseoumusurioestolhando.
(Noentanto,codificaodecoresquasenuncausadaporsis,emvezdisso,
reforaoutrosistemadesinalizaotambmnolugar.)cones,porrtulos
sistemasing,etipografiasooutrasopesdedesigndeinformao
porvezesusadosparaajudarareforarumsentimentode"vocestaqui"paraosusurios.
pgina147
128
wireframes
117/153
27/09/2016
Semttulo
layoutdapginaondeodesigndeinformao,designdeinterface,e
designdenavegaosejuntamparaformarumskelcoesaunificada
Eton.Olayoutdapginadeveintegrarasdiferentesnavegao
sistemas,cadaumprojetadoparatransmitirumavisodiferentedoarquitetural
turatodososelementosdainterfaceexigidosporqualquerfuncionalidadeem
apaginaeodesigndeinformaoquesuportaambos,como
bemcomoodesigndeinformaodoprpriocontedodapgina.
muitoparaequilibrartudodeumavez.porissoqueolayoutdapginacobertoem
detalhesemumdocumentochamadoumesquemadepginaouwireframe.o
wireframeumarepresentaodeesqueleto(comoonomesugere)detodos
oscomponentesdeumapginaecomoelesseencaixam.
capturadewireframes
CORTESIANAV
todooesqueleto
LOGOTIPO
decisesemumnico
GLOBALNAV
documentoqueserve
comoumarefernciapara
CUESwayfinding
trabalhodedesignvisuale
CONSULTADEPESQUISA
HeaderGraphic
implementaosite.
suspenso
wireframespode
Embaleminhacaixacomcincojarrasdziadebebidas.
contmnveisvariveis LOCAL Comorsrazorbacksaltopodenivelarseis
campodetexto
NAV
ginastasdespertado!Nsnogostamdetroca
dedetalhe,este
lotesdetrabalhodetamanhosquevariamdeumquartoacima.
boto
OtrabalhoexigeArranqueextraezelode
luzbonita.
cadaassalariadojovem.
CONTEDOPARTNER
Umfrascolitrodeleomisturadocomxidodezinco
fazumapinturamuitobrilhante.Seisgrandesuculenta
Otrabalhoexigeadicional
bifeschiaramemumapaneladecincooperriosesquerda
arrancarezelodecada
pedreira.Amsicajukeboxintrigadoum
assalariadojovem.UMA
visitantesuavedeumacidadedovalepitoresco.
quartpotedeleomisturadocom
Sup.NAV
xidodezincotornamuito
Embaleminhacaixacomcincojarrasdziadebebidas.
pinturabrilhante.Embaleminhacaixa
Comorsrazorbacksaltopodenivelarseis
comcincojarrasdziadebebidas.
ginastasdespertado!
CORTESIANAV
pgina148
129
Estedesenhosimplesgeralmentefortementeanotada,referindose
oleitoradiagramasdearquiteturaououtrodesigndeinterao
documentao,exignciasdecontedoouespecificaesfuncionais,
ououtrostiposdedocumentaodetalhadaconformenecessrio.Porexemplo,
seumwireframerefereseaelementosespecficosdecontedoexistentes,pode
fornecerrefernciasparaqueelespodemserencontrados.Almdisso,oarame
quadro,muitasvezes,contmnotassuplementaressobreocomportamentodestinase
quepodenoserbviaapartirdeapenasolhandoparaowireframee
odiagramadearquitetura.
Demuitasmaneiras,odiagramadearquiteturavimosdevoltanaestru
avioturaagrandevisoparaoprojetoaquinoesqueleto
avio,owireframeodocumentodetalhadoquemostraoquo
118/153
27/09/2016
Semttulo
essavisosercumprida.Wireframes,svezes,sercomple
tadasporespecificaesdenavegaoabrangente,descrevendo
maisdetalhe,acomposioprecisadecadaumdosvriosnavegao
componentesadicionais.
Paraprodutoscomplexosmenoresoumenos,umanicawireframesuficiente
cienteparaservircomomoldeparatodasastelasaseremconstrudas.Para
muitosprojetos,noentanto,vrioswireframessonecessriosparatransmitir
acomplexidadedoresultadopretendido.Vocprovavelmentenovaiprecisardeum
wireframeparacadatela,noentanto.Assimcomooproarquitectnica
cessopermitiuclassificaroselementosdecontedoemcategoriasamplas
outipos,umnmerorelativamentepequenodetelaspadroemergir
dedesenvolvimentodeestruturadearame,combasenafuncionalounavegao
diversidadecionaldeseuproduto.
Wireframessoumprimeiropassonecessrionoprocessodeformalmente
queestabeleceodesignvisualparaosite,masquasetodomundo
envolvidanoprocessodedesenvolvimentoirutilizlosemalgumponto.
pgina149
130
Aspessoasresponsveispelaestratgia,escopoeestruturapodesereferira
owireframeparaconfirmarqueoprodutofinalirsatisfazerassuas
expectativas.Aspessoasresponsveispelarealmenteconstruindooproduto
podeconsultarowireframepararesponderperguntassobrecomoosite
devefuncionar.
Owireframe,sendoolugarondeainformaoarquiteturae
designvisualserenem,muitasvezesumassuntodedebateedis
pute.experinciadousuriodesignersdereclamarqueosdesignersvisuaisque
criarwireframesobscurecersuasarquiteturastrsdenavegao
sistemasquenoreflectemosprincpiossubjacentesarquitetural
turas.designersvisuaissequeixamdequewireframesproduzidopelousurio
experinciadesignersdereduziroseupapelaodeumapinturapornmeros
artista,desperdiaraexperinciaeperciaemcomuvisuais
nicaoqueelestrazemparaproblemasdedesigndeinformao.
Quandovoctemosdesignersdeexperinciadousurioseparadasevisuais
osdesigners,anicamaneiradeproduzirwireframessucessoatravs
colaborao.Oprocessodeterdetrabalharosdetalhesdo
wireframeemconjuntopermitequecadaladoparaverasquestesapartirdaoutra
pontodevista,epodeajudaradescobrirosproblemasnoinciodoprocesso
(Emvezdemaistarde,quandooprodutoestsendoconstrudoetodaagente
perguntandoporqueelenoestfuncionandocomoplanejado).
119/153
27/09/2016
Semttulo
Tudoissofazwireframessoarcomoummontedetrabalho.Eles
notemqueser.Documentaonuncaumfimemsimesmoapenas
ummeioparaumfim.Criaodedocumentaoparaoseuprpriobemno
apenasumdesperdciodetempo,podesercontraproducenteedemoral
izing.Produzindoonvelcertodedocumentaodoseunecessidades
enoenganandoasimesmoquevocpodeconseguircommenosvoltas
documentaodeumproblemaemumavantagem.
pgina150
131
Algunsdoswireframesmaisbemsucedidosqueeujtrabalheicomtm
sidonadamaisdoqueesboosalpiscomnotasanexadas.
Porumapequenaequipeemqueodesignereprogramadorsentar
direitaaoladodooutro,queonveldedocumentaoperfeitamente
suficiente.Masquandoaprogramaoaresponsabilidadedeumtodo
equipeenoapenasumapessoaequeaequipaestameiocaminhoaoredordo
mundialmentealgoumpoucomaisformalprovavelmentechamadopara.
Ovalordewireframesamaneiracomoelesintegrartodosostrselementos
daestruturaavio:designdeinterface,atravsdoarranjo
eseleodeelementosdeinterfacedesigndenavegao,atravs
aidentificaoedefiniodesistemasdenavegaodoncleoe
designdeinformao,atravsdacolocaoepriorizaode
componentesinformativos.Aotrazerostrsjuntosemum
documentonico,owireframepodedefinirumesqueletoqueconstri
sobreaestruturaconceptualsubjacenteenquantoapontaocaminho
encaminharparaodesigndesuperfcie.
120/153
27/09/2016
Semttulo
pgina151
7
captulo
Asuperfcie
Avio
projetosensorial
pgina152
121/153
27/09/2016
Semttulo
Superfcie
Esqueleto
Estrutura
Napartesuperiordomodelodecincoavio,voltamosnossaateno
oaessesaspectosdoprodutonossosusuriosvo
Escopo
notaremprimeirolugar:odesignsensorial.Aqui,ocontedo,funo
Estratgia
cionalidadeeestticaserenemparaproduzirum
projetoterminadoqueagradaossentidosaomesmotempocumprindo
todasasmetasdosoutrosquatroavies.
projetosensorial
ND
designdainformao
Interao Emformao
ati
projeto Arquitetura
r
Funcional Contedo
en
Especificaes
requisitos
nt
Objetivosdoproduto
pgina153
134
CAPTULO7DOPLANODESUPERFCIE
Quedefinemasuperfcie
Noplanoesqueleto,estvamoslidandoprincipalmentecomarranjo
mento.Designdeinterfacedizrespeitodisposiodeelementosde
permitirainteraodesigndenavegao,oarranjodeele
mentosparapermitiromovimentoatravsdoprodutoeinformaes
desenho,adisposiodeelementosdecomunicaodeinformao
paraoutilizador.
Movendoseparaoplanodesuperfcie,estamosagoraalidarcomo
projetosensorialeapresentaodosarranjoslgicosque
122/153
27/09/2016
Semttulo
fazerseoesqueletodoproduto.Porexemplo,atravsdeateno
oaodesigndeinformaes,podemosdeterminarcomodevemosgrupoe
providenciaroselementosdeinformaodapginaatravsdaateno
dedesignvisual,nsdeterminarcomoessearranjodeveser
apresentadavisualmente.
ctionality
projetosensorial
superfcie
esqueleto
pgina154
135
MakingSensedosSentidos
Cadaexperinciaquetemos,noapenascomprodutoseservios,
mascomomundoeunscomosoutros,tratadefundamentalmente
nosatravsdosnossossentidos.Noprocessodedesign,estaaltimaparada
nocaminhoparaentregarumaexperinciaparanossosusurios:determinar
comotudosobreonossoprojetovaisemanifestaraossentidosdaspessoas.
Qualdoscincosentidos(viso,audio,tato,olfatoepaladar)
podemosempregardependedotipodeprodutoqueestoprojetando.
Cheiroesabor
Excetoparaalimentos,fragrncia,ouprodutosperfumados,cheiroesaborso
raramenteconsideraesparadesignersdeexperinciadousurio.verdadeque
svezesaspessoasdesenvolvemfortesassociaescomocheirodeum
produto,taiscomo"cheirodecarronovo",queprovoutopopular
quepodeseradicionadocomoumafragrnciamuitotempodepoisdeocarroultrapassou
definiodeningumde"novo",masessescheirossotipicamenteo
resultadodaescolhademateriaisdeconstruodoproduto,no
asdecisesdosdesignersdeexperincia.
Tocar
123/153
27/09/2016
Semttulo
Aexperinciadetoquedeumprodutofsicoencontrasedentrodoreinoda
desenhoindustrial.designersindustriaisestopreocupadosprincipalmentecoma
engajamentofsicodousuriocomumproduto.Istoimplicaele
mentosdeinterfaceedesigndeinterao(comoosarranjos
debotesdeumtelefonecelular),mastambmincluipuramentesensorial
consideraes,taiscomoaformadeumdispositivo(arredondado?quadrado?),
astexturasutilizadas(suave?spero?)eosmateriaisempregados
pgina155
136
(Plstico?Metal?).Graasadispositivosdevibrao,experimentalbaseadoemtela
ciaspodeterdimensessensveisaotoquetambm.Ostelefonesmveisedevdeo
controladoresdejogosusamvibraoparasecomunicarcomousurio.
Audio
Somdesempenhaumpapelnaexperinciademuitostiposdeprodutos.
Penseemtodososdiferentessinaissonorosevibraemumautomveltpico
easmensagensqueenviam:seusfarisestoacesos.Seucintodesegurana
desprendido.Suaportaestaberta,masvocdeixouachavenaignio
o.Osompodeserusadonoapenasparainformarousurio,masparaimbuirum
produtocomumsensodepersonalidade.Porexemplo,qualquerusuriopodeTiVo
recuperarfacilmenteavariedadedeBing,boops,esolavancosqueacompanham
anavegaoatravsdaexperinciaTiVo.
Viso
Estaareaondeaexperinciadousuriodesignerstmamais
sofisticao,porquedesignvisualdesempenhaumpapelempraticamentetodosos
tipodeprodutoqueexiste.Porestarazo,orestodestecaptulo
seconcentraremcomodesignvisualsuportaaexperinciadousurio.
Inicialmente,vocpodepensardesignvisualumasimplesquestodeAES
thetics.Todomundotemgostodiferente,etodomundotemumdiferente
ideiadoqueconstituiumdesignvisualmenteatraente,entocadaargumento
mentosobreasdecisesdedesignseresumeaprefernciapessoal,
certo?Bem,todomundotemumsentidodiferentedeesttica,mas
issonosignificaqueasdecisesdedesigntemqueserbaseadanoqueparece
legalparatodososenvolvidos.
Emvezdeavaliarideiasdedesignvisualapenasemtermosdoque
pareceesteticamenteagradvel,vocdeveconcentrarsuaatenoem
124/153
27/09/2016
Semttulo
pgina156
137
comoelasfuncionambem.Comoeficazqueodesenhoapoiaro
objectivosdefinidosporcadaumdosplanosinferiores?Porexemplo,faz
aaparnciadoprodutofazerdistinesentreasseesda
arquiteturaambguasoupoucoclaras,prejudicandoaestrutura?Ou
queodesignvisualclarificarasopesdisponveisparaosusurios,refora
forandoaestrutura?
Comunicandoseumaidentidadedemarca,porexemplo,umtgiacomum
objetivoGICparaumWebsite.identidadedamarcavematravsdemuitos
formasnalinguagemquevocusaounodesigndeinteraodoseu
sitefuncionalidade,masumadasprincipaisferramentasutilizadasparacomunicar
identidadedamarcaodesignvisual.Seaidentidadequedesejatransmitir
tcnicoeautoritrio,usandofontesdequadrinhosebrilhante
corespastelprovavelmentenoaescolhacerta.Noapenasumaquestode
esttica,umaquestodeestratgia.
SigaoEye
Umamaneirasimplesdeavaliarodesignvisualdeumprodutoperguntar:
Ondequeoolhovaiprimeiro?Qualoelementodoprojetoinicialmente
chamaaatenodosusurios?Elessoatradosparaalgoimportante
paraosobjectivosestratgicosdoproduto?Ouoprimeiroobjetodeseu
atenoumadistraodesuasmetas(ouseu)?
Pesquisadoressvezesusamsofisticadoseyetrackingequipamentos
paradeterminarexatamenteoquecobaiasestoolhandoecomooseu
olhossemovemaoredordatela.SevocapenasoajustefinodoVisual
concepodeumproduto,noentanto,normalmentevocpodeirlongecomsim
plypedindospessoasmesmoapenasperguntando.Estaabordagemnovai
pgina157
138
125/153
27/09/2016
Semttulo
fornecerosresultadosmaisprecisos,eissonuncavaicapturartodoo
nuancesqueoequipamentoeyetrackingpodeoferecer.Masamaiorpartedo
tempo,simplesmentefazendoperguntasperfeitamenteadequado.Outraformade
encontraroelementodominanteaolhardesoslaionapginaouborro
seusolhosatquevocnopodefazerosdetalhes,oucaminharatooutro
extremidadedasalaeolharparaeledel.
Emseguida,tentardeterminarondeoolhovai.Sevocestservindocomoseu
prprioassuntodeteste,tenteperceberosmovimentosinconscientesdasua
olhospelapgina.Nopensemuitosobreoquevocest
olhandoparaapenasdeixeseusolhostomarnapginanaturalmente.Sealgum
outracoisaoseuassuntodeteste,pedirlhesparachamaroselementosda
Apginanaordememquesuaatenoatradaparaeles.
Geralmente,vocencontrarpadresbastanteconsistentesnaformacomoaspessoassedeslocam
seusolhos,afinal,estessolargamenteinconsciente,instintiva
movimentos.Sesujeitosrelatamseusolhosapsumamuitodiferente
padrodeoutraspessoas,elesprovavelmentenosorealmenteconscientesdasua
movimentosdosolhosnaturais,ouelesestoapenasdizendooqueelespensam
vocquerouvir(ouambos).
Seseuprojetoforbemsucedido,opadrodeolhodousurioseguevontade
temduasqualidadesimportantes:
.Emprimeirolugar,segueseumfluxosuave.Quandoaspessoascomentamque
umdesenho"ocupado"ou"confuso",elesestorealmentereagindoa
ofactodequeodesenhonoconduzilossuavementeemtorno
apagina.Emvezdisso,seusolhossaltarparatrseparaafrenteentreuma
variedadedeelementostodosclamandoporsuaateno.
pgina158
139
.Emsegundolugar,eledaosusuriosumaespciedevisitaguiadadaspossibilidades
disponvelparaelessemsobrecarregloscomdetalhe.Como
sempre,essaspossibilidadesdevemapoiarasmetasetarefas
ousurioesttentandorealizarnestemomentoemsuainterao
ocomoproduto.Talvezmaisimportante,ospos
sabilidadesnodevedesviaraatenodainformaooufunesque
osusuriosterodecumpriressasmetas.
Omovimentodosolhosdousurioemtornodapginanoacontecepor
acidente.oresultadodeumconjuntocomplexodeprofundamenteenraizadainstintivo
126/153
27/09/2016
Semttulo
tivarespostasaestmulosvisuaisquetodosossereshumanospartilham.Felizmente
paranscomodesigners,essasrespostasnosocompletamenteforadonosso
controlartantoaolongodossculos,nsdesenvolvemosumavariedadede
tcnicasvisuaiseficazesparaatrairedirigiraateno.
Contrasteeuniformidade
Emdesignvisual,aprincipalferramentaqueusamosparachamaraatenodousurio
ocontraste.Umprojetosemcontrastevistocomoumcinza,
massasemtraoscaractersticos,fazendocomqueosolhosdousurioderivaaoredorsem
sedecidirsobrenadaemparticular.Ocontrastevitalparadesenharo
aatenodousurioparaaspectosessenciaisdainterface,contrasteajuda
ousuriocompreenderasrelaesentreanavegao
elementosnapgina,econtrasteoprincipalmeiodecom
municatinggruposconceituaisemdesigndeinformao.
Quandooselementosemumprojetosodiferentes,osusuriospagamaateno.Eles
Nopossofazernada.Vocpodeusaressecomportamentoinstintivoparaoseuvanta
tage,fazendoosusuriospeasrealmenteprecisaversedestacar
pgina159
140
orestodoselementos.MensagensdeerroeminterfacesWeb,muitasvezessufi
ferdemisturarcomorestodapginacontrastandoaspor
colocarotextoemumacordiferente(como,porexemplo,vermelho)ourealando
loscomumgrficocorajosopodefazertodaadiferena.
Numavisualmenteneutro
layout(pertodedireita,decima),
nadasedestaca.
Ocontrastepodeserutilizada
paraorientarosolhosdoutilizador
emtornodapgina(extrema
direita,decima)oudesenharoseu
atenoparaumachavedepoucos
elementos(pertodedireita,
inferior).Ousoexcessivode
levaaumcontraste
olharconfuso(extremadireita,
inferior).
127/153
27/09/2016
Semttulo
pgina160
141
Paraqueessaestratgiafuncione,noentanto,adiferenatemdesersigni
signisuficienteparaousuriodedizerclaramentequeaescolhadedesign
destinaseacomunicaralgumacoisa.Quandootratamentodedesign
dedoiselementossemelhante,masnoexatamenteomesmo,osusuriostmcon
fundido."Porqueaquelesquesodiferentes?quesupostoseromesmo?
Talvezfosseapenasumerro.Oueudeverianotaralgo
aqui?"Emvezdisso,queremostantoparaagarraraatenodosusuriosegarantir
lhesqueintencional.
Manterauniformidadeemseudesignumaparteimportanteda
assegurarqueodesigntransmitedeformaeficazsemcon
fusoousobrecarregarosusurios.Uniformidadeentraemjogono
muitosaspectosdiferentesdedesignvisual.
Mantendoseostamanhosdeelementosuniformespodetornlomaisfcildereco
Binelosemnovosprojetosquevocprecisardeles.Porexemplo,setodos
osbotesgrficosquevocusaparanavegaosoamesmaaltura,
elespodemsermisturadosecombinados,conformenecessrio,semcriarumaclut
tereddisposioouexigindoquenovosgrficosserproduzido.
Gradecombasedisposioumatcnicadedesigndeimpressoquetransporta
maiseficazmenteparaaWeb.Estaabordagemasseguraauniformidadeda
desenhoatravsdeumesquemaprincipalqueusadocomoummodeloparacreat
ingvariaesdelayout.Nemtodoolayoutirusartodasaspartesdo
gridnaverdade,amaioriadoslayoutsvaiprovavelmenteusarapenasalguns,mastodosos
colocaodoelementonogriddeveseruniformeeconsistente.
128/153
27/09/2016
Semttulo
pgina161
142
layoutbaseadoemgrade
garantequediversificada
desenhostmumcompartilhada
ordemvisual.
Noentanto,porqueosdispositivos,tamanhosdetelaeresoluodatelapode
variammuito,aplicandogradesparadesignbaseadoemtelanosempre
tosimplescomonodesigndeimpresso.fcilcairnaarmadilhade
aderindoaumsistemadegradeouqualquertipodestinadasaassegurar
uniformidade,mesmoquandoclaramentenoestfuncionandomais.oanar
chydetrabalharsempadresdeprojetoruim,masacamisadefora
pgina162
143
129/153
27/09/2016
Semttulo
detentartrabalhardentrodospadresdedesignquesoinadequadaspara
suasnecessidadespodeserpior.Talvezoprodutoassumiunova
funcionalidadequeningumtinhaimaginadonomomentoemqueagrade
foidesenvolvidotalvezagradeapenasnuncafuncionoutobemno
oprimeirolugar.Sejaqualforarazo,importantesercapazde
reconhecerquandohoraderevisitarosfundamentosdasuavisuais
sistemadedesign.
Coernciainternaeexterna
DevidoformacomositesdaWebtmsidomuitasvezesproduzidosemfragmentada,
adhoc,eisoladodeoutrostrabalhosdedesignacontecendonoorga
nizaodeteremsidoatormentadocomproblemasdecoernciaem
designvisual.Estesproblemasassumirduasformas:
.Hproblemasdeconsistnciainterna,emquediferentes
partesdoprodutorefletemdiferentesabordagensdedesign.
.Depois,hproblemasdeconsistnciaexterna,emque
oprodutonorefleteamesmaabordagemdedesignutilizadoem
outrosprodutosdamesmaorganizao.
Boassoluesparaosproblemasdeconsistnciainternaestenraizadana
umacompreensodoesqueletodolocal.Achaveaiden
tificaroselementosdedesignqueaparecememdiferentescontextosrecorrentes
emtodaavriasinterfaces,navegao,einformaes
problemasdedesignnoproduto.Aoisolarcadaelementodedesign
apartirdessescontextosdiferentesantesdeprojetlo,nspodemosmais
verclaramenteoproblemadepequenaescalaqueestamostentandoresolver,emvezde
sedistraircomosproblemasdemaiorescalaimpostaspelocontexto.
Aoinvsdeprojetaromesmoelementoumaeoutravez,ns
podeprojetloumavezeusaressedesignemtodooproduto.
pgina163
144
Paratalabordagemaotrabalho,teremosdeverificaronossotrabalho
contraosdiferentescontextosemqueesseelementoaparece.Talvez
umgrande,redondo,botoPARARvermelhoirfuncionarbemparaapginadepagamento,
maspodenosertovisualmenteeficaznoprodutoaglomerado
pginadepersonalizao.Amelhorabordagemprojetarcadaelemento,
experimentloemvrioscontextos,edepoisrefazeroprojeto,conformenecessrio.
Mesmoquemuitosdoselementosdedesignsercriadonoisoladamente
ounscomosoutros,elesaindadevemtrabalharemconjunto.Umsucesso
130/153
27/09/2016
Semttulo
designnoapenasumacoleodepequenosobjetos,bemdesenhados
Emvezdisso,osobjectosdevemformarumsistemaquefuncionacomoumcoesa,
todoconsistente.
Impondoconsistnciadedesignemtodaamdiaapresentaasuaaudi
enceclientes,prospects,acionistas,empregados,ouocasional
observadorescomumaimpressouniformedasuaidentidadedemarca.este
consistnciadaidentidadedamarcadeveestarpresenteemtodososnveis
odesignvisualdeseuproduto,apartirdoselementosdenavegao
aparecendoatravsdecadatelaparaobotohumildequeaparece
apenasumavez.
ApresentandoumestiloemseuWebsitequeincompatvelcomoseu
estiloemoutrosmeiosdecomunicaonoafectaapenasaimpressodopblico
doreferidoprodutoelaafetaasuaimpressodesuaempresacomoum
todo.Aspessoasrespondempositivamentesempresascomclaramentedefinidos
identidades.estilosvisuaisinconsistentesprejudicaraclarezadasua
imagemcorporativaedeixaraaudinciacomaimpressodeque
estaumaempresaquenoconseguerealmenteentenderquem.
pgina164
145
Paletasdecoresetipografia
Acorpodeserumadasformasmaiseficazesparacomunicarumamarca
identidade.Algumasmarcassotointimamenteassociadacomascoresdeque
difcilpensardaempresasemacorautomaticamente
quevemmenteconsidereCocaCola,UPS,ouKodak.estescom
companhiastmempregadocoresespecficas(vermelho,marrom,amarelo)consistncia
tentementeaolongodosanosparacriarumsentidomaisfortedesuasidentidadesem
mentedopblico.
Issonosignificaqueelesusamessascoresparaaexclusodetudo
outras.Ascoresdamarcancleosogeralmentepartedeummaisamplodecor
paletausadaemtodososmateriaisdeumaempresa.Ascoresemumcom
paletapadrodacompanhiasoselecionadosespecificamenteparaoquobemeles
trabalharemconjunto,complementandosemutuamentesemcompetir.
Umapaletadecoresdeveincorporarcoresqueseprestama
umavastagamadeutilizaes.Namaioriadoscasos,coresmaisbrilhantesoumaisousadaspodem
serutilizadoparaoprimeiroplanodoseudesignelementosaosquais
Vocquerchamaraateno.coresmaissuavessomelhoresusadospara
131/153
27/09/2016
Semttulo
elementosdefundoquenoprecisamdesaltarparaforadapgina.Tendouma
gamadecoresparaescolhernosforneceumconjuntodeferramentasparaatomadade
escolhasdedesigneficazes.
Assimcomocontrasteeuniformidadesoimportantesparaoutrasreasdo
designvisual,elesdesempenhamumpapelvitalnacriaodepaletasdecores
tambm.Quandousadonomesmocontexto,ascoresqueestomuitoperto
umaooutro,masnoexatamenteomesmo,prejudicaraeficciada
suapaletadecores.Issonosignificaquevocstemumtomdevermelho,
pgina165
146
Orbitzusouum
paletadecoreslimitada
(Topo)paradiferenciar
caractersticase
nafuncionalidade
Website(embaixo).
r:102
g:153
b:204
R:0
g:102
b:204
R:0
g:51
b:153
R:0
g:153
b:0
r:255
g:153
b:0
r:255
g:255
b:204
r:204
g:204
b:153
r:153
g:153
b:102
R:51
g:51
b:51
r:204
g:204
b:204
132/153
27/09/2016
Semttulo
pgina166
147
umtomdeazul,eassimpordiante.Issosignificaquesevocquiserusardife
tonsrentesdevermelho,certifiquesedequeelessodiferentesosuficienteparaqueosusurios
podedistinguilos,ecertifiquesedeusarcadademaneiraconsistente.
Paraalgumasempresas,tipografiausoadefontesoutiposdeletra
paracriarumvisualespecficaestilodetoimportanteparaasuamarca
identidadesqueelestenhamencomendadofontesespeciaisquedevemser
especificamenteproduzidoparaasuautilizao.Organizaesquevariamde
AppleaVolkswagendometrodeLondreseatmesmoMartha
Stewartusaramtipografiapersonalizadaparacriarumfortesensode
identidadeemsuascomunicaes.Mesmosevocoptarpornotomar
estepassoextraordinrio,tipoaindapodeservircomoumaparteeficazde
comunicarasuaidentidadeatravsdodesignvisual.
Paraocorpodetextodequalquermaterialquevaiserapresentadaemblocosmaiores
ouquevenhamaserlidoporusuriosemtrechossimplesmaismelhor.
Nossosolhosobterrapidamentecansadotentandotomaremlotesdetextodeumaformamais
tipogrficoornamentado.porissoquefontessimples,comoHelveticaouTimesso
toamplamenteutilizado.Elesnososuasnicasopes,emboravocnofaz
temquesacrificaroestiloparaacomodaralegibilidade.
Paraoselementosdetextomaioresouetiquetascurtas,comoasobservadasnanavegao
elementosadicionais,tiposcomumpoucomaisdepersonalidadesoper
fectlyapropriado.Masumdosnossosobjetivosnosobrecarregaronosso
usurioscomadesordemvisual,eusandoumdesnecessariamentegrandevariedade
defontes,oumesmousandoumpequenonmerodefonteseminconsistentes
maneiraspodecontribuirparaessasensaodedesordem.Namaioriadoscasos,voc
novaiprecisarmaisdoqueumpunhadodefontesparasatisfazertodasassuascomu
caoprecisa.
pgina167
133/153
27/09/2016
148
Semttulo
Osprincpiosdousodetipodeformaeficazsorealmenteasmesmas
paraoutrosaspectosdodesignvisual:Nouseestilosquesomuito
semelhante,masnoexactamenteamesma.Useestilosdiferentesapenasparaindi
diferenascatenainformaoquevocesttentandosecomunicar.
Fornecercontrastesuficienteentreosestilosquevocpodedesenharo
aatenodousurio,conformenecessrio,masnosobrecarregueodesigncomum
amplagamadediversosestilos.
ProjetoCompseGuiasdeEstilo
OanlogomaisdirectaparaowireframeparaoreinodaVisual
designoVisualmockupouumaminiaturadedesign.Compcurtopara
composto,porqueissoexatamenteoque:umavisualizaoda
produtoacabadoconstrudaapartirdeoscomponentesquetenhamsido
escolhido.Aamostramostracomotodasaspeastrabalhamjuntosparaformar
umtodocoesoou,senoofizerem,issomostraquearepartio
estacontecendoedemonstrarestriesquequalquersoluoser
obrigadaaprestarcontas.
Vocdevesercapazdeverumsimplesumparaumentre
componentesdaestruturadearameeoscomponentesdodesenho
comp.Aamostrapodenoreproduzirfielmenteolayoutdo
wireframenaverdade,eleprovavelmentenoir.Owireframeno
contaparapreocupaesdedesignvisual,concentrandoseemdocument
ingoesqueleto.Aconstruodaestruturadearameantesdeenfrentaro
compprojetopermitenosolharparaasquestesdeesqueletoemisolamentoemprimeirolugar,
emseguida,vercomoquestessuperficiaisentramemjogo.Noentanto,oncleo
ideiasnowireframe,nomeadamenteemmatriadedesigndainformao
questes,deveserclaramenteevidentenascomposiesdedesign,embora
elespodemnosigaoarranjoprecisoapresentadana
wireframe.
pgina168
LOGOTIPO
AREABRANDING
CORTESIANAV
GLOBALNAV
ARTIGOSINCLUIDOS
149
Odesignvisual
notemde
coincidircomowireframe
precisamentequestem
paraexplicara
importnciarelativae
agrupamentodeelementos
apresentadana
wireframe.
134/153
27/09/2016
Semttulo
SUPLEMENTARNAV
HISTRIASTOPNACIONAL
HistriaslocaisTOP
pgina169
150
Tudoissodocumentao,naturalmente,ummontedetrabalho,masissoacontece
porumaboarazo:Aolongodotempo,asrazesparanossasdecisesdesaparecer
damemria.Asdecisesadhocfeitaparaabordarumaprobabilidadeespecfica
lememumacircunstnciaespecficasetodosdesordenadoscomasdecises
destinadasaformarabaseparaotrabalhodeprojetofuturo.
Outrarazoparadocumentaroseusistemadeprojetoqueaspessoas
eventualmente,pararseustrabalhos.Quandoofazem,elesapcomuma
riquezadeconhecimentosobrecomoumprodutoficaprojetadoeconstrudo
diariamente.Semumguiadeestiloquepermaneceupto
atualizadocomasmaisrecentesnormaseprticas,queoconhecimentoseperde.
Aolongodotempo,comoaspessoasmudardeposio,todaorganizao
gradualmentesofreumaespciedeamnsia,comoasformasascoisasforamfeitas
eosmotivosdessasdecisesafastarseparaoutraspartesdo
empresaoudevoltaparaaforadetrabalho.
Adocumentaodefinitivadasdecisesdedesignquetemos
Madeoguiadeestilo.Estecompndiodefinetodososaspectos
135/153
27/09/2016
Semttulo
dodesignvisual,apartirdamaiorescalaparaomenor.Global
normasqueafetamtodasaspartesdoproduto,taiscomogradesdedesign,
paletasdecores,padrestipografia,ouguidelinesTratamentodologotipo
sogeralmenteasprimeirascoisasairemumguiadeestilo.
Oguiadeestilotambmirincluirnormasespecficasaumespe
secodelaroufunodeumproduto.Emalgunscasos,asnormas
documentadasnoguiadeestiloirpercorrertodoocaminhoatonvel
deelementosdeinterfaceenavegaoindividuais.Oobjetivogeral
doguiadeestilofornecerdetalhessuficientesparaajudaraspessoasafazer
decisesinteligentesnofuturo,porqueamaiorpartedopensamentotem
jfoifeitoparaeles.
pgina170
151
Criandoumguiadeestilotambmtilnaimposiodeconsistnciadedesign
atravsdeumaorganizaodescentralizada.SesuasoperaesWebcon
sistdeumagamadiversificadadeprojetosindependentessendoiniciadoe
trabalhadoporpessoasemescritriosespalhadosportodoomundo,oseusite
provvelqueolharcomoumamisturaaleatriadeestilosepadres.
Obtendotodasessaspessoasparairjuntocomumconjuntounificadodepadres
podeserummontedetrabalho,razopelaqualaresponsabilidadepelaaplicao
guiasdeestilodedesign,muitasvezesresidemaisacimanaorganizao
doquevocpoderiaesperar.Terumguiadeestiloquevocpodereferirseo
nicamaneiramaiseficazdeobteroseuprodutoparecendoumacoesa
todoemvezdeapenasumamontoadodealinhavarempedaos.
136/153
27/09/2016
Semttulo
pgina171
8
captulo
Oselementos
aplicado
pgina172
137/153
27/09/2016
Semttulo
153
Oselementosdaexperinciadousuriopermanecemconsistentes,noimportaquo
complexooseuproduto.Mascolocarasideiasportrsdoselementos
emprtica,porvezes,podeparecerumdesafioporsis.Est
noapenasumaquestodetempoerecursos,muitasvezesumaquestode
mentalidade.
Olhandoparatrs,aestratgiadeaviescinco,mbito,aestrutura,esqueltica
ton,edesuperfcietudoissosoacomoummontedetrabalho.certamente,tais
cuidadosaatenoatodosessesdetalhesdevemlevarmesesdedesenvolvimento
tempodeavaliaoeumpequenoexrcitodeespecialistasaltamentetreinados,certo?
Nonecessariamente.Certamente,paraalgunsprojectosealgunsorganizao
es,empregandoumaequipedeespecialistasdedicadosomaiseficaz
maneiradedividiraresponsabilidadeporumprodutoquesimplesmentedemasiadocom
plexparalidarcomqualqueroutraforma.Almdisso,comoosespecialistaspodemconcentrar
exclusivamentenumsubconjuntodaexperinciadoutilizadorcompleta,muitasvezeseles
trazerumacompreensomaisprofundadasquestesateremseutrabalho.
pgina173
154
CAPTULO8OSELEMENTOSAPLICADA
Grandepartedotempo,noentanto,pequenasequipescomrecursoslimitadospode
atingirresultadossemelhantes.svezes,umgrupodeapenasalgumaspessoaspodem
realmenteproduzirmelhoresresultadosdoqueumagrandeequipe,porquemaisfcil
paraelesficarememsincroniaemumavisocompartilhadadaexperinciadousurio.
Projetandoaexperinciadousuriorealmentepoucomaisdeummuito
138/153
27/09/2016
Semttulo
grandecolecodemuitopequenosproblemasaseremresolvidos.Adiferena
entreumaabordagembemsucedidaeumcondenadoaofracassorealmente
seresumeaduasidiasbsicas:
.Entendaoproblemaquevocesttentandoresolver.Ento,
voctrabalhousequeobotoroxograndenacasa
telaumproblema.agrandezaeapurplenessde
ateclaquetemdemudar(superfcie)?Ouserqueo
botoestnolugarerradonapgina(esqueleto),ouque
afunodobotorepresentanofazoqueosusurios
esperar(estrutura)?
.Entenderasconseqnciasdesuasoluoparao
problema.Lembresequehumefeitocascataempotencial
cimaeparabaixoatravsdoselementosdecadadecisoquevoc
fao.Odesigndenavegaoquefuncionatobememumapartedo
seuprodutopodenobastantesatisfazerasnecessidadesdeumaoutraseo
odaarquitectura.Odesigndeinteraoparaoduto
assistentedeseleoUCTpoderiamuitobemserumaabordageminovadora,
maselevaiatendersnecessidadesdeseususuriostecnofbicas?
pgina174
155
Sporter
algumemsua
organizaothink
sobrecadaumadascinco
aviesvocpoderesolver
todasasconsideraes
crucialparaacriao
umusuriobemsucedida
experincia.comoestes
responsabilidadesso
distribudosemsua
organizaonoto
importantecomofazer
garantirquetodososelementos
daexperinciadousurioso
contabilizados.
139/153
27/09/2016
Semttulo
pgina175
156
Vocficariasurpresocomquantasdaspequenasdecisesquefazem
seoprocessodedesigndeexperinciadousurionosofeitasconscientementena
todos.Namaioriadasvezes,asescolhasfeitassobreaexperinciadoutilizador
cairemumadestassituaes:
.Designbydefault.Issoacontecequandoaestruturado
aexperinciadousuriosegueaestruturadosubjacente
tecnologiaoudasuaorganizao.Mantendoocliente
histricodepedidosefaturamentoinformaesembancosdedadosseparados
podefuncionarmelhorparaoseusistematcnicoexistente,masque
nosignificamantlosseparadosnaexperinciadousurio
tambmumaboaideia.Domesmomodo,ocontedoquevemdediferente
departamentosdaempresapodeservirousuriomelhorse
trazidojunto,nomantidasseparadas.
.Designporimitao.Issoacontecequandoaexperinciadousurio
recaisobreconvenesfamiliaresdeoutrosprodutos,publicao
ctions,ouaplicativosdesoftware,independentementedecomoapro
comeudessasconvenespoderiaseradeseususurios(oumesmoao
Webemsi).
.Designbyfiat.Issoaconteceprefernciasquandopessoais
emvezdasnecessidadesdosutilizadoresouobjetivosprodutosdirigirrinciadousurio
decisesrincia.Selaranjadominasuapaletadecores
porqueumdosvicepresidentessenioresapaixonadoporela,ouse
todososseuselementosdenavegaosomenussuspensosporque
issooqueoseuengenheirochefegosta,vocperdeudevistao
objetivosestratgicoseinsightsdeusurioquedeveserconduodo
escolhasquevocfaz.
140/153
27/09/2016
Semttulo
pgina176
157
Fazendoasperguntascertas
Defrenteparaoemaranhadodepequenosproblemasaseremresolvidosnaconcepodo
experinciadousuriosvezespodeserdesanimador.ocasionalmente,um
soluoparaumproblemairforloarepensaroutrosproblemas
vocpensouquejtinharesolvido.Muitasvezes,vocter
afazercompromissoseavaliarsoluesdecompromissoentrediferentes
abordagens.Quandovocestnomeiodeterquefazerestes
tiposdedecises,fciltornarsefrustradoepergunta
sevocesttomandoaabordagemcorreta.Aabordagemcorreta
parafundamentarcadadecisoemsuacompreensodosubjacente
questesemjogo.Aprimeiraperguntaquevocdeveperguntarasimesmo(edo
primeiraperguntaquevocdevesercapazderesponder)sobrequalqueraspectodo
experinciadousurio:Porquevocfezissodessaforma?
Tendooframedireitodamentesobreaabordagemdosproblemas
vocestenfrentandoquestesmais.Todososoutrosaspectosdarinciadousurio
processodedesignrinciapodeserajustadodeacordocomotempo,dinheiroe
aspessoassuadisposio.Semtempoparareunirdadosdepesquisademercadoem
oseupblico?Talvezvocpossaencontrarmaneirasdeolharparaainformao
vocjtem,comologsdoservidoroumensagensdefeedback,paraobter
umsentidodeasnecessidadesdeseususurios.nopodedaraoluxodealugarumusabilidade
laboratriodeteste?Recrutaramigos,familiaresoucolegasdetrabalhoparaparticiparde
testeinformal.
Resistatentaodeencobrirousuriofundamentaisrincia
ciamasquestesdoprojectoemnomedepoupartempooudinheiro.Em
algunsprojectos,algumvaicuidadosamenteadernciaemalgumtipodeusurio
experinciadeavaliaoatofimdoprocessodemuitotempodepoisda
pgina177
141/153
27/09/2016
158
Semttulo
tempopararealmenteresolveressasquestesseesgotou.correndoemdireo
lanamentosemolharparatrspodeterparecidoumaboaideia
devoltaquandoadatadelanamentofoidefinida,masoresultadoprovvelquesejaum
produtoqueatendeatodososrequisitostcnicosparaoprojecto,mas
nofuncionaparaosseususurios.Piorainda,poradernciaaexperinciadousurio
deavaliaosobrenofinal,vocpodeacabarlanandoumproduto
quevocsabequeestquebrado,masnotmoportunidade(oudinheiroesquerda)
Consertar.
Algumasorganizaesfavorecemestaabordagem,chamandolhe"aaceitaodousurio
teste."Apalavradeaceitaomuitoreveladoraqui,aquesto
noseelesgostamdoprodutoouutilizaroproduto,mas
aocontrrio,elespodemaceitaroproduto?Estetipodeteste,muitasvezes,
acontecenofinaldoprocesso,peloqualotempoincontvel
premissasmoldaramaexperinciadousuriosemnuncaser
examinado.Essashiptesespodemserextraordinariamentedifcil
descobriremtestesutilizadordoprodutoacabado,porqueelesso
escondidoatrsdecamadasdeinterfaceeinterao.
Muitaspessoasdefendemparaotestedeusuriocomooprincipalmeiode
garantindoumaboaexperinciadousurio.Estalinhadepensamentopareceser
quevocdevefazeralgumacoisa,coloclonafrentedealgumaspessoaspara
vercomoelesgostam,edepoiscorrigiroqueelessequeixaram.
Masotestenoumsubstitutoparaumusuriopensativo,informou
processodedesignexperincia.
Fazersuasperguntasdeusuriosqueseconcentramemelementosespecficosdo
experinciadousuriopodeajudloarecolhercontributosmaisrelevantes.testesdeusurios
construdossemumolhoparaoselementosdousurioexperimental
ciapodeacabarfazendoasperguntaserradas,queporsuavezpode
levararespostaserradas.Porexemplo,aotestarprottipos,
pgina178
159
saberoproblemaquevocestdefinindoparainvestigarcrucialpara
apresentarseusassuntosdetestecomumaexperinciaquenonuvem
oassuntocomquestesnorelacionadas.oproblemacomissonavegao
barorealmenteapenasacor?Ouotextoqueosusurios
estorespondendoa?
142/153
27/09/2016
Semttulo
Vocsimplesmentenopodedependerdeseususuriosparaarticularassuasnecessidades.
Odesafionacriaodequalquerexperinciadousurioentendero
necessidadesdosusuriosmelhordoqueelesentendemessasnecessidadessi
eus.Otestepodeajudloaentenderasnecessidadesdeseususurios,
masapenasumadasmuitasferramentasquepodemajudaraatingiromesmofim.
AMarathoneaSprint
Assimcomovocnodevedeixarqualqueraspectodaexperinciadousuriopara
acaso,vocnodevedeixaroseuprprioprocessodedesenvolvimentopara
acaso.Somuitasequipesdedesenvolvimentooperamemumestadode
emergnciapermanente.Cadaprojetoconcebidocomoarespostaa
algunspercebidacrise,e,comoresultado,cadaprojetoatrssched
uleantesmesmodecomear.
Aquiumametforaparaoprocessodedesenvolvimentoexperinciadousurioque
Costumousaraodescreverproblemasparaosclientes:Amaratonano
umsprint.Saberquetipodecorridaquevocestdentroeexecutaremconformidade.
Acorridaumacorridacurta.Sprinterstmderecorreravastasreservasde
energianoinstanteemqueotirodepartidaacionadoeelesgastamtudo
dequeaenergianoespaodepoucosminutos.Bemaoladodapartida
linha,ovelocistatemquecorreromaisrpidoquepuderemanterfuncionandocomo
rpidoquepodeatchegaralinhadechegada.
pgina179
160
Amaratonaumacorridalonga.maratonistasprecisatanto
energiacomosprintersfazer,maselesgastammuitodiferente.suco
cessonamaratonadependedequoefetivamenteoritmocorredores
simesmos.Todososoutrosfactoresiguais,ocorredorquesabe
quandoacelerarequandoaabrandarmuitomaisprovvelque
winouatmesmoterminaracorridaemtudo.
Omaisrpidoquepuderdocomeoaogernciaestratgiadesprint
endpodeparecerseranicaabordagemsensataparaumacorrida.isto
Parecequevocdeveriasercapazdecorrerumamaratonacomosefosse
umasriedesprints,maselenofuncionadessaforma.Partedarazo,
nofuncionadessaformaolimitefsicosimplesdeendurancehumana
ance.Humoutrofatortambm:Paraacomodaresselimite,
maratonistasmonitorarconstantementeoseudesempenho,paraassistir
oqueestfuncionandoeoquenoestfuncionando,eajustarsuaabordagem
143/153
27/09/2016
Semttulo
emconformidade.
Odesenvolvimentodoprodutoraramenteumsprint.Maisfrequentemente,nohaver
momentosemquevocempurrarparaafrente,construodeprottiposedegerao
ideias,seguidodemomentosemquevocpuxarparatrs,testandooquevoc
construdo,vercomoaspeasseencaixam,erefinaraimagemgrande
paraoprojeto.Algumastarefassomelhorrealizadascomnfase
navelocidadeoutrosexigemumaabordagemmaisdeliberada.boaMara
corredoresthonsaberqualqual,assimsevoc.
,decisesdedesigndeliberadaspensativovaicustarlhetempono
curtoprazo,masvocvaieconomizarmuitomaistempoalongo
prazo.Designersedesenvolvedoresmuitasvezeslamentarafaltadeateno
aestratgia,escopoeestruturanosprojetosemquetrabalham.eutenho
esteveenvolvidoemmaisdeumprojetoemqueessasatividades
eramconstantementesobameaadesereliminado.Algumaspessoasficam
pgina180
161
impacientecomtarefasquenoenvolvemaproduodeumreal
componentesitecomoumgrficoouumpedaodecdigo.Estastarefasso
muitasvezesosprimeirositensdelinhacortadadeumprojetoqueestatrasado
ouacimadooramento.
ctionality
Concreto
projetosensorial
superfcie
projeto
ND
esqueleto
designdainformao
o
Interaoo
projeto
estrutura
Emformao
ati
Arquitetura r
Funcional
onal
Contedo
en
escopo
Especificaes
ons requisitos nt
usurioNe
estratgia
Objetivosdoproduto
tObj
144/153
27/09/2016
Semttulo
Abstrato
pgina181
162
Masessastarefasforamincludasnoescopodoprojeto,emprimeirolugar
porqueservidopreparaocomoessencialparaentregasposteriores
vir.(porissoqueoscincoaviesconstruirdebaixoparacima,cadaum
servindocomobaseparaaquelesacimadela.)Quandoessastarefasso
eliminadas,astarefaseprodutosdeixaramnocronogramadoprojeto
sentirdesinformadopelocontextomaisamplodoprojetoedesconexo
nectadoumdooutro.
Quandovocchegaraofinal,voctemumprodutoqueficaaqumdo
asexpectativasdetodos.Nostemvocnoconseguiuresolveroseu
problemaoriginal,quevocrealmentecriounovosproblemasparaseu
autoporqueagoraoprximograndeprojectonohorizonteatentativa
paraabordarasdeficinciasdoltimoprojeto.Eassimociclo
repete.
Olhandoparaumprodutoapartirdoexterior,ouentrandonodesenvolvimento
cessode,pelaprimeiravez,fcildeseconcentraremmaisobvi
elementosouspertodotopodomodelodecincoplanoemdetrimentoda
aquelesmaispertodofundo.Aironia,noentanto,queoselementos
quesomaisdifceisdeveraestratgia,oalcanceeestruturada
produtodedesempenharopapelmaisimportantenosucessoglobalou
fracassodaexperinciadousurio.
Emmuitoscasos,asfalhasnosplanossuperiorespodemobscurecersucessos
planosinferiores.Problemascomdesignlayoutsvisuaisqueparecemclut
tradoouocupado,oucoresquesoinconsistentesouchocampodetransformar
usuriosforatorapidamentequeelesnuncadescobrirtodasasescolhasinteligentes
quevocfezcomanavegaooudesigndeinterao.malconcebido
abordagensdedesigndenavegaopodefazertodooseutrabalhoparacriaruma
som,arquiteturadeinformaoflexvelparecerumdesperdciodetempo.
145/153
27/09/2016
Semttulo
pgina182
163
Damesmaforma,fazendocomquetodasasdecisescertasnosplanossuperioressignifica
nadaseessasdecisessebaseiamemmsescolhasfeitasno
planosinferiores.AhistriadaWebestrepletadesitesquefalharam
porque,emboraeleserambonitos,eleseramtotalmenteinutilizvel.
Comfocoemdesignvisualparaaexclusodeoutroselementosde
experinciadousuriolevoumaisdeumastartupfalnciae
levououtrasempresasaseperguntarporqueelesestavamincomodandocomo
Webemtodos.
Elenotemqueserassim.Sevocseaproximadeseuprodutovolvimento
processodedesencomaexperinciacompletadousurioemmente,voc
podesairdelacomumprodutoqueumavantagem,noumpassivo.
Aofazertudooqueasexperinciasdousuriocomoprodutoda
resultadodeumadecisoconsciente,explcito,vocpodegarantirqueo
produtofuncionaparacumprirambososseusobjetivosestratgicoseasnecessidadesde
seususurios.
pgina183
ndice
146/153
27/09/2016
Semttulo
pgina184
UMA
botesdeao,descritas,117
abordagensdearquitetura.
Vejatambminformaes
arquitetura
estruturahierrquica,93
cartodetriagem,49
caixas,descreveu,116,
118
CMS(gerenciamentodecontedo
dosistema),6364
165
147/153
27/09/2016
Semttulo
estruturahubandspoke,
paletasdecores,considerando,em
93
projetosensorial,145148
estruturadematriz,9394
comunicao,importncia
estruturaorgnica,9495
de,1213
estruturaseqencial,95
comp,definido,148
estruturadervore,93
concorrentes,obtendo
atitudesdosusurios,
inspirao,6768
considerando,44
modelosconceituais,8385,
pblico,ocontedoconsiderando 97,111112
para,74
consistncia
segmentosdepblico,baseandoseemconsiderandonosensorial
demografia,4344
design,143144
internacontraexterno,
143a144
B
contedo
identidadedamarca,considerando, considerandoaudinciapara,
3839
74
requisitosdemarca,
definido,12
considerando,65
Formatocontrapropsito,72
objetivosdenegcio,definindo,
impactosobreaexperinciadousurio,
3738
32
estruturao,8992
contratecnologia,32
pgina185
166
NDICE
recursosdecontedo,atualizao,
7374
inventriodecontedo,Tomar,74
exignciasdecontedo,
7174.Vejatambmprojeto
requisitosrequisitos
considerando,29
considerandosobreoescopo
avio,6164
definindo,63
investigaocontextual,47
navegaocontextual,122
contrasteeuniformidade,
considerandonosensorial
design,139143
vocabulriocontrolado,usando,
9899
convenesemetfora,
110113
convenes
considerando,84
desenvolvimento,116
taxadeconverso,medio,
1315
navegaocortesia,122123
fidelizaodeclientes,13
D
demografia,aplicandose
segmentosdepblico,4344
design.Vejatambmproduto
sistemasdeprojeto,documentao,
150
documentao.Vejatambm
wireframes
sistemasdedesign,150
especificaesfuncionais,
6971
listassuspensas,descreveu,
117118
E
eficincia,melhorando,1516
Elementosdomodelo.Vejaavies
tratamentodeerros,8688
correo,8687
preveno,8687
recuperao,8687
funodesfazer,88
mensagensdeerro,aocorrncia
de,64
eyetracking,considerandoseem
F
facetas
benefciosde,121
definido,98
FAQs,considerando,72
caractersticas
conflitosentre,76
148/153
27/09/2016
Semttulo
desenhodesigncentradonousurio
analogiaspara
experincias,113
porpadro,156
implementao,de76
pordecreto,156
sugestes,7677
pormimetismo,156
limitaesdetemposobre,76
Compensaesdedesign,considerandoseem
usodeterminologia,62
cincoavies.Vertambmescopo
projetarconsistncia,impondo,
avioavioesqueleto
144
planodeestratgiaestrutura
pgina186
167
avioplanodesuperfciedoutilizador
adaptabilidadede,9192
experincia
abordagens,9295
construodebaixopara
abordagembottomup,90
top,162
Categoriasem,9091
opesrelacionadascom,23
estruturaconceitualde,97
considerando,155
considerando,30
decisesrelacionadascom,24
vocabulriocontrolado,
dependncias,2223
9899
falhasno,162163
diagramao,101105
escopo,21,29
documentar,101105
esqueleto,20,30
fluxodelinguagemem,95
estratgia,21,28
linguagem,98101
estrutura,20,30
metadados,98101
superfcie,20,30
nsem,9293
utilizandoelementosde,3133
princpiosdeorganizao,
trabalhandoem,24
9698
especificaesfuncionais,29,
contedoestruturao,8992
6264,6871
abordagemtopdown,8990
usodeenciclopdia,99
VisualVocabulrio,102
G
103
navegaoglobal,120121
designdeinformao,108109.
tcnicadelayoutbaseadoemgrid, Vejatambmdesigndeinterface
141142
considerando,30,45
124126
H
papelnodesigndeinterface,
experinciaauditiva,136
126
Tipovisualde,124
estruturahubandspoke,93
wayfinding,127
hiperlinks,asubutilizao
navegaoinline,122
de,122
designdeinterao,8182
modelosconceituais,8385
considerando,30
Eu
consistnciada,111112
impresses,definidas,40
convenesemetfora,
ndices,usandoparanavegao,
110
123
convenes,84
arquiteturadeinformao,81,
tratamentodeerros,8688
8889.Vejatambmarquitectnicaconvenesdeinterface,
abordagens
asalteraesno,116
149/153
27/09/2016
Semttulo
pgina187
168
NDICE
designdeinterface,108109.See
ndices,123
Tambmdesigndeinformao
inline,122
considerando,30
local,121
sucessode,114
elementospersistentes,120
Oselementosdainterface
mapasdosite,123
botesdeao,117
suplementar,121
caixasdeseleo,116,118
ferramentasdenavegao,123
listassuspensas,117118
ns
caixasdelistagem,117
crianaeospais,93
botesderdio,116,118
naestruturahierrquica,
camposdetexto,116
93
naestruturadamatriz,9394
naestruturaorgnica,94
eu
princpiosorganizadoresde,
linguagememetadados,
96
98101
papelnainformao
caixasdelistagem,descritas,117
estruturas,9293
navegaolocal,121
nomenclatura,98
M
maratonaesprint,159
objetivos.Vejaproduto
163
objetivos
mtodosdepesquisademercado,46sistemasoperacionais,ainterface
elementos,116118
metadadoselinguagem,
PaletadecoresOrbitz,146
98101
metforaeconvenes,
110113
aplicar,9698
N
designdenavegao,108109.
Vertambmwayfinding
considerando,30
metasde,118119
importnciade,119120
sistemasdenavegao,120
contextual,122
cortesia,122123
global,120121
layoutdepgina,128131
navegaopersistente
elementos,120
personas
criando,4951
inclusivenonecessidades,
67
telefones,convenesrelacionadas
a,110111
pgina188
avies.Vejatambmescopo
avioavioesqueleto
169
projetorequisitos.Veja
Tambmosrequisitosdecontedo
150/153
27/09/2016
Semttulo
planodeestratgiaestrutura
requisitos
avioplanodesuperfciedoutilizador
deesclarecimento,de5961
experincia
definindo,6568
construodebaixopara
geradora,67
top,162
incluindopersonasem,67
opesrelacionadascom,23
gesto,61
considerando,155
projetos,planejamento,24
decisesrelacionadascom,24 prottipos,4849
dependncias,2223
perfispsicogrficos,44
falhasno,162163
escopo,21,29
Q
esqueleto,20,30
perguntas,posandoparaosusurios,
estratgia,21,28
158159
estrutura,20,30
superfcie,20,30
utilizandoelementosde,3133 R
trabalhandoem,24
resoluodeproblemas,157159 botesderdio,descritas,116,
118
designdeproduto,conceitode,
requisitos.Vertambmcontedo
78.Vejatambmprojetardoutilizador
requisitosprojeto
designcentrado
requisitos
objetivosprodutos,esclarecendo,
recolhadeideiaspara,74
6164
desenvolvimento,73
objetivosprodutos
avaliando,75
identidadedamarca,3839
priorizao,7477
objetivosdenegcio,3738
objectivosestratgicospara,75
considerando,28,36,91
ferramentasdepesquisa
mtricasdesucesso,3941
cartodetriagem,49
produtos
investigaocontextual,47
descrevendoconjuntosderecursosde,
mtodosdepesquisademercado,
29
46
comofuncionalidade,2729,
prottipos,4849
161
anlisedetarefas,47
comoinformao,2729,161
testescomusurios,4748
planejamento,5960
visitasderetorno,medindo,41
sucessode,1213
Areceita,aumentando,1415
ROI(retornosobreinvestimento),
13
pgina189
170
NDICE
avioesqueleto,20,30.See
tambmavies
mbito,definindo,5859
convenes,110113
avioescopo,21,29.Vejatambm
designdeinformao,30,
avies
108109,124127
contedo,6164
designdeinterface,30,108
exignciasdecontedo,29,
109,114118
7174
metfora,110113
contedodefinio
designdenavegao,30,
requisitos,63
108109,118123
definioderequisitos,
wireframes,128131
6568
cheiroesabor,considerando
emdesignsensorial,135
29,62,6871
software,foco,8283
funcionalidade,6164
solues,encontrandopara
requisitospriorizando,
problemas,157159
7477
S
151/153
27/09/2016
Semttulo
papelnabottomup
LocaldeSouthwestAirlines,85
arrancada
arquitetura,90
definida,159
componentedaestratgia,75
estratgia,160
partesinteressadas
paletasdecores,145148
preocupaessobreaestratgia,77
consistncia,143144
definido,52
resoluodeconflitos
139143
entreeles,77
Compensaesdedesign,148151
objetivosestratgicos,reunio,40
eyetracking,137139
objetivosestratgicos,
audio,136
requisitospara,75
cheiroesabor,135
estrategistas,oempregode,
guiasdeestilo,148151
52
touch,135136
documentodeestratgia
tipografia,145148
contedo,5354
viso,136137
hierarquiade,77
experinciasensorial,
planodeestratgia,21,28.Vejatambm
considerando,30
avies
objectivosdeproduto,28
local,usodeterminologia,910
papelnotopdown
mapasdosite,usode,102,123
arquitetura,90
esqueleto,definindo,108109
necessidadesdosutilizadores,28
pgina190
171
planodeestrutura,20,30.See
T
tambmavies
anlisedetarefas,47
arquiteturadainformao,
gostoecheiro,considerando
30,81,88101
emdesignsensorial,135
designdeinterao,30,
funesdaequipeeprocesso
8088
paraoplanodeestratgia,5254
funesdaequipeeprocesso,
paraoplanodeestrutura,
101105
101105
estruturas
ferramentasdetecnologia,restries
definindo,8081
na,115
tecnologiaversusquantidade,32
estruturahubandspoke,
telefones,convenes
93
relacionado,110111
elementosdetexto,considerando,
147
camposdetexto,descritas,116
estruturadervore,93
enciclopdia,utilizando,99
guiasdeestilo,considerandoseem
experinciadetoque,135136
estruturadervore,93
mtricasdesucesso,3941
tipografia,considerando,
navegaosuplementar,
121
superfcie,definindo,134
voc
planodesuperfcie,20,30.Vejatambm
avies
funodesfazer,usandoindevidamente
paletasdecores,145148
manuseamento,88
consistncia,143144
uniformidadeecontraste,
considerandonosensorial
139143
design,139143
Compensaesdedesign,148151
usabilidade,definido,48
152/153
27/09/2016
Semttulo
eyetracking,137139
audio,136
sentidos,135137
experinciasensorial,30
cheiroesabor,135
guiasdeestilo,148151
touch,135136
tipografia,145148
viso,136137
testedeaceitaodousurio,158
comportamentodousurio.Vejainterao
projeto
experinciadousurio.Vejatambm
avies
escolhasfeitassobre,156
definido,6
responsabilidadedelegando
para,31
design,78
pgina191
172
NDICE
experinciadousurio(continuao)
V
projetoporpadro,156
documentodeviso
projetoporfiat,156
contedo,5354
projetopormimetismo,156
hierarquiade,77
projetandopara,89
experinciadeviso,136137
detalhesde,6
designsvisuais,correspondentesa
analogiaspara
wireframes,149
caractersticas,113
disposioneutravisual,140
formaodecomunidade,
VisualVocabulrio,102103
26
impactodanocontedo,32
W
impactononegcio,1217
incluindonodesenvolvimento wayfinding,127.Vejatambm
processo,11
designdenavegao
metforapara,159
Rede
qualidadede,1217
interessescomerciaissobre,
projetobemsucedidode,154
26
naWeb,912
exignciasdecontedo,62
modelosdeusurio,criando,4951 evoluode,2526
necessidadesdousurio
considerando,28,36
62
criandopersonas,4951
experinciadousurioem,912
identificar,42
Oselementosdoweb
perfispsicogrficos,44
funcionalidade,2728
ferramentasdepesquisarelacionados,
suportedeinformao,
46
2728
compreenso,a4649
Websites,fracassode,36
usabilidade,4649
wireframes.Vejatambm
perfisdeusurio,criando,4951
documentando
apesquisadousurio,4649,51
combinandodesignsvisuais
segmentosdeusurios,4246
a,149
importnciade,45
avioesqueleto,128131
revisoapsapesquisa,45
testescomusurios,4748
designcentradonousurio,17.See
Tambmprojetardesigndeproduto
usurios
opesapresentadasao,10
posandoperguntaspara,
158159
153/153

Elements of User Experience - Traduzido PDF

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Elements of User Experience - Traduzido PDF

Uploaded by

Copyright:

Available Formats

27/09/2016

You might also like