O documento apresenta uma análise heurística do site da Ricardo Eletro comparado com um concorrente. A análise avaliou três categorias principais: Homepage, Design e Checkout. Os resultados mostraram que o Design do concorrente é superior, enquanto o Checkout de ambos os sites precisa de melhorias. Já a Homepage tem poucas diferenças e o Ricardo Eletro pode igualar o concorrente otimizando a priorização das informações.

1. Iris
Jacomino
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro
Ricardo
Eletro
Análise
e
insights

2. O
que
será
apresentado
hoje
Quem
sou
eu
J
Análise
heurís:ca
e
Benchmark
• o
que
é
e
como
foi
realizada
• Resultados
• Insights
de
outros
sites
Evolução
• Apresentação
de
protóMpo
• Proposta
para
monitoramento
(KPIs)
Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro

3. Análise
Heurís:ca
Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro

4. Análise
heurís:ca
O
que
é
Avaliação
elaborada
a
parMr
de
critérios
e
qualidade
pré
estabelecidos.
Como
foi
realizada
• Escolha
de
um
possível
concorrente
(Fast
Shop)
• IdenMficação
de
categorias
essenciais
para
boa
experiência
de
compra
• Comparação
entre
os
dois
sites
Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro

5. Análise
heurís:ca,
categorias
• Homepage
(12
critérios)
Vitrine
da
loja,
“primeiro
contato
do
cliente
o
site
da
empresa”
• Design
(9
critérios)
Indiretamente
transmite
valores
como
profissionalismo
e
segurança
• Checkout
(19
critérios)
Fluxo
essencial
para
todo
site
que
vende
produtos
online
“The
checkout
process
should
be
the
most
user-­‐tested
and
reliable
sec6on
of
the
site.
When
users
enter
the
checkout
process,
they
are
looking
to
complete
the
purchase.
Once
users
have
selected
the
products
they
want
to
purchase,
nothing
should
stand
in
the
way.”
NN
GROUP,
E-­‐commerce
Reports,
2011
Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro

6. Análise
heurís:ca,
pontuação
Problema
grave
Todo
problema
que
pode
interferir
na
realização
da
ação
principal
Problema
leve
Todo
problema
que,
indiretamente,
pode
interferir
no
desempenho
da
ação
desejada
Regular
Item
presente
que
pode
ser
melhorado
para
a
realização
da
ação
principal
Bem
resolvido
Iden6ficação
de
uma
funcionalidade
que
suporta
e
encoraja
a
ação
desejada
Excelente
Iden6ficação
de
uma
funcionalidade
que
pode
ser
benchmark
1
2
3
4
5
Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro

7. A
análise
Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro

8. Resultados
gerais
Apesar
da
grande
diferença
se
encontrar
no
quesito
design…
Checkout
em
ambos
os
sites
é
mediano,
comprometendo
a
experiência
do
usuário
devido
a
questões
técnicas;
A
homepage
possui
pouca
diferença…
Trabalhando
a
questão
de
prioridade
de
informações,
o
site
Ricardo
Eletro
pode
se
igualar
ao
concorrente.
Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro
0,00
1,00
2,00
3,00
4,00
5,00
Homepage
Design
Checkout
Ricardo
Eletro
Fast
Shop

9. Homepage
Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro

10. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro

11. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro
Gaze
plot:
Teste
realizado
com
a
ferramenta
Feng
GUI,
a
qual
simula
a
visão
humana
durante
os
primeiros
5
segundos
de
exposição
ao
site
e
prevê
como
a
tela
será
escaneada
pelo
usuário.

12. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro
Melhor
aproveitamento
do
espaço
nobre
• Menu
com
as
categorias
abertas
compete
com
a
promoção;
• Nenhuma
informação
sobre
o
menor
preço
do
brasil
(quanto
é?);
• Pouco
destaque
para
os
produtos
oferecidos.
• Campo
de
busca
praMcamente
invisível

13. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro
Walmart

14. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro
• Preço
visível
• Categorias
mais
importantes
em
primeiro
lugar
• Destaque
aos
produtos
• Campo
de
busca
visível
• Página
com
ação
visível
Walmart

15. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro
Amazon

16. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro
• Categorias
mais
importantes
em
primeiro
lugar
• Ofertas
e
produtos
trazem
produtos
baseados
no
meu
histórico
de
compraJ
• Campo
de
busca
visível
Amazon

17. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro
Ricardo
Eletro
Fast
Shop

18. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro
Opacity
map
report:
Teste
realizado
com
a
ferramenta
Feng
GUI,
simula
a
visão
humana
durante
os
primeiros
5
segundos
de
exposição
ao
site
e
e
evidencia
quais
informações
são
atraentes
e
percebidas
pelos
usuáruis
e
quais
não
são,
respec6vamente
áreas
visîveis
x
áreas
não
visíveis.

19. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro
Melhor
aproveitamento
do
espaço
nobre
• Menu
com
as
categorias
abertas
roubam
atenção
dos
produtos
• A
quanMdade
de
informações
rouba
valor
agregado
dos
produtos.
• QuanMdade
de
informações
torna
diicil
a
tarefa
de
encontrar
e
comparar
preços.

20. Layout
Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro

21. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro

22. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro

23. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro
Valorização
dos
produtos
As
informações
em
excesso
roubam
o
valor
agregado
do
produto.
Obje:vo
da
página
claro
O
layout
deve
priorizar
a
ação
principal
da
página:
comprar
produto.

24. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro

25. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro

26. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro
Densidade
informacional
apropriada
O
site
não
possui
espaços
em
branco
na
maior
parte
das
páginas.
Todos
os
respiros
são
ocupados
por
propagandas
que
não
auxiliam
a
decisão
de
compra.

27. Aproveitamento
das
cores
As
cores
contrastantes
podem
ser
uMlizaras
para
invocar
ações
importantes:
comprar,
adicionar
ao
carrinho,
comparar
produtos,
etc.
Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro

28. Checkout
Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro

29. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro

30. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro
Itens
adicionais
Quando
compro
produtos
que
tem
garanMa,
uma
página
extra
é
adicionada
ao
fluxo.
“Páginas
adicionais
reduzem
a
conversão.”

31. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro
Referência
para
apresentar
a
garanMa:
• Formato
permite
comparação
e
escolha
• Dentro
de
um
lightbox
Walmart

32. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro

33. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro
Transições
Transição
entre
as
telas
é
excessivamente
lenta:
• Na
escolha
do
produto
• No
preenchimento
do
formulário
de
idenMficação
• Na
escolha
da
forma
de
entrega

34. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro

35. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro
Uso
inteligente
do
carrinho
• Site
não
favorece
comparação
de
produtos
no
carrinho.
“Usuários
usam
o
carrinho
para
comparar
produtos
diferentes
e
também
para
revisar
a
compra:
quan6dade,
cores,
etc.”

36. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro
Passo
a
passo
O
Checkout
apresenta
muitos
passos
para
a
conclusão
da
compra.

37. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro
• O
Walmart
simplifica
o
processo
e
apresenta
apenas
os
passos
essenciais.
Walmart

38. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro
Compre
também
Coluna
“compre
também”
empurra
o
botão
principal
(fechar
compra)
para
a
segunda
dobra
da
página.

39. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro
• Sugestão
de
diagramação
para
os
acessórios
recomendados
ao
produto
Bose

40. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro

41. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro
Cadastro
obrigatório
Para
comprar
no
site
é
obrigatório
o
cadastro.
Isso
pode
interromper
o
fluxo
de
compra.
“”

42. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro
• O
site
não
interrompe
o
fluxo
com
cadastro
obrigatório.
Como
o
usuário
precisa
digitar
as
informações
essenciais
durante
a
compra,
primeiro
efetua-­‐se
a
transação,
depois,
o
site
oferece
o
cadastro
com
os
dados
já
preenchidos.
Crate&Barrel

43. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro

44. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro
Estrutura
e
hierarquia
em
formulários
A
página
de
idenMficação
não
possui
diagramação
de
acordo
com
a
leitura,
ou
seja,
o
preenchimento
das
informações
é
dificultado..

45. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro
Pontos
de
fuga
O
Checkout
os
sites
possui
pontos
de
fuga,
ou
seja,
informações
irrelevantes
como
o
header
e
o
footer.

46. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro
Durante
o
fluxo
de
compra,
apenas
as
informações
essenciais
permanecem
na
interface,
entre
elas:
• Telefone
para
atendimento
• PolíMca
de
privacidade
• CerMificado
de
segurança
Walmart

47. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro

48. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro
Ação
principal
Botão
“uMlizar
este
endereço”
tem
pouco
destaque
em
relação
ao
“cadastrar
outro
endereço”,
ou
seja,
para
prosseguir
com
a
compra,
o
usuário
precisa
encontrar
o
botão.

49. Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro

50. Evolução
Iris
Jacomino
-­‐
São
Paulo,
9/11/2013
AD
DIALETO
|
Análise
do
site
Ricardo
Electro

51. AD
DIALETO
|
Análise
do
site
Ricardo
Electro
Iris
Jacomino
São
Paulo,
9/11/2013
Heurís:cas
Nota
dev
Nota
heuris:ca
Comentários
Na
página
do
carrinho,
o
botão
"ir
para
o
checkout"
está
visível
no
topo
e
final
da
página?
1
1
Em
algumas
compras,
uma
coluna
de
compre
também
aparece
na
tela
do
carrinho,
afastando
o
botão
fechar
compra
para
o
final
da
página.
Os
itens
podem
ser
comparados
facilmente
no
carrinho?
1
1
Não.
A
diagramação
não
favorece
esta
comparação.
As
questões
de
formulários
estão
agrupados
de
maneira
lógica
e
estruturada?
1
1
As
informações
não
estão
estruturadas
em
bloco
e,
por
esse
moMvo,
algumas
páginas
aparentam
estar
com
problemas
de
formatação,
ex.
IdenMficaçao.
A
ordem
poderia
ser
mais
lógica:
no
passo
"escolha
do
endereço
de
entrega"
poderíamos
oferecer
as
opções
de
frete,
desse
modo,
o
usuário
poderá
escolher
a
maneira
mais
adequada
para
o
endereço
escolhido.
Os
itens
podem
ser
editados
no
carrinho
(quan:dade,
cor,
modelo
do
produto)?
2
1
Apenas
a
quanMdade
pode
ser
editada.
Cross
seling
é
efe:vo?
1
1
O
crosseling
empurra
botão
"fechar
compra"
para
a
segunda
dobra
da
página.
O
usuário
precisa
"procurar"
pelo
botão
mais
importante
da
tela.
O
checkout
é
livre
de
informações
desnecessárias,
irrelevantes
e
distra:vas?
1
1
Não
em
todas
as
páginas.
A
idenMfcação
ainda
apresenta
o
menu
principal
de
categorias
abertos,
o
que
pode
distrair
o
usuário.
As
páginas
também
deixam
o
footer
inteiro
habilitado,
juntamente
com
o
campo
de
busca,
o
que
pode
reMrar
o
usuário
do
fluxo.

52. AD
DIALETO
|
Análise
do
site
Ricardo
Electro
Iris
Jacomino
São
Paulo,
9/11/2013
Heurís:cas
KPI
Comentários
Na
página
do
carrinho,
o
botão
"ir
para
o
checkout"
está
visível
no
topo
e
final
da
página?
Análise
da
página:
%
de
saídas
(diminuiu?),
tempo
gasto
(se
diminuiu)?
Em
algumas
compras,
uma
coluna
de
compre
também
aparece
na
tela
do
carrinho,
afastando
o
botão
fechar
compra
para
o
final
da
página.
Os
itens
podem
ser
comparados
facilmente
no
carrinho?
QuanMdade
de
alterações
do
produto
realizadas
no
carrinho.
Não.
A
diagramação
não
favorece
esta
comparação.
As
questões
de
formulários
estão
agrupados
de
maneira
lógica
e
estruturada?
Tempo
total
gasto
na
página
"idenMficação".
Tempo
total
gasto
na
página
forma
de
entrega.
Número
de
usuários
que
sairem
na
página
forma
de
entrega.
As
informações
não
estão
estruturadas
em
bloco
e,
por
esse
moMvo,
algumas
páginas
aparentam
estar
com
problemas
de
formatação,
ex.
IdenMficaçao.
A
ordem
poderia
ser
mais
lógica:
no
passo
"escolha
do
endereço
de
entrega"
poderíamos
oferecer
as
opções
de
frete,
desse
modo,
o
usuário
poderá
escolher
a
maneira
mais
adequada
para
o
endereço
escolhido.
Os
itens
podem
ser
editados
no
carrinho
(quan:dade,
cor,
modelo
do
produto)?
Quant.
De
cliques
nos
botões
"aterar"
carrinho.
Apenas
a
quanMdade
pode
ser
editada.
Cross
seling
é
efe:vo?
Quant.
de
pedidos
realizados
com
crosseling.
O
crosseling
empurra
botão
"fechar
compra"
para
a
segunda
dobra
da
página.
O
usuário
precisa
"procurar"
pelo
botão
mais
importante
da
tela.
O
checkout
é
livre
de
informações
desnecessárias,
irrelevantes
e
distra:vas?
Análise-­‐funil
do
checkout:
usuários
estão
clicando
menos
nos
links
distraMvos?
Não
em
todas
as
páginas.
A
idenMfcação
ainda
apresenta
o
menu
principal
de
categorias
abertos,
o
que
pode
distrair
o
usuário.
As
páginas
também
deixam
o
footer
inteiro
habilitado,
juntamente
com
o
campo
de
busca,
o
que
pode
reMrar
o
usuário
do
fluxo.

53. AD
DIALETO
|
Análise
do
site
Ricardo
Electro
Iris
Jacomino
São
Paulo,
9/11/2013
KPIS:
Obje:vo:
melhorar
a
conversão
do
checkout
Tipo
Página
Métricas
Periodicidade
Macro:
-­‐
Total
de
compras
realizadas
no
c.
alterado
x
c.
anterior
quinzenal
-­‐
Total
de
desistências
(bouce-­‐rate),
n.
de
saídas
no
c.
atual
x
c.
anterior
quinzenal
-­‐
Total
de
compras
realizadas
que
possuem
produtos
recomendados
no
c.
alterado
x
c.
anterior
quinzenal
-­‐
Tempo
gasto
durante
fluxo
de
compra
no
c.
alterado
x
c.
anterior
quinzenal
Micro:
ID
Tempo
total
gasto
na
página
"idenMficação".
semanal
Página
carrinho
%
de
saídas
c.
alterado
x
c.
anterior
semanal
Página
carrinho
Tempo
gasto
atual
x
c.
anterior
semanal
Página
carrinho
N.
de
cliques
recebido
por
bt
"fechar
compra"
c.
alterado
x
c.
anterior
semanal
Página
carrinho
N.
de
cliques
no
bt
"alterar
dados"
c.
alterado
semanal
Página
"forma
de
entrega"
Tempo
gasto
atual
no
c.
atual
x
c.
anterior
N.
de
usuários
que
sairam
na
página
forma
de
entrega.
semanal

54. Ou
seja,
hora
do
protó:po
J
AD
DIALETO
|
Análise
do
site
Ricardo
Electro
Iris
Jacomino
São
Paulo,
9/11/2013

55. Obrigada
J
Contato:
irisjacomino@gmail.com
Tel.:
9
7084
9586
AD
DIALETO
|
Análise
do
site
Ricardo
Electro
Iris
Jacomino
São
Paulo,
9/11/2013