amyris colubre

51
Amyris Fernandez, Profa. Dra Design Thinker / Dark Matter Strategist Experiência do Usuário & Boas Práticas

Upload: amyris-fernandez

Post on 27-Nov-2014

243 views

Category:

Education


0 download

DESCRIPTION

Palestra Gratuita - Melhores práticas para Experiência do Usuário em e-commerce - web e mobile com Amyris no Colubre 2014.

TRANSCRIPT

Page 1: Amyris Colubre

Amyris Fernandez, Profa. Dra

Design Thinker / Dark Matter Strategist

Experiência do Usuário

& Boas Práticas

Page 2: Amyris Colubre

Amyris Fernandez - Sócia-Diretora da

Knowledge Brokers, empresa de

Design Thinking, pesquisa e design

digitais.

Em uma vida passada trabalhou para

grandes empresas de publicidade,

tecnologia e varejo tradicionais, mas

se apaixonou por tecnologia e resolveu

viver essa paixão!

Pós Doutora em Comunicação Social

pela USP.

Doutora em Comunicação Social pela

Universidade Metodista - SBC, tendo

realizado parte de sua pesquisa com

Bolsa Sanduíche CAPES no Centro de

Pesquisas de Games no ITU,

Dinamarca.

Mestre em Comércio Eletrônico pelo

Rochester Institute of Technology.

Page 3: Amyris Colubre

Os meios digitais já fazem parte do dia-a-dia do consumidor

Page 4: Amyris Colubre

Como as empresas vão se relacionar com estes consumidores que mudaram seus hábitos?

Page 5: Amyris Colubre

Social Networks

Media

Mobile

Indoor Media and Out-of-Home

Games

Intranet | Extranet

Websites and Hot sites

Digital TV | IPTV

MULTIPLATAFORMA

Empresas vão viver com seus consumidores ativando

o relacionamento e estando aptas a recebê-lo através

da sua conveniência…

Page 6: Amyris Colubre

Mobilidade 24/7

On demand Imersão

Interação

…e explorando a oportunidade para desenvolver

o seu “engagement” e convidá-lo à ação.

Segmentação

Customização

Page 7: Amyris Colubre

Estratégia é o plano de como a empresa irá competir no mercado.

Começando por criar a ESTRATÉGIA

Page 8: Amyris Colubre

Escolha da arena

Quais consumidores iremos servir?

Que produtos e serviços iremos oferecer?

Onde iremos operar?

Localização de uma posição

defensável

Que tipo de benefícios nossos clientes procuram?

Nossa empresa possui todos os recursos, capacidades

e capacitações para entregar os benefícios propostos

melhor que nosso melhor competidor?

Busca de diferenciação através

de atividades ou métodos

Nossa proposta de valor é diferente das dos nossos

competidores?

Os clientes conseguem perceber a diferença?

Identificação e execução

de trade offs

Nossa locação de recursos reflete nossa

diferenciação?

Desenho de atividades

interligadas

Todas as decisões estratégicas são compatíveis?

Existe criação de valor as fornecer serviços

complementares?

A formulação da estratégia envolve cinco passos

Page 9: Amyris Colubre

Premissa 01: Só existe 1 pessoa

Page 10: Amyris Colubre

Premissa 02: É uma experiência de consumo

experiência

Catalizadores

Sentidos:

. Imagem

. Som

. Tato

. Gosto

Cognitivos:

. Conceitos

. Simbolos

.Cultura

Duração

. Iniciação

. Imersão

. Conclusão

. Continuação

Intensidade

. Hábitos

. Engajamento

Fôlego

. Produto

. Serviço

. Marcas (nomes)

. Canais/Ambientes

(espaços)

. Promoção

. Preço que está

disposto a pagar

Eu e o Outro - Significados

. O fato de conseguir/ter

. Status/Identidade

. Emoção/Estilo de vida

. Significado de pagar um

certo preço

. Função

Interação

. Passiva

. Ativa

. Interativa

Page 11: Amyris Colubre

Então, como criar

um bom e-commerce?

Page 12: Amyris Colubre

Copyright by Amyris Fernandez, 2008

Design

Guia de desenvolvimento de e-commerce

Negócios

Arquitetura

de Informação

Conteúdo

Tecnologia

Page 13: Amyris Colubre

Qualificação do Lead

Falha no Processo

Mensagem

Público-Alvo

Navegação

ruim

Serviços

Momentos cruciais do e-commerce

Comunicação

(banner, etc)

Landing

Page Processo (AI)

Pagamento

(logística)

Page 14: Amyris Colubre

O que está errado nesta peça publicitária?

Page 15: Amyris Colubre

O que está errado

nesta página?

Page 16: Amyris Colubre
Page 17: Amyris Colubre

O que está errado nesta vitrine?

Page 18: Amyris Colubre

O que está errado nesta página?

Page 19: Amyris Colubre
Page 20: Amyris Colubre
Page 21: Amyris Colubre
Page 22: Amyris Colubre
Page 23: Amyris Colubre

O que está errado?

Page 24: Amyris Colubre
Page 25: Amyris Colubre

Análise Heurística

(estruturada com números, nada de Jakob Nielsen)

Page 26: Amyris Colubre
Page 27: Amyris Colubre

Tecnologia

Arquitetura

de Informação

Conteúdo

Imagens

(fotos)

Texto

Som

Vídeo

Labels

Formas

Ícones

Fontes

(letras)

Navegação

(processo)

Navegação

(busca)

Cores

Diagramação

Rapidez da

Resposta

Confiabilidade

Modernidade

tecnológica

Robustez

Portabilidade

Ajudas

Negócios

Brand Diálogo com

consumidores

Design

Page 28: Amyris Colubre

• Só pergunte uma vez por uma determinada informação;

• Use o endereço de envio como endereço de cobrança por default;

• Indique sempre e antes de começar o processo de preenchimento

quais são os campos obrigatórios;

• Mostre exemplos de como preencher os campos;

• Valide os campos conforme são preenchidos;

• Use o CEP para pré-popular os campos endereço e cidade;

Regras: AI / Tecnologia

ENTRADA DE DADOS

Page 29: Amyris Colubre

• Os labels devem estar visíveis o tempo todo;

• Mostre a mudança de localização dentro de um processo através de

dicas visuais (cores, números, formas);

• Processos devem ser clicáveis e navegáveis;

• Títulos (e outras funções hierárquicas não clicáveis) devem indicar o

tempo todo que não são clicáveis;

• Imagens devem ser clicáveis;

• Pense em termos de acessibilidade e suas ferramentas e, por isso,

coloque descreva cada imagem em alt tag;

Regras: AI / Tecnologia

NAVEGAÇÃO

Page 30: Amyris Colubre

• Os campos devem estar alinhados um embaixo do outro, respeitando a

ordem de leitura do usuário;

• Deixe um campo para nome (chamar de “Nome”) e outro para

sobrenome (Chamar de “Último Sobrenome”);

• Se o pagamento for via cartão de crédito, apresentar os campos na

ordem do cartão;

• Evite o uso de Drop Down Menus, pois eles diminuem a velocidade de

preenchimento;

• Desabilite a função “colar” para o campo de validação de email;

• Nunca peça como obrigatório: RG, telefone fixo, nome do pai ou da

mãe;

Regras: AI / Tecnologia

ENTRADA DE DADOS

Page 31: Amyris Colubre

• O processo de check out deve ser linear;

• Destaque (mostre claramente) descontos e valores adicionais;

• Mostre o valor final o mais cedo possível no processo;

• Evite simuladores dissociados do carrinho (se simular, o valor deve ser

mostrado no carrinho);

• Permita comparação de atributos de produtos;

Regras: AI / Tecnologia

FLUXO

Page 32: Amyris Colubre

• Descreva os nomes dos links;

• Seja conciso nas descrições;

• Evite jargões técnicos;

• Nome de “endereço de envio” deve ser opcional;

• Erros devem conter mensagens simples, claras e conter instruções

para resolver o problema;

• Permita acesso a explicações (sem sair da página), para regras

particulares do seu negócio;

• Texto de finalização deve ser simples, claro e conter instruções que

diminuam receio de qualquer natureza;

Regras:

CONTEÚDO

Page 33: Amyris Colubre

• Crie estruturas claras e de fácil identificação;

• Todo conteúdo deve ser apresentado de forma hierarquizada;

• Use diferentes tamanhos de fontes para indicar hierarquia;

• Permita o controle de tamanho de fontes/visualização;

• Durante o pagamento coloque o mínino possível de novos elementos,

para evitar distrações;

Regras:

DESIGN

Page 34: Amyris Colubre

• Registro no site deve ser opcional, sempre que o modelo de negócio

permitir;

• Peça informações de registro somente quando o usuário estiver

motivado;

• Não dê demasiada importância ao cupom;

• Cross-selling deve existir, mas deve ser apresentado com cuidado para

não atrapalhar a venda;

Regras:

NEGÓCIOS

Page 35: Amyris Colubre

Análise de Relatórios de Servidor

Page 36: Amyris Colubre

Teste de Usabilidade (usamos Morae)

Page 37: Amyris Colubre
Page 38: Amyris Colubre
Page 39: Amyris Colubre
Page 40: Amyris Colubre
Page 41: Amyris Colubre
Page 42: Amyris Colubre

Arquitetura de Informação que pensa em arquitetura

de Sistemas e regras de negócios

CAMADAS NÍVEIS

Lógica do Negócio

Dados

Pagamento User/Admin Conteúdo

Módulos

{

{

apresentação servidor web

Page 43: Amyris Colubre

E PARA MOBILE??

Page 44: Amyris Colubre

Melhores Práticas

• Pense na necessidade, no desejo a ser satisfeito pelo aplicativo ou site;

• Considere o local ou locais onde o usuário vai realizar a tarefa;

• Pense no tipo de terminal que ele vai usar (mas pense em termos de marketing, OK?);

• Pense como esse aplicativo / site vai ser tão legal que nem vai precisar de propaganda...

Page 45: Amyris Colubre

•Simples

•Modular

•Login na hora certa

•Conteúdo Relevante

Page 46: Amyris Colubre

Best Practices

• Cenários de uso - aparelho, local, motivo

• Select versus type

• Consistência & menus

• Feedback deve ser visual e sonoro

• Uso de ícones e audicons

• Controle – cancelar e parar

• Uso de metáforas

• Gráficos clicáveis devem parecer clicáveis

Page 47: Amyris Colubre
Page 48: Amyris Colubre

E cada profissional verá o problema de um jeito

diferente e vai brigar pra ter razão

Page 49: Amyris Colubre
Page 50: Amyris Colubre
Page 51: Amyris Colubre

Amyris Fernandez

Profa. Dra.

[email protected]

celular: +55 11 98122.1723

skype/facebook: Amyris Fernandez

twitter: amyrisf