Tudo sobre Design de Interação

971 visualizações

Publicada em

Resumo dos principais conceitos relacionados com Design de Interação. O que é usabilidade, design centrado no usuário, User experience, design de interação, arquitetura da informação? De onde veio? Pra que serve? Como aplicamos?

Publicada em: Design
1 comentário
11 gostaram
Estatísticas
Notas
Sem downloads
Visualizações
Visualizações totais
971
No SlideShare
0
A partir de incorporações
0
Número de incorporações
8
Ações
Compartilhamentos
0
Downloads
39
Comentários
1
Gostaram
11
Incorporações 0
Nenhuma incorporação

Nenhuma nota no slide

Tudo sobre Design de Interação

  1. 1. tudo sobre
 Design de Interação Marcello de Campos Cardoso
 mcardoso@gmail.com
  2. 2. (=
 Prazer, meu nome é Marcello!

  3. 3. Marcello Cardoso ‣ Especialista em Design de Interação pela PUC MG ‣ Professor na PUC, UNA, Newton Paiva, Faculdade Cotemig, Faculdade Pitágoras ‣ Proprietário/consultor na Latitude14 ‣ Mentor de Usabilidade na Aceleradora ‣ Organizador do Interaction South America 2011 (ISA’11) ‣ 6 anos como gerente de produtos na Studio Sol (16 iBest) ‣ +21 anos “fazendo site” ‣ +14 anos de mercado web (2001 - atual)
  4. 4. Sou especialistas em uma metodologia (IxD - Interaction Design) com envolvimento do usuário no processo (User Centered Design) e objetivo interface simples e fácil de ser usada por muitos (usabilidade).
 ♢ Trabalhamos desde 2006 com este foco (1a empresa do ramo no Brasil) ♢ Fomos premiados como melhor case 2012 em mídias sociais pelo prêmio Aberje MG ♢ Somos fundadores e coordenadores locais da Interaction Design Association (IxDA) ♢ Organizadores locais do Dia Mundial da Usabilidade ♢ Curtimos trabalho voluntário e escolhemos projetos de impacto social ♢ Consultores cadastrados SEBRAETEC NOME: LATITUDE CONSULTORIA E PLANEJAMENTO LTDA 
 NOME FANTASIA: latitude14
 CNPJ: 07.807.389/0001-20
 Representante legal: Marcello de Campos Cardoso
 E-mail: mcardoso@latitude14.com.br
  5. 5. Designing for Interaction, Dan Saffer The Design of Everyday things, Don Norman Emotional Design, Don Norman About Face 3, Alan Cooper Observing the User Experience, Mike Kuniavsky Microinteractions, Dan Saffer Referências bibliográficas
  6. 6. www.useit.com www.acm.org www.interactions.acm.org www.upassoc.org www.cooper.com www.slideshare.net/dansaffer www.slideshare.net/LaneHalley Referências online
  7. 7. Antes de mais nada, vamos falar de problemas.
  8. 8. A vida é permeada de problemas e desafios.
  9. 9. A família se preocupa, pois o velhinho tem pressão alta, e gostaria que o Seu Nicolau usasse um celular. Seu Nicolau tem 76 anos, mas é muito ativo. Gosta de fazer suas coisas sozinho, retirar a pensão no banco, visitar vizinhos... Mas nem sempre dá satisfação pra família, e não gosta de usar celular, pois acha “Muito difícil”. Como este celular poderia ser?
  10. 10. Que tal um iPhone pro Nicolau?
  11. 11. melhor ≠ mais sofisticado solução simples = solução elegante
  12. 12. FOCO na demanda REAL.
  13. 13. FOCO na demanda REAL.
  14. 14. PROBLEMA ENQUADRANDO O
  15. 15. …para se trocar uma lâmpada? quantos designers são necessários…
  16. 16. 5 porquês
  17. 17. “É pesada meu filho, e machuca minha mão. Quase não consigo virá-la na xícara, fico com medo de me queimar.” Dona Lucinha adora um cházinho com bolo de fubá, quando recebe as amigas em casa pra falar de novela. Mas a senhorinha tem artrite e ultimamente reclama muito de usar a chaleira. Vamos pensar uma chaleira pra ela?
  18. 18. OXO - Good Grips maior acessibilidade pode ser melhor para TODOS
  19. 19. maior acessibilidade pode ser melhor para TODOS
  20. 20. boa solução resolve mais de um problema.
  21. 21. “Os fios do fone embolam porque são muito separados. Mas se fossem menos separados, também não ia dar pra dividir com a Aninha.” Mário tem 32 anos, trabalha em Betim, mas mora em Belo Horizonte. Todos os dias pega o transporte da empresa às 7 da manhã na Praça da Liberdade e escuta músicas no trajeto. Às vezes divide o fone com sua paquera, Ana Luiza.
  22. 22. YI | Sound Invention A solução pode existir em outro lugar!
  23. 23. Existem várias soluções para um problema.
  24. 24. Algumas são “robustas”. Evolution Pillow
  25. 25. Algumas são mais simples. Music Branch Headphone Splitter
  26. 26. mesmo o que funciona pode melhorar.
  27. 27. Uma solução inserida no projeto é uma Solução de design
  28. 28. Uma solução inserida no projeto é uma Solução de design
  29. 29. Uma solução inserida no projeto é uma Solução de design
  30. 30. Uma solução inserida no projeto é uma Solução de design
  31. 31. Uma solução inserida no projeto é uma Solução de design
  32. 32. Uma solução inserida no projeto é uma Solução de design
  33. 33. Uma solução inserida no projeto é uma Solução de design
  34. 34. mesmo o que funciona pode melhorar.
  35. 35. mesmo o que funciona pode melhorar.
  36. 36. mesmo o que funciona pode melhorar.
  37. 37. mesmo o que funciona pode melhorar.
  38. 38. Para resolver bem, precisamos entender o problema... “Se eu perguntasse para as pessoas o que queriam, me diriam cavalos mais rápidos.” -Henry Ford
  39. 39. Para resolver bem, precisamos entender o problema... “Se eu perguntasse para as pessoas o que queriam, me diriam cavalos mais rápidos.” -Henry Ford
  40. 40. Para resolver bem, precisamos entender o problema... “Se eu perguntasse para as pessoas o que queriam, me diriam cavalos mais rápidos.” -Henry Ford
  41. 41. Para resolver bem, precisamos entender o problema... “Se eu perguntasse para as pessoas o que queriam, me diriam cavalos mais rápidos.” -Henry Ford
  42. 42. Para resolver bem, precisamos entender o problema... “Se eu perguntasse para as pessoas o que queriam, me diriam cavalos mais rápidos.” -Henry Ford
  43. 43. Para resolver bem, precisamos entender o problema... “Se eu perguntasse para as pessoas o que queriam, me diriam cavalos mais rápidos.” -Henry Ford
  44. 44. Para resolver bem, precisamos entender o problema... “Se eu perguntasse para as pessoas o que queriam, me diriam cavalos mais rápidos.” -Henry Ford
  45. 45. Para resolver bem, precisamos entender o problema... “Se eu perguntasse para as pessoas o que queriam, me diriam cavalos mais rápidos.” -Henry Ford
  46. 46. Para resolver bem, precisamos entender o problema... “Se eu perguntasse para as pessoas o que queriam, me diriam cavalos mais rápidos.” -Henry Ford
  47. 47. Para resolver bem, precisamos entender o problema... “Se eu perguntasse para as pessoas o que queriam, me diriam cavalos mais rápidos.” -Henry Ford
  48. 48. Para resolver bem, precisamos entender o problema... “Se eu perguntasse para as pessoas o que queriam, me diriam cavalos mais rápidos.” -Henry Ford
  49. 49. Para resolver bem, precisamos entender o problema... “Se eu perguntasse para as pessoas o que queriam, me diriam cavalos mais rápidos.” -Henry Ford ...pensar coletivamente... ... e pensar sem limites.
  50. 50. Pensar simples a princípio regra de Paretto, MVP
  51. 51. concentrar onde há maior valor de USO começar pela espinha e ITERAR
  52. 52. não focar em tecnologia... ...mas em comportamento
  53. 53. Resumindo…. 1. Enquadramos a natureza do problema 2. A solução baseia em comportamento, não tecnologia 3. A solução mais elegante é a mais simples. 4. O bom design é o que se removeu tudo que era possível, não oontrário 5. Devemos ter foco na demanda real, aplicar regra de pareto e MVP 6. Um bom Brainstorming é colaborativo, coletivo, e sem limites. 7. Uma boa solução considera todos os envolvidos no processo ou sistema 8. Uma boa solução provavelmente está em outro lugar, outro mercado 9. Uma boa solução resolve mais de um problema 10. É importante coletar e cruzar informações para apoiar a tomada de decisão 11. Acessibilidade e usabilidade é melhor pra todos
  54. 54. O que eles têm em comum?
  55. 55. design!
  56. 56. todo mundo é designer!
  57. 57. Design = Projeto
  58. 58. pode ser com ou sem metodologia
  59. 59. Qual é o melhor 
 caminho para criar soluções?

  60. 60. sorte...

  61. 61. sorte...

  62. 62. ...ou tática/metodologia
  63. 63. tablets da microsoft (2001): fracasso de vendas

  64. 64. iPad da Apple (2010): 15 milhões vendidos em 1 ano

  65. 65. Software difícilé fácilde projetar. Software fácilé difícilde projetar.

  66. 66. metodologia
 sorte
 ...15%, 25%, 40%, 70%...
 0,00001% ... 50%

  67. 67. Resumindo…. 1. Enquadramos a natureza do problema 2. A solução baseia em comportamento, não tecnologia 3. A solução mais elegante é a mais simples. 4. O bom design é o que se removeu tudo que era possível, não oontrário 5. Devemos ter foco na demanda real, aplicar regra de pareto e MVP 6. Um bom Brainstorming é colaborativo, coletivo, e sem limites. 7. Uma boa solução considera todos os envolvidos no processo ou sistema 8. Uma boa solução provavelmente está em outro lugar, outro mercado 9. Uma boa solução resolve mais de um problema 10. É importante coletar e cruzar informações para apoiar a tomada de decisão 11. Acessibilidade e usabilidade é melhor pra todos
  68. 68. O que é usabilidade?
  69. 69. Usabilidade é característica de um sistema que determina sua qualidade de uso.
  70. 70. Design de Interação é a metodologia para projetar sistemas com a melhor usabilidade.
  71. 71. Design Centrado no Usuário é a abordagem onde o comportamento do usuário determina os requisitos do sistema.
  72. 72. Arquitetura da Informação é parte do Design de interação focada em levantar, categorizar e organizar os conteúdos e taxonomia de um sistema.
  73. 73. User Experience é o resultado das interações do usuário com um sistema
  74. 74. Quem define o que é fácil de ser usado?
  75. 75. Usuáriosdevemos perguntá-los como fazer nosso trabalho?
  76. 76. a princípio, NÃO
  77. 77. o paciente sabe da dor,
 mas o médico conhece o remédio.
  78. 78. Devemos identificar seus padrões de comportamento e projetarmos soluções adequadas.
  79. 79. Pesquisa é minerar dados e colher informações.
  80. 80. ( )Dados vs. Informações
  81. 81. “Possuímos 6 mil cadastros femininos.” Isso é um dado. ( )
  82. 82. 6 mil fem / 3 mil masc = 2/3 fem Isso é um informação. ( )
  83. 83. ( )Informação são dados tratados.
  84. 84. InformaçõesAjudam a evitar problemas clássicos de escopo de projeto
  85. 85. Não há receita de bolo, mas princípios. 1. Desenvolvedor ≠ usuário 2. Dados ≠ informações 3. Mais informação = menor chance de insucesso 4. Arquétipo ≠ clichê
  86. 86. O usuário elástico “Quem vai usar isso? - Todo Mundo!” usuário avançado / usuário iniciante ≠ usuário real
  87. 87. Algumas técnicas de pesquisa: ‣ Avaliação do SAC, feedback, ‣ Análise métrica, ‣ Benchmarking, ‣ Etnografia online, ‣ Entrevistas, ‣ Questionários, ‣ Focus group ‣ etc...
  88. 88. Metodologia
 é um conjunto de técnicas aplicadas em um processo
  89. 89. Negócio Pessoas Tecnologia AS 3 FORÇAS DA INOVAÇÃO
  90. 90. INOVAÇÃO disruptiva ou incremental
  91. 91. pesquisa prototipação validação CICLO DE VIDA DO PRODUTO
  92. 92. Marcello de Campos Cardoso - www.mcardoso.com.br | www.latitude14.com.br | Servem para guiar o desenvolvimento de produtos fáceis de usar, eficientes e agradáveis. São elas (Preece, Rogers, Sharp): 1. Utilidade 2. Eficácia 3. Eficiência 4. Segurança 5. Facilidade de aprendizado 6. Facilidade de lembrar como se usa 
 Eficácia: O quanto um produto é bom em se fazer o que se espera dele
 Eficiência: Como um produto auxilia a execução de suas tarefas com o mínimo de recursos Metas de Usabilidade
  93. 93. Utilidade A medida que o sistema propicia a funcionalidade adequada para o objetivo específico do usuário.
  94. 94. Utilidade Ferramenta de nicho
  95. 95. Utilidade Ferramenta sem foco Pra que serve? Elevator pitch, Twitter pitch!
  96. 96. Eficácia se refere a quão bem uma ferramenta auxilia na realização de uma atividade proposta, em um contexto de uso. É uma característica analógica, em escala. Eficácia
  97. 97. Qual é mais eficaz? Eficácia
  98. 98. Depende, pra que, para quem? Eficácia
  99. 99. Eficiência Eficiência
 
 
 economia de recursos =
  100. 100. Eficiência recursos podem ser medidos em tempo, cliques... se traduzem em trabalho/custo
  101. 101. Eficiência
  102. 102. eficácia - fazer melhor eficiência - produtividade
  103. 103. Segurança se refere a prevenção e recuperação de erros. Deve ser perceptível, transparente. Segurança
  104. 104. Segurança Física
  105. 105. Segurança Lógica
  106. 106. Segurança Prevenção de erros
  107. 107. Segurança Prevenção de erros, transparente.
  108. 108. Segurança Segurança percebida
  109. 109. Facilidade de aprendizado Clareza na interface, compreensão das funcionalidades metáforas e modelos mentais
  110. 110. Facilidade de lembrar como se usa Interface profissional, especialista
  111. 111. obrigado!

×