Prototipação
a arte de gerar, refinar e comunicar idéias
Fabrício Fava
Design de interação . Interação Humano-Computador . Análise de Usabilidade .
Game design . Arquitetura de informação . Use...
O design é um ato evolutivo
Pressão constante para gerar idéias
As pessoas não sabem dizer exatamente o que
querem
Mas quando vêem ou interagem com algo, elas
logo sabem o que não querem”
Processo:
Prototipar
Revisar
Refinar
Criar opções Fazer escolhas
Exploração Refinamento
Os protótipos podem ser:
Baixa fidelidade (low fidelity)
Alta fidelidade (high fidelity)
Filosofia:
Rough
Rapid
Right
Personas
Prototipando perfis de usuários
Conheça seu usuário antes de começar a
codificar
Personas estão para os usuários,
como o álbum de fotografias está para uma
viagem
Personas são úteis para:
Comunicar requisitos
Conhecer características dos usuários
Personificar os usuários
Moodboard
Prototipando características dos usuários
Quadros de humor que representam estado de
espírito, estilo de vida, hábitos de consumo de
uma persona
Moodboards são úteis para:
Comunicar requisitos
Conhecer características dos usuários
Personificar os usuários
Modelo que estamos desenvolvendo
Protótipos em papel
Prototipando com rapidez
Auxiliam na definição do design conceitual do
produto
Encorajam a participação das pessoas no
processo de design
Protótipos em papel são úteis para:
Coletar e identificar requisitos
Discutir e comunicar idéias
Avaliar soluções
Você pode utilizar templates para auxiliar na
geração de protótipos em papel
http://www.uxpin.com/
Wireframe
Prototipando para comunicar idéias
Auxiliam na definição do design conceitual do
produto
Recomenda-se aumentar gradativamente a
fidelidade das informações
Wireframes são úteis para:
Comunicar idéias
Validar a hierarquia do conteúdo
Avaliar soluções de design
Wireframes podem ser detalhados
Mesmo assim, recomenda-se apresentá-los ao
invés de enviá-los
Mockup
Prototipando dispositivos físicos
Réplicas, geralmente em tamanho natural, de
artefatos físicos
Mockups são úteis para:
Gerar idéias
Inserir o produto no contexto de uso
Avaliar aspectos físicos do produto
Objetos do cotidiano também podem lhe ajudar
a ter grandes idéias
Storyboarding
Prototipando cenários de uso
Seqüência de desenhos comentados ilustrando
um cenário de uso específico
É interessante combinar o storyboard com o
wireframe para tornar a visualização da
interação mais rica.
Storyboards são úteis para:
Compreender o contexto de uso
Refinar e avaliar requisitos
Avaliar modelo de interação
Sketchboard
Prototipando para comunicar idéias
Quadro de protótipos que apresenta requisitos
e fluxos de navegação do sistema
Sketchboards são úteis para:
Comunicar soluções de design
Avaliar soluções de design
Gerenciar as mudanças de projeto
Inte...
Skecthboard Adaptive Path
Protótipo de alta fidelidade
Prototipando o design físico
Representam o design físico do produto
Protótipos de alta fidelidade são úteis para:
Comunicar idéias
Avaliar aspectos físicos do design
Vender uma solução
O lado ruim...
As pessoas se apegam ao design
Protótipo executável
Prototipando a interação
Implementação de soluções para funcionalidades
do produto
Podem ser de baixa ou alta fidelidade
São bastante utilizados pela indústria de games
E para avaliar novas aplicações para celular
Protótipos executáveis são úteis para:
Avaliar o fluxo de interação com o produto
Realizar testes de usabilidade
Como saber que funcionalidades projetar?
Como obter o melhor da
prototipação?
Defina os seus objetivos
Identifique o tipo de protótipo mais adequado
Escolha tecnologia e ferramenta adequadas
Ouça as idéias do outro e trabalhe para
evoluí-la de forma coletiva
“If at first the idea is not absurd,
then there is no hope for it.”
Albert Einstein
Fabrício Fava
Designer de Interação
fabriciofava@gmail.com
Prototipação: a arte de gerar, refinar e comunicar idéias
Prototipação: a arte de gerar, refinar e comunicar idéias
Prototipação: a arte de gerar, refinar e comunicar idéias
Prototipação: a arte de gerar, refinar e comunicar idéias
Prototipação: a arte de gerar, refinar e comunicar idéias
Prototipação: a arte de gerar, refinar e comunicar idéias
Prototipação: a arte de gerar, refinar e comunicar idéias
Prototipação: a arte de gerar, refinar e comunicar idéias
Prototipação: a arte de gerar, refinar e comunicar idéias
Prototipação: a arte de gerar, refinar e comunicar idéias
Prototipação: a arte de gerar, refinar e comunicar idéias
Prototipação: a arte de gerar, refinar e comunicar idéias
Prototipação: a arte de gerar, refinar e comunicar idéias
Prototipação: a arte de gerar, refinar e comunicar idéias
Prototipação: a arte de gerar, refinar e comunicar idéias
Prototipação: a arte de gerar, refinar e comunicar idéias
Prototipação: a arte de gerar, refinar e comunicar idéias
Prototipação: a arte de gerar, refinar e comunicar idéias
Prototipação: a arte de gerar, refinar e comunicar idéias
Prototipação: a arte de gerar, refinar e comunicar idéias
Prototipação: a arte de gerar, refinar e comunicar idéias
Prototipação: a arte de gerar, refinar e comunicar idéias
Próximos SlideShares
Carregando em…5
×

Prototipação: a arte de gerar, refinar e comunicar idéias

1.670 visualizações

Publicada em

Publicada em: Design

Prototipação: a arte de gerar, refinar e comunicar idéias

  1. 1. Prototipação a arte de gerar, refinar e comunicar idéias Fabrício Fava
  2. 2. Design de interação . Interação Humano-Computador . Análise de Usabilidade . Game design . Arquitetura de informação . User Experience . Acessibilidade Fabrício Fava . Designer de Interação . Atlântico
  3. 3. O design é um ato evolutivo
  4. 4. Pressão constante para gerar idéias
  5. 5. As pessoas não sabem dizer exatamente o que querem Mas quando vêem ou interagem com algo, elas logo sabem o que não querem”
  6. 6. Processo: Prototipar Revisar Refinar
  7. 7. Criar opções Fazer escolhas Exploração Refinamento
  8. 8. Os protótipos podem ser: Baixa fidelidade (low fidelity) Alta fidelidade (high fidelity)
  9. 9. Filosofia: Rough Rapid Right
  10. 10. Personas Prototipando perfis de usuários
  11. 11. Conheça seu usuário antes de começar a codificar
  12. 12. Personas estão para os usuários, como o álbum de fotografias está para uma viagem
  13. 13. Personas são úteis para: Comunicar requisitos Conhecer características dos usuários Personificar os usuários
  14. 14. Moodboard Prototipando características dos usuários
  15. 15. Quadros de humor que representam estado de espírito, estilo de vida, hábitos de consumo de uma persona
  16. 16. Moodboards são úteis para: Comunicar requisitos Conhecer características dos usuários Personificar os usuários
  17. 17. Modelo que estamos desenvolvendo
  18. 18. Protótipos em papel Prototipando com rapidez
  19. 19. Auxiliam na definição do design conceitual do produto
  20. 20. Encorajam a participação das pessoas no processo de design
  21. 21. Protótipos em papel são úteis para: Coletar e identificar requisitos Discutir e comunicar idéias Avaliar soluções
  22. 22. Você pode utilizar templates para auxiliar na geração de protótipos em papel http://www.uxpin.com/
  23. 23. Wireframe Prototipando para comunicar idéias
  24. 24. Auxiliam na definição do design conceitual do produto
  25. 25. Recomenda-se aumentar gradativamente a fidelidade das informações
  26. 26. Wireframes são úteis para: Comunicar idéias Validar a hierarquia do conteúdo Avaliar soluções de design
  27. 27. Wireframes podem ser detalhados Mesmo assim, recomenda-se apresentá-los ao invés de enviá-los
  28. 28. Mockup Prototipando dispositivos físicos
  29. 29. Réplicas, geralmente em tamanho natural, de artefatos físicos
  30. 30. Mockups são úteis para: Gerar idéias Inserir o produto no contexto de uso Avaliar aspectos físicos do produto
  31. 31. Objetos do cotidiano também podem lhe ajudar a ter grandes idéias
  32. 32. Storyboarding Prototipando cenários de uso
  33. 33. Seqüência de desenhos comentados ilustrando um cenário de uso específico
  34. 34. É interessante combinar o storyboard com o wireframe para tornar a visualização da interação mais rica.
  35. 35. Storyboards são úteis para: Compreender o contexto de uso Refinar e avaliar requisitos Avaliar modelo de interação
  36. 36. Sketchboard Prototipando para comunicar idéias
  37. 37. Quadro de protótipos que apresenta requisitos e fluxos de navegação do sistema
  38. 38. Sketchboards são úteis para: Comunicar soluções de design Avaliar soluções de design Gerenciar as mudanças de projeto Integrar o time no processo de design
  39. 39. Skecthboard Adaptive Path
  40. 40. Protótipo de alta fidelidade Prototipando o design físico
  41. 41. Representam o design físico do produto
  42. 42. Protótipos de alta fidelidade são úteis para: Comunicar idéias Avaliar aspectos físicos do design Vender uma solução
  43. 43. O lado ruim...
  44. 44. As pessoas se apegam ao design
  45. 45. Protótipo executável Prototipando a interação
  46. 46. Implementação de soluções para funcionalidades do produto
  47. 47. Podem ser de baixa ou alta fidelidade
  48. 48. São bastante utilizados pela indústria de games E para avaliar novas aplicações para celular
  49. 49. Protótipos executáveis são úteis para: Avaliar o fluxo de interação com o produto Realizar testes de usabilidade
  50. 50. Como saber que funcionalidades projetar?
  51. 51. Como obter o melhor da prototipação?
  52. 52. Defina os seus objetivos
  53. 53. Identifique o tipo de protótipo mais adequado
  54. 54. Escolha tecnologia e ferramenta adequadas
  55. 55. Ouça as idéias do outro e trabalhe para evoluí-la de forma coletiva
  56. 56. “If at first the idea is not absurd, then there is no hope for it.” Albert Einstein
  57. 57. Fabrício Fava Designer de Interação fabriciofava@gmail.com

×