Oficina "Projetando Interações com Base Heurística" por Renato Rosa

Loading...

Flash Player 9 (or above) is needed to view presentations.
We have detected that you do not have it on your computer. To install it, go here.

0 comments

Post a comment

    Post a comment
    Embed Video
    Edit your comment Cancel

    10 Favorites

    Oficina "Projetando Interações com Base Heurística" por Renato Rosa - Presentation Transcript

    1.  
    2. Quem sou eu
      • Gerente de internet da BOX1824 – Consultoria em pesquisa de tendência de comportamento do consumidor jovem;
      • Consultor em usabilidade, AI e design de interação;
      • 10 anos de experiência em mídias digitais interativas;
      • Membro do Information Architecture Institute;
      • 3 vezes Presidente do Júri do Prêmio Internet Corporativa;
      • Jurado Webdesign International Festival – Webjam WIF 2006;
      • Jurado de Internet do 11° Salão da Propaganda ARP;
      • Palestrante 12º EWD – 2007;
      • Apoiador WUD 2007 e palestrante âncora do WUD 2006;
    3. Como vamos fazer a oficina
      • Entendendo um modelo mental
      • O que é heurística?
      • Conhecendo os 10 princípios heurísticos
      • Como identificar problemas de usabilidade
      • Composição da interface
      • Como o usuário enxerga a interface
    4.  
    5. 1. Conceituação de modelo mental Vamos começar com um elemento que todos conhecemos.
    6. 1. Conceituação de modelo mental Provavelmente a marioria das funções ou utilidades secundárias de uma escova envolvem o ato de escovar . Isso ocorre porque o modelo mental que temos de uma escova de dentes é escovar . Estamos presos nessa função.
    7. 1. Conceituação de modelo mental Isso é um modelo mental .
    8. 1. Conceituação de modelo mental Como seria um modelo mental de um carro?
    9. 1. Conceituação de modelo mental Como seria um modelo mental de um carro?
    10. 1. Conceituação de modelo mental Como seria um modelo mental de um site? Marca Buscar Navegação global Rodapé Navegação local Conteúdo
    11. “ Modelo mental é o nosso modelo conceitual particular da maneira como um objeto funciona, eventos acontecem ou pessoas se comportam, que resulta da nossa tendência de dar explicações para as coisas. ” Donald Norman - 1990 1. Conceituação de modelo mental
    12.  
    13. 2. O que é heurística? Isso está correto? Quem disse? Marca Buscar Navegação global Rodapé Navegação local Conteúdo
    14. 2. O que é heurística?
    15. 2. O que é heurística?
    16. 2. O que é heurística?
    17. 2. O que é heurística?
    18. 2. O que é heurística? Acaba virando regra! As técnicas heurísticas não asseguram as melhores soluções, mas somente soluções válidas, aproximadas; e freqüentemente não é possível justificar em termos estritamente lógico a validade do resultado.
    19. 2. O que é heurística? Por isso, temos 3 estratégias para a definição de problemas: 1. busca às cegas 2. busca heurística (baseada na experiência) 3. buscas racionais (usando um sistema forma de raciocínio).
    20. 2. O que é heurística?
    21. 3. Conhecendo os 10 princípios heurísticos Em 1990, Jakob Nielsen criou 10 regras de design de interação, chamadas de “Heurísticas”. Hoje elas são usadas como guias no desenvolvimento de produtos interativos. 1. Visibilidade do estado do sistema 2. Compatibilidade do sistema com o mundo real 3. Controle e liberdade do usuário 4. Consistência e padrões 5. Prevenção de erros 6. Reconhecimento ao invés de lembrança 7. Flexibilidade e eficiência de uso 8. Estética e design minimalista 9. Ajudar os usuários a reconhecer, diagnosticar e corrigir erros 10. Ajudas (Help) e documentação.
    22. 3. Conhecendo os 10 princípios heurísticos 1. Visibilidade do estado do sistema O sistema deve sempre manter os usuários informados sobre o que está acontecendo, através de comentários, dentro de um prazo razoável de tempo.
    23. 3. Conhecendo os 10 princípios heurísticos
    24. 3. Conhecendo os 10 princípios heurísticos
    25. 3. Conhecendo os 10 princípios heurísticos 2. Compatibilidade do sistema com o mundo real O sistema deve falar a língua do usuário, com palavras, frases e conceitos familiares. Siga as convenções do mundo real para que a informação pareça lógica e muito natural.
    26. 3. Conhecendo os 10 princípios heurísticos
    27. 3. Conhecendo os 10 princípios heurísticos 3. Controle e liberdade do usuário O usuário deve ter o controle de sua navegação. Ele escolhe o que vai acessar, quando e como. Todo o sistema deve ser sua saída, segunda escolha ou simplesmente a possibilidade de desfazer uma ação.
    28. 3. Conhecendo os 10 princípios heurísticos
    29. 3. Conhecendo os 10 princípios heurísticos 4. Consistência e padrões Em um mesmo site, tudo deve ser consistente. Tanto em design (branding) quanto em funcionalidade. O usuário não deve ter questionamentos sobre ações já executadas e repetidas.
    30. 3. Conhecendo os 10 princípios heurísticos
    31. 3. Conhecendo os 10 princípios heurísticos 5. Prevenção de erros Prever todas as maneiras e formatos de navegação ou manipulação de dados, com o objetivo de mapear eventuais erros.
    32. 3. Conhecendo os 10 princípios heurísticos
    33. 3. Conhecendo os 10 princípios heurísticos 6. Reconhecimento ao invés de lembrança Minimize a carga de memória do usuário, fazendo objetos, ações e opções visíveis. O usuário não deve ter que lembrar de todas as funcionalidades ou interações antes de cada clique.
    34. 3. Conhecendo os 10 princípios heurísticos
    35. 3. Conhecendo os 10 princípios heurísticos 7. Flexibilidade e eficiência de uso O sistema deve se adequar à usuários experientes ou inexperientes, deve permitir manipulações e formas diferentes e alternativas de se navegar.
    36. 3. Conhecendo os 10 princípios heurísticos 8. Estética e design minimalista As interfaces não devem conter informações que são irrelevantes ou raramente necessárias. Tudo, além do necessário, é ruído.
    37. 3. Conhecendo os 10 princípios heurísticos 9. Ajudar os usuários a reconhecer, diagnosticar e corrigir erros Melhor do que não ter erros, é informar o usuário onde ocorreu o erro, como ele ocorreu e como ele poderá corrigir ou contonar o erro.
    38. 3. Conhecendo os 10 princípios heurísticos 10. Ajudas (Help) e documentação. Fornecer um método de ajudar o usuário a navegar, através de recursos de ajuda e orientação.
    39. 3. Conhecendo os 10 princípios heurísticos
    40.  
    41. 4. Como identificar problemas de usabilidade
      • Onde eu estou: em que página eu me localizo, qual é o conteúdo disponível;
      • De onde eu vim: qual foi o meu caminho percorrido até aqui;
      • Onde eu posso ir: quais são as minhas opções de navegação e os recursos disponíveis a partir daqui.
      Devemos responder:
    42. 4. Como identificar problemas de usabilidade
      • Ideal: especialista duplo. Possui experiência nos processos e princípios de usabilidade, assim como métodos de avaliação;
      • Desejável: especialista em IHC;
      • Menos desejável: especialista no domínio de testes. Estuda princípios de interface e o processo de avaliação de sites;
      • Menos desejável ainda: membro da equipe de desenvolvimento. Tem dificuldade de deixar de lado seu papel de desenvolvedor.
      Quem deve avaliar uma interface?
    43. 4. Como identificar problemas de usabilidade
      • Fase de preparação: devemos definir onde será feita a avaliação: proposta de design (papel, protótipo ou ambiente definitivo), hipótese sobre os usuários ou cenário de tarefas;
      • Seções curtas (1 ou 2 horas) onde cada especialista:
        • Julga a conformidade de um determinado princípio de heurísticas (aspectos ou subaspectos);
        • Anota os problemas encontrados;
        • Julga a gravidade desses problemas;
        • Gera um relatório individual com comentários adicionais;
      Avaliação heurística
    44. 4. Como identificar problemas de usabilidade
      • Cosmético: poderia melhorar a satisfação subjetiva dos usuários;
      • “ Adorei essa página, mas se ela fosse rosinha seria muito mais bacana” – Panzinha, 16 anos, navegando no 8P.
      • 2. Baixa criticidade: correção desejável do problema, pois limita as opções de navegação do usuário;
      • “ Acho que tenho que ir por aqui agora, né?” – André, 31 anos, depois que encontrou a matéria que procurava no G1.
      • 3. Catastrófico: impede a utilização do ambiente;
      • “ Acho que agora deu” – Ricardo, no GloboEsporte, após 10 minutos de procura de uma determinada informação.
      Como se categorizam os problemas?
    45. 4. Como identificar problemas de usabilidade
      • Onde?
      • Um único local na interface;
      • Em dois locais na interface, casualmente;
      • Na estrutura geral da interface, de forma sistemática;
      • Algo que não está lá, que precisa ser incluído na interface.
      • Heurística violada
      • Explicação
      • Gravidade
      Problema encontrado
    46.  
    47. 5. Composição da interface Composição da interface
      • Conteúdo;
      • Conteúdo relacionado;
      • Navegação estrutural (zonas de salto);
      • Navegação relacionada;
      • Componentes de ação (botões, formulários, combos);
      • Componentes de orientação navegacional;
    48.  
    49.  
    50.  
    51.  
    52.  
    53.  
    54.  
    55.  
    56. 4. Como identificar problemas de usabilidade
      • Cosmético: poderia melhorar a satisfação subjetiva dos usuários;
      Como se categorizam os problemas?
    57. Consigo obter as 3 respostas para essa interface?
    58. Consigo obter as 3 respostas para essa interface?
    59. Consigo obter as 3 respostas para essa interface?
    60. Consigo obter as 3 respostas para essa interface?
    61.  
    62. 6. Como o usuário enxerga a interface Como o usuário enxerga a interface?
    63. 6. Como o usuário enxerga a interface Como o usuário enxerga a interface? Eye-tranking
    64. 6. Como o usuário enxerga a interface Como o usuário enxerga a interface? Eye-tranking
    65. 6. Como o usuário enxerga a interface Como o usuário enxerga a interface?
    66. 6. Como o usuário enxerga a interface Conclusões
      • Os usuários simplesmente filtram a publicidade descontextual;
      • Fotos vendem melhor o conteúdo;
      • A área conceitual, embora seja nobre, não é vista.
    67. 6. Como o usuário enxerga a interface
      • Os usuários possuem pouca paciência para a leitura;
    68. 6. Como o usuário enxerga a interface Existem diferenças entre usuários
    69. 6. Como o usuário enxerga a interface Mulher Homem
    70. 6. Como o usuário enxerga a interface Cuidados que devemos ter no desenho de interfaces
      • Os usuários usam a rolagem. Menos os perdidos;
      • Estudo de limitações dos usuários: 3Ps
        • Peso (lógico)
        • Performance (renderização)
        • Proximidade (linguagem, simbologia, metáforas)
      • Tudo deve ter rótulo;
      • Prever todas as possíveis interações;
      • Prever erros do sistema;
      • O usuário é a sua mãe, seu pai ou o tio que não entende nada;
    71. 7. Estudo de caso – atividade prática Obrigado :-) Renato Rosa [email_address] [email_address] +55 51 9335.3208

    + wudrswudrs, 3 years ago

    custom

    2272 views, 10 favs, 0 embeds more stats

    Slides da Oficina do Renato Rosa no WUD RS 2007 (Wo more

    More info about this document

    © All Rights Reserved

    Go to text version

    • Total Views 2272
      • 2272 on SlideShare
      • 0 from embeds
    • Comments 0
    • Favorites 10
    • Downloads 0
    Most viewed embeds

    more

    All embeds

    less

    Flagged as inappropriate Flag as inappropriate
    Flag as inappropriate

    Select your reason for flagging this presentation as inappropriate. If needed, use the feedback form to let us know more details.

    Cancel
    File a copyright complaint
    Having problems? Go to our helpdesk?

    Categories