SlideShare ist ein Scribd-Unternehmen logo
1 von 70
Oficina de Capacitação   – 24 de janeiro de 2008  Usabilidade e Experiência do Usuário Faça da usabilidade um diferencial competitivo em seu negócio digital
Ricardo Lima – ricardolimaprojetos@gmail.com Gerenciando um projeto de usabilidade: como obter resultados satisfatórios Usabilidade e Experiência do Usuário
A Usabilidade está por todo lado ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Definição de Usabilidade ,[object Object]
Profissional de Usabilidade Usabilidade Como é o produto. O que ele faz. Qual o público. Políticas Internas. Áreas envolvidas nas  decisões O que o cliente espera Qual o objetivo do cliente ao consumir o produto. Empresa Produto Clientes
A Usabilidade e o foco no usuário ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
A Usabilidade e o foco no usuário ,[object Object]
A Usabilidade e o foco no usuário ,[object Object]
Projetos focados em Usabilidade ,[object Object],Pesquisa, Benchmarking Usabilidade Conteúdo Principal Seções Arquitetura de Informação /  Navegação Design
Projetos focados em Usabilidade – Visão Macro ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
CASE 1 - Asset Management ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
CASE 1 - Asset Management ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
CASE 1 - Asset Management Clientes reclamavam da dificuldade para conseguir ler o conteúdo dentro das caixas. Não sabiam que os itens eram propagandas.
CASE 1 - Asset Management Espaço reduzido para leitura e scroll em JavaScript incomodavam (“conteúdo preso!”) “ Menu está apagado!” / “Não parece Menu”
CASE 1 - Asset Management Apesar da inserção do homem, a A.I não foi bem aceita. Utilização de Highlight ajudou pouco
CASE 1 - Asset Management 1 2 3 1. Novo menu horizontal 2. Propagandas maiores com imagens claras 3. Exibição de notícias atualizadas pela área
CASE 1 - Asset Management 1 1 1 1. Distinção de fundos pela cor (Benchmarking + sugestão de clientes)
CASE 1 - Asset Management 1 1. Texto “livre”, com possibilidade de impressão 2. Subseções dentro da seção, durante toda a navegação 3. Fale Conosco (dúvidas de investimentos + Treinamento central atendimento) 2 3
CASE 1 - Asset Management 1. Rentabilidade no período (aumento da fonte/cliente com calculadora) 1
CASE 2 – Pequenas Empresas ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
CASE 2 – Pequenas Empresas ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
CASE 2 – Pequenas Empresas ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
CASE 2 – Pequenas Empresas 1. Novo menu horizontal 2. Uma única propaganda, maior, focando determinado produto/serviço 3. Oferecimento de produtos/serviços secundários 1 2 3
CASE 2 – Pequenas Empresas 1. Seções destacadas sempre ao lado esquerdo 2. Textos menores e focados na venda/contratação direta pela internet 1 2
CASE 2 – Pequenas Empresas 1. Menu horizontal com mesmas opções institucionais 2. Seções e Sub-Seções abertas (Master e Usuários) 3. Propaganda focada 4. Dicas/Você sabia? 5. Maximizar – Ajuda integrada (para cada serviço) 1 2 3 4 5
CASE 2 – Pequenas Empresas 1. Exemplo de tela maximizada (Pagamentos, Cobrança, Recebimentos etc.) 2. Opção de Minimizar 1 2
CASE 2 – Pequenas Empresas ,[object Object]
CASE 2 – Pequenas Empresas ,[object Object]
CASE 2 – Pequenas Empresas ,[object Object]
CASE 2 – Pequenas Empresas ,[object Object]
CASE 2 – Pequenas Empresas ,[object Object]
CASE 2 – Pequenas Empresas ,[object Object]
CASE 3 – Corretora de Ações ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
CASE 3 – Corretora de Ações ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
CASE 3 – Corretora de Ações
CASE 3 – Corretora de Ações
CASE 3 – Corretora de Ações
CASE 3 – Corretora de Ações
CASE 3 – Corretora de Ações 1. Menu horizontal 2. Acesso direto, sem precisar acessar a conta pessoa física 3. Propagandas com foco no mercado 4. Perdendo o foco... 5. Painel de Cotações rápido 6. Resultados de Ofertas Públicas, Calendário e afins 1 2 3 4 5 6
CASE 3 – Corretora de Ações
CASE 3 – Corretora de Ações
CASE 3 – Corretora de Ações
CASE 3 – Corretora de Ações 1. Informações em tempo real sobre qualquer papel 2. Cotações e Índices atualizados 3. Busca por código ou empresa 4. Maiores Altas (com atalho de compra) 5. Maiores Baixas (com atalho de compra) 1 2 3 4 5
CASE 2 – Pequenas Empresas ,[object Object],[object Object],[object Object],[object Object],[object Object]
CASE 3 – Corretora de Ações
CASE 3 – Corretora de Ações 1. Cabeçalho, seguindo linha institucional 2. Itens explicados dentro de cada subseção 3. Sem distinção por empresa prestadora de informação 1 2 3
CASE 3 – Corretora de Ações
CASE 3 – Corretora de Ações
CASE 3 – Corretora de Ações
CASE 3 – Corretora de Ações 1. Renovação de cabeçalho, focando em contas e cotação “sempre à mão” 2. Alterações “sutis” de cores, fontes e estilo  1 2
CASE 3 – Corretora de Ações
CASE 3 – Corretora de Ações ... cores, fontes e estilo...
CASE 3 – Corretora de Ações
CASE 3 – Corretora de Ações
CASE 3 – Corretora de Ações Seguindo preceitos básicos da Web 2.0, porém, de uma maneira diferente...
CASE 3 – Corretora de Ações ,[object Object],[object Object],[object Object],[object Object],[object Object]
Usabilidade – Outras Informações ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Usabilidade – Outras Informações ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Usabilidade – Outras Informações ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Usabilidade – Outras Informações ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Usabilidade – Outras Informações ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Usabilidade – Outras Informações ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Banner mais eficiente = o que vende mais!
Usabilidade – Outras Informações ,[object Object],[object Object],[object Object],[object Object],[object Object],Com  crédito pré-aprovado Sem  crédito pré-aprovado Banner/Cliente PRODUTO GERENTE
Usabilidade – Microsoft Surface
Usabilidade – Microsoft Surface
Usabilidade – Amazon Kindle ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Links ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Contatos profissionais e pessoais ,[object Object],[object Object],[object Object]
Dúvidas? Ricardo Lima – ricardolimaprojetos@gmail.com
Obrigado! Ricardo Lima – ricardolimaprojetos@gmail.com

Weitere ähnliche Inhalte

Andere mochten auch

Testes de usabilidade para otimizar a experiência do usuário
Testes de usabilidade para otimizar a experiência do usuárioTestes de usabilidade para otimizar a experiência do usuário
Testes de usabilidade para otimizar a experiência do usuárioGlauber Lænder
 
Design para o Comportamento
Design para o ComportamentoDesign para o Comportamento
Design para o ComportamentoCogIgnition
 
Usabilidade e Experiencia do Usuario
Usabilidade e Experiencia do UsuarioUsabilidade e Experiencia do Usuario
Usabilidade e Experiencia do UsuarioGustavo Gil
 
Teste de usabilidade - Ferramentas online para testes
Teste de usabilidade - Ferramentas online para testesTeste de usabilidade - Ferramentas online para testes
Teste de usabilidade - Ferramentas online para testesLuiz Agner
 
Design de Interação, Experiência do Usuário e Usabilidade - 2010
Design de Interação, Experiência do Usuário e Usabilidade - 2010Design de Interação, Experiência do Usuário e Usabilidade - 2010
Design de Interação, Experiência do Usuário e Usabilidade - 2010Mourylise Heymer
 
UX para agências de publicidade
UX para agências de publicidadeUX para agências de publicidade
UX para agências de publicidadeRichard Jesus
 

Andere mochten auch (6)

Testes de usabilidade para otimizar a experiência do usuário
Testes de usabilidade para otimizar a experiência do usuárioTestes de usabilidade para otimizar a experiência do usuário
Testes de usabilidade para otimizar a experiência do usuário
 
Design para o Comportamento
Design para o ComportamentoDesign para o Comportamento
Design para o Comportamento
 
Usabilidade e Experiencia do Usuario
Usabilidade e Experiencia do UsuarioUsabilidade e Experiencia do Usuario
Usabilidade e Experiencia do Usuario
 
Teste de usabilidade - Ferramentas online para testes
Teste de usabilidade - Ferramentas online para testesTeste de usabilidade - Ferramentas online para testes
Teste de usabilidade - Ferramentas online para testes
 
Design de Interação, Experiência do Usuário e Usabilidade - 2010
Design de Interação, Experiência do Usuário e Usabilidade - 2010Design de Interação, Experiência do Usuário e Usabilidade - 2010
Design de Interação, Experiência do Usuário e Usabilidade - 2010
 
UX para agências de publicidade
UX para agências de publicidadeUX para agências de publicidade
UX para agências de publicidade
 

Ähnlich wie Usabilidade em projetos digitais

Palestra Jump
Palestra JumpPalestra Jump
Palestra Jumpluribeiro
 
Trabalho : Apresentação de layout de website para rede de eletrôdomésticos
Trabalho : Apresentação de layout de website para rede de eletrôdomésticosTrabalho : Apresentação de layout de website para rede de eletrôdomésticos
Trabalho : Apresentação de layout de website para rede de eletrôdomésticosHenrique Coutinho Teixeira
 
Textile CRM Strategy
Textile CRM StrategyTextile CRM Strategy
Textile CRM Strategykrajnc_alves
 
Portais Corporativos - Planejamento e Levantamento de Necessidades
Portais Corporativos - Planejamento e Levantamento de NecessidadesPortais Corporativos - Planejamento e Levantamento de Necessidades
Portais Corporativos - Planejamento e Levantamento de NecessidadesThiago Macedo
 
Brochura ud121 e-business
Brochura ud121 e-businessBrochura ud121 e-business
Brochura ud121 e-businessAmplitude Net
 
Desenvolvimento Web centrado no usuário
Desenvolvimento Web centrado no usuárioDesenvolvimento Web centrado no usuário
Desenvolvimento Web centrado no usuáriowebsemlimites
 
6 estratégias de comunicação na web 20
6  estratégias de comunicação na web 206  estratégias de comunicação na web 20
6 estratégias de comunicação na web 20Vera Carlos
 
7 Passos para um e-Commerce de Sucesso
7 Passos para um e-Commerce de Sucesso7 Passos para um e-Commerce de Sucesso
7 Passos para um e-Commerce de SucessoAndre Lucena
 
Apresentação UNIQUEDB b2c
Apresentação UNIQUEDB b2cApresentação UNIQUEDB b2c
Apresentação UNIQUEDB b2cBruno Porto
 
Fórum E-Commerce Brasil 2023 | Design de organizações de tecnologia - a estru...
Fórum E-Commerce Brasil 2023 | Design de organizações de tecnologia - a estru...Fórum E-Commerce Brasil 2023 | Design de organizações de tecnologia - a estru...
Fórum E-Commerce Brasil 2023 | Design de organizações de tecnologia - a estru...E-Commerce Brasil
 
Lean startup - Agile Brazil 2011
Lean startup - Agile Brazil 2011Lean startup - Agile Brazil 2011
Lean startup - Agile Brazil 2011Webgoal
 
Palestra Model Canvas
Palestra Model Canvas Palestra Model Canvas
Palestra Model Canvas Weber Rangel
 
7 Dicas para um e-commerce de sucesso
7 Dicas para um e-commerce de sucesso7 Dicas para um e-commerce de sucesso
7 Dicas para um e-commerce de sucessoAndre Lucena
 
Web SemâNtica, Erp, Crm, Bi E Bpm
Web SemâNtica, Erp, Crm, Bi E BpmWeb SemâNtica, Erp, Crm, Bi E Bpm
Web SemâNtica, Erp, Crm, Bi E Bpmodlegio2
 
Arquitetura de Informação: Projeto TIM
Arquitetura de Informação: Projeto TIMArquitetura de Informação: Projeto TIM
Arquitetura de Informação: Projeto TIMLuiz Agner
 
O futuro do mercado de mídia no Brasil | Evento F5
O futuro do mercado de mídia no Brasil | Evento F5 O futuro do mercado de mídia no Brasil | Evento F5
O futuro do mercado de mídia no Brasil | Evento F5 IAB Brasil
 
Gestão de Frota com Microsoft Dynamics
Gestão de Frota com Microsoft DynamicsGestão de Frota com Microsoft Dynamics
Gestão de Frota com Microsoft DynamicsFabio Bonifacio
 
Analise de SWOT - Parte 2
Analise de SWOT - Parte 2Analise de SWOT - Parte 2
Analise de SWOT - Parte 2Wilson Souza
 

Ähnlich wie Usabilidade em projetos digitais (20)

Palestra Jump
Palestra JumpPalestra Jump
Palestra Jump
 
Trabalho : Apresentação de layout de website para rede de eletrôdomésticos
Trabalho : Apresentação de layout de website para rede de eletrôdomésticosTrabalho : Apresentação de layout de website para rede de eletrôdomésticos
Trabalho : Apresentação de layout de website para rede de eletrôdomésticos
 
Textile CRM Strategy
Textile CRM StrategyTextile CRM Strategy
Textile CRM Strategy
 
Portais Corporativos - Planejamento e Levantamento de Necessidades
Portais Corporativos - Planejamento e Levantamento de NecessidadesPortais Corporativos - Planejamento e Levantamento de Necessidades
Portais Corporativos - Planejamento e Levantamento de Necessidades
 
Brochura ud121 e-business
Brochura ud121 e-businessBrochura ud121 e-business
Brochura ud121 e-business
 
Desenvolvimento Web centrado no usuário
Desenvolvimento Web centrado no usuárioDesenvolvimento Web centrado no usuário
Desenvolvimento Web centrado no usuário
 
6 estratégias de comunicação na web 20
6  estratégias de comunicação na web 206  estratégias de comunicação na web 20
6 estratégias de comunicação na web 20
 
7 Passos para um e-Commerce de Sucesso
7 Passos para um e-Commerce de Sucesso7 Passos para um e-Commerce de Sucesso
7 Passos para um e-Commerce de Sucesso
 
Apresentação UNIQUEDB b2c
Apresentação UNIQUEDB b2cApresentação UNIQUEDB b2c
Apresentação UNIQUEDB b2c
 
Fórum E-Commerce Brasil 2023 | Design de organizações de tecnologia - a estru...
Fórum E-Commerce Brasil 2023 | Design de organizações de tecnologia - a estru...Fórum E-Commerce Brasil 2023 | Design de organizações de tecnologia - a estru...
Fórum E-Commerce Brasil 2023 | Design de organizações de tecnologia - a estru...
 
Ecommerce Sun Special 06 2011
Ecommerce Sun Special 06 2011Ecommerce Sun Special 06 2011
Ecommerce Sun Special 06 2011
 
Lean startup - Agile Brazil 2011
Lean startup - Agile Brazil 2011Lean startup - Agile Brazil 2011
Lean startup - Agile Brazil 2011
 
Mauricio Dias Galilei - 2016
Mauricio Dias Galilei - 2016Mauricio Dias Galilei - 2016
Mauricio Dias Galilei - 2016
 
Palestra Model Canvas
Palestra Model Canvas Palestra Model Canvas
Palestra Model Canvas
 
7 Dicas para um e-commerce de sucesso
7 Dicas para um e-commerce de sucesso7 Dicas para um e-commerce de sucesso
7 Dicas para um e-commerce de sucesso
 
Web SemâNtica, Erp, Crm, Bi E Bpm
Web SemâNtica, Erp, Crm, Bi E BpmWeb SemâNtica, Erp, Crm, Bi E Bpm
Web SemâNtica, Erp, Crm, Bi E Bpm
 
Arquitetura de Informação: Projeto TIM
Arquitetura de Informação: Projeto TIMArquitetura de Informação: Projeto TIM
Arquitetura de Informação: Projeto TIM
 
O futuro do mercado de mídia no Brasil | Evento F5
O futuro do mercado de mídia no Brasil | Evento F5 O futuro do mercado de mídia no Brasil | Evento F5
O futuro do mercado de mídia no Brasil | Evento F5
 
Gestão de Frota com Microsoft Dynamics
Gestão de Frota com Microsoft DynamicsGestão de Frota com Microsoft Dynamics
Gestão de Frota com Microsoft Dynamics
 
Analise de SWOT - Parte 2
Analise de SWOT - Parte 2Analise de SWOT - Parte 2
Analise de SWOT - Parte 2
 

Usabilidade em projetos digitais

  • 1. Oficina de Capacitação – 24 de janeiro de 2008 Usabilidade e Experiência do Usuário Faça da usabilidade um diferencial competitivo em seu negócio digital
  • 2. Ricardo Lima – ricardolimaprojetos@gmail.com Gerenciando um projeto de usabilidade: como obter resultados satisfatórios Usabilidade e Experiência do Usuário
  • 3.
  • 4.
  • 5. Profissional de Usabilidade Usabilidade Como é o produto. O que ele faz. Qual o público. Políticas Internas. Áreas envolvidas nas decisões O que o cliente espera Qual o objetivo do cliente ao consumir o produto. Empresa Produto Clientes
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13. CASE 1 - Asset Management Clientes reclamavam da dificuldade para conseguir ler o conteúdo dentro das caixas. Não sabiam que os itens eram propagandas.
  • 14. CASE 1 - Asset Management Espaço reduzido para leitura e scroll em JavaScript incomodavam (“conteúdo preso!”) “ Menu está apagado!” / “Não parece Menu”
  • 15. CASE 1 - Asset Management Apesar da inserção do homem, a A.I não foi bem aceita. Utilização de Highlight ajudou pouco
  • 16. CASE 1 - Asset Management 1 2 3 1. Novo menu horizontal 2. Propagandas maiores com imagens claras 3. Exibição de notícias atualizadas pela área
  • 17. CASE 1 - Asset Management 1 1 1 1. Distinção de fundos pela cor (Benchmarking + sugestão de clientes)
  • 18. CASE 1 - Asset Management 1 1. Texto “livre”, com possibilidade de impressão 2. Subseções dentro da seção, durante toda a navegação 3. Fale Conosco (dúvidas de investimentos + Treinamento central atendimento) 2 3
  • 19. CASE 1 - Asset Management 1. Rentabilidade no período (aumento da fonte/cliente com calculadora) 1
  • 20.
  • 21.
  • 22.
  • 23. CASE 2 – Pequenas Empresas 1. Novo menu horizontal 2. Uma única propaganda, maior, focando determinado produto/serviço 3. Oferecimento de produtos/serviços secundários 1 2 3
  • 24. CASE 2 – Pequenas Empresas 1. Seções destacadas sempre ao lado esquerdo 2. Textos menores e focados na venda/contratação direta pela internet 1 2
  • 25. CASE 2 – Pequenas Empresas 1. Menu horizontal com mesmas opções institucionais 2. Seções e Sub-Seções abertas (Master e Usuários) 3. Propaganda focada 4. Dicas/Você sabia? 5. Maximizar – Ajuda integrada (para cada serviço) 1 2 3 4 5
  • 26. CASE 2 – Pequenas Empresas 1. Exemplo de tela maximizada (Pagamentos, Cobrança, Recebimentos etc.) 2. Opção de Minimizar 1 2
  • 27.
  • 28.
  • 29.
  • 30.
  • 31.
  • 32.
  • 33.
  • 34.
  • 35. CASE 3 – Corretora de Ações
  • 36. CASE 3 – Corretora de Ações
  • 37. CASE 3 – Corretora de Ações
  • 38. CASE 3 – Corretora de Ações
  • 39. CASE 3 – Corretora de Ações 1. Menu horizontal 2. Acesso direto, sem precisar acessar a conta pessoa física 3. Propagandas com foco no mercado 4. Perdendo o foco... 5. Painel de Cotações rápido 6. Resultados de Ofertas Públicas, Calendário e afins 1 2 3 4 5 6
  • 40. CASE 3 – Corretora de Ações
  • 41. CASE 3 – Corretora de Ações
  • 42. CASE 3 – Corretora de Ações
  • 43. CASE 3 – Corretora de Ações 1. Informações em tempo real sobre qualquer papel 2. Cotações e Índices atualizados 3. Busca por código ou empresa 4. Maiores Altas (com atalho de compra) 5. Maiores Baixas (com atalho de compra) 1 2 3 4 5
  • 44.
  • 45. CASE 3 – Corretora de Ações
  • 46. CASE 3 – Corretora de Ações 1. Cabeçalho, seguindo linha institucional 2. Itens explicados dentro de cada subseção 3. Sem distinção por empresa prestadora de informação 1 2 3
  • 47. CASE 3 – Corretora de Ações
  • 48. CASE 3 – Corretora de Ações
  • 49. CASE 3 – Corretora de Ações
  • 50. CASE 3 – Corretora de Ações 1. Renovação de cabeçalho, focando em contas e cotação “sempre à mão” 2. Alterações “sutis” de cores, fontes e estilo 1 2
  • 51. CASE 3 – Corretora de Ações
  • 52. CASE 3 – Corretora de Ações ... cores, fontes e estilo...
  • 53. CASE 3 – Corretora de Ações
  • 54. CASE 3 – Corretora de Ações
  • 55. CASE 3 – Corretora de Ações Seguindo preceitos básicos da Web 2.0, porém, de uma maneira diferente...
  • 56.
  • 57.
  • 58.
  • 59.
  • 60.
  • 61.
  • 62.
  • 63.
  • 66.
  • 67.
  • 68.
  • 69. Dúvidas? Ricardo Lima – ricardolimaprojetos@gmail.com
  • 70. Obrigado! Ricardo Lima – ricardolimaprojetos@gmail.com