SlideShare uma empresa Scribd logo
Capítulo 14
Experiência do Usuário
com foco em Alta Performance
Lisandra Maioli
Talvez você já tenha ouvido falar da história do famoso botão de
300 milhões de dólares: um ajuste proposto pelo especialista de UX Jared
Spool a uma loja virtual (que ele não revela qual é, mas alguns apostam
no formulário da Macy’s) conseguiu aumentar em mais de 45% o fatura-
mento dela. Mágica? Milagre? Nada disso! O que Jared Spool fez – e conta
no site da UIE1
– foi simplesmente entender o usuário e facilitar a sua
experiência no processo de compra. E, para isso, foi necessário apenas
fazer o tal ajuste em um único botão de um formulário.
O formulário do site, conforme Jared Spool conta em seu blog,
não poderia ser mais simples: dois campos (“e-mail” e “senha”), dois bo-
tões (“registrar-se” e “logar-se”) e um link (“esqueci a senha”). Os desig-
ners da empresa que contratou Jared Spool não conseguiam entender a
razão de justamente aquela página representar uma enorme porta de
saída e “abandono de carrinho” do site, tendo cerca de 75% dos usuários
não completando a compra. Em testes de usabilidade, a equipe de Spool
descobriu que o problema não estava no layout do formulário nem no
próprio formulário em si, mas sim no que o cadastro representava para
os consumidores:
1
“The $300 Million Button”, por Jared M. Spool (14 de janeiro de 2009): https://articles.uie.com/
three_hund_million_button/
Marketing Digital de Alta Performance250
•	 Além de não se lembrarem se já haviam se registrado no site,
frustrando-se ao fazer várias tentativas de login, novos clien-
tes resistiam à necessidade de se registrar, imaginando que
iriam ser bombardeados por e-mail marketing indesejados
ou, pior, ter a sua privacidade invadida.
•	 Enquanto isso, entre os clientes já registrados no site, muitos
tiveram dificuldade em lembrar o login e a senha e, em lugar
de clicarem no link solicitando o lembrete da senha, registra-
vam-se novamente, o que poderia explicar a média de 45% de
usuários com mais de um cadastro no site.
“O formulário, que tinha como objetivo facilitar o processo de
compra, (...) ao invés, estava impedindo as vendas – muitas vendas!”, co-
mentou Spool no post da UIE. A solução, então, sugerida pelo especia-
lista foi trocar o botão “Registrar-se” por “Continuar”. Adicionaram ain-
da a mensagem: “Você não precisa criar uma conta para fazer compras
em nosso site. Simplesmente clique em ‘Continuar’ para avançar para o
checkout. Para fazer suas compras futuras ainda mais rápido, você pode
criar uma conta durante o checkout”.
E foi assim, entendendo o usuário, que a loja aumentou o número
de vendas em 45%, lucrando U$300 milhões a mais naquele ano!
O que é UX?
Proporcionar uma experiência agradável e fácil para o cliente
final é fundamental no negócio de qualquer empresa, seja ela física-
Experiência do Usuário e Usabilidade 251
seja virtual. Você deve se lembrar de alguma situação em que desis-
tiu de comprar algo ou finalizar um negócio pela complexidade e dor
de cabeça que estavam gerando. Uma fila muito grande, dificuldade
em achar o produto, muita burocracia. Tudo isso atrapalha e frustra
o cliente, aumentando as chances de perdê-lo naquela transação ou,
pior, para sempre. Empreendedores sabem melhor do que ninguém
que é muito mais caro recuperar um cliente perdido do que conquis-
tar um novo, certo?
E é aí que entra UX (User Experience ou, simplesmente, Experiên-
cia do Usuário): ao entender o usuário e seu modelo mental, o profis-
sional de UX tem o papel de desenhar as melhores experiências para o
cliente de seu negócio, facilitando sua vida e desburocratizando tarefas
simples como encontrar um produto na sua loja virtual ou mesmo seguir
o checkout para finalizar a compra.
UX para conversão
Não basta apenas facilitar o caminho para o seu usuário se não
houver conversão, certo? O seu site ou aplicativo foi construído para atin-
gir um objetivo, seja o de divulgar um conteúdo, vender produtos ou servi-
ços, criar/aumentar base de cadastrados, receber pedidos de orçamento,
gerar leads etc. Você espera que o usuário conclua uma tarefa ou ação no
seu site, e essa conversão é o que vai determinar o sucesso ou não do seu
site.
O profissional de A especialista em UX Jennifer Winter, em um
post do blog da empresa User Testing,2
faz uma analogia interessante em
relação a isto: não adianta, diz ela, conseguir levar o cavalo até a água se
o mesmo não bebê-la. “A conversão não é sobre como fazer alguém fazer
algo, mas sim sobre oferecer um ambiente em que esse ‘fazer algo’ seja
irresistível”, resume a especialista.
E como construir esse ambiente irresistível para que o cavalo
beba a água?
2
“How Good UX Leads To Conversions”, por Jennifer Winter (1º. de maio de 2015): https://www.
usertesting.com/blog/2015/05/01/good-ux-leads-to-conversions/
Marketing Digital de Alta Performance252
Peter Morville,3
conhecido nome da área de UX, desenvolveu uma
colmeia que apresenta os principais elementos para se desenvolver um
ambiente irresistível:
Pensar nesse diagrama de Morville,
lembra Jennifer, nos fará refletir sobre pergun-
tas básicas que vão influenciar o desenvolvi-
mento do nosso produto:
•	 O quão fácil é para o cavalo encontrar a
água?
•	 Será que ele precisa, ou mesmo quer a
água?
•	 Ele pode fisicamente chegar até a água?
Entenda o seu usuário
Para conseguir responder a essas perguntas, de novo, é impor-
tante entender os seus usuários. E quando dizemos “entender seus usuá-
rios”, não estamos falando apenas de levantar dados sociodemográficos
sobre seus clientes. Precisamos ir mais a fundo e entender seus desejos,
necessidades, frustrações, expectativas, comportamentos etc.
Pensando na analogia do cavalo, proposto por Jennifer Winter, o
objetivo dessas entrevistas (que chamamos User Interview) seria des-
cobrir o que o seu usuário pensa não somente durante a experiência até
o vale de água (navegação), mas o que ele pensa em relação à água (seu
produto, conteúdo ou serviço) por si só:
•	 Estou com sede?
•	 Será que a água é potável?
3
Peter Morville é Presidente da Semantic Studios (semanticstudios.com), empresa de arquitetura
de informação e consultoria em encontrabilidade.
Fonte: Semantics Studio
( http://semanticstudios.
com/user_experience_
design/)
Experiência do Usuário e Usabilidade 253
•	 Estou seguro?
•	 Tenho amigos que tentaram beber desta água? O que eles
pensam?
•	 A água está convenientemente localizada? Existe outro vale
mais perto ou mais fácil para eu acessar?
A área de UX oferece uma série de técnicas, ferramentas e meto-
dologias que vão ajudar na missão de entender melhor seu usuário.
Use ferramentas de Analytics
Se você já tem um site, é importante os dados já gerados com fer-
ramentas de Analytics. O Google Analytics (www.google.com/analytics),
por exemplo, pode ajudar a entender o comportamento dos usuários no
site: links mais clicados, páginas mais acessadas, tempo de permanência
no site, pontos de conversão e de saída/abandono.4
Todos esses dados
vão ajudar o UX Designer a tomar decisões importantes no re-design do
site (ainda que seja apenas a alteração em um único botão).
Tela do Google Analytics.
Fonte: Google Analytics Academy5
4
Vale ler sobre como definir metas para o seu site usando o Google Analytics: https://support.
google.com/analytics/answer/1012040?hl=pt-BR
5
https://analyticsacademy.withgoogle.com/course/1/unit/6/lesson/1
Marketing Digital de Alta Performance254
Outra ferramenta muito bacana e que tem sido cada vez mais usa-
da por UX Designers é o Hotjar (www.hotjar.com). Com essa ferramenta,
você pode visualizar vídeos das ações (cliques, rolagem da página) dos
seus usuários, conferir heatmaps (mapas de calor), mais a possibilidade
de se criar pesquisas, enquetes etc., além de também poder analisar fu-
nis de conversão.
Fonte: Hotjar Product Tour6
O Mixpanel é outra ferramenta interessante que monitora even-
tos no seu site ou aplicativo, ou seja, ações dos usuários que não geram
visualização de página. Outro ponto bacana do Mixpanel é a possibilida-
de de análise de dados em tempo real.
Fonte: Mixpanel Blog7
6
https://www.hotjar.
com/tour
7
http://blog.mixpanel.
com/2015/11/17/
introducing-predict-see-
who-will-convert-before-
they-do/
Experiência do Usuário e Usabilidade 255
O Formisimo8
é uma ferramenta especializada em monitorar
abandono de formulários de checkout. Além de analisar o que os usuá-
rios estão fazendo no checkout on-line, formulários de inscrição e de
consulta, também mede a taxa de abandono de um site.
Fonte: Formisimo
Outra ferramenta parecida como Formisimo é o Lucky Orange
(www.luckyorange.com) que também grava a navegação de usuários em
vídeo.
Fonte: LuckOrange site
8
http://www.formisimo.com
Marketing Digital de Alta Performance256
Essas são apenas algumas ferramentas que podem ser usadas na
coleta de dados e de informações sobre o comportamento do seu usuá-
rio. É oportuno lembrar que existem inúmeras ótimas ferramentas de
Analytics no mercado como SessionCam (www.sessioncam.com), Cra-
zyEgg (www.crazyegg.com), KISSmetrics (www.kissmetrics.com) entre
outras.9
Vale discutir com o profissional de Analytics do seu time. O im-
portante aqui para o processo de UX é coletar informações relevantes
para a tomada de decisão no design do seu produto ou serviço digital.
Pesquise e entreviste seus usuários
Além de usar ferramentas de Analytics no seu site, é importante
ouvir diretamente do seu usuário ou usuário em potencial.10
Aqui a ideia
é entender o comportamento do seu usuário de forma mais contextuali-
zada. Com as ferramentas de Analytics, você já conseguiu entender como
é a navegação do usuário no seu site ou aplicativo, agora, vamos enten-
der os porquês.
Fazer uma pesquisa on-line (Survey), pode ser o ponto de parti-
da. Existem inúmeras ferramentas no mercado como Google Form (goo-
gle.com/forms/about), Survey Monkey (surveymonkey.com), Typeform
(www.typeform.com/), Polldaddy (polldaddy.com). É importante que as
questões da pesquisa sejam rápidas, objetivas e fácil de entender.
Além das pesquisas, é interessante realizarmos User Interview. O
objetivo aqui é ter a chance de conversar individualmente com usuários
do seu site ou potenciais usuários que representem seu público. Para re-
crutar os participantes (fase crucial desse processo de User Interview), é
importante entender bem quem é o seu público-alvo, onde mora, quan-
tos anos tem, onde trabalha, estuda etc.
Além dos porquês de seu comportamento durante a navegação, é
uma ótima oportunidade para entender melhor o contexto de utilização do
seu site: onde o usuário está quando acessa seu site ou aplicativo? Em que
momentos do dia ou da semana ele acessa? Quais são suas motivações? etc.
9
Algumas ferramentas para análise de formulário aqui: https://www.conversioner.com/blog/6-
practical-tools-improve-web-forms
10
Vale ler esse post sobre metodologias para se entender o usuário: http://www.taqtile.com.br/
taqtile/day/7/year/ueww2q28sdglbkyjnhywkfhzr6skg8
Experiência do Usuário e Usabilidade 257
As entrevistas podem acontecer on-line ou pessoalmente em um
laboratório, em um local escolhido pelo usuário (ou onde eles podem ser
encontrados) ou mesmo em seu escritório, embora alguns especialistas
acreditem que pelo fato de estarem na sua empresa, possam ser tenden-
ciosos. Eu diria que o resultado dessa entrevista independedo local, mas
do foco do trabalho e da experiência e do entrevistador.
Existem ainda outras metodologias de entrevistas (que, inclusive,
podem ser combinadas com testes de usabilidade) como a Etnografia,
quando o pesquisador acompanha o diaadia do usuário; o Contextual
Enquiry, quando o pesquisador vai até um local onde pode estar seu pú-
blico-alvo como praia, shopping, livraria, restaurante (tenho o cuidado
de pedir autorização no caso de ambiente comercial); ou Diary Study,
quando o usuário se compromete a desenvolver um diário que contem-
ple a utilização do site ou do aplicativo.
Investigação Contex-
tual (Contextual inquiry):
quando o entrevistador vai
até o local onde os seus usu-
ários estão no mundo físico.
É importante lembrar
degravartodasasentrevistas,
além de fazer anotações du­
rante a conversa, com o
consen­timento por escrito do
entrevistado. Vale também
presentear o entrevistado
com algum brinde, valor em
dinheiro, voucher ou giftcard.
O valor varia muito com o
público entrevistado.
User Interview (Entrevista com
Usuário) em laboratório
Foto de Tielly Ogura
Marketing Digital de Alta Performance258
No caso de entrevistas on-line, existem algumas boas ferramen-
tas que podem ajudar nessa tarefa como o Silverback, Morea etc. além
da possibilidade de usar ferramentas de videochat como Skype, Google
Hangout ou mesmo o Messenger, do Facebook. Só não se esqueça de gra-
var esses vídeos chats!
Ao final da entrevista, lembre-se de confirmar com o usuário sua
disponibilidade para fornecer informações adicionais ou mesmo partici-
par de uma segunda rodada, desta vez testando o redesenho.
Faça testes de Usabilidade
O Teste de Usabilidade pode ser combinado com o User Inter-
view. Assim, você pode aproveitar melhor seu tempo com o mesmo usuá-
rio. Tente apenas não alongar demais o tempo com o usuário, o ideal
seria levar entre 45 e 60 minutos.
É importante ter o roteiro do teste preparado, previamente. Ain-
da que ele não seja seguido à risca, é importante saber qual é o objetivo
do teste e quais perguntas queremos responder. Peça para o usuário con-
tar suas primeiras impressões ao entrar no site ou no aplicativo, no caso
de ele ainda não conhecer seu serviço ou produto. Caso seja um já usuá-
rio do seu site ou aplicativo, peça para mostrar onde costuma navegar.
Outro ponto importante é lembrar ao usuário, no início do teste,
que a participação dele tem como objetivo melhorarmos a navegação do
produto ou serviço testado, ou seja, o que está sendo testado é o site ou o
aplicativo e não o usuário. Deixe-o à vontade para falar (não interrompa
suas falas) e incentive-o a “pensar em voz alta”, permitindo algum tempo
de silêncio para que ele possa pensar, enquanto você analisa a sua nave-
gação.
Para o teste de usabilidade, o especialista (e papa da Usabilidade)
Jakob Nielsen,11
sugere cinco usuários como número ideal para se obter
resultados válidos. A tendência, de acordo com ele, é que os resultados
comecem a se repetir a partir do sexto usuário.
11
https://www.nngroup.com/articles/why-you-only-need-to-test-with-5-users/
Experiência do Usuário e Usabilidade 259
Fonte: Nielsen Norman Group
O teste pode acontecer
presencialmente, em um la-
boratório, na sua empresa, ou
em algum lugar indicado pelo
usuário (casa ou escritório), ou
utilizando plataformas on-line,
como já foi falado. Esses seriam
testes moderados, quando há a participação do entrevistador durante
o teste. Há também a possibilidade de se fazer testes não-moderados
com ferramentas on-line, como o UserTesting.com ou o UserZoom.co.uk,
UsabiltyHub.com, Loop11.com,
WhatUsersDo.com, entre tantos
outros.12
Neste caso, o UX Resear-
cher poderá usar o mesmo roteiro
de teste, definindo tarefas que de-
vem ser realizadas (e que esta-
rão sendo testadas) pelo usuá-
rio on-line. O usuário é incentivado a falar/explicar suas ações durante a
navegação, que é toda gravada.
Existem ainda outras metodologias
de testes que você pode usar combinadas
com User Interview como: o CardSorting
(atividades com cartões para testar a or-
ganização de áreas ou do conteúdo do seu
site) ou o Tree Testing (para testar a árvore
de navegação do site).
12
Lista bacana de ferramentas para Teste de Usabilidade: http://remoteresear.ch/tools/
Fonte: Loop11.com
Fonte: Noble Desktop (https://
www.nobledesktop.com/classes/
prototyping)
Marketing Digital de Alta Performance260
Desenvolva Personas
Além de lúdica, criar Personas é uma técnica que parece simples,
mas muito poderosa. É uma ferramenta amplamente usada por profis-
sionais de Marketing, Design, Produtos etc. A ideia aqui é criar um per-
fil detalhado de um usuário que represente grupos do seu público-alvo.
Para isso, é importante ter o maior número de informações possíveis so-
bre seus usuários, coletados com as ferramentas de Analytics, nas entre-
vistas, pesquisas, testes de usabilidade, além de informações do seu SAC,
do time de venda, da área de Marketing etc.
Para construir as Personas,13
é interessante fazer uma atividade
coletiva, reunindo profissionais de diferentes áreas do seu time. É incrí-
vel como cada área pode ver aspectos específicos e distintos da outra.
Reunir esses profissionais, nessa atividade, vai ajudar a todos a olhar
também o seu público-alvo por outro ponto de vista.
Fonte: Fakecrow.com
Não se preocupe se você for uma “eu-quipe”, o importante é fa-
zer o esforço de olhar seu público-alvo por diferentes perspectivas. Ou
seja, você pode desenvolver a Persona em uma atividade individual, o
importante é só ter certeza que você está usando informações variadas e
13
Vídeo bacana sobre Personas: http://uxmastery.com/create-ux-personas/
Experiência do Usuário e Usabilidade 261
de diferentes fontes (ferramentas de Analytics, nas entrevistas, testes de
usabilidade, Surveys etc. etc. etc.).
O formato e as informações que vão compor a Persona depende-
rão muito do seu produto ou serviço. Mas é importante que seja o mais
personalizado possível: dê um nome para a sua Persona, adicione uma
foto, defina idade (não faixa de idade), local onde vive, o que estuda, se
trabalha, que contenha informações sobre quais são os seus desafios diá-
rios (e que, provavelmente, seu serviço ou produto vai solucionar) e mo-
tivações, que soluções busca, qual seu nível de acesso a devices, o quanto
costuma ficar on-line etc.
Fonte: Ux-Lady
(http://www.ux-lady.
com/diy-user-
personas/ )
Marketing Digital de Alta Performance262
É importante que a persona represente seu público-alvo de for-
ma realística (é preciso acreditar que se trata de uma pessoa real), que
reflita os padrões levantados nas suas pesquisas e análises anteriores,
baseadas em dados e informações coletadas. Quando estivermos dese-
nhando o site ou o aplicativo, criando soluções com o design é essa Per-
sona (ou Personas) que vamos ter em mente.
Prefiro desenhar os meus próprios templates de Personas,14
mas
existem algumas ferramentas on-line para ajudá-lo nessa tarefa, como
o Xtension.com, MakeMyPersona.com (do Hubspot), Userforge.com etc.
Fonte:
Userforge.
com/
Fonte: Extension.com
14
Um Pinterest board com alguns templates: https://www.pinterest.com/kooj/personas/
Experiência do Usuário e Usabilidade 263
Proporcione uma experiência incrível
Você já sabe bastante a respeito do seu usuário e todas estas in-
formações irão ajudá-lo a tomar decisões de design que contribuirão
para o sucesso do seu site com foco em conversão e melhor experiência.
Nessa fase, é importante considerar alguns pontos:
Construa sites responsivos e acessíveis
O uso de dispositivos móveis para acesso à internet cresce verti-
ginosamente no Brasil e no mundo. Mais e mais pessoas têm se sentido
confortáveis em consumir conteúdo e fazer transações pelos seus smar-
tphones e tablets. Sem contar a penetração dos chamados “wearables”
(como relógios conectados à internet e outros dispositivos). Nesse novo
contexto, planejar seu website para ser responsivo é mandatório.
Segundo o relatório Tendências Internet de Mary Meeker, 45%
das operações realizadas na Groupon vieram de dispositivos móveis a
partir do início de 2013 (contra menos de 15% dois anos antes). Na Etsy,
50% do tráfego de usuários veio de dispositivos móveis a partir do início
de 2014.
Marketing Digital de Alta Performance264
Criação de Sites Responsivos (ou seja, que se adaptam confor-
me o device utilizado), Desenvolvimento de Sites para Smartphones,
M-Commerce e Inteligência Mobile Marketing para Criação de Sites Res-
ponsivos. Pensar na otimização do seu site para dispositivo móvel pode
ser uma grande oportunidade. Mas é importante lembrar que as pessoas
usam o celular ou o tablet de formas diferentes do desktop/laptop. Leve
em consideração também o contexto da utilização do device: é um exe-
cutivo em seu escritório? Um médico com iPad em uma clínica? Um ado-
lescente com seu celular no ponto de ônibus?
Um estudo realizado pelo Google (2012)15
descobriu que as pes-
soas usam smartphones nos seguintes contextos:
•	 “A caminho” (de casa, do trabalho etc.) e/ou em casa
•	 Para comunicar e se conectar
•	 Em curtos períodos
•	 Quando precisam de informações de forma rápida e imedia-
tamente
Tablets são igualmente utilizados para o entretenimento e nave-
gação. Desktops, no entanto, são usados para tarefas mais sérias ou de
investigação intensiva. De acordo com o estudo, os smartphones são o
ponto de partida mais comum para as seguintes atividades on-line:
•	 Busca de informações específicas
•	 Navegação
•	 Compras
•	 Rede social
15
http://ssl.gstatic.com/think/docs/the-new-multi-screen-world-study_research-studies.pdf
Experiência do Usuário e Usabilidade 265
Ao desenhar um site, considere também os usuários que contam
somente com o celular para acessar a web,que não têm escolha a não ser
usar seu telefone para todos os tipos de tarefas.
Fonte: Wimimedia(https://commons.wikimedia.org/
wiki/File:Responsive.png)
Fonte:
Wekipedia(https://
en.wikipedia.org/
wiki/Responsive_
web_design)
Para ajudar a analisar se o seu site é responsivo ou não, o Goo-
gle lançou a ferramenta Google Resizer (design.google.com/resizer).
Existem outras ferramentas que também ajudam nessa tarefa como o
DesignModo.com (designmodo.com/responsive-test), o Semalt (semalt.
design) e o SmartScreenresolution (whatismyscreenresolution.net/mul-
ti-screen-test), só para citar alguns.
Outro ponto importante é pensar na Acessibilidade para o seu
site:16
considere que entre o seu público, você poderá ter usuários com
16
Cartilha sobre Acessibilidade: http://www.w3c.br/pub/Materiais/PublicacoesW3C/cartilha-
w3cbr-acessibilidade-web-fasciculo-I.html
Marketing Digital de Alta Performance266
baixa visão ou audição, daltonismo etc. Pensar em acessibilidade já dei-
xou de ser “luxo” há muito tempo.
Existem alguns especialistas em Acessibilidade,17
além de sites
e informações on-line18
e ferramentas (como o Toomino,19
que adicio-
nam suporte de voz à navegação do site: o Web Acessibility Checker,20
o Wave21
) poderão ajudá-lo nessa missão. O importante é não ignorar a
questão da Acessibilidade no seu projeto de Design.
Melhore o tempo de carregamento
O tempo em que o usuário tinha paciência em aguardar o carre-
gamento de uma página on-line (os que são da época da conexão discada,
sabem o que estou dizendo eheheh) se foi. Segundos extras no carrega-
mento da página podem frustrar seu usuário, aumentando as chances de
abandono. Um estudo feito pela Universidade de Massachusetts mostrou
que os serviços de streaming de vídeos (como YouTube e Netflix) podem
ganhar ou perder usuários em questão de segundos. “Descobrimos que
as pessoas são pacientes em até dois segundos”, afirmou à NPR News o
professor de ciências da Universidade Ramesh Sitaraman.22
O diretor de UX da R/GA NY, Fabrício Teixeira, listou no Blog de AI
alguns dados interessantes sobre carregamento:
•	 Usuários esperam as páginas carregarem por dois segundos.
Depois do terceiro segundo, até 40% dos usuários abando-
nam o site.23
•	 85% dos usuários de dispositivos móveis esperam que o car-
regamento seja tão ou mais rápido do que sites no desktop.24
17 http://acessodigital.net/art_horacio_como_testar_acessibilidade_parte_1.html
18 http://www.acessibilidadelegal.com/
19 http://www.toonimo.com/solutions/for-accessibility/
20 http://achecker.ca/checker/index.php
21 http://wave.webaim.org/
22 http://connecticut.cbslocal.com/2013/01/10/study-streaming-video-viewers-lose-patience-
after-2-seconds/
23 http://www.mcrinc.com/Documents/Newsletters/201110_why_web_performance_matters.pdf
24 http://designingforperformance.com/performance-is-ux/
Experiência do Usuário e Usabilidade 267
•	 A Amazon notou que cada 100 milissegundos de espera re-
presenta um declínio de 1% nas vendas.25
•	 A Akamai relatou que 75% dos compradores on-line que ex-
perimentam um problema, como um congelamento local, link
quebrado, tempo longo para carregar, ou com um processo de
pagamento complicado, não comprarão a partir desse site.26
•	 O Google perdeu 20% de lucratividade e tráfego de usuários
por causa de um aumento de meio segundo no tempo de car-
regamento de suas páginas de resultados.27
•	 A Gomez estudou o comportamento comprador on-line e
descobriu que 88% dos consumidores on-line são menos
propensos a retornar a um site depois de uma experiência
ruim. O mesmo estudo descobriu que “em momentos de pico
de tráfego, mais de 75% dos consumidores on-line partiram
para o site de um concorrente em vez de esperar”.28
Um especialista em front-end pode ajudá-lo nessa tarefa. Mas
como bem lembrou Teixeira em seu post “Designers podem contribuir
para a otimização da performance de uma página,”29
e que estão no livro
“Design For Performance”30
(O’Reilly), por Lara Callender Hogan. Quan-
tidade de tipos e de tamanhos de fontes; quantidade, tamanho e peso de
imagem; reutilização de elementos e outras decisões de design impac-
tam no carregamento de páginas. Essas decisões podem (e devem) ser
compartilhadas com o desenvolvedor.
Se você já tem um site e tem a missão de otimizá-lo, pode usar o
Pingdom (http://tools.pingdom.com/fpt/) para conferir o tempo de car-
regamento de cada página/elemento.
25 https://sites.google.com/site/glinden/Home/StanfordDataMining.2006-11-28.
ppt?attredirects=0
26 Idem 28 (http://designingforperformance.com/performance-is-ux/)
27 http://glinden.blogspot.com/2006/11/marissa-mayer-at-web-20.html
28 Idem 28 (http://designingforperformance.com/performance-is-ux/)
29http://arquiteturadeinformacao.com/user-experience/a-importancia-da-performance-das-
paginas-na-experiencia-do-usuario/
30 http://shop.oreilly.com/product/0636920033578.do
Marketing Digital de Alta Performance268
Outro site bacana que pode ajudar nessa tarefa é o “PageSpeed
Insights”, ferramenta gratuita disponibilizada pelo Google: https://deve-
lopers.google.com/speed/pagespeed/insights/?hl=pt-BR
Além de verificar o tempo de carregamento da página, o PageSpeed
também dá dicas de como melhorar as páginas. Outro ponto interessante:
é possível verificar a otimização do site para dispositivos móveis.31
Screenshot da tela de
PageSpeed
Ajude o seu usuário a economizar tempo
Como vimos, em um mundo mais e mais acelerado, o usuário, com
menos tempo, tem cada vez menos paciência ao navegar no seu site ou
aplicativo.32
Não há mais tempo a perder pensando o que deve ser feito
no seu site, por isso você tem ouvido tanto se falar de designs que sejam
“simples e intuitivos” (dá-lhe, Steve Jobs!)Sugiro fortemente a leitura do
livro “Não me faça pensar”, de Steve Krug, que apresenta a importância
de se facilitar ao máximo a experiência do usuário.
Além do tempo de carregamento, por exemplo, é importante fa-
cilitar os caminhos de navegação para o usuário completar as tarefas
necessárias (como finalizar uma compra, por exemplo). É importante
que a Arquitetura de Informação do site seja bem redonda (ferramentas
como “Card Sorting” e “Tree Testing” podem ajudar nessa tarefa): tenha
umapriorização e hierarquização adequadas, conte com uma navegação
Global clara e opções do usuário voltar para pontos onde iniciou na na-
vegação, como os “Breadcrumbs” (ou “migalhas de pão”) que mostram o
caminho seguido pelo usuário.
31
https://www.thinkwithgoogle.com/intl/pt-br/articles/speed-matters-optimizing-mobile.html
32
http://designingforperformance.com/performance-is-ux/
Experiência do Usuário e Usabilidade 269
Uma maneira de ajudar o seu usuário a economizar tempo é au-
tomatizar campos de formulários, por exemplo, o campo do CEP deve vir
antes do preenchimento do endereço. Assim, quando preencher o campo
do CEP, os outros (cidade e Estado) serão preenchidos automaticamente
pelo sistema. Outra sugestão é que o cursor vá ao campo seguinte, assim
que o anterior for preenchido. A função “autocomplete” também pode
ajudar o usuário a economizar tempo no preenchimento de campos de
formulário e de Buscas. As informações também podem ser salvas para
facilitar a vida do usuário quando ele voltar ao seu site.
Vale também garantir um acesso fácil ao contato de suporte ou
chat de atendimento. O usuário se sente mais confortável sabendo que
poderá pedir ajuda em caso de necessidade.
Siga tendências em design
Além de funcional e fácil de navegar, seu site também precisa ser
agradável aos olhos. Aqui, já entramos mais na função do Web Designer,
que vai cuidar da Arte do site. Mas UX pode e deve influenciar nessas
decisões sempre tomadas em conjunto.
Tenha certeza, por exemplo, de escolher uma palheta de cores
adequada que comunique sua mensagem e esteja alinhada à sua marca.
É importante também ficar atento ao estilo da Arte e estrutura do
site (flat? Em cards? Padrão vertical com scroll? Com hero video? Slides
framework?): independentemente de ter um público mais moderno ou
mais tradicional, você não quer que seu site tenha uma “cara datada”,
feito em “mil novecentos e guaraná com rolha”, como dizem por aí.
Fique atento aos textos e conteúdo
Mais papel do webwriter do que do UX Designer, produzir um
bom conteúdo faz toda a diferença na experiência do usuário no seu site
ou aplicativo. Imagens com qualidade, textos bem escritos e (revisados),
transmitem credibilidade, e engajam e estimulam o seu usuário a com-
pletar a tarefa no seu site e retornar.
Marketing Digital de Alta Performance270
Além de um texto bem escrito, com um tom e voz adequados (um
redator ou um jornalista poderá ajudar nessa tarefa), é importante tam-
bém observar como ele está organizado na página e ao longo da navega-
ção do site. O formato do textoe o modo como ele está organizadoajudam
o usuário ao longo da navegação, como se “pegasse em sua mão” para
levá-lo pelo caminho mais adequado.
Outro ponto importantíssimo é quanto ao “call-to-action”.33
Além
de cores e posições, tamanhos e cores adequadas, é importante também
ficar atento ao texto: é sabido que se usa verbos nesses links e botões,
daí, vale uma definição de padronização: serão usados verbos no Intran-
sitivo (“Assinar Newsletter”) ou no Imperativo (“Assine nossa Newsle-
tter”). Vale lembrar também que, com o aumento de acesso e a maior
familiaridade dos usuários com produtos e serviços on-line, está em de-
suso termos como “Clique Aqui”, com a ajuda do Designer (que criará a
Arte de seu site ou aplicativo), o botão ou link deveria falar por si só que
é um elemento clicável.
Vale também lembrar a importância dos textos de feedback, aque-
les quando o usuário completa alguma ação bem-sucedida ou quando
acontece algum erro, por exemplo, ao faltar um campo a ser preenchido.
É fundamental que esses textos sejam diretos, objetivos e que expliquem
de forma simples.
Escolha a Tipografia adequada
Como já foi dito, a escolha da fonte pode impactar na performan-
ce do site. Além disso, essa definição pode também ser determinante na
comunicação do site, uma vez que, assim como cores, fontes diferentes
comunicam mensagens diferentes.
A escolha correta das fontes também é determinante para a legi-
bilidade do seu site, assim como o número de caracteres por linha (su-
gere-se entre 44 e 75, sendo 66 considerado ideal) e do tamanho das
entrelinhas e como o texto está organizado nas páginas (em blocos, justi-
ficado, alinhado à esquerda etc.). O tamanho da fonte também vai ajudar
a determinar hierarquização.
33
Uma análise de diferentes links e botões de CTA feita pela Hubspot: http://blog.hubspot.com/
marketing/great-call-to-action-examples#sm.0000qby632ilydk2ru7206f5donsq
Experiência do Usuário e Usabilidade 271
Uma dica34
importante é não usar mais do que dois tipos de fon-
tes. Geralmente,utiliza-se um para o corpo do texto e outro para os bo-
tões. O tamanho da fonte vai ajudar a determinar hierarquização, além
de diferenciar o corpo do texto de títulos. Assim como a formatação,
como bold ou itálico, pode ser usada para definir intertítulos e legendas
de fotos. O importante é que haja um padrão na formatação e consistên-
cia no tamanho.
Lembre-se: tanto o conteúdo (texto, fotos, elementos) e as fontes
precisam adequar-se também aos dispositivos móveis.
Defina uma iconografia consistente
A iconogrografia do seu site também é ponto-chave para a boa
comunicação do seu conteúdo e do seu site com o seu usuário. Deve fa-
cilitar a navegação e promover a rápida intepretação do conteúdo e das
ações possíveis (especialmente de CTAs).
É importante que a iconografia do seu site seja consistente
e padronizada para facilitar o aprendizado de seus significados.
34
Mais dicas aqui: https://medium.com/product-design-ux-ui/26-digital-typography-rules-for-
beginners-a04c6a5aaff3#.rcopl2hmc E aqui: https://www.usertesting.com/blog/2014/08/06/
choosing-the-right-font-a-guide-to-typography-and-user-experience/
Print Screen do site thenounproject.com
Lembrando que, como já foi dito, não queremos que o seu usuário perca
tempo no site, especialmente tentando interpretar os ícones.
Um site que pode ajudar nessa tarefa é o The Noun Project (the-
nounproject.com), onde é possível encontrar milhares de ícones criados
por designers do mundo todo.
Não relaxe!
Não pense que o trabalho de UX parou aqui! Estamos vivendo
uma era de mudanças constantes e em velocidade ímpar: os contextos
mudam, os devices mudam, seus usuários mudam, suas necessidades e
dificuldades mudam… É importante manter um ciclo frequente de testes,
além de analisar constantemente os dados coletados pelas ferramentas
de Analytics.
É necessário também testar o desenho do site ou do aplicativo
antes de lançá-lo, usando as mesmas técnicas e metodologias descritas
quando foi falado de Entrevistas e Testes de Usabilidade.
Faça testes A/B
E se há dúvidas entre duas soluções de design, a sugestão é rea-
lizar testes A/B. A ideia aqui é testar essas duas soluções diferentes com
Fonte: The Next Web (http://thenextweb.com/dd/2015/01/04/practical-tips-web-
mobile-usability-tests/#gref)
Experiência do Usuário e Usabilidade 273
os usuários reais do site. Assim, as duas opções são publicadas: um gru-
po de usuários verá a opção A e o outro grupo de usuários verá a opção
B. Após um período com as duas opções no ar, verifica-se a que desem-
penhou melhor e que será utilizada a partir de então. Ou seja, testes A/B
são uma das formas mais eficientes de validação de hipóteses, principal-
mente quando se trata de otimizar conversões.
A ferramenta Optimizely.com poderá ajudar nessa tarefa e deve
ser usada tanto para sites como para aplicativo móvel.
Fonte:
printscreen
de tela do site
optimizely.com
Já o Visual Website Optimizer (vwo.com) permite testes A/B com
diferentes URLs e com mais de uma variável. Conta com ferramenta para
análise de Langing Page, heatmaps, e relatórios segmentados para cada
tipo e tópico da pesquisa. Além da possibilidade de direcionar a pesquisa
para usuários específicos.
Fonte: blogo do
Marketing Digital de Alta Performance274
Atualize-se sempre!
Em um mundo que não para de mudar, além de se manter atuali-
zado sobre o seu usuário – que pode alterar o seu comportamento cons-
tantemente de acordo com o contexto ou surgimento de novas platafor-
mas e até de concorrentes – é preciso estar atualizado sobre UX, novas
técnicas e ferramentas.
Para ajudá-lo nessa tarefa, vou manter uma lista de blogs e de
livros que podem ser interessantes nessa Missão UX: uxpressocafe.com/
LeituraUX.

Mais conteúdo relacionado

Mais procurados

Estratégia simples e eficiente de tráfego para internet em 2021 para o seu ne...
Estratégia simples e eficiente de tráfego para internet em 2021 para o seu ne...Estratégia simples e eficiente de tráfego para internet em 2021 para o seu ne...
Estratégia simples e eficiente de tráfego para internet em 2021 para o seu ne...
Interidade Cursos Online - Consultoria - Mentoria - Produção Digital
 
O guia geração de contactos ilimitados
O guia geração de contactos ilimitadosO guia geração de contactos ilimitados
O guia geração de contactos ilimitados
Deni Vasconcelos
 
Livro como-criar-e-administrar-sua-loja-virtual
Livro como-criar-e-administrar-sua-loja-virtualLivro como-criar-e-administrar-sua-loja-virtual
Livro como-criar-e-administrar-sua-loja-virtual
Alonso A. Cirino
 
ArchaDay Rio de Janeiro - Como criar um site para arquitetos otimizado para c...
ArchaDay Rio de Janeiro - Como criar um site para arquitetos otimizado para c...ArchaDay Rio de Janeiro - Como criar um site para arquitetos otimizado para c...
ArchaDay Rio de Janeiro - Como criar um site para arquitetos otimizado para c...
Edu Costa
 
Passo a passo para criar uma loja virtual.
Passo a passo para criar uma loja virtual.Passo a passo para criar uma loja virtual.
Passo a passo para criar uma loja virtual.
Raphael Lassance ⚡
 
Como fazer uma Análise SWOT de uma loja virtual
Como fazer uma Análise SWOT de uma loja virtualComo fazer uma Análise SWOT de uma loja virtual
Como fazer uma Análise SWOT de uma loja virtual
Carlos Sousa
 
Evitando os-erros-de-hospedagem-v2
Evitando os-erros-de-hospedagem-v2Evitando os-erros-de-hospedagem-v2
Evitando os-erros-de-hospedagem-v2
TomSlick
 
Google meu negócio manual-google-analytics
Google meu negócio manual-google-analyticsGoogle meu negócio manual-google-analytics
Google meu negócio manual-google-analytics
everson ramiro
 
Artigo "Web Analytics: Mensurando o comportamento dos usuários de um site" (M...
Artigo "Web Analytics: Mensurando o comportamento dos usuários de um site" (M...Artigo "Web Analytics: Mensurando o comportamento dos usuários de um site" (M...
Artigo "Web Analytics: Mensurando o comportamento dos usuários de um site" (M...
MZ .
 
Intent Marketing e o Poder da Intenção - Future of E-commerce 21 Martech
Intent Marketing e o Poder da Intenção - Future of E-commerce 21 MartechIntent Marketing e o Poder da Intenção - Future of E-commerce 21 Martech
Intent Marketing e o Poder da Intenção - Future of E-commerce 21 Martech
Felipe Bazon
 
Indústrias e marcas: Como tornar seu site imbatível
Indústrias e marcas: Como tornar seu site imbatívelIndústrias e marcas: Como tornar seu site imbatível
Indústrias e marcas: Como tornar seu site imbatível
Arank
 
Otimização de Conversao e Ecommerce
Otimização de Conversao e EcommerceOtimização de Conversao e Ecommerce
Otimização de Conversao e Ecommerce
ComSchool
 
Como montar uma loja virtual
Como montar uma loja virtualComo montar uma loja virtual
Como montar uma loja virtual
Sandrorogeriomarquesvieira
 
Web marketing 6 Contrução Site
Web marketing 6 Contrução SiteWeb marketing 6 Contrução Site
Web marketing 6 Contrução Site
Ronaldo Hofmeister
 
Conectando-se com Compradores de Carros em um Mundo que Utiliza Smartphones
Conectando-se com Compradores de Carros em um Mundo que Utiliza SmartphonesConectando-se com Compradores de Carros em um Mundo que Utiliza Smartphones
Conectando-se com Compradores de Carros em um Mundo que Utiliza Smartphones
Eduardo Cortez
 
O Segredo dos Sites que Vendem
O Segredo dos Sites que Vendem O Segredo dos Sites que Vendem
O Segredo dos Sites que Vendem
acesso2612
 
Organizando a casa - MBA Esamc - Canvas e MVP
Organizando a casa - MBA Esamc - Canvas e MVPOrganizando a casa - MBA Esamc - Canvas e MVP
Organizando a casa - MBA Esamc - Canvas e MVP
Renato Melo
 
Campus Party 2013 - Como mimar seus usuários (e fazer com que falem bem de você)
Campus Party 2013 - Como mimar seus usuários (e fazer com que falem bem de você)Campus Party 2013 - Como mimar seus usuários (e fazer com que falem bem de você)
Campus Party 2013 - Como mimar seus usuários (e fazer com que falem bem de você)
Lu Terceiro
 
Web marketing 5 SEO
Web marketing 5 SEOWeb marketing 5 SEO
Web marketing 5 SEO
Ronaldo Hofmeister
 

Mais procurados (19)

Estratégia simples e eficiente de tráfego para internet em 2021 para o seu ne...
Estratégia simples e eficiente de tráfego para internet em 2021 para o seu ne...Estratégia simples e eficiente de tráfego para internet em 2021 para o seu ne...
Estratégia simples e eficiente de tráfego para internet em 2021 para o seu ne...
 
O guia geração de contactos ilimitados
O guia geração de contactos ilimitadosO guia geração de contactos ilimitados
O guia geração de contactos ilimitados
 
Livro como-criar-e-administrar-sua-loja-virtual
Livro como-criar-e-administrar-sua-loja-virtualLivro como-criar-e-administrar-sua-loja-virtual
Livro como-criar-e-administrar-sua-loja-virtual
 
ArchaDay Rio de Janeiro - Como criar um site para arquitetos otimizado para c...
ArchaDay Rio de Janeiro - Como criar um site para arquitetos otimizado para c...ArchaDay Rio de Janeiro - Como criar um site para arquitetos otimizado para c...
ArchaDay Rio de Janeiro - Como criar um site para arquitetos otimizado para c...
 
Passo a passo para criar uma loja virtual.
Passo a passo para criar uma loja virtual.Passo a passo para criar uma loja virtual.
Passo a passo para criar uma loja virtual.
 
Como fazer uma Análise SWOT de uma loja virtual
Como fazer uma Análise SWOT de uma loja virtualComo fazer uma Análise SWOT de uma loja virtual
Como fazer uma Análise SWOT de uma loja virtual
 
Evitando os-erros-de-hospedagem-v2
Evitando os-erros-de-hospedagem-v2Evitando os-erros-de-hospedagem-v2
Evitando os-erros-de-hospedagem-v2
 
Google meu negócio manual-google-analytics
Google meu negócio manual-google-analyticsGoogle meu negócio manual-google-analytics
Google meu negócio manual-google-analytics
 
Artigo "Web Analytics: Mensurando o comportamento dos usuários de um site" (M...
Artigo "Web Analytics: Mensurando o comportamento dos usuários de um site" (M...Artigo "Web Analytics: Mensurando o comportamento dos usuários de um site" (M...
Artigo "Web Analytics: Mensurando o comportamento dos usuários de um site" (M...
 
Intent Marketing e o Poder da Intenção - Future of E-commerce 21 Martech
Intent Marketing e o Poder da Intenção - Future of E-commerce 21 MartechIntent Marketing e o Poder da Intenção - Future of E-commerce 21 Martech
Intent Marketing e o Poder da Intenção - Future of E-commerce 21 Martech
 
Indústrias e marcas: Como tornar seu site imbatível
Indústrias e marcas: Como tornar seu site imbatívelIndústrias e marcas: Como tornar seu site imbatível
Indústrias e marcas: Como tornar seu site imbatível
 
Otimização de Conversao e Ecommerce
Otimização de Conversao e EcommerceOtimização de Conversao e Ecommerce
Otimização de Conversao e Ecommerce
 
Como montar uma loja virtual
Como montar uma loja virtualComo montar uma loja virtual
Como montar uma loja virtual
 
Web marketing 6 Contrução Site
Web marketing 6 Contrução SiteWeb marketing 6 Contrução Site
Web marketing 6 Contrução Site
 
Conectando-se com Compradores de Carros em um Mundo que Utiliza Smartphones
Conectando-se com Compradores de Carros em um Mundo que Utiliza SmartphonesConectando-se com Compradores de Carros em um Mundo que Utiliza Smartphones
Conectando-se com Compradores de Carros em um Mundo que Utiliza Smartphones
 
O Segredo dos Sites que Vendem
O Segredo dos Sites que Vendem O Segredo dos Sites que Vendem
O Segredo dos Sites que Vendem
 
Organizando a casa - MBA Esamc - Canvas e MVP
Organizando a casa - MBA Esamc - Canvas e MVPOrganizando a casa - MBA Esamc - Canvas e MVP
Organizando a casa - MBA Esamc - Canvas e MVP
 
Campus Party 2013 - Como mimar seus usuários (e fazer com que falem bem de você)
Campus Party 2013 - Como mimar seus usuários (e fazer com que falem bem de você)Campus Party 2013 - Como mimar seus usuários (e fazer com que falem bem de você)
Campus Party 2013 - Como mimar seus usuários (e fazer com que falem bem de você)
 
Web marketing 5 SEO
Web marketing 5 SEOWeb marketing 5 SEO
Web marketing 5 SEO
 

Destaque

Teste de usabilidade - Variantes do método básico
Teste de usabilidade - Variantes do método básicoTeste de usabilidade - Variantes do método básico
Teste de usabilidade - Variantes do método básico
Luiz Agner
 
Mapeamento e Wireframes - conceitos básicos, bem básicos
Mapeamento e Wireframes - conceitos básicos, bem básicosMapeamento e Wireframes - conceitos básicos, bem básicos
Mapeamento e Wireframes - conceitos básicos, bem básicos
Claudia Bordin Rodrigues
 
Directorio de productores_de_pisco
Directorio de productores_de_piscoDirectorio de productores_de_pisco
Directorio de productores_de_pisco
Raul Enrique Castro
 
Usabilidade 7-8 - Teste de Usabilidade
Usabilidade 7-8 - Teste de UsabilidadeUsabilidade 7-8 - Teste de Usabilidade
Usabilidade 7-8 - Teste de Usabilidade
Marcello Cardoso
 
Como fazer testes de usabilidade
Como fazer testes de usabilidadeComo fazer testes de usabilidade
Como fazer testes de usabilidade
UTFPR
 
pic 16f877a
pic 16f877apic 16f877a
pic 16f877a
Nthong Ktv
 
Avaliação de Interface
Avaliação de InterfaceAvaliação de Interface
Avaliação de Interface
Claudio Diniz - Designer Gráfico
 

Destaque (7)

Teste de usabilidade - Variantes do método básico
Teste de usabilidade - Variantes do método básicoTeste de usabilidade - Variantes do método básico
Teste de usabilidade - Variantes do método básico
 
Mapeamento e Wireframes - conceitos básicos, bem básicos
Mapeamento e Wireframes - conceitos básicos, bem básicosMapeamento e Wireframes - conceitos básicos, bem básicos
Mapeamento e Wireframes - conceitos básicos, bem básicos
 
Directorio de productores_de_pisco
Directorio de productores_de_piscoDirectorio de productores_de_pisco
Directorio de productores_de_pisco
 
Usabilidade 7-8 - Teste de Usabilidade
Usabilidade 7-8 - Teste de UsabilidadeUsabilidade 7-8 - Teste de Usabilidade
Usabilidade 7-8 - Teste de Usabilidade
 
Como fazer testes de usabilidade
Como fazer testes de usabilidadeComo fazer testes de usabilidade
Como fazer testes de usabilidade
 
pic 16f877a
pic 16f877apic 16f877a
pic 16f877a
 
Avaliação de Interface
Avaliação de InterfaceAvaliação de Interface
Avaliação de Interface
 

Semelhante a UX - Experiência do Usuário com foco em Alta Performance

Artigo - Gerenciando a experiëncia do e-consumidor
Artigo - Gerenciando a experiëncia do e-consumidorArtigo - Gerenciando a experiëncia do e-consumidor
Artigo - Gerenciando a experiëncia do e-consumidor
Pedro Waengertner
 
Design de temas para WooCommerce - Anyssa Ferreira
Design de temas para WooCommerce - Anyssa FerreiraDesign de temas para WooCommerce - Anyssa Ferreira
Design de temas para WooCommerce - Anyssa Ferreira
Anyssa Ferreira
 
Construa o seu negócio online: como, onde e porquê
Construa o seu negócio online: como, onde e porquêConstrua o seu negócio online: como, onde e porquê
Construa o seu negócio online: como, onde e porquê
Cady Bocum
 
Web Analytics - Como Implementar Uma Cultura de Web Analytics
Web Analytics - Como Implementar Uma Cultura de Web AnalyticsWeb Analytics - Como Implementar Uma Cultura de Web Analytics
Web Analytics - Como Implementar Uma Cultura de Web Analytics
Rafael Comin
 
10 dicas-antes-criar-loja-virtual
10 dicas-antes-criar-loja-virtual10 dicas-antes-criar-loja-virtual
10 dicas-antes-criar-loja-virtual
Eliane Soares
 
Implantação de E-Commerce para Pequenas e Médias Empresas
Implantação de E-Commerce para Pequenas e Médias EmpresasImplantação de E-Commerce para Pequenas e Médias Empresas
Implantação de E-Commerce para Pequenas e Médias Empresas
Alexandre Grolla
 
Como Usar o comércio eletrônico para superar as expectativas do universo fashion
Como Usar o comércio eletrônico para superar as expectativas do universo fashionComo Usar o comércio eletrônico para superar as expectativas do universo fashion
Como Usar o comércio eletrônico para superar as expectativas do universo fashion
Ricardo Jordão Magalhaes
 
Como escolher a melhor plataforma de e-commerce para montar uma loja virtual
Como escolher a melhor plataforma de e-commerce para montar uma loja virtualComo escolher a melhor plataforma de e-commerce para montar uma loja virtual
Como escolher a melhor plataforma de e-commerce para montar uma loja virtual
Gazin Atacado
 
Bombando suas conversões com dados
Bombando suas conversões com dadosBombando suas conversões com dados
Bombando suas conversões com dados
William Rufino
 
Meet Magento 2014 OSC brasil 6 pro 2
Meet Magento 2014 OSC brasil 6 pro 2Meet Magento 2014 OSC brasil 6 pro 2
Meet Magento 2014 OSC brasil 6 pro 2
Deivison Serpa
 
O que são indicadores de desempenho em marketing digital
O que são indicadores de desempenho em marketing digitalO que são indicadores de desempenho em marketing digital
O que são indicadores de desempenho em marketing digital
Juice Comunicação - Consultoria em Marketing Digital
 
Conversao no E-commerce
Conversao no E-commerceConversao no E-commerce
Conversao no E-commerce
ComSchool
 
Gestao financeira-para-modelo-de-negocios
Gestao financeira-para-modelo-de-negociosGestao financeira-para-modelo-de-negocios
Gestao financeira-para-modelo-de-negocios
Rafael Almeida
 
Gestao financeira-para-modelo-de-negocios
Gestao financeira-para-modelo-de-negociosGestao financeira-para-modelo-de-negocios
Gestao financeira-para-modelo-de-negocios
Rafael Almeida
 
Chatbots: estratégias e boas práticas para atender mais e melhor
Chatbots: estratégias e boas práticas para atender mais e melhor Chatbots: estratégias e boas práticas para atender mais e melhor
Chatbots: estratégias e boas práticas para atender mais e melhor
E-commerce Brasil
 
E commerce - como planejar o seu negócio online
E commerce - como planejar o seu negócio onlineE commerce - como planejar o seu negócio online
E commerce - como planejar o seu negócio online
42 Marketing Digital
 
O que é um ecommerce.docx
O que é um ecommerce.docxO que é um ecommerce.docx
O que é um ecommerce.docx
MariaFilomenaRodrigu
 
White paper mercado pago
White paper mercado pagoWhite paper mercado pago
White paper mercado pago
Marcelo Coelho
 
Treinamento em Google Analytics
Treinamento em Google AnalyticsTreinamento em Google Analytics
Treinamento em Google Analytics
Ericson Mattoso
 
CONAIND 2015 - Tecnologia Para a Internet e E-commerce
CONAIND 2015 - Tecnologia Para a Internet e E-commerceCONAIND 2015 - Tecnologia Para a Internet e E-commerce
CONAIND 2015 - Tecnologia Para a Internet e E-commerce
VitaminaWeb
 

Semelhante a UX - Experiência do Usuário com foco em Alta Performance (20)

Artigo - Gerenciando a experiëncia do e-consumidor
Artigo - Gerenciando a experiëncia do e-consumidorArtigo - Gerenciando a experiëncia do e-consumidor
Artigo - Gerenciando a experiëncia do e-consumidor
 
Design de temas para WooCommerce - Anyssa Ferreira
Design de temas para WooCommerce - Anyssa FerreiraDesign de temas para WooCommerce - Anyssa Ferreira
Design de temas para WooCommerce - Anyssa Ferreira
 
Construa o seu negócio online: como, onde e porquê
Construa o seu negócio online: como, onde e porquêConstrua o seu negócio online: como, onde e porquê
Construa o seu negócio online: como, onde e porquê
 
Web Analytics - Como Implementar Uma Cultura de Web Analytics
Web Analytics - Como Implementar Uma Cultura de Web AnalyticsWeb Analytics - Como Implementar Uma Cultura de Web Analytics
Web Analytics - Como Implementar Uma Cultura de Web Analytics
 
10 dicas-antes-criar-loja-virtual
10 dicas-antes-criar-loja-virtual10 dicas-antes-criar-loja-virtual
10 dicas-antes-criar-loja-virtual
 
Implantação de E-Commerce para Pequenas e Médias Empresas
Implantação de E-Commerce para Pequenas e Médias EmpresasImplantação de E-Commerce para Pequenas e Médias Empresas
Implantação de E-Commerce para Pequenas e Médias Empresas
 
Como Usar o comércio eletrônico para superar as expectativas do universo fashion
Como Usar o comércio eletrônico para superar as expectativas do universo fashionComo Usar o comércio eletrônico para superar as expectativas do universo fashion
Como Usar o comércio eletrônico para superar as expectativas do universo fashion
 
Como escolher a melhor plataforma de e-commerce para montar uma loja virtual
Como escolher a melhor plataforma de e-commerce para montar uma loja virtualComo escolher a melhor plataforma de e-commerce para montar uma loja virtual
Como escolher a melhor plataforma de e-commerce para montar uma loja virtual
 
Bombando suas conversões com dados
Bombando suas conversões com dadosBombando suas conversões com dados
Bombando suas conversões com dados
 
Meet Magento 2014 OSC brasil 6 pro 2
Meet Magento 2014 OSC brasil 6 pro 2Meet Magento 2014 OSC brasil 6 pro 2
Meet Magento 2014 OSC brasil 6 pro 2
 
O que são indicadores de desempenho em marketing digital
O que são indicadores de desempenho em marketing digitalO que são indicadores de desempenho em marketing digital
O que são indicadores de desempenho em marketing digital
 
Conversao no E-commerce
Conversao no E-commerceConversao no E-commerce
Conversao no E-commerce
 
Gestao financeira-para-modelo-de-negocios
Gestao financeira-para-modelo-de-negociosGestao financeira-para-modelo-de-negocios
Gestao financeira-para-modelo-de-negocios
 
Gestao financeira-para-modelo-de-negocios
Gestao financeira-para-modelo-de-negociosGestao financeira-para-modelo-de-negocios
Gestao financeira-para-modelo-de-negocios
 
Chatbots: estratégias e boas práticas para atender mais e melhor
Chatbots: estratégias e boas práticas para atender mais e melhor Chatbots: estratégias e boas práticas para atender mais e melhor
Chatbots: estratégias e boas práticas para atender mais e melhor
 
E commerce - como planejar o seu negócio online
E commerce - como planejar o seu negócio onlineE commerce - como planejar o seu negócio online
E commerce - como planejar o seu negócio online
 
O que é um ecommerce.docx
O que é um ecommerce.docxO que é um ecommerce.docx
O que é um ecommerce.docx
 
White paper mercado pago
White paper mercado pagoWhite paper mercado pago
White paper mercado pago
 
Treinamento em Google Analytics
Treinamento em Google AnalyticsTreinamento em Google Analytics
Treinamento em Google Analytics
 
CONAIND 2015 - Tecnologia Para a Internet e E-commerce
CONAIND 2015 - Tecnologia Para a Internet e E-commerceCONAIND 2015 - Tecnologia Para a Internet e E-commerce
CONAIND 2015 - Tecnologia Para a Internet e E-commerce
 

Mais de Lisandra Maioli

Hero's Journey para UX - EN (Lisandra Maioli).pptx
Hero's Journey para UX - EN (Lisandra Maioli).pptxHero's Journey para UX - EN (Lisandra Maioli).pptx
Hero's Journey para UX - EN (Lisandra Maioli).pptx
Lisandra Maioli
 
Hero's Journey para UX.pptx
Hero's Journey para UX.pptxHero's Journey para UX.pptx
Hero's Journey para UX.pptx
Lisandra Maioli
 
Don't let ux ui be a block_ embedding development on product design process _
 Don't let ux ui be a block_ embedding development on product design process _ Don't let ux ui be a block_ embedding development on product design process _
Don't let ux ui be a block_ embedding development on product design process _
Lisandra Maioli
 
UX Research by Lisandra Maioli
UX Research by Lisandra MaioliUX Research by Lisandra Maioli
UX Research by Lisandra Maioli
Lisandra Maioli
 
Intrax - Social Media Strategy
Intrax - Social Media StrategyIntrax - Social Media Strategy
Intrax - Social Media Strategy
Lisandra Maioli
 
UX e dicas práticas
UX e dicas práticasUX e dicas práticas
UX e dicas práticas
Lisandra Maioli
 
Diagnóstico para Mídias Sociais
Diagnóstico para Mídias SociaisDiagnóstico para Mídias Sociais
Diagnóstico para Mídias Sociais
Lisandra Maioli
 
Social Media Strategy (2013)
Social Media Strategy (2013)Social Media Strategy (2013)
Social Media Strategy (2013)
Lisandra Maioli
 
UX - Online Classify wireframe
UX - Online Classify wireframeUX - Online Classify wireframe
UX - Online Classify wireframe
Lisandra Maioli
 
Consumer Research
Consumer ResearchConsumer Research
Consumer Research
Lisandra Maioli
 
Online magazine wireframe (Lisandra Maioli))
Online magazine wireframe (Lisandra Maioli))Online magazine wireframe (Lisandra Maioli))
Online magazine wireframe (Lisandra Maioli))
Lisandra Maioli
 
New Website Architecture (by Lisandra Maioli)
New Website Architecture (by Lisandra Maioli)New Website Architecture (by Lisandra Maioli)
New Website Architecture (by Lisandra Maioli)
Lisandra Maioli
 
Gestão de Conteudo para Midias Sociais
Gestão de Conteudo para Midias SociaisGestão de Conteudo para Midias Sociais
Gestão de Conteudo para Midias Sociais
Lisandra Maioli
 
UX App Design - MeuCarroNovo App
UX App Design - MeuCarroNovo AppUX App Design - MeuCarroNovo App
UX App Design - MeuCarroNovo App
Lisandra Maioli
 
UX Project for LACMA Online Store
UX Project for LACMA Online StoreUX Project for LACMA Online Store
UX Project for LACMA Online Store
Lisandra Maioli
 
James Bond App
James Bond AppJames Bond App
James Bond App
Lisandra Maioli
 
Who is who in UX: Alan Cooper
Who is who in UX: Alan CooperWho is who in UX: Alan Cooper
Who is who in UX: Alan Cooper
Lisandra Maioli
 
GoPro - UCLA project
GoPro - UCLA projectGoPro - UCLA project
GoPro - UCLA project
Lisandra Maioli
 
Talenthouse - Ad Campaign
Talenthouse - Ad CampaignTalenthouse - Ad Campaign
Talenthouse - Ad Campaign
Lisandra Maioli
 
UX Design - Talenthouse Redesign (UCLA)
UX Design - Talenthouse Redesign (UCLA)UX Design - Talenthouse Redesign (UCLA)
UX Design - Talenthouse Redesign (UCLA)
Lisandra Maioli
 

Mais de Lisandra Maioli (20)

Hero's Journey para UX - EN (Lisandra Maioli).pptx
Hero's Journey para UX - EN (Lisandra Maioli).pptxHero's Journey para UX - EN (Lisandra Maioli).pptx
Hero's Journey para UX - EN (Lisandra Maioli).pptx
 
Hero's Journey para UX.pptx
Hero's Journey para UX.pptxHero's Journey para UX.pptx
Hero's Journey para UX.pptx
 
Don't let ux ui be a block_ embedding development on product design process _
 Don't let ux ui be a block_ embedding development on product design process _ Don't let ux ui be a block_ embedding development on product design process _
Don't let ux ui be a block_ embedding development on product design process _
 
UX Research by Lisandra Maioli
UX Research by Lisandra MaioliUX Research by Lisandra Maioli
UX Research by Lisandra Maioli
 
Intrax - Social Media Strategy
Intrax - Social Media StrategyIntrax - Social Media Strategy
Intrax - Social Media Strategy
 
UX e dicas práticas
UX e dicas práticasUX e dicas práticas
UX e dicas práticas
 
Diagnóstico para Mídias Sociais
Diagnóstico para Mídias SociaisDiagnóstico para Mídias Sociais
Diagnóstico para Mídias Sociais
 
Social Media Strategy (2013)
Social Media Strategy (2013)Social Media Strategy (2013)
Social Media Strategy (2013)
 
UX - Online Classify wireframe
UX - Online Classify wireframeUX - Online Classify wireframe
UX - Online Classify wireframe
 
Consumer Research
Consumer ResearchConsumer Research
Consumer Research
 
Online magazine wireframe (Lisandra Maioli))
Online magazine wireframe (Lisandra Maioli))Online magazine wireframe (Lisandra Maioli))
Online magazine wireframe (Lisandra Maioli))
 
New Website Architecture (by Lisandra Maioli)
New Website Architecture (by Lisandra Maioli)New Website Architecture (by Lisandra Maioli)
New Website Architecture (by Lisandra Maioli)
 
Gestão de Conteudo para Midias Sociais
Gestão de Conteudo para Midias SociaisGestão de Conteudo para Midias Sociais
Gestão de Conteudo para Midias Sociais
 
UX App Design - MeuCarroNovo App
UX App Design - MeuCarroNovo AppUX App Design - MeuCarroNovo App
UX App Design - MeuCarroNovo App
 
UX Project for LACMA Online Store
UX Project for LACMA Online StoreUX Project for LACMA Online Store
UX Project for LACMA Online Store
 
James Bond App
James Bond AppJames Bond App
James Bond App
 
Who is who in UX: Alan Cooper
Who is who in UX: Alan CooperWho is who in UX: Alan Cooper
Who is who in UX: Alan Cooper
 
GoPro - UCLA project
GoPro - UCLA projectGoPro - UCLA project
GoPro - UCLA project
 
Talenthouse - Ad Campaign
Talenthouse - Ad CampaignTalenthouse - Ad Campaign
Talenthouse - Ad Campaign
 
UX Design - Talenthouse Redesign (UCLA)
UX Design - Talenthouse Redesign (UCLA)UX Design - Talenthouse Redesign (UCLA)
UX Design - Talenthouse Redesign (UCLA)
 

Último

Veronica Daniel Dantas Opportunity Recebe 5 Premios Ademi.pdf
Veronica Daniel Dantas Opportunity Recebe 5 Premios Ademi.pdfVeronica Daniel Dantas Opportunity Recebe 5 Premios Ademi.pdf
Veronica Daniel Dantas Opportunity Recebe 5 Premios Ademi.pdf
Veronica Dantas
 
7 - Gerenciamento e Economia de Sistemas de Operações Logísticas.pdf
7 - Gerenciamento e Economia de Sistemas de Operações Logísticas.pdf7 - Gerenciamento e Economia de Sistemas de Operações Logísticas.pdf
7 - Gerenciamento e Economia de Sistemas de Operações Logísticas.pdf
InsttLcioEvangelista
 
Estudo de caso apresenta ao Projeto Integrado Multidisciplinar - TCC
Estudo de caso apresenta ao Projeto Integrado Multidisciplinar - TCCEstudo de caso apresenta ao Projeto Integrado Multidisciplinar - TCC
Estudo de caso apresenta ao Projeto Integrado Multidisciplinar - TCC
Paulo Emerson Pereira
 
RESTAURANT MANORA HOTEL SINDBAD HAMMAMET
RESTAURANT MANORA HOTEL SINDBAD HAMMAMETRESTAURANT MANORA HOTEL SINDBAD HAMMAMET
RESTAURANT MANORA HOTEL SINDBAD HAMMAMET
rihabkorbi24
 
Revolução da inclusão financeira: Benefícios da criptomoeda
Revolução da inclusão financeira: Benefícios da criptomoedaRevolução da inclusão financeira: Benefícios da criptomoeda
Revolução da inclusão financeira: Benefícios da criptomoeda
Renan Batista Bitcoin
 
A ADEQUAÇÃO À LGPD DA UNIVERSIDADE UNIVAZADA: UM ESTUDO DE CASO FICTÍCIO DE U...
A ADEQUAÇÃO À LGPD DA UNIVERSIDADE UNIVAZADA: UM ESTUDO DE CASO FICTÍCIO DE U...A ADEQUAÇÃO À LGPD DA UNIVERSIDADE UNIVAZADA: UM ESTUDO DE CASO FICTÍCIO DE U...
A ADEQUAÇÃO À LGPD DA UNIVERSIDADE UNIVAZADA: UM ESTUDO DE CASO FICTÍCIO DE U...
Paulo Emerson Pereira
 
GUIA DE EMPRESA PEDAGOGICA PARA ALUNOS.pdf
GUIA DE EMPRESA PEDAGOGICA PARA ALUNOS.pdfGUIA DE EMPRESA PEDAGOGICA PARA ALUNOS.pdf
GUIA DE EMPRESA PEDAGOGICA PARA ALUNOS.pdf
AlfeuBuriti1
 

Último (7)

Veronica Daniel Dantas Opportunity Recebe 5 Premios Ademi.pdf
Veronica Daniel Dantas Opportunity Recebe 5 Premios Ademi.pdfVeronica Daniel Dantas Opportunity Recebe 5 Premios Ademi.pdf
Veronica Daniel Dantas Opportunity Recebe 5 Premios Ademi.pdf
 
7 - Gerenciamento e Economia de Sistemas de Operações Logísticas.pdf
7 - Gerenciamento e Economia de Sistemas de Operações Logísticas.pdf7 - Gerenciamento e Economia de Sistemas de Operações Logísticas.pdf
7 - Gerenciamento e Economia de Sistemas de Operações Logísticas.pdf
 
Estudo de caso apresenta ao Projeto Integrado Multidisciplinar - TCC
Estudo de caso apresenta ao Projeto Integrado Multidisciplinar - TCCEstudo de caso apresenta ao Projeto Integrado Multidisciplinar - TCC
Estudo de caso apresenta ao Projeto Integrado Multidisciplinar - TCC
 
RESTAURANT MANORA HOTEL SINDBAD HAMMAMET
RESTAURANT MANORA HOTEL SINDBAD HAMMAMETRESTAURANT MANORA HOTEL SINDBAD HAMMAMET
RESTAURANT MANORA HOTEL SINDBAD HAMMAMET
 
Revolução da inclusão financeira: Benefícios da criptomoeda
Revolução da inclusão financeira: Benefícios da criptomoedaRevolução da inclusão financeira: Benefícios da criptomoeda
Revolução da inclusão financeira: Benefícios da criptomoeda
 
A ADEQUAÇÃO À LGPD DA UNIVERSIDADE UNIVAZADA: UM ESTUDO DE CASO FICTÍCIO DE U...
A ADEQUAÇÃO À LGPD DA UNIVERSIDADE UNIVAZADA: UM ESTUDO DE CASO FICTÍCIO DE U...A ADEQUAÇÃO À LGPD DA UNIVERSIDADE UNIVAZADA: UM ESTUDO DE CASO FICTÍCIO DE U...
A ADEQUAÇÃO À LGPD DA UNIVERSIDADE UNIVAZADA: UM ESTUDO DE CASO FICTÍCIO DE U...
 
GUIA DE EMPRESA PEDAGOGICA PARA ALUNOS.pdf
GUIA DE EMPRESA PEDAGOGICA PARA ALUNOS.pdfGUIA DE EMPRESA PEDAGOGICA PARA ALUNOS.pdf
GUIA DE EMPRESA PEDAGOGICA PARA ALUNOS.pdf
 

UX - Experiência do Usuário com foco em Alta Performance

  • 1. Capítulo 14 Experiência do Usuário com foco em Alta Performance Lisandra Maioli Talvez você já tenha ouvido falar da história do famoso botão de 300 milhões de dólares: um ajuste proposto pelo especialista de UX Jared Spool a uma loja virtual (que ele não revela qual é, mas alguns apostam no formulário da Macy’s) conseguiu aumentar em mais de 45% o fatura- mento dela. Mágica? Milagre? Nada disso! O que Jared Spool fez – e conta no site da UIE1 – foi simplesmente entender o usuário e facilitar a sua experiência no processo de compra. E, para isso, foi necessário apenas fazer o tal ajuste em um único botão de um formulário. O formulário do site, conforme Jared Spool conta em seu blog, não poderia ser mais simples: dois campos (“e-mail” e “senha”), dois bo- tões (“registrar-se” e “logar-se”) e um link (“esqueci a senha”). Os desig- ners da empresa que contratou Jared Spool não conseguiam entender a razão de justamente aquela página representar uma enorme porta de saída e “abandono de carrinho” do site, tendo cerca de 75% dos usuários não completando a compra. Em testes de usabilidade, a equipe de Spool descobriu que o problema não estava no layout do formulário nem no próprio formulário em si, mas sim no que o cadastro representava para os consumidores: 1 “The $300 Million Button”, por Jared M. Spool (14 de janeiro de 2009): https://articles.uie.com/ three_hund_million_button/
  • 2. Marketing Digital de Alta Performance250 • Além de não se lembrarem se já haviam se registrado no site, frustrando-se ao fazer várias tentativas de login, novos clien- tes resistiam à necessidade de se registrar, imaginando que iriam ser bombardeados por e-mail marketing indesejados ou, pior, ter a sua privacidade invadida. • Enquanto isso, entre os clientes já registrados no site, muitos tiveram dificuldade em lembrar o login e a senha e, em lugar de clicarem no link solicitando o lembrete da senha, registra- vam-se novamente, o que poderia explicar a média de 45% de usuários com mais de um cadastro no site. “O formulário, que tinha como objetivo facilitar o processo de compra, (...) ao invés, estava impedindo as vendas – muitas vendas!”, co- mentou Spool no post da UIE. A solução, então, sugerida pelo especia- lista foi trocar o botão “Registrar-se” por “Continuar”. Adicionaram ain- da a mensagem: “Você não precisa criar uma conta para fazer compras em nosso site. Simplesmente clique em ‘Continuar’ para avançar para o checkout. Para fazer suas compras futuras ainda mais rápido, você pode criar uma conta durante o checkout”. E foi assim, entendendo o usuário, que a loja aumentou o número de vendas em 45%, lucrando U$300 milhões a mais naquele ano! O que é UX? Proporcionar uma experiência agradável e fácil para o cliente final é fundamental no negócio de qualquer empresa, seja ela física-
  • 3. Experiência do Usuário e Usabilidade 251 seja virtual. Você deve se lembrar de alguma situação em que desis- tiu de comprar algo ou finalizar um negócio pela complexidade e dor de cabeça que estavam gerando. Uma fila muito grande, dificuldade em achar o produto, muita burocracia. Tudo isso atrapalha e frustra o cliente, aumentando as chances de perdê-lo naquela transação ou, pior, para sempre. Empreendedores sabem melhor do que ninguém que é muito mais caro recuperar um cliente perdido do que conquis- tar um novo, certo? E é aí que entra UX (User Experience ou, simplesmente, Experiên- cia do Usuário): ao entender o usuário e seu modelo mental, o profis- sional de UX tem o papel de desenhar as melhores experiências para o cliente de seu negócio, facilitando sua vida e desburocratizando tarefas simples como encontrar um produto na sua loja virtual ou mesmo seguir o checkout para finalizar a compra. UX para conversão Não basta apenas facilitar o caminho para o seu usuário se não houver conversão, certo? O seu site ou aplicativo foi construído para atin- gir um objetivo, seja o de divulgar um conteúdo, vender produtos ou servi- ços, criar/aumentar base de cadastrados, receber pedidos de orçamento, gerar leads etc. Você espera que o usuário conclua uma tarefa ou ação no seu site, e essa conversão é o que vai determinar o sucesso ou não do seu site. O profissional de A especialista em UX Jennifer Winter, em um post do blog da empresa User Testing,2 faz uma analogia interessante em relação a isto: não adianta, diz ela, conseguir levar o cavalo até a água se o mesmo não bebê-la. “A conversão não é sobre como fazer alguém fazer algo, mas sim sobre oferecer um ambiente em que esse ‘fazer algo’ seja irresistível”, resume a especialista. E como construir esse ambiente irresistível para que o cavalo beba a água? 2 “How Good UX Leads To Conversions”, por Jennifer Winter (1º. de maio de 2015): https://www. usertesting.com/blog/2015/05/01/good-ux-leads-to-conversions/
  • 4. Marketing Digital de Alta Performance252 Peter Morville,3 conhecido nome da área de UX, desenvolveu uma colmeia que apresenta os principais elementos para se desenvolver um ambiente irresistível: Pensar nesse diagrama de Morville, lembra Jennifer, nos fará refletir sobre pergun- tas básicas que vão influenciar o desenvolvi- mento do nosso produto: • O quão fácil é para o cavalo encontrar a água? • Será que ele precisa, ou mesmo quer a água? • Ele pode fisicamente chegar até a água? Entenda o seu usuário Para conseguir responder a essas perguntas, de novo, é impor- tante entender os seus usuários. E quando dizemos “entender seus usuá- rios”, não estamos falando apenas de levantar dados sociodemográficos sobre seus clientes. Precisamos ir mais a fundo e entender seus desejos, necessidades, frustrações, expectativas, comportamentos etc. Pensando na analogia do cavalo, proposto por Jennifer Winter, o objetivo dessas entrevistas (que chamamos User Interview) seria des- cobrir o que o seu usuário pensa não somente durante a experiência até o vale de água (navegação), mas o que ele pensa em relação à água (seu produto, conteúdo ou serviço) por si só: • Estou com sede? • Será que a água é potável? 3 Peter Morville é Presidente da Semantic Studios (semanticstudios.com), empresa de arquitetura de informação e consultoria em encontrabilidade. Fonte: Semantics Studio ( http://semanticstudios. com/user_experience_ design/)
  • 5. Experiência do Usuário e Usabilidade 253 • Estou seguro? • Tenho amigos que tentaram beber desta água? O que eles pensam? • A água está convenientemente localizada? Existe outro vale mais perto ou mais fácil para eu acessar? A área de UX oferece uma série de técnicas, ferramentas e meto- dologias que vão ajudar na missão de entender melhor seu usuário. Use ferramentas de Analytics Se você já tem um site, é importante os dados já gerados com fer- ramentas de Analytics. O Google Analytics (www.google.com/analytics), por exemplo, pode ajudar a entender o comportamento dos usuários no site: links mais clicados, páginas mais acessadas, tempo de permanência no site, pontos de conversão e de saída/abandono.4 Todos esses dados vão ajudar o UX Designer a tomar decisões importantes no re-design do site (ainda que seja apenas a alteração em um único botão). Tela do Google Analytics. Fonte: Google Analytics Academy5 4 Vale ler sobre como definir metas para o seu site usando o Google Analytics: https://support. google.com/analytics/answer/1012040?hl=pt-BR 5 https://analyticsacademy.withgoogle.com/course/1/unit/6/lesson/1
  • 6. Marketing Digital de Alta Performance254 Outra ferramenta muito bacana e que tem sido cada vez mais usa- da por UX Designers é o Hotjar (www.hotjar.com). Com essa ferramenta, você pode visualizar vídeos das ações (cliques, rolagem da página) dos seus usuários, conferir heatmaps (mapas de calor), mais a possibilidade de se criar pesquisas, enquetes etc., além de também poder analisar fu- nis de conversão. Fonte: Hotjar Product Tour6 O Mixpanel é outra ferramenta interessante que monitora even- tos no seu site ou aplicativo, ou seja, ações dos usuários que não geram visualização de página. Outro ponto bacana do Mixpanel é a possibilida- de de análise de dados em tempo real. Fonte: Mixpanel Blog7 6 https://www.hotjar. com/tour 7 http://blog.mixpanel. com/2015/11/17/ introducing-predict-see- who-will-convert-before- they-do/
  • 7. Experiência do Usuário e Usabilidade 255 O Formisimo8 é uma ferramenta especializada em monitorar abandono de formulários de checkout. Além de analisar o que os usuá- rios estão fazendo no checkout on-line, formulários de inscrição e de consulta, também mede a taxa de abandono de um site. Fonte: Formisimo Outra ferramenta parecida como Formisimo é o Lucky Orange (www.luckyorange.com) que também grava a navegação de usuários em vídeo. Fonte: LuckOrange site 8 http://www.formisimo.com
  • 8. Marketing Digital de Alta Performance256 Essas são apenas algumas ferramentas que podem ser usadas na coleta de dados e de informações sobre o comportamento do seu usuá- rio. É oportuno lembrar que existem inúmeras ótimas ferramentas de Analytics no mercado como SessionCam (www.sessioncam.com), Cra- zyEgg (www.crazyegg.com), KISSmetrics (www.kissmetrics.com) entre outras.9 Vale discutir com o profissional de Analytics do seu time. O im- portante aqui para o processo de UX é coletar informações relevantes para a tomada de decisão no design do seu produto ou serviço digital. Pesquise e entreviste seus usuários Além de usar ferramentas de Analytics no seu site, é importante ouvir diretamente do seu usuário ou usuário em potencial.10 Aqui a ideia é entender o comportamento do seu usuário de forma mais contextuali- zada. Com as ferramentas de Analytics, você já conseguiu entender como é a navegação do usuário no seu site ou aplicativo, agora, vamos enten- der os porquês. Fazer uma pesquisa on-line (Survey), pode ser o ponto de parti- da. Existem inúmeras ferramentas no mercado como Google Form (goo- gle.com/forms/about), Survey Monkey (surveymonkey.com), Typeform (www.typeform.com/), Polldaddy (polldaddy.com). É importante que as questões da pesquisa sejam rápidas, objetivas e fácil de entender. Além das pesquisas, é interessante realizarmos User Interview. O objetivo aqui é ter a chance de conversar individualmente com usuários do seu site ou potenciais usuários que representem seu público. Para re- crutar os participantes (fase crucial desse processo de User Interview), é importante entender bem quem é o seu público-alvo, onde mora, quan- tos anos tem, onde trabalha, estuda etc. Além dos porquês de seu comportamento durante a navegação, é uma ótima oportunidade para entender melhor o contexto de utilização do seu site: onde o usuário está quando acessa seu site ou aplicativo? Em que momentos do dia ou da semana ele acessa? Quais são suas motivações? etc. 9 Algumas ferramentas para análise de formulário aqui: https://www.conversioner.com/blog/6- practical-tools-improve-web-forms 10 Vale ler esse post sobre metodologias para se entender o usuário: http://www.taqtile.com.br/ taqtile/day/7/year/ueww2q28sdglbkyjnhywkfhzr6skg8
  • 9. Experiência do Usuário e Usabilidade 257 As entrevistas podem acontecer on-line ou pessoalmente em um laboratório, em um local escolhido pelo usuário (ou onde eles podem ser encontrados) ou mesmo em seu escritório, embora alguns especialistas acreditem que pelo fato de estarem na sua empresa, possam ser tenden- ciosos. Eu diria que o resultado dessa entrevista independedo local, mas do foco do trabalho e da experiência e do entrevistador. Existem ainda outras metodologias de entrevistas (que, inclusive, podem ser combinadas com testes de usabilidade) como a Etnografia, quando o pesquisador acompanha o diaadia do usuário; o Contextual Enquiry, quando o pesquisador vai até um local onde pode estar seu pú- blico-alvo como praia, shopping, livraria, restaurante (tenho o cuidado de pedir autorização no caso de ambiente comercial); ou Diary Study, quando o usuário se compromete a desenvolver um diário que contem- ple a utilização do site ou do aplicativo. Investigação Contex- tual (Contextual inquiry): quando o entrevistador vai até o local onde os seus usu- ários estão no mundo físico. É importante lembrar degravartodasasentrevistas, além de fazer anotações du­ rante a conversa, com o consen­timento por escrito do entrevistado. Vale também presentear o entrevistado com algum brinde, valor em dinheiro, voucher ou giftcard. O valor varia muito com o público entrevistado. User Interview (Entrevista com Usuário) em laboratório Foto de Tielly Ogura
  • 10. Marketing Digital de Alta Performance258 No caso de entrevistas on-line, existem algumas boas ferramen- tas que podem ajudar nessa tarefa como o Silverback, Morea etc. além da possibilidade de usar ferramentas de videochat como Skype, Google Hangout ou mesmo o Messenger, do Facebook. Só não se esqueça de gra- var esses vídeos chats! Ao final da entrevista, lembre-se de confirmar com o usuário sua disponibilidade para fornecer informações adicionais ou mesmo partici- par de uma segunda rodada, desta vez testando o redesenho. Faça testes de Usabilidade O Teste de Usabilidade pode ser combinado com o User Inter- view. Assim, você pode aproveitar melhor seu tempo com o mesmo usuá- rio. Tente apenas não alongar demais o tempo com o usuário, o ideal seria levar entre 45 e 60 minutos. É importante ter o roteiro do teste preparado, previamente. Ain- da que ele não seja seguido à risca, é importante saber qual é o objetivo do teste e quais perguntas queremos responder. Peça para o usuário con- tar suas primeiras impressões ao entrar no site ou no aplicativo, no caso de ele ainda não conhecer seu serviço ou produto. Caso seja um já usuá- rio do seu site ou aplicativo, peça para mostrar onde costuma navegar. Outro ponto importante é lembrar ao usuário, no início do teste, que a participação dele tem como objetivo melhorarmos a navegação do produto ou serviço testado, ou seja, o que está sendo testado é o site ou o aplicativo e não o usuário. Deixe-o à vontade para falar (não interrompa suas falas) e incentive-o a “pensar em voz alta”, permitindo algum tempo de silêncio para que ele possa pensar, enquanto você analisa a sua nave- gação. Para o teste de usabilidade, o especialista (e papa da Usabilidade) Jakob Nielsen,11 sugere cinco usuários como número ideal para se obter resultados válidos. A tendência, de acordo com ele, é que os resultados comecem a se repetir a partir do sexto usuário. 11 https://www.nngroup.com/articles/why-you-only-need-to-test-with-5-users/
  • 11. Experiência do Usuário e Usabilidade 259 Fonte: Nielsen Norman Group O teste pode acontecer presencialmente, em um la- boratório, na sua empresa, ou em algum lugar indicado pelo usuário (casa ou escritório), ou utilizando plataformas on-line, como já foi falado. Esses seriam testes moderados, quando há a participação do entrevistador durante o teste. Há também a possibilidade de se fazer testes não-moderados com ferramentas on-line, como o UserTesting.com ou o UserZoom.co.uk, UsabiltyHub.com, Loop11.com, WhatUsersDo.com, entre tantos outros.12 Neste caso, o UX Resear- cher poderá usar o mesmo roteiro de teste, definindo tarefas que de- vem ser realizadas (e que esta- rão sendo testadas) pelo usuá- rio on-line. O usuário é incentivado a falar/explicar suas ações durante a navegação, que é toda gravada. Existem ainda outras metodologias de testes que você pode usar combinadas com User Interview como: o CardSorting (atividades com cartões para testar a or- ganização de áreas ou do conteúdo do seu site) ou o Tree Testing (para testar a árvore de navegação do site). 12 Lista bacana de ferramentas para Teste de Usabilidade: http://remoteresear.ch/tools/ Fonte: Loop11.com Fonte: Noble Desktop (https:// www.nobledesktop.com/classes/ prototyping)
  • 12. Marketing Digital de Alta Performance260 Desenvolva Personas Além de lúdica, criar Personas é uma técnica que parece simples, mas muito poderosa. É uma ferramenta amplamente usada por profis- sionais de Marketing, Design, Produtos etc. A ideia aqui é criar um per- fil detalhado de um usuário que represente grupos do seu público-alvo. Para isso, é importante ter o maior número de informações possíveis so- bre seus usuários, coletados com as ferramentas de Analytics, nas entre- vistas, pesquisas, testes de usabilidade, além de informações do seu SAC, do time de venda, da área de Marketing etc. Para construir as Personas,13 é interessante fazer uma atividade coletiva, reunindo profissionais de diferentes áreas do seu time. É incrí- vel como cada área pode ver aspectos específicos e distintos da outra. Reunir esses profissionais, nessa atividade, vai ajudar a todos a olhar também o seu público-alvo por outro ponto de vista. Fonte: Fakecrow.com Não se preocupe se você for uma “eu-quipe”, o importante é fa- zer o esforço de olhar seu público-alvo por diferentes perspectivas. Ou seja, você pode desenvolver a Persona em uma atividade individual, o importante é só ter certeza que você está usando informações variadas e 13 Vídeo bacana sobre Personas: http://uxmastery.com/create-ux-personas/
  • 13. Experiência do Usuário e Usabilidade 261 de diferentes fontes (ferramentas de Analytics, nas entrevistas, testes de usabilidade, Surveys etc. etc. etc.). O formato e as informações que vão compor a Persona depende- rão muito do seu produto ou serviço. Mas é importante que seja o mais personalizado possível: dê um nome para a sua Persona, adicione uma foto, defina idade (não faixa de idade), local onde vive, o que estuda, se trabalha, que contenha informações sobre quais são os seus desafios diá- rios (e que, provavelmente, seu serviço ou produto vai solucionar) e mo- tivações, que soluções busca, qual seu nível de acesso a devices, o quanto costuma ficar on-line etc. Fonte: Ux-Lady (http://www.ux-lady. com/diy-user- personas/ )
  • 14. Marketing Digital de Alta Performance262 É importante que a persona represente seu público-alvo de for- ma realística (é preciso acreditar que se trata de uma pessoa real), que reflita os padrões levantados nas suas pesquisas e análises anteriores, baseadas em dados e informações coletadas. Quando estivermos dese- nhando o site ou o aplicativo, criando soluções com o design é essa Per- sona (ou Personas) que vamos ter em mente. Prefiro desenhar os meus próprios templates de Personas,14 mas existem algumas ferramentas on-line para ajudá-lo nessa tarefa, como o Xtension.com, MakeMyPersona.com (do Hubspot), Userforge.com etc. Fonte: Userforge. com/ Fonte: Extension.com 14 Um Pinterest board com alguns templates: https://www.pinterest.com/kooj/personas/
  • 15. Experiência do Usuário e Usabilidade 263 Proporcione uma experiência incrível Você já sabe bastante a respeito do seu usuário e todas estas in- formações irão ajudá-lo a tomar decisões de design que contribuirão para o sucesso do seu site com foco em conversão e melhor experiência. Nessa fase, é importante considerar alguns pontos: Construa sites responsivos e acessíveis O uso de dispositivos móveis para acesso à internet cresce verti- ginosamente no Brasil e no mundo. Mais e mais pessoas têm se sentido confortáveis em consumir conteúdo e fazer transações pelos seus smar- tphones e tablets. Sem contar a penetração dos chamados “wearables” (como relógios conectados à internet e outros dispositivos). Nesse novo contexto, planejar seu website para ser responsivo é mandatório. Segundo o relatório Tendências Internet de Mary Meeker, 45% das operações realizadas na Groupon vieram de dispositivos móveis a partir do início de 2013 (contra menos de 15% dois anos antes). Na Etsy, 50% do tráfego de usuários veio de dispositivos móveis a partir do início de 2014.
  • 16. Marketing Digital de Alta Performance264 Criação de Sites Responsivos (ou seja, que se adaptam confor- me o device utilizado), Desenvolvimento de Sites para Smartphones, M-Commerce e Inteligência Mobile Marketing para Criação de Sites Res- ponsivos. Pensar na otimização do seu site para dispositivo móvel pode ser uma grande oportunidade. Mas é importante lembrar que as pessoas usam o celular ou o tablet de formas diferentes do desktop/laptop. Leve em consideração também o contexto da utilização do device: é um exe- cutivo em seu escritório? Um médico com iPad em uma clínica? Um ado- lescente com seu celular no ponto de ônibus? Um estudo realizado pelo Google (2012)15 descobriu que as pes- soas usam smartphones nos seguintes contextos: • “A caminho” (de casa, do trabalho etc.) e/ou em casa • Para comunicar e se conectar • Em curtos períodos • Quando precisam de informações de forma rápida e imedia- tamente Tablets são igualmente utilizados para o entretenimento e nave- gação. Desktops, no entanto, são usados para tarefas mais sérias ou de investigação intensiva. De acordo com o estudo, os smartphones são o ponto de partida mais comum para as seguintes atividades on-line: • Busca de informações específicas • Navegação • Compras • Rede social 15 http://ssl.gstatic.com/think/docs/the-new-multi-screen-world-study_research-studies.pdf
  • 17. Experiência do Usuário e Usabilidade 265 Ao desenhar um site, considere também os usuários que contam somente com o celular para acessar a web,que não têm escolha a não ser usar seu telefone para todos os tipos de tarefas. Fonte: Wimimedia(https://commons.wikimedia.org/ wiki/File:Responsive.png) Fonte: Wekipedia(https:// en.wikipedia.org/ wiki/Responsive_ web_design) Para ajudar a analisar se o seu site é responsivo ou não, o Goo- gle lançou a ferramenta Google Resizer (design.google.com/resizer). Existem outras ferramentas que também ajudam nessa tarefa como o DesignModo.com (designmodo.com/responsive-test), o Semalt (semalt. design) e o SmartScreenresolution (whatismyscreenresolution.net/mul- ti-screen-test), só para citar alguns. Outro ponto importante é pensar na Acessibilidade para o seu site:16 considere que entre o seu público, você poderá ter usuários com 16 Cartilha sobre Acessibilidade: http://www.w3c.br/pub/Materiais/PublicacoesW3C/cartilha- w3cbr-acessibilidade-web-fasciculo-I.html
  • 18. Marketing Digital de Alta Performance266 baixa visão ou audição, daltonismo etc. Pensar em acessibilidade já dei- xou de ser “luxo” há muito tempo. Existem alguns especialistas em Acessibilidade,17 além de sites e informações on-line18 e ferramentas (como o Toomino,19 que adicio- nam suporte de voz à navegação do site: o Web Acessibility Checker,20 o Wave21 ) poderão ajudá-lo nessa missão. O importante é não ignorar a questão da Acessibilidade no seu projeto de Design. Melhore o tempo de carregamento O tempo em que o usuário tinha paciência em aguardar o carre- gamento de uma página on-line (os que são da época da conexão discada, sabem o que estou dizendo eheheh) se foi. Segundos extras no carrega- mento da página podem frustrar seu usuário, aumentando as chances de abandono. Um estudo feito pela Universidade de Massachusetts mostrou que os serviços de streaming de vídeos (como YouTube e Netflix) podem ganhar ou perder usuários em questão de segundos. “Descobrimos que as pessoas são pacientes em até dois segundos”, afirmou à NPR News o professor de ciências da Universidade Ramesh Sitaraman.22 O diretor de UX da R/GA NY, Fabrício Teixeira, listou no Blog de AI alguns dados interessantes sobre carregamento: • Usuários esperam as páginas carregarem por dois segundos. Depois do terceiro segundo, até 40% dos usuários abando- nam o site.23 • 85% dos usuários de dispositivos móveis esperam que o car- regamento seja tão ou mais rápido do que sites no desktop.24 17 http://acessodigital.net/art_horacio_como_testar_acessibilidade_parte_1.html 18 http://www.acessibilidadelegal.com/ 19 http://www.toonimo.com/solutions/for-accessibility/ 20 http://achecker.ca/checker/index.php 21 http://wave.webaim.org/ 22 http://connecticut.cbslocal.com/2013/01/10/study-streaming-video-viewers-lose-patience- after-2-seconds/ 23 http://www.mcrinc.com/Documents/Newsletters/201110_why_web_performance_matters.pdf 24 http://designingforperformance.com/performance-is-ux/
  • 19. Experiência do Usuário e Usabilidade 267 • A Amazon notou que cada 100 milissegundos de espera re- presenta um declínio de 1% nas vendas.25 • A Akamai relatou que 75% dos compradores on-line que ex- perimentam um problema, como um congelamento local, link quebrado, tempo longo para carregar, ou com um processo de pagamento complicado, não comprarão a partir desse site.26 • O Google perdeu 20% de lucratividade e tráfego de usuários por causa de um aumento de meio segundo no tempo de car- regamento de suas páginas de resultados.27 • A Gomez estudou o comportamento comprador on-line e descobriu que 88% dos consumidores on-line são menos propensos a retornar a um site depois de uma experiência ruim. O mesmo estudo descobriu que “em momentos de pico de tráfego, mais de 75% dos consumidores on-line partiram para o site de um concorrente em vez de esperar”.28 Um especialista em front-end pode ajudá-lo nessa tarefa. Mas como bem lembrou Teixeira em seu post “Designers podem contribuir para a otimização da performance de uma página,”29 e que estão no livro “Design For Performance”30 (O’Reilly), por Lara Callender Hogan. Quan- tidade de tipos e de tamanhos de fontes; quantidade, tamanho e peso de imagem; reutilização de elementos e outras decisões de design impac- tam no carregamento de páginas. Essas decisões podem (e devem) ser compartilhadas com o desenvolvedor. Se você já tem um site e tem a missão de otimizá-lo, pode usar o Pingdom (http://tools.pingdom.com/fpt/) para conferir o tempo de car- regamento de cada página/elemento. 25 https://sites.google.com/site/glinden/Home/StanfordDataMining.2006-11-28. ppt?attredirects=0 26 Idem 28 (http://designingforperformance.com/performance-is-ux/) 27 http://glinden.blogspot.com/2006/11/marissa-mayer-at-web-20.html 28 Idem 28 (http://designingforperformance.com/performance-is-ux/) 29http://arquiteturadeinformacao.com/user-experience/a-importancia-da-performance-das- paginas-na-experiencia-do-usuario/ 30 http://shop.oreilly.com/product/0636920033578.do
  • 20. Marketing Digital de Alta Performance268 Outro site bacana que pode ajudar nessa tarefa é o “PageSpeed Insights”, ferramenta gratuita disponibilizada pelo Google: https://deve- lopers.google.com/speed/pagespeed/insights/?hl=pt-BR Além de verificar o tempo de carregamento da página, o PageSpeed também dá dicas de como melhorar as páginas. Outro ponto interessante: é possível verificar a otimização do site para dispositivos móveis.31 Screenshot da tela de PageSpeed Ajude o seu usuário a economizar tempo Como vimos, em um mundo mais e mais acelerado, o usuário, com menos tempo, tem cada vez menos paciência ao navegar no seu site ou aplicativo.32 Não há mais tempo a perder pensando o que deve ser feito no seu site, por isso você tem ouvido tanto se falar de designs que sejam “simples e intuitivos” (dá-lhe, Steve Jobs!)Sugiro fortemente a leitura do livro “Não me faça pensar”, de Steve Krug, que apresenta a importância de se facilitar ao máximo a experiência do usuário. Além do tempo de carregamento, por exemplo, é importante fa- cilitar os caminhos de navegação para o usuário completar as tarefas necessárias (como finalizar uma compra, por exemplo). É importante que a Arquitetura de Informação do site seja bem redonda (ferramentas como “Card Sorting” e “Tree Testing” podem ajudar nessa tarefa): tenha umapriorização e hierarquização adequadas, conte com uma navegação Global clara e opções do usuário voltar para pontos onde iniciou na na- vegação, como os “Breadcrumbs” (ou “migalhas de pão”) que mostram o caminho seguido pelo usuário. 31 https://www.thinkwithgoogle.com/intl/pt-br/articles/speed-matters-optimizing-mobile.html 32 http://designingforperformance.com/performance-is-ux/
  • 21. Experiência do Usuário e Usabilidade 269 Uma maneira de ajudar o seu usuário a economizar tempo é au- tomatizar campos de formulários, por exemplo, o campo do CEP deve vir antes do preenchimento do endereço. Assim, quando preencher o campo do CEP, os outros (cidade e Estado) serão preenchidos automaticamente pelo sistema. Outra sugestão é que o cursor vá ao campo seguinte, assim que o anterior for preenchido. A função “autocomplete” também pode ajudar o usuário a economizar tempo no preenchimento de campos de formulário e de Buscas. As informações também podem ser salvas para facilitar a vida do usuário quando ele voltar ao seu site. Vale também garantir um acesso fácil ao contato de suporte ou chat de atendimento. O usuário se sente mais confortável sabendo que poderá pedir ajuda em caso de necessidade. Siga tendências em design Além de funcional e fácil de navegar, seu site também precisa ser agradável aos olhos. Aqui, já entramos mais na função do Web Designer, que vai cuidar da Arte do site. Mas UX pode e deve influenciar nessas decisões sempre tomadas em conjunto. Tenha certeza, por exemplo, de escolher uma palheta de cores adequada que comunique sua mensagem e esteja alinhada à sua marca. É importante também ficar atento ao estilo da Arte e estrutura do site (flat? Em cards? Padrão vertical com scroll? Com hero video? Slides framework?): independentemente de ter um público mais moderno ou mais tradicional, você não quer que seu site tenha uma “cara datada”, feito em “mil novecentos e guaraná com rolha”, como dizem por aí. Fique atento aos textos e conteúdo Mais papel do webwriter do que do UX Designer, produzir um bom conteúdo faz toda a diferença na experiência do usuário no seu site ou aplicativo. Imagens com qualidade, textos bem escritos e (revisados), transmitem credibilidade, e engajam e estimulam o seu usuário a com- pletar a tarefa no seu site e retornar.
  • 22. Marketing Digital de Alta Performance270 Além de um texto bem escrito, com um tom e voz adequados (um redator ou um jornalista poderá ajudar nessa tarefa), é importante tam- bém observar como ele está organizado na página e ao longo da navega- ção do site. O formato do textoe o modo como ele está organizadoajudam o usuário ao longo da navegação, como se “pegasse em sua mão” para levá-lo pelo caminho mais adequado. Outro ponto importantíssimo é quanto ao “call-to-action”.33 Além de cores e posições, tamanhos e cores adequadas, é importante também ficar atento ao texto: é sabido que se usa verbos nesses links e botões, daí, vale uma definição de padronização: serão usados verbos no Intran- sitivo (“Assinar Newsletter”) ou no Imperativo (“Assine nossa Newsle- tter”). Vale lembrar também que, com o aumento de acesso e a maior familiaridade dos usuários com produtos e serviços on-line, está em de- suso termos como “Clique Aqui”, com a ajuda do Designer (que criará a Arte de seu site ou aplicativo), o botão ou link deveria falar por si só que é um elemento clicável. Vale também lembrar a importância dos textos de feedback, aque- les quando o usuário completa alguma ação bem-sucedida ou quando acontece algum erro, por exemplo, ao faltar um campo a ser preenchido. É fundamental que esses textos sejam diretos, objetivos e que expliquem de forma simples. Escolha a Tipografia adequada Como já foi dito, a escolha da fonte pode impactar na performan- ce do site. Além disso, essa definição pode também ser determinante na comunicação do site, uma vez que, assim como cores, fontes diferentes comunicam mensagens diferentes. A escolha correta das fontes também é determinante para a legi- bilidade do seu site, assim como o número de caracteres por linha (su- gere-se entre 44 e 75, sendo 66 considerado ideal) e do tamanho das entrelinhas e como o texto está organizado nas páginas (em blocos, justi- ficado, alinhado à esquerda etc.). O tamanho da fonte também vai ajudar a determinar hierarquização. 33 Uma análise de diferentes links e botões de CTA feita pela Hubspot: http://blog.hubspot.com/ marketing/great-call-to-action-examples#sm.0000qby632ilydk2ru7206f5donsq
  • 23. Experiência do Usuário e Usabilidade 271 Uma dica34 importante é não usar mais do que dois tipos de fon- tes. Geralmente,utiliza-se um para o corpo do texto e outro para os bo- tões. O tamanho da fonte vai ajudar a determinar hierarquização, além de diferenciar o corpo do texto de títulos. Assim como a formatação, como bold ou itálico, pode ser usada para definir intertítulos e legendas de fotos. O importante é que haja um padrão na formatação e consistên- cia no tamanho. Lembre-se: tanto o conteúdo (texto, fotos, elementos) e as fontes precisam adequar-se também aos dispositivos móveis. Defina uma iconografia consistente A iconogrografia do seu site também é ponto-chave para a boa comunicação do seu conteúdo e do seu site com o seu usuário. Deve fa- cilitar a navegação e promover a rápida intepretação do conteúdo e das ações possíveis (especialmente de CTAs). É importante que a iconografia do seu site seja consistente e padronizada para facilitar o aprendizado de seus significados. 34 Mais dicas aqui: https://medium.com/product-design-ux-ui/26-digital-typography-rules-for- beginners-a04c6a5aaff3#.rcopl2hmc E aqui: https://www.usertesting.com/blog/2014/08/06/ choosing-the-right-font-a-guide-to-typography-and-user-experience/ Print Screen do site thenounproject.com
  • 24. Lembrando que, como já foi dito, não queremos que o seu usuário perca tempo no site, especialmente tentando interpretar os ícones. Um site que pode ajudar nessa tarefa é o The Noun Project (the- nounproject.com), onde é possível encontrar milhares de ícones criados por designers do mundo todo. Não relaxe! Não pense que o trabalho de UX parou aqui! Estamos vivendo uma era de mudanças constantes e em velocidade ímpar: os contextos mudam, os devices mudam, seus usuários mudam, suas necessidades e dificuldades mudam… É importante manter um ciclo frequente de testes, além de analisar constantemente os dados coletados pelas ferramentas de Analytics. É necessário também testar o desenho do site ou do aplicativo antes de lançá-lo, usando as mesmas técnicas e metodologias descritas quando foi falado de Entrevistas e Testes de Usabilidade. Faça testes A/B E se há dúvidas entre duas soluções de design, a sugestão é rea- lizar testes A/B. A ideia aqui é testar essas duas soluções diferentes com Fonte: The Next Web (http://thenextweb.com/dd/2015/01/04/practical-tips-web- mobile-usability-tests/#gref)
  • 25. Experiência do Usuário e Usabilidade 273 os usuários reais do site. Assim, as duas opções são publicadas: um gru- po de usuários verá a opção A e o outro grupo de usuários verá a opção B. Após um período com as duas opções no ar, verifica-se a que desem- penhou melhor e que será utilizada a partir de então. Ou seja, testes A/B são uma das formas mais eficientes de validação de hipóteses, principal- mente quando se trata de otimizar conversões. A ferramenta Optimizely.com poderá ajudar nessa tarefa e deve ser usada tanto para sites como para aplicativo móvel. Fonte: printscreen de tela do site optimizely.com Já o Visual Website Optimizer (vwo.com) permite testes A/B com diferentes URLs e com mais de uma variável. Conta com ferramenta para análise de Langing Page, heatmaps, e relatórios segmentados para cada tipo e tópico da pesquisa. Além da possibilidade de direcionar a pesquisa para usuários específicos. Fonte: blogo do
  • 26. Marketing Digital de Alta Performance274 Atualize-se sempre! Em um mundo que não para de mudar, além de se manter atuali- zado sobre o seu usuário – que pode alterar o seu comportamento cons- tantemente de acordo com o contexto ou surgimento de novas platafor- mas e até de concorrentes – é preciso estar atualizado sobre UX, novas técnicas e ferramentas. Para ajudá-lo nessa tarefa, vou manter uma lista de blogs e de livros que podem ser interessantes nessa Missão UX: uxpressocafe.com/ LeituraUX.