O documento discute princípios de usabilidade em design de interfaces, como visibilidade, feedback, restrições, mapeamento e affordance. Também aborda testes de usabilidade, como realizar testes com usuários, analisar os resultados e melhorar o produto de acordo com o feedback recebido.

1. Curso Avançado Quantos produtos interativos existem em nossas vidas? (Pense um instante)

2. Curso Avançado Produtos de todo o dia Aparelhos celulares, players de música, DVDs, calculadoras, computadores....

3. Curso Avançado Dificuldades de todo dia Quando algum produto deixou você na mão ? Qual deles não são assim tão fáceis de usar?

4. Curso Avançado Atividades Simples Algumas coisas corriqueiras as vezes são complicadas . Em um elevador qual botão te leva para o primeiro andar? O “T” o “P”o “ZERO” ou o “1” ?

5. Curso Avançado Facilitando o Dia-a-Dia Um grande shopping center, abortou os números e letras, adotou frutas para fazer a relação entre andares. Nesse caso, a imagem da fruta foi utilizada para auxiliar a memória.

6. Curso Avançado Memória Visual É a comunicação que vem pelos olhos e é responsável por cerca de 75% do que se grava na memória. A comunicação através da memória visual pode ser captada por quatro formas diferentes. MEMÓRIA ESCRITA GRÁFICA COMUNICAÇÃO VISUAL AUDIO VISUAL

7. Curso Avançado Memória Escrita É a comunicação que vem através de um documento escrito, em papel ou em tela. MEMÓRIA ESCRITA GRÁFICA COMUNICAÇÃO VISUAL AUDIO VISUAL

8. Curso Avançado Memória Gráfica É a comunicação que vem através de símbolos, desenhos, plantas, diagramas, ícones, fotos ou outros recursos gráficos isoladamente. É o caso da maioria das placas de trânsito, onde um único símbolo tenta traduzir o que a placa representa, de forma rápida e eficaz. MEMÓRIA ESCRITA GRÁFICA COMUNICAÇÃO VISUAL AUDIO VISUAL

9. Curso Avançado Comunicação Visual É a comunicação que vem da junção da comunicação gráfica com a escrita, onde um símbolo, desenho, etc., vem acompanhado de palavras-chave ou textos que complementam o símbolo, desenho, etc. Usando o mesmo exemplo de placas de trânsito, há uma placa que significa "cuidado, pista derrapante" mas que pode vir acompanhado da expressão "Em dias de chuva". MEMÓRIA ESCRITA GRÁFICA COMUNICAÇÃO VISUAL AUDIO VISUAL

10. Curso Avançado Memória Áudio Visual Junta a Comunicação Visual com a auditiva. É considerada a mais eficiente de todas. O dispositivo cognitivo do cérebro ativa os dois principais sentidos, chegando a um índice de cerca de 84% de eficiência. MEMÓRIA ESCRITA GRÁFICA COMUNICAÇÃO VISUAL AUDIO VISUAL

11. Curso Avançado O que faz um bom design? Produtos utilizáveis, fáceis de aprender, eficazes e que proporcionam uma experiência agradável.

12. Curso Avançado O que faz um mau design? Produtos irritantes, confusos, ineficientes, com muitos passos, difíceis de usar, não óbvios e que podem induzir o usuário ao erro.

13. Curso Avançado Onde entra a Usabilidade? As boas práticas de usabilidade devem otimizar as interações com sistemas, de forma que a execução de uma atividade seja quase intuitiva, ajudando as pessoas.

14. Curso Avançado Metas e Objetivos As três principais metas de usabilidade são eficiência , memorização e aprendizado . Eficiência Aprendizado Memorização

15. Curso Avançado Metas de Eficiência Qual o grau de dificuldade que os seus clientes encontram para comprar em seu site ?

16. Curso Avançado Metas de eficácia Usando o exemplo de comércio eletrônico, as perguntas seriam: Qual é a taxa de conversão? (do total de visitas, quantas pessoas efetivamente concluem uma transação)? Qual a taxa de abandono de carrinho? (do total de itens incluídos no carrinho, quantos são abandonados no decorrer do processo)?

17. Curso Avançado Metas de Aprendizado Quanto tempo os seus usuários demoram para aprender a interagir com o seu website?

18. Curso Avançado Metas de Aprendizado O seu site é auto-explicativo? Existe alguma área que estimule o aprendizado sobre a utilização do seu produto ?

19. Curso Avançado Metas de Aprendizado Usando o exemplo de comércio eletrônico, as perguntas seriam: Qual o tempo médio que as pessoas gastam para finalizar um pedido?

20. Curso Avançado Metas de Memorização Depois que os seus clientes entram no seu site, eles conseguem lembrar como executaram uma tarefa?

21. Curso Avançado Metas de Memorização A memorização pode se tornar um índice de fidelização de clientes, após eles conseguirem concluir uma tarefa de maneira agradável, certamente irão retornar. Perguntas O seu site utiliza ícones para facilitar a memória visual?

22. Curso Avançado O que são Ícones? Ícone é uma imagem que mantém uma relação de semelhança ou propriedade com um determinando objeto. Um ícone é uma abstração de algo que é do nosso conhecimento e apresenta pelo menos um traço em comum com o objeto representado.

23. Curso Avançado Princípios sobre design Antes de entender mais sobre usabilidade, é necessário entender alguns princípios do design. São eles: Visibilidade Feedback Restrições Mapeamento Consistência Affordance

24. Curso Avançado Visibilidade Quanto mais visível for algo mais os usuários vão saber como proceder .

25. Curso Avançado FeedBack Após uma ação, existe a resposta visual do sistema. Ao pressionar o acelerador, o ponteiro de velocidade se altera.

26. Curso Avançado Restrições Delimita o tipo de interação que pode ocorrer em determinado momento, ou seja, o que o usuário pode ou não fazer.

27. Curso Avançado Mapeamentos Relação entre controle e seus efeitos no mundo, geralmente seguindo alguma convenção. Como por exemplo, os ícones que representam as funções de pause, play e eject de um sistema de som.

28. Curso Avançado Consistência Manter padrões de interface para as operações semelhantes facilita o aprendizado e a memorização e proporciona segurança para o usuário

29. Curso Avançado Affordance Um objeto deve sugerir a ação que deve ser tomada, um botão deve pedir para ser clicado.

30. Curso Avançado Analisando sites Com os conceitos de necessidade , memorização e os princípios de design , é possível analisar se determinado site ou produto atende à essas questões básicas de usabilidade

31. Curso Avançado

32. Curso Avançado O ícone aproxima todas as funções relacionadas a personalização, facilitando a memorização e mantendo a consistência .

33. Curso Avançado a seta sugere que algo ocorrerá após uma ação do mouse. Isso é sinalização com FeedBack.

34. Curso Avançado

35. Curso Avançado

36. Curso Avançado A área “aprenda sobre” é muito importante para o aprendizado dos novos usuários

37. Curso Avançado A visibilidade das principais funções do site induzem o usuário a navegar corretamente.

38. Curso Avançado

39. Curso Avançado o mapeamento é a convenção das funções, nesse caso o player interativo, se aproxima das funções dos players mais tradicionais.

40. Curso Avançado

41. Curso Avançado A distância entre a área do clique e o FeedBack do site podem dificultar o entendimento do usuário

42. Curso Avançado Por não haver uma restrição coerente, o usuário pode cometer erros, como escolher a data de volta, anterior a data de ida.

43. Curso Avançado

44. Curso Avançado Sem Affordance o usuário não percebe que um item sugere uma ação.

45. Curso Avançado Criando protótipos Antes de começar a fazer um site é feito um “ wireframe ” funcional, que nada mais é que um protótipo do produto final, remetendo a definição de toda a arquitetura de informação .

46. Curso Avançado

47. Curso Avançado

48. Curso Avançado Como testar? Para conseguir melhores índices de satisfação do usuário final, o website deve ser testado. E para cada objetivo existe um método.

49. Curso Avançado Definição do Público A seleção de pessoas que contemplem a abrangência do público-alvo do produto é crucial para obter uma amostragem satisfatória. Alguns deles são: Faixa salarial Idade Ocupação

50. Curso Avançado Tarefas do Teste Para o teste de usabilidade algumas tarefas são definidas para que o público do site avalie o produto na prática. As tarefas devem: Testar as ações cruciais do teste Colocar o usuário em situação de dificuldade Estimular que o usuário recorra ao auxilio do próprio site

51. Curso Avançado Avaliação de Amostragem É possível testar um protótipo através de uma pequena amostragem.

52. Curso Avançado O teste é realizado em uma sala de teste onde 4 a 6 pessoas executam uma lista de tarefas pré-definidas . A partir daí é possível tirar conclusões sobre os pontos fortes e os pontos fracos de um produto.

53. Curso Avançado A sala de testes geralmente é dividida em duas áreas. De um lado ficam o usuário e o avaliador . O avaliador é quem conduz as tarefas sem dar nenhum suporte as possíveis dificuldades do usuário.

54. Curso Avançado Do outro lado ficam os projetistas do produto, que fazem suas pré-considerações sobre o que deve ser mantido , deletado ou aperfeiçoado .

55. Curso Avançado Eyetracking / Mapa de Calor O desenvolvimento de tarefas também pode ser monitorado pelo comportamento do olhar .

56. Curso Avançado Com o eyetracking é possível analisar os caminhos mais freqüentes percorridos pelo olho do usuário. Essa informação permite aos projetistas re-organizar informações importantes de um site.

57. Curso Avançado Card Sorting Categorizar o site é uma tarefa complexa. Utilizar o usuário no processo de classificação pode reduzir o ruído de entendimento.

58. Curso Avançado Um aspirador de pó é um eletrodoméstico ou um eletro portátil?

59. Curso Avançado Avaliando os Resultados Após testar um site / protótipo alguns pontos devem ser levados em consideração. Percentual de acertos das tarefas Número de passos para cada tarefa Tempo despendido em cada tarefa Números de cliques por tarefa

60. Curso Avançado Teste de Comparação e Validação Após a avaliação do primeiro teste e levar em consideração os feedbacks dos usuários, é importante fazer um segundo teste, com o objetivo de comparar e validar os resultados.

61. Curso Avançado Relatório de Satisfação Após a conclusão dos testes, é realizado um relatório constando todas as métricas de avaliação , considerando todos os indicadores, incluindo a comparação entre o teste inicial e a validação .

62. Curso Avançado Dicas Um conjunto de dicas que melhoram consideravelmente o desempenho de web sites.

63. Curso Avançado Onde estou, para onde vou? É importante informar ao usuário exatamente aonde ele está situado dentro de um processo.

64. Curso Avançado Links devem parecer links

65. Curso Avançado Sem Saída Não deixe o seu usuário sem saída. Se ele cometer algum erro, deixe alguma área de escape para ele retornar ou tentar novamente.

66. Curso Avançado Boas Vindas Se for possível, disponha de uma área para os navegantes de primeira viagem em seu website.

67. Curso Avançado Aproxime as Informações Estruture a interface aproximando as informações em grupo.

68. Curso Avançado Menos é Mais Evite a tentação do excesso.

69. Curso Avançado Formulários Curtos Evite formulários longos. Já somos obrigados a preencher tanta coisa, seja sintético nos formulários de cadastro.

70. Curso Avançado Induza ao Acerto Auto-complete é um recurso que induz o usuário a tomar o caminho certo.

71. Curso Avançado Usabilidade e Design de Interação para construir marcas. É possível fazer da usabilidade um diferencial competitivo?

72. Curso Avançado A apple fez

73. Curso Avançado Extrapolar a Interatividade Toca, escuta e vê

74. Curso Avançado Para cada ocasião um produto Em casa, na academia, no trabalho, qual é o melhor?

75. Curso Avançado Menos é mais Uma vida com muito menos fios.

76. Curso Avançado A amazon fez.

77. Curso Avançado Uma Década Simplificando. A amazon é a maior varejista on-line do mundo. O foco no usuário fez com que a navegação do seu site acompanhasse a evolução do seu sortimento.

78. Curso Avançado 1998 Tudo começou com livros, e logo foi necessário adaptar as abas para suportar outras categorias como, música, vídeos e presentes.

79. Curso Avançado 1998 - 1999 Já em 1999, outras categorias como, eletrônicos e brinquedos, começaram a fazer parte do leque de produtos oferecidos pela loja.

80. Curso Avançado 1999 - 2001 As primeiras tentativas para simplificar a categorização que não parava de crescer.

81. Curso Avançado 2001 - 2003 Começou a personalização da navegação.

82. Curso Avançado 2004 - 2006 Reduzindo as abas.

83. Curso Avançado 2006 - 2008 Tudo em um.

84. Curso Avançado Novos Formatos de Interação O que está mudando na maneira como interagimos, entre nós mesmos e com as máquinas?

85. Curso Avançado Hologramas.

86. Curso Avançado Livros sem papel

87. Curso Avançado Teclados Virtuais

88. Curso Avançado ;) Tiê Lima Blog: www.singlepeer.com e-mail: tielima@gmail.com