1. Marcello Cardoso é um especialista em Design de Interação e professor universitário com mais de 20 anos de experiência na área. 2. Ele apresenta conceitos e princípios do Design de Interação focados em entender o problema e o usuário, desenvolver soluções simples e centradas no comportamento das pessoas. 3. As metas de usabilidade incluem utilidade, eficácia, eficiência, segurança, facilidade de aprendizado e lembrar como usar, e devem guiar o desenvolvimento de produtos fáceis de usar.

1. tudo sobre
Design de Interação
Marcello de Campos Cardoso
mcardoso@gmail.com

2. (=
Prazer, meu nome é Marcello!

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. 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

6. 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

7. 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

8. Antes de mais nada,
vamos falar de problemas.

9. A vida é permeada de
problemas e desafios.

10. 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?

11. Que tal um iPhone pro Nicolau?

12. melhor ≠ mais sofisticado
solução simples = solução elegante

13. FOCO na demanda REAL.

14. FOCO na demanda REAL.

15. PROBLEMA
ENQUADRANDO O

16. …para se trocar uma lâmpada?
quantos designers são necessários…

17. 5 porquês

18. “É 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?

19. OXO - Good Grips
maior acessibilidade pode ser melhor para TODOS

20. maior acessibilidade pode ser melhor para TODOS

21. boa solução resolve mais de um problema.

22. “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.

23. YI | Sound Invention
A solução pode existir em outro lugar!

24. Existem várias soluções para um
problema.

25. Algumas são “robustas”.
Evolution Pillow

26. Algumas são mais simples.
Music Branch Headphone Splitter

27. mesmo o que funciona
pode melhorar.

28. Uma solução inserida no projeto é uma
Solução de design

29. Uma solução inserida no projeto é uma
Solução de design

30. Uma solução inserida no projeto é uma
Solução de design

31. Uma solução inserida no projeto é uma
Solução de design

32. Uma solução inserida no projeto é uma
Solução de design

33. Uma solução inserida no projeto é uma
Solução de design

34. Uma solução inserida no projeto é uma
Solução de design

35. mesmo o que funciona
pode melhorar.

36. mesmo o que funciona
pode melhorar.

37. mesmo o que funciona
pode melhorar.

38. mesmo o que funciona
pode melhorar.

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. 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. 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. 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. 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. 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. 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. 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. 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. 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. Para resolver bem,
precisamos entender o problema...
“Se eu perguntasse para as pessoas o que queriam,
me diriam cavalos mais rápidos.” -Henry Ford

50. 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.

51. Pensar simples a princípio
regra de Paretto, MVP

52. concentrar onde há maior valor de USO
começar pela espinha e ITERAR

53. não focar em tecnologia...
...mas em comportamento

54. 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

55. O que eles têm em comum?

56. design!

57. todo mundo é designer!

58. Design = Projeto

59. pode ser com ou sem
metodologia

60. Qual é o melhor
caminho para criar
soluções?

61. sorte...

62. sorte...

64. ...ou tática/metodologia

66. tablets da microsoft (2001): fracasso de vendas

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

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

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

70. 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

71. O que é usabilidade?

72. Usabilidade
é característica de um sistema que determina sua
qualidade de uso.

73. Design de Interação
é a metodologia para projetar sistemas com a melhor
usabilidade.

74. Design Centrado no Usuário
é a abordagem onde o comportamento do usuário
determina os requisitos do sistema.

75. Arquitetura da Informação
é parte do Design de interação focada em levantar, categorizar e
organizar os conteúdos e taxonomia de um sistema.

76. User Experience
é o resultado das interações do usuário com um
sistema

78. Quem define o que é fácil de ser usado?

79. Usuáriosdevemos perguntá-los como fazer nosso trabalho?

80. a princípio, NÃO

81. o paciente sabe da dor,
mas o médico conhece o remédio.

82. Devemos identificar seus padrões de comportamento
e projetarmos soluções adequadas.

83. Pesquisa é minerar dados
e colher informações.

84. ( )Dados vs. Informações

85. “Possuímos 6 mil cadastros femininos.”
Isso é um dado.
( )

86. 6 mil fem / 3 mil masc = 2/3 fem
Isso é um informação.
( )

87. ( )Informação são
dados tratados.

88. InformaçõesAjudam a evitar problemas clássicos
de escopo de projeto

89. 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ê

90. O usuário elástico
“Quem vai usar isso? - Todo Mundo!”
usuário avançado / usuário iniciante ≠ usuário real

91. Algumas técnicas de pesquisa:
‣ Avaliação do SAC, feedback,
‣ Análise métrica,
‣ Benchmarking,
‣ Etnografia online,
‣ Entrevistas,
‣ Questionários,
‣ Focus group
‣ etc...

96. Metodologia
é um conjunto de técnicas
aplicadas em um processo

99. Negócio
Pessoas
Tecnologia
AS 3 FORÇAS DA INOVAÇÃO

100. INOVAÇÃO
disruptiva ou incremental

102. pesquisa
prototipação
validação
CICLO DE VIDA DO PRODUTO

106. 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

107. Utilidade
A medida que o sistema propicia a funcionalidade
adequada para o objetivo específico do usuário.

108. Utilidade
Ferramenta de nicho

109. Utilidade
Ferramenta sem foco
Pra que serve?
Elevator pitch,
Twitter pitch!

110. 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

111. Qual é mais eficaz?
Eficácia

112. Depende, pra que, para quem?
Eficácia

113. Eficiência
Eficiência
economia de recursos
=

114. Eficiência
recursos podem ser medidos em tempo, cliques... se traduzem em trabalho/custo

115. Eficiência

116. eficácia - fazer melhor
eficiência - produtividade

117. Segurança se refere a prevenção e recuperação de erros.
Deve ser perceptível, transparente.
Segurança

118. Segurança
Física

119. Segurança
Lógica

120. Segurança
Prevenção de erros

121. Segurança
Prevenção de erros, transparente.

122. Segurança
Segurança percebida

123. Facilidade de aprendizado
Clareza na interface, compreensão das funcionalidades
metáforas e modelos mentais

124. Facilidade de lembrar como se usa
Interface profissional, especialista

125. obrigado!