monografia - qualidade afetiva de elementos visuais
DESCRIPTION
Embora não tenha atingido resultados que possam mudar o mundo. Segue a monografia com o resultado dos experimentos que realizei em 2013 para testar o impacto da mudança sutil de elementos de interface para a mesta atividade. A cada novo ano, estamos acompanhando o crescimento da internet e como ela tem mudado a vida das pessoas. Como uma ferramenta global de comunicação, vendas, compra e trabalho, a Internet se provou um ambiente multi-disciplinar e multi-cultural. Isso alimenta a necessidade e o desafio de criar interfaces que comunicam com todas essas comunidades, culturas e atividades, e que as ajudem a alcançar seus objetivos de uso. Baseado nos estudos que apontam que a percepção do usuário sobre o uso de interfaces se altera de acordo com sua cultura e personalidade, este trabalho experimental tem como objetivo analisar como diferentes elementos visuais tem impacto na forma que as pessoas usam interfaces.TRANSCRIPT
UNIVERSIDADE FEDERAL DO AMAZONAS
INTITUTO DE COMPUTAÇÃO
BACHARELADO EM CIÊNCIA DA COMPUTAÇÃO
Qualidade Afetiva de Elementos Visuais de
Interface
Marcelo Henrique Souza da Silva
Manaus – AM
Setembro / 2013
Marcelo Henrique Souza da Silva
Qualidade Afetiva de Elementos Visuais de
Interface
Monografia de Graduação apresentada ao Instituto de Computação da Universidade Federal do Amazonas como requisito parcial para a obtenção do grau de bacharel em Ciência da Computação.
Orientador(a)
Dra. Tayana Conte
Universidade Federal do Amazonas – UFAM
Instituto de Computação – IComp
Manaus-AM
Setembro / 2013
Monografia de Graduação sob o título Quantidade Afetiva de Elementos
Visuais de Interfaces apresentada por Marcelo Henrique Souza da Silva e
aceita pelo Instituto de Computação da Universidade Federal do
Amazonas, sendo aprovada por todos os membros da banca examinadora
abaixo especificada:
__________________________________________
Tayana Conte, Dra. em Engenharia de Sistemas de Computação
Orientador(a)
Grupo de Pesquisa em Usabilidade e Engenharia de Software
Universidade Federal do Amazonas
__________________________________________
Natasha Valentim
Departamento de Ciência da Computação
Universidade Federal do Amazonas
Manaus-AM, 18 de Setembro de 2013.
Para todos aqueles dedicam confiança em meu trabalho, meu muito
obrigado.
Agradecimentos
À minha professora orientadora que sempre me abriu portas, acreditou no
potencial de meu trabalho e que me serve de inspiração na tomada de
muitas decisões.
Aos meus colegas de trabalho que me deram suporte e contribuíram com
seus pontos de vista em relação aos modelos de experimento.
A todas as pessoas que me servem de fonte de energia para acordar todo
dia e continuar em frente.
“The buck stops here!“
Harry S. Truman
Qualidade Afetiva de Elementos Visuais de
Interfaces
Autor: Marcelo Henrique Souza da Silva
Orientador(a): Dra. Tayana Conte
RESUMO
A cada novo ano, estamos acompanhando o crescimento da internet e
como ela tem mudado a vida das pessoas. Como uma ferramenta global
de comunicação, vendas, compra e trabalho, a Internet se provou um
ambiente multi-disciplinar e multi-cultural. Isso alimenta a necessidade e o
desafio de criar interfaces que comunicam com todas essas comunidades,
culturas e atividades, e que as ajudem a alcançar seus objetivos de uso.
Baseado nos estudos que apontam que a percepção do usuário sobre o
uso de interfaces se altera de acordo com sua cultura e personalidade,
este trabalho experimental tem como objetivo analisar como diferentes
elementos visuais tem impacto na forma que as pessoas usam interfaces.
Palavras-chave: usabilidade, experiência, efetividade, conversão.
Affection Quality of Interface Visual Elements
Author: Marcelo Henrique Souza da Silva
Advisor: Dra. Tayana Conte
ABSTRACT
Every new year, we are following internet growth and how it is changing
peoples’ life. As a global tool to communicate, sell, buy and work, Internet
has been proven as a multicultural environment. It brings up the challenge
to create interfaces that communicate with all those communities, cultures
and activities, and help them to achieve their goals. Since there are
references that culture and people’s personality creates a different
perception of trust and meaning, this work has as main objective, analyze
how common user interface components help users to complete simple
tasks.
Keywords: usability, ux, experience, effectiveness, conversion.
Lista de figuras
Imagem 1 – Exemplo página inicial......................................................................................23
Imagem 2 – Exemplo página de produto............................................................................23
Imagem 3 – Exemplo página de pagamento.....................................................................24
Imagem 4 – Exemplo página de pesquisa..........................................................................24
Imagem 5 - Comparação entre as páginas de busca.....................................................26
Imagem 6 - Comparação entre as páginas de produto.................................................27
Imagem 7 - Comparação entre as páginas de pagamento..........................................27
Imagem 8 - Distribuição de pessoas por tempo para completar o experimento
da loja 1............................................................................................................................................29
Imagem 9 - Distribuição de pessoas por tempo para completar o experimento
na loja 2............................................................................................................................................29
Imagem 10 - Comparação de cliques entre páginas de busca da loja 1 (a
esquerda) e loja 2 (a direita).....................................................................................................30
Imagem 11 - Comparação de cliques entre páginas de blusa da loja 1 (a
esquerda) e loja 2 (a direita).....................................................................................................30
Imagem 12 - Comparação de cliques entre páginas de pagamento da loja 1 (a
esquerda) e loja 2 (a direita).....................................................................................................30
Imagem 13 - Número de pessoas que completaram cada etapa do experimento
para a loja 1.....................................................................................................................................31
Imagem 14 - Número de pessoas que completaram cada etapa do experimento
para a loja 2.....................................................................................................................................31
Imagem 15 - Tabela de cálculo de índices Loja 1............................................................32
Imagem 16 - Tabela de Cálculo de Índices Loja 2...........................................................33
Lista de tabelas
Tabela 1 - Elementos Visuais de Páginas Web e Suas Funções....................................18
Tabela 2 - Diferença entre as versões das lojas.................................................................24
Lista de abreviaturas e siglas
UFAM – Universidade Federal do Amazonas
IComp – Instituto de Computação
Sumário
1 Introdução.........................................................................................................14
1.1 Contextualização................................................................................................................15
1.2 Objetivos...............................................................................................................................15
1.3 Organização do trabalho.................................................................................................15
2 Intenção e Hipóteses do Experimento...................................................17
3 Estudo experimental.....................................................................................17
3.1 Os Elementos Visuais.......................................................................................................18
3.2 Métricas.................................................................................................................................20
3.3 A Loja Virtual.......................................................................................................................22
3.4 Itens de comparação........................................................................................................24
4 Resultados e Análise.....................................................................................28
4.1 Utilizar o elemento visual correto para cada tarefa diminui o tempo
necessário para completar a tarefa....................................................................................28
4.2 Utilizar o elemento visual correto para cada tarefa aumenta a taxa de
sucesso na execução das tarefas........................................................................................31
4.1 Utilizar o elemento visual correto para cada tarefa aumenta a percepção de
satisfação do usuário em relação à aplicação.................................................................32
5 Considerações Finais....................................................................................33
Referências...........................................................................................................34
14
1 Introdução
As vendas online têm redefinido os paradigmas de venda de produtos
(Hoque and Lohse 1999). Elas reduzem o tempo de pesquisa por
diferentes preços e em encontrar diferentes fornecedores, além de criar
um canal de comunicação alternativo para quem presta algum serviço. As
vendas pela internet aumentaram o alcance de pequenas, médias e
grandes lojas, o que torna lojas online visíveis à pessoas de diferentes
culturas e metáforas linguísticas. A necessidade por melhorar a razão de
conversão - quantidade de visitantes do site que chegam a realizar uma
compra - se torna necessária para o sucesso desses negócios (Reibstein
1999?).
Mesmo que fosse possível criar interfaces que vendem mais, pois se
comunicam diretamente com o interesse de cada indivíduo, predizer o
comportamento do usuário é uma tarefa muito complexa (Khalid 2006).
Neste cenário, o designer ou gerente de produto deve observar as
características que definem o grupo de consumidores, então criar
interfaces que deem os meios que o grupo precisa para atingir seus
objetivos. Através de interfaces web trabalhadas com foco nos usuários,
os donos de lojas online têm a expectativa de sair da dura média de 4%
de razão de conversão (Chaffey 2013).
Dentre os desafios de se identificar comportamentos dos grupos de
usuários está a “culturabilidade”, mistura de cultura e usabilidade (Barber
and Badre 1998), que impacta diretamente na percepção de confiança e
aceitação dos usuários nos websites, dependendo de suas origens (Marcus
and Gould 2000, Fogg 2002, Jarvenpaa, et al. 1999). Independentemente
se a loja é real ou virtual, o contato do consumidor com o ambiente da loja
influencia suas respostas emocionais e comportamento de compra
(Chang, et al. 2002, Novak, Hoffman and Yung 2000, Sherman and Smith
15
1986, Baker, Levy and Grewal 1992, Donovan, et al. 1994, Spies, Hesse
and Loesch 1997). Diante disso, assim como em lojas reais, nos quais o
ambiente de compra influencia o usuário a fazer uma compra ou não,
alguns frameworks estão sendo propostos para criar os mesmos estímulos
em meios virtuais (Mummalaneni 2005).
1.1 Contextualização
A maioria das pessoas não leem as instruções de interface, ao contrário,
interagem com a interface primeiro, e caso não atinjam seu objetivo,
começam a procurar por instruções na página (Callahan and Koenemann
2000). Sendo assim, não importa quão bem trabalhada e sofisticada as
interfaces web sejam, as diferenças de língua e culturas irão influenciar
fortemente a percepção do usuário (Nielsen 1990). Faz-se necessário,
então, entender o que move os grandes grupos de consumidores e
construir interfaces que se comuniquem bem com estes grupos. Devido a
estes fatos, o uso dos elementos de comunicação visual se tornam
essenciais na hora de construir interfaces que conduzam bem os usuários
até o seu objetivo final (Callahan and Koenemann 2000).
1.2 Objetivos
O objetivo deste trabalho é observar como a mesma tarefa pode modificar
o comportamento e percepção do usuário sobre a interface, variando-se
apenas os elementos visuais utilizados para navegar e auxiliar o usuário.
1.3 Organização do trabalho
Este material está dividido em quatro capítulos. Este capítulo inicial é uma
introdução ao conceito de percepção do usuário e introdução aos termos
utilizados. No Capítulo 2, serão explicitadas as hipóteses que servem de
base para este experimento. O Capítulo 3 descreve a elaboração,
16
desenvolvimento e o método de aplicação do experimento. Por último, no
Capítulo 4, serão apresentadas as conclusões sobre o experimento, co-
founding factors do experimento e possíveis trabalhos futuros.
17
2 Intenção e Hipóteses do Experimento
Baseado na pesquisa de Callahan & Koenemann (2000), de que as
pessoas primeiro interagem com elementos visuais da interface, para
então, caso não consigam atingir seus objetivos, ler as instruções, este
estudo assume que os elementos visuais são o fator principal de influência
no tempo no qual os usuários irão completar as atividades propostas pelas
interfaces web. É mencionado por Kubilus (2002) que os componentes de
ambientes de e-commerce confiáveis compartilham de muitas
características de usabilidade de interfaces eficazes. Este estudo propõe
que essa relação existe, pois quando se utiliza o componente visual
correto para a tarefa proposta, o usuário se sente mais confortável e
confiante para dar o próximo passo.
Este estudo desconsidera os princípios de criação de design: harmonia,
equilíbrio e simplicidade (Watzman 2002), e concentra as diferenças nos
grupos de teste apenas nos componentes visuais com o objetivo de testar
as seguintes hipóteses:
- Utilizar o elemento visual correto para cada tarefa
H1: diminui o tempo necessário do usuário para completar a tarefa
H2: aumenta a taxa de sucesso na execução das tarefas
H3: aumenta a percepção de satisfação do usuário em relação à aplicação
3 Estudo experimental
Para aumentar a variação do grupo de participantes do experimento e as
circunstâncias de uso da interface, este experimento foi realizado através
de uma página divulgada na internet e na língua portuguesa - língua
nativa do país onde o projeto foi executado. O modelo de experimento
remoto foi escolhido pois (Remote Testing 2013):
18
elimina a necessidade do uso de laboratórios e o efeito de
laboratórios sobre os participantes,
acomoda diversos grupos de participantes,
é mais barato que o modelo tradicional,
possibilita estender os dias de experimento em caso de necessidade
3.1 Os Elementos Visuais
Pra criar dois ambientes diferentes de uso, serão criadas duas interfaces
de loja virtual: a primeira na qual cada componente visual será utilizado
para a função que foi determinado, e uma segunda na qual tarefa e
componente utilizado serão de objetivos diferentes. Foi utilizado como
base a descrição de função dos componentes visuais como definido por
usability.gov (User Interface Elements 2013) , conforme mostra a Tabela
1.
Tabela 1 - Elementos Visuais de Páginas Web e Suas Funções
Elemento Função Exemplo
checkbox Permite ao usuários selecionar
mais de uma opção.
radiobutton Permite aos usuários
selecionarem um item por vez.
Dropdown
list
Mesma função do radiobutton,
porém mais compacto.
List box Mesma função do checkbox,
porém mais compacto.
Button Indica uma ação no clique.
19
Dropdown
button
Indica uma lista de ações no
clique.
Toggle Permite ao usuário definir
estados diferentes de algum
conteúdo.
Text Field Permite aos usuários adicionar
textos.
Datepicker Permite aos usuários selecionar
data e hora em formato correto
para o sistema.
Search field Mesma função do componente
“text field”, porém é geralmente
acompanhado por um botão de
busca.
Breadcrumb Permitem aos usuários
encontrarem sua atual posição
no site, e permitir navegar para
etapas anteriores.
Pagination Permite aos usuários navegador
entre as páginas de conteúdo,
seguindo uma ordem definida ou
não.
20
Tag Tags permitem aos usuários
encontrarem conteúdo da
mesma categoria.
Slider Permite usuários definirem ou
ajustarem valores.
Icon Ajudam usuários a navegar na
interface.
Image
Carousel
Permite os usuários navegarem
por um conjunto de itens e
escolherem um, que geralmente
encaminha para uma nova
página.
3.2 Métricas
Como o experimento se dá com o uso de uma interface simulada de loja
virtual, e que pode ser acessada por várias pessoas em lugares diferentes,
os dados serão todos coletados remotamente. Para este estudo foram
utilizados o seguinte conjunto de métricas:
Taxa de sucesso ao completar a tarefa (H2)
Tempo necessário total para completar as atividades (H2)
Satisfação final do usuário com a experiência de compra (H3)
O experimento foi executado com dois modelos de loja diferentes. Ambos
21
modelos de loja possuem 5 tarefas, e o teste foi criado para durar um
tempo médio de 7 minutos. Segue abaixo a lista de tarefas propostas para
ambas as lojas online:
1. Procurar por um blusa;
2. Selecionar uma quantidade e atributos do produto;
3. Inserir dados de pagamento simulando um cartão de crédito;
4. Voltar para escolher uma nova quantidade, pois a quantidade
indicada na tarefa é maior que a quantidade disponível;
5. Completar a compra.
Para a medição do tempo de execução entre as atividades, assim como
para saber o fluxo de interação do usuário com a página, será
implementado ao longo do site medidores através da ferramenta
KISSMetrics1. Essa ferramenta é totalmente transparente para o usuário,
não afetando assim a percepção do mesmo sobre a interface.
Para medir o nível de satisfação do usuário, será utilizada a escala de
usabilidade de sistemas (SUS) (Brooke 1986). No sistema SUS os usuários
precisam responder aos 10 itens abaixo mencionados com uma resposta
que varia entre “Discordo totalmente” e “Concordo totalmente”:
1. Eu acredito que gostaria de utilizar esse site mais vezes.
2. Eu achei o sistema desnecessariamente complexo.
3. Eu achei o sistema fácil de usar.
4. Eu acredito que precisaria da ajuda de uma pessoa técnica para usar
o sistema.
5. Eu acredito que as várias funções desse sistema estavam melhor
integradas.
6. Eu acredito que há várias inconsistências nesse sistema.
7. Eu acredito que a maioria das pessoas aprenderiam rapidamente a
utilizar esse sistema.
1 KISSMetrics – www.kissmetrics.com
22
8. Eu achei o sistema muito desconfortável de utilizar.
9. Eu me senti bem confiante utilizando o sistema.
10. Eu sinto que preciso aprender mais coisas para conseguir
utilizar esse sistema.
Ao final serão analisados ainda as imagens de interação de mouse, clique
e uso de rolar página, com as interfaces capturadas ao longo do
experimento no objetivo de mapear algum tipo de comportamento em
cada modelo de loja. Para a medição dos mapas de calor será utilizado a
ferramenta Crazy Egg2 que faz medição dos mapas de calor, assim como
mapa de cliques e rolamento das páginas.
Ambas as ferramentas, CrazyEgg e KissMetrics, foram escolhidas por
permitirem o uso gratuito dentro do período do experimento, e também
pelo domínio das ferramentas.
3.3 A Loja Virtual
Ambas as lojas virtuais possuem o mesmo cenário, e variam apenas nos
recursos disponibilizados na interface para permitir ao usuário completar
sua tarefa. Como já é conhecido que as taxas de conversão web são
baixas naturalmente, propõe um cenário simples para o experimento, e
que segue descrito abaixo:
Utilizar a loja para comprar camisas, sendo uma ou mais.
A loja virtual possuirá uma página inicial com a lista de produtos (ver
Imagem 1). A segunda página é a página com mais detalhes do produto, e
possui os campos para definir quantidade, tamanho e cor da camisa
desejada, além do botão comprar (ver Imagem 2). A terceira tela simula a
inserção de dados de pagamento de cartão de crédito, solicitando ao
usuário somente para adicionar sua data de nascimento e nome (ver
2 Crazy Egg – www.crazyegg.com
23
Imagem 3). Nessa etapa ele é obrigado a voltar para diminuir a
quantidade de camisas para completar a compra. Ao completar a compra,
todos os usuários são redirecionados para o mesmo formulário de
avaliação SUS. O preço dos produtos foram ocultados para não
influenciarem no processo de decisão do usuário.
Para gerenciar a distribuição dos modelos de loja seria utilizado como
ferramenta o Google Analytics Content Experiments3. Essa ferramenta
redireciona os acessos do link original, para uma de suas variações, e
armazena esses dados com o propósito de apontar uma versão vencedora
em número de conversões. Porém, devido a tecnologia utilizada para o
desenvolvimento do site de experimento, não foi possível inserir o recurso,
que exigia que as páginas do site fossem geradas de forma estática, ao
contrário de como funcionam os sites feitos em AngularJS – linguagem de
desenvolvimento escolhida para desenvolver o projeto. Para substituir o
Google Analytics Content Experiments foi implementada uma função
randômica para direcionar os usuários aleatoriamente para cada página.
No caso de desequilíbrio na distribuição que superasse uma razão de dois
terços, seria adaptado o direcionamento apenas para uma página afim de
equilibrar a pesquisa.
Imagem 1 – Exemplo página inicial Imagem 2 – Exemplo página de
produto
3 Google Analytics Content Experiments - https://support.google.com/analytics/answer/1745147?hl=en
24
Imagem 3 – Exemplo página de
pagamento
Imagem 4 – Exemplo página de
pesquisa
O código fonte do projeto está disponível em um repositório aberto no
Github e pode ser encontrado no endereço https://github.com/bissu/ui-
acceptance. O experimento pode ser acessado pelo endereço
http://bissu.github.io/ui-acceptance/#/.
3.4 Itens de comparação
Como o experimento tem por objetivo demonstrar que o uso correto dos
elementos de interface, assim como os componentes visuais da página,
tem impacto positivo na percepção do usuário e no comportamento dele,
foram alterados em cada versão da loja, elementos que são detalhes
suaves, mas que poderiam ser identificados se fosse solicitada uma
comparação. A lista de itens selecionados são elementos que o usuário irá
precisar para navegar ou completar a tarefa, o que implica que
necessariamente ele irá ver interagir com esses elementos ao longo do
experimento. Dos itens modificados entre as lojas estão:
Tabela 2 - Diferença entre as versões das lojas
Item Página do
experimento
Diferença
Links Página com lista Todos os links na versão 2 da loja
25
de blusas estão na cor preta e sem
sublinhado, com o intuito de
descaracterizar a função destes
textos.
Todos os elementos de link também
não modificam o cursor do mouse
para pointer ( ).
Imagens das
blusas
Página com lista
de blusas
Todas as imagens de blusas
perderam moldura e o cursor do
mouse também não muda para
pointer ( ).
Box para
definição de
quantidade do
produto
Página do
produto
Na versão 1 da loja, o campo possui
ponteiros para cima e para baixo
para a definição dos valores de
quantidade:
Na versão 2 o campo é um text field
comum como definido na Tabela 1.
Lista de
tamanhos de
camisa
Página do
produto
Na versão 1 da loja as opções foram
dispostas em um dropdown list,
como definido na Tabela 1.
Na versão 2 as opções foram
dispostas por um conjunto de
radiobuttons, como definido na
Tabela 1.
Botão comprar Página do
produto
Na versão 1 da loja foram usados
botões com cores e bordas.
26
Na versão 2, todos os botões foram
substituídos por links, esses com
cores azuis características dos links.
Botão Voltar Página de
pagamento
Na versão 1 da loja foram usados
botões com cores e bordas.
Na versão 2, todos os botões foram
substituídos por links, mas este em
específico está da cor preta.
Botão efetuar
pagamento
Página de
pagamento
Na versão 1 da loja foram usados
botões com cores e bordas.
Na versão 2, todos os botões foram
substituídos por links, esses com
cores azuis características dos links.
Imagem 5 - Comparação entre as páginas de busca
27
Imagem 6 - Comparação entre as páginas de produto
Imagem 7 - Comparação entre as páginas de pagamento
28
4 Resultados e Análise
Dos 108 participantes da pesquisa, apenas 55 pessoas responderam ao
formulário SUS ao final do experimento. Devido ao fato de esse
experimento ser executado remotamente, através de um endereço
disponibilizado na internet, não é possível observar os motivos que
levaram os participantes a desistirem no processo. Esses motivos podem
ser diversos como: falha na internet, falha no site, desinteresse pelo
objetivo, interrupção da atividade seguida por desistência ou frustração no
meio do processo. Essas faltas se aproximam das causas reais de
desistência de compra/assinatura em um processo real de aquisição na
internet.
Das 3 hipóteses que incentivaram o estudo, uma apresentou indício
negativo e duas apresentaram indícios positivos. Seguem abaixo as
apresentações dos modelos de teste e os resultados atingidos.
4.1 Utilizar o elemento visual correto para cada tarefa
diminui o tempo necessário para completar a tarefa
Para analisar esta hipótese foram considerados somente os participantes
que conseguiram iniciar o experimento e chegar a última página
experimento. O tempo medido é desde a visualização da página de busca,
até a visualização da página final – não incluindo o tempo para responder
a pesquisa ao final do experimento.
A loja 1 apresentou uma média de 136,72 segundos, com um desvio
padrão de 88,77, para 29 pessoas. Foi removido do grupo amostral um
usuário em específico que levou 8 minutos para a execução da tarefa. A
distribuição dos usuários pelo tempo utilizado para executar o
experimento pode ser acompanhada pela Imagem 8.
29
Imagem 8 - Distribuição de pessoas por tempo para completar o experimento da
loja 1
A loja 2 apresentou uma média de 85,84 segundos, com um desvio padrão
de 42,03 para 31 pessoas. Foram removidos do grupo amostral 3 usuários
que levaram mais do que 15 minutos para a execução do experimento. A
distribuição dos usuários pelo tempo utilizado para executar o
experimento pode ser acompanhada pela Imagem 9.
Imagem 9 - Distribuição de pessoas por tempo para completar o experimento na
loja 2
Segundo os dados coletados, a loja 2 – que apresenta elementos visuais
fora das suas características padrão - apresentou menor tempo médio
para a execução do experimento, com uma diferença de 47,96 segundos.
Os motivos que levaram os usuários a passar mais tempo na loja com
melhor interface não estão claros. Os mapas de interação não
demonstram nenhuma diferença significativa no comportamento entre os
usuários das páginas.
30
Imagem 10 - Comparação de cliques entre páginas de busca da loja 1 (a esquerda)
e loja 2 (a direita)
Imagem 11 - Comparação de cliques entre páginas de blusa da loja 1 (a esquerda) e
loja 2 (a direita)
Imagem 12 - Comparação de cliques entre páginas de pagamento da loja 1 (a
esquerda) e loja 2 (a direita)
31
4.2 Utilizar o elemento visual correto para cada tarefa
aumenta a taxa de sucesso na execução das tarefas
Para testar esta hipótese foram consideradas a quantidade de pessoas
que visualizaram a primeira página da loja (página de busca por blusas) e
que conseguiram visualizar a última página do experimento. Para
considerar a realização do experimento um sucesso, não foi considerado
necessário preencher a pesquisa na última página.
Para a loja 1, a taxa de sucesso foi de 56,1% (ver imagem 13). Para a loja
2, a taxa de sucesso foi de 54,8% (ver imagem 14). Sendo assim a loja 1
apresentou uma leve melhor performance em número de pessoas que
chegaram ao fim do experimento, porém com uma diferença muito baixa
o que caracteriza o indício como neutro.
Imagem 13 - Número de pessoas que completaram cada etapa do experimento
para a loja 1
Imagem 14 - Número de pessoas que completaram cada etapa do experimento para
a loja 2
32
4.1 Utilizar o elemento visual correto para cada tarefa
aumenta a percepção de satisfação do usuário em
relação à aplicação
Os usuários que conseguiram chegar até a última etapa do experimento
encontraram um formulário de escala de usabilidade de sistemas (SUS)
(Brooke 1986). O SUS tem como objetivo medir sistemas em diferentes
aspectos:
Eficácia: os usuários conseguem atingir seus objetivos;
Eficiência: quanto de recurso ou esforço é necessário é investido
para realizar os objetivos;
Satisfação: a avaliação de quão a experiência foi boa.
O formulário gera um índice que varia de 0 a 100, com uma nota de corte
média para 68 (Sauro 2011). Medindo os índices da loja 1 apresentou um
índice de 74,17, contra 71,83 da loja 2. Novamente uma diferença muito
baixa, o que caracteriza o indício como neutro. Abaixo é possível
acompanhar os dados completos coletados para o formulário
Imagem 15 - Tabela de cálculo de índices Loja 1
33
Imagem 16 - Tabela de Cálculo de Índices Loja 2
34
5 Considerações Finais
As diferenças implantadas entre as lojas são muito sutis e geralmente não
seriam percebidas por pessoas que usaram as lojas individualmente. As
lojas diferem apenas em relação com elementos isolados e não foi
implementada nenhuma diferença visual que interfere no fluxo do
experimento.
Embora o tempo para executar a segunda versão da loja seja menor, o
índice de conversão da loja 1 apresentou melhores resultados. Além disso,
mesmo as diferenças sendo sutis, a loja 1 apresentou melhor resultado na
percepção de qualidade através do formulário SUS. Analisando esses
resultados, temos indícios de que tão embora leves modificações nos
elementos visuais alteraram levemente a percepção do usuário sobre a
qualidade e conforto percebido, a modificação tão somente dos elementos
visuais não foram fortes o suficiente para alterar a taxa de sucesso.
Questiona-se também agora, ao final do estudo, se a atividade talvez não
fosse simples demais a ponto de não impor desafios aos usuários,
requerindo assim que eles procurassem suporte nos elementos visuais das
páginas para atingir seus objetivos.
Dessa forma, indica-se como próximos passos:
- A realização de entrevistas com parte do grupo amostral, afim de
captar diferenças mais subjetivas no comportamento e percepção
do usuário;
- Aumentar a amostra para tirar conclusões mais sólidas do
experimento;
- Realizar novos experimentos, com alterações menos sutis nos
elementos de interface;
- Realizar novos experimentos com cenários que possuam objetivos
mais complexo
35
ReferênciasBaker, J, M Levy, e D Grewal. “An experimental approach to making retail store environmental
decisions .” J Retail, 1992: 445-60.
Barber, W, e A N Badre. “Culturability: The merging of culture and usability.” 4th Conference on
Human Factors and the Web . Baskin Ridge, 1998.
Brooke, John. “SUS: A Quick and Dirty Usability Scale.” (Redhatch Consulting Ltd.) 1986.
Callahan, Ewa, e Jürgen Koenemann. A Comparative Usability Evaluation of User Interfaces for Online
Product Catalogs. Minneapolis, Minnesota: ACM, October de 2000.
Chaffey, Dave. Ecommerce Conversion Rates. 10 de June de 2013.
http://www.smartinsights.com/ecommerce/ecommerce-analytics/ecommerce-conversion-rates/
(acesso em 13 de July de 2013).
Chang, J. E., T. W. Simpson, A Rangaswamy, e J R Tekchadaney. “A good website can convey the
wrong brand image! A preliminary report.” EBRC, 2002.
Donovan, R J, J R Rossiter, G Marcoolyn, e A Nesdale. “Store atmosphere and purchasing behavior.” J
Retail, 1994: 283-94.
Fogg, B. J. “Persuasive technology.” (Morgan Kaufmann Publishers) 2002.
Hoque, AY, e GL Lohse. “An information search cost perspective for designing interfaces for
electronic commerce.” J Mark Res, August 1999: 387 - 94.
Jarvenpaa, S. L., N. Tractinsky, L. Saarinen, e M. Vitale. “Consumer trust in an Internet store: A cross-
cultural validation.” Journal of Computer Mediated Communication 5 (Online Journal), 1999.
Khalid, Halimahtun M. “Embracing diversity in user needs for affective design.” Applied Ergonomics,
July de 2006: 409–418.
Kubilus, N. J. “Designing an e-commerce site for users.” ACM Crossroads ([on-line serial]), August
2002.
Marcus, A., e E. W. Gould. “Cultural dimensions and global Web user interface design: What? So
what? Now what?” 16th Conference on Human Factors and the Web. Austin, 2000.
Mummalaneni, Venkatapparao. “An empirical investigation of Web site characteristics, consumer
emotional states and on-line shopping behaviors.” Journal of Business Research 58 (2005): 526-532.
Nielsen, Jakob. “Designing user interfaces for international use.” 1990.
36
Novak, T P, D L Hoffman, e Y F Yung. “Measuring customer experience in online environments: a
structural modeling approach.” Mark Sci, 2000: 22-42.
Reibstein, DJ. “Who is buying on the Internet.” Wharton School, University of Pennsylvania, 1999?
Remote Testing. 2013. http://www.usability.gov/how-to-and-tools/methods/remote-testing.html
(acesso em 20 de July de 2013).
Sauro, Jeff. Measuring Usability With The System Usability Scale (Sus). 2 de February de 2011.
http://www.measuringusability.com/sus.php (acesso em 17 de August de 2013).
Sherman, E, e R B Smith. “Mood states of shoppers and store image: promising interactions and
possible behavioral effects.” Edição: Anderson P. (Adv Consum Res) 14 (1986): 251-254.
Spies, K, F Hesse, e K Loesch. “Store atmosphere, mood and purchasing behavior.” Int J Res Mark 14
(1997): 1-17.
User Interface Elements. 2013. http://www.usability.gov/how-to-and-tools/methods/user-interface-
elements.html (acesso em 13 de July de 2013).
Watzman, Suzanne. “Visual Design Principles For User Interface.” In: Visual Design Principles For User
Interface, por Suzanne Watzman, 264-284. Hillsdale, NJ: L. Erlbaum Associates Inc, 2002.