54
USABILIDADE Como aplicar no seus projetos RENATO MELO - 2016

Melhorando a Usabilidade

Embed Size (px)

Citation preview

Page 1: Melhorando a Usabilidade

USABILIDADEComo aplicar no seus projetosRENATO MELO - 2016

Page 2: Melhorando a Usabilidade

USABILIDADEE sua importância

Page 3: Melhorando a Usabilidade

O QUE É USABILIDADE?

Page 4: Melhorando a Usabilidade

O QUE É USABILIDADE?

Page 5: Melhorando a Usabilidade
Page 6: Melhorando a Usabilidade

WHATSAPP:Usuário Novo

1 – Adicione uma amiga que você não tem na agenda2 – Criar um grupo de amigos para combinar um encontro

3 – Enviar uma foto para este grupo de amigos4 – Alterar seu status

Page 7: Melhorando a Usabilidade

WHATSAPP:1 – Adicione uma amiga que você não tem na agenda

Você não consegue adicionar pelo Whatsapp, tem que ir até a agenda e adicionar a pessoa

2 – Criar um grupo de amigos para combinar um encontroApenas o admin pode incluir novas pessoas no

grupo, isso não fica claro para o usuário3 – Enviar uma foto para este grupo de amigos

Botão de anexo é representado apenas por um ícone

4 – Alterar seu statusAlguns usuários não sabem que isso é possível

Page 8: Melhorando a Usabilidade

WHATSAPP:1 – Adicione uma amiga que você não tem na agenda

1min20s2 – Criar um grupo de amigos para combinar um encontro

1min14s3 – Enviar uma foto para este grupo de amigos

42s4 – Alterar seu status

37s

Page 9: Melhorando a Usabilidade

NÃO É POR QUE DEU CERTO QUE ESTÁ TUDO CERTO!

Page 10: Melhorando a Usabilidade

SNAPCHAT:Usuário Novo

1 - Manter a imagem pressionada até o tempo de visualização acabar;

2 - Algumas imagens, se o usuário soltasse antes da hora havia contratempo. Até que ele conseguisse voltar e

apertar novamente o tempo acabava e ele ficava sem ler a mensagem;

3 – Problemas com a limitação de caracteres;4 – Onde adiciono meus amigos do Facebook?

5 – Cadê minha timeline?

Page 11: Melhorando a Usabilidade

SIMPLES E FUNCIONAL. DÁ PARA MELHORAR?

Page 12: Melhorando a Usabilidade

WAZE: ROTAS SEGURAS

Muitas vezes o aplicativo induz o condutor a trafegar por ruas perigosas, expondo-os a riscos potenciais de

assaltos, violência e outros infortúnios.

Page 13: Melhorando a Usabilidade

WAZE: ROTAS SEGURAS

API integrado com notícias ou cadastro de ocorrências ou a comunidade Waze poderia marcar alterações de

segurança e ganhar pontos.

Page 14: Melhorando a Usabilidade
Page 15: Melhorando a Usabilidade

RADARESO motorista não recebe alertas chamativos, tem que

prestar atenção no caminho e na tela do aplicativo a todo momento.

Page 16: Melhorando a Usabilidade

MUDANÇAS + SINAL SONORO

Page 17: Melhorando a Usabilidade

FORMULÁRIOSMedida é MP/H ao invés de KM/H o que pode confundir o

usuário.

Page 18: Melhorando a Usabilidade
Page 19: Melhorando a Usabilidade

USABILIDADETestes

Page 20: Melhorando a Usabilidade

1) FEEDBACK

Page 21: Melhorando a Usabilidade

até 0,1s: ideia de continuidade até 1s: delay percebido, mas okdepois de 10s: o usuário muda de tarefa.

O USUÁRIO NÃO QUER ESPERAR!

Page 22: Melhorando a Usabilidade

A CADA 100 MILISSEGUNDOS DE TEMPO DE CARREGAMENTO DE PÁGINA REDUZ 1% DE VENDAS NA AMAZON.

AMAZON

Page 23: Melhorando a Usabilidade

AO AUMENTAR O CARREGAMENTO DO SITE DE 0.4 PARA 0.9 SEGUNDOS, PERDEU 20% DA RECEITA EM PUBLICIDADE,

GOOGLE

Page 24: Melhorando a Usabilidade

2) PÁGINAS DE ERRO

O usuário deve saber o que está acontecendo em uma linguagem fácil.O usuário deve saber que a culpa não foi dele.O usuário deve conseguir voltar para o site.

Page 25: Melhorando a Usabilidade

3) ERROS DE FORMULÁRIO

Nome:

Endereço:

CEP:

CPF:

Telefone:

Renato Melo

Rua dos Bobos, número zero

01234-000

12345678900

48 6666-6666

Houve um erro no preenchimento do formulário.

Onde?Não use espaços ou hifens no telefone. Utilize somente números.

13 6666-6666

Page 26: Melhorando a Usabilidade

3) DADOS DO FORMULÁRIO

Remover um único campo do formulário (telefone) foi capaz de aumentar as conversões em 167%. A taxa média de

conversão da página foi de 20,18% para 53,90%.

Pense que para cada R$ 100 investidos em mídia anteriormente, agora conseguiríamos o mesmo resultado investindo apenas R$37,45, ou então teríamos quase três

vezes esse resultado se investíssemos o mesmo valor.

Page 27: Melhorando a Usabilidade

4) CAIXA DE BUSCA

Page 28: Melhorando a Usabilidade

5) ETAPAS DO SEU SITE

1. Escolhas dos produtos

2. Cadastro ou login

3. Entrega e embalagem

4. Pagamento

Page 29: Melhorando a Usabilidade

Testes de Usabilidade

Page 30: Melhorando a Usabilidade

TESTE COM USUÁRIOS!Nunca mencione a palavra teste, ela assusta as pessoas.

Page 31: Melhorando a Usabilidade

Maior controle de dados e variáveis;Mais fácil de envolver o cliente;Maior custoUsuário pode se sentir desconfortávelComportamento distante do seu universo real

LABORATÓRIO

Page 32: Melhorando a Usabilidade

Mais barato;Usuário se sente mais a vontade;Mais próximo de seu uso real;Menor controle dos dados e variáveisDificuldade de envolver o cliente (quem contrata)

AMBIENTE DO USUÁRIO

Page 33: Melhorando a Usabilidade

Laboratório

Medir performance (tempo, número de

erros)Produção acadêmica (maior “aceitação”

científica para teses, artigos e dissertações)Estudos permanentes com equipe dedicada

(Globo, Nokia)

Ambiente do Usuário

Obter feedback rápidoProjetos com recursos

reduzidosTestar conceitos e

interfaces em fases iniciais de design

Page 34: Melhorando a Usabilidade

SÉRIES AMERICANASNOVELAS BRASILEIRAS

Page 35: Melhorando a Usabilidade

USABILIDADEPesquisas com Usuários

Page 36: Melhorando a Usabilidade

Perguntas abertas são aquelas que permitem ao participante responder da forma que quiser, no formato que quiser, e com a profundidade e duração que quiser.

Perguntas abertas vs. Perguntas

fechadas

Page 37: Melhorando a Usabilidade

Perguntas fechadas são aquelas que podem ser respondidas com um “Sim? ou “Não”, ou outra opção sugerida.

Perguntas abertas vs. Perguntas

fechadas

Page 38: Melhorando a Usabilidade

Perguntas fechadas funcionam melhor para questionários quantitativos (porcentagem de sim ou não). Já para usabilidade, o melhor é utilizar questões abertas.

Perguntas abertas vs. Perguntas

fechadas

Page 39: Melhorando a Usabilidade

USABILIDADESoluções Nielsen

Page 40: Melhorando a Usabilidade

MUDANÇAS:De: A interface agiu como esperado?

Para: O que você esperava queacontecesse quando você ____?

Page 41: Melhorando a Usabilidade

MUDANÇAS:De: Você encontrou o que procurava?

Para: Onde você encontrou o item?

Page 42: Melhorando a Usabilidade

MUDANÇAS:De: Você acha que usaria esse

produto?

Para: Como você acha que esse produto se encaixaria no seu trabalho?

Page 43: Melhorando a Usabilidade

MUDANÇAS:De: Você achou fácil de usar?

Para: Qual a parte mais confusa da experiência?

Page 44: Melhorando a Usabilidade

USABILIDADERoteiro

Page 45: Melhorando a Usabilidade

• Planejar o teste: com quantas pessoas?• Criar um roteiro: como devem ser as

perguntas?• Moderação do teste: o que fazer e o que

não fazer, exercício prático• Como analisar: o que observar, o que

fazer com as informações obtidas• Como adaptar: teste mobile, teste

caseiro, teste em contexto de uso

Page 46: Melhorando a Usabilidade

#TRABALHO30.11

Page 47: Melhorando a Usabilidade

1) 2 GRUPOS

Page 48: Melhorando a Usabilidade

2) ESCOLHA UMA EMPRESA DA BAIXADA QUE TENHA UM SITE RUIM OU NÃO POSSUA SITE

Page 49: Melhorando a Usabilidade

3) NOVO SITE:-Projeto com checklist: TAMANHO DA TELA CONECTIVIDADE OBJETIVOS DO USUÁRIO AMBIENTES DO USUÁRIO CAPACIDADE DO USUÁRIO CONVERSÃO

Page 50: Melhorando a Usabilidade

4) REDES SOCIAIS:-Criar fanpage e perfil no Insta-Imagem de capa-Imagem de perfil-Pelo menos 15 publicações (somando Facebook e Instagram)

Page 51: Melhorando a Usabilidade

4) PARTE ESCRITA (VIA E-MAIL):

4.1 PROPOSTA TÉCNICA:-PESQUISA;- DESCRIÇÃO;- APRESENTAÇÃO DAS PEÇAS;

4.2 PROPOSTA FINANCEIRA-CÁLCULO FINANCEIRO;

Page 52: Melhorando a Usabilidade

5) APRESENTAÇÃO:- COMO SE FOSSE UMA AGÊNCIA (CRIAR NOME E LOGO);- APRESENTAÇÃO DA CAMPANHA;- AÇÕES CRIATIVAS;

Page 53: Melhorando a Usabilidade

PRÉVIAPara 09/11 até às [email protected] ou [email protected] no Google “perfume lacoste”, acesse 3 sites e escreva:-Cite os 3 sites que você pesquisou;-Qual site mais fácil para comprar e por que?-Qual site mais difícil para comprar e por que?-O que você mudaria neste site “mais difícil”?

Page 54: Melhorando a Usabilidade

FACEBOOK.COM/RENATOMELOMKT

[email protected]