Rapid
Ivo Gomes
Prototyping
1 imagem vale por 1000 palavras
1 imagem já não vale por 1000 palavras
Case Study
• O mesmo cliente
• Situações semelhantes
• Metodologias iguais
• Apresentação de resultados diferente
Case Study
• É preciso criar um menu
com base numa lista de
itens
• É preciso remodelar o
menu de modo a
podermos adiciona...
Case Study
• Card Sorting com grupo
de utilizadores
• Testes de usabilidade
com várias versões
possíveis de menu
• Card So...
Card Sorting
desfocado de propósito :)
Card Sorting
desfocado de propósito :)
Case Study
• Wireframes (incluiam
todos os menus e sub-
menus abertos e
fechados)
• Versão em Excel da
arquitetura de info...
Principais Diferenças...
Com Wireframes
• Ainteracção com os intervenientes não foi tão ágil, pois são
pessoas que precisam de ver as coisas a acon...
Com Protótipo HTML
• Ainteracção foi bastante mais ágil.
• As alterações podem ser feitas durante as reuniões em
tempo rea...
Porquê preferir HTML?
• Amaioria do software de criação de wireframes já permite ter
elementos clicáveis e interativos.
• ...
Vantagens a longo prazo
• Alterações à estrutura podem ser feitas em vários momentos
do projecto.
• O URLdo protótipo é se...
Desvantagens
• É preciso saber (algum) HTML
Frameworks
• Usar frameworks de HTMLagiliza bastante este processo
• Amaior parte dos elementos já estão pré-concebidos (e...
E vocês?
• Experiências parecidas?
• Reultados semelhantes ou totalmente
diferentes?
• Outras alternativas?
Obrigado
IvoGomes
ivo.gomes@co.sapo.pt
Rapid Prototyping
Rapid Prototyping
Rapid Prototyping
Upcoming SlideShare
Loading in …5
×

Rapid Prototyping

607 views
515 views

Published on

Case study sobre duas abordagens diferentes de apresentação de resultados de um estudo de usabilidade a um menu de navegação: com wireframes vs. com protótipos HTML

Published in: Technology
1 Comment
0 Likes
Statistics
Notes
  • Be the first to like this

No Downloads
Views
Total views
607
On SlideShare
0
From Embeds
0
Number of Embeds
4
Actions
Shares
0
Downloads
15
Comments
1
Likes
0
Embeds 0
No embeds

No notes for slide

Rapid Prototyping

  1. 1. Rapid Ivo Gomes Prototyping
  2. 2. 1 imagem vale por 1000 palavras
  3. 3. 1 imagem já não vale por 1000 palavras
  4. 4. Case Study • O mesmo cliente • Situações semelhantes • Metodologias iguais • Apresentação de resultados diferente
  5. 5. Case Study • É preciso criar um menu com base numa lista de itens • É preciso remodelar o menu de modo a podermos adicionar a nova componente de negócio da empresa • Lista de itens para o menu mais extensa do que a anterior 2012 2013 PROBLEMA
  6. 6. Case Study • Card Sorting com grupo de utilizadores • Testes de usabilidade com várias versões possíveis de menu • Card Sorting com grupo de utilizadores • Testes de usabilidade com várias versões possíveis de menu 2012 2013 METODOLOGIA
  7. 7. Card Sorting desfocado de propósito :)
  8. 8. Card Sorting desfocado de propósito :)
  9. 9. Case Study • Wireframes (incluiam todos os menus e sub- menus abertos e fechados) • Versão em Excel da arquitetura de informação • Página HTMLcom menus e sub-menus a abrir e fechar • Versão em Excel da arquitetura de informação 2012 2013 APRESENTAÇÃO DOS RESULTADOS
  10. 10. Principais Diferenças...
  11. 11. Com Wireframes • Ainteracção com os intervenientes não foi tão ágil, pois são pessoas que precisam de ver as coisas a acontecer e a mexer para poderem tomar decisões. • Processo iterativo mais lento, pois era necessário actualizar os wireframes entre reuniões.
  12. 12. Com Protótipo HTML • Ainteracção foi bastante mais ágil. • As alterações podem ser feitas durante as reuniões em tempo real. • Todos os participantes têm acesso a um URLpara poderem experimentar e partilhar mais facilmente com outros intervenientes e tomadores de decisão. • Processo com muito mais iterações e feedback bastante positivo por parte dos intervenientes
  13. 13. Porquê preferir HTML? • Amaioria do software de criação de wireframes já permite ter elementos clicáveis e interativos. • Mas implica conhecer e saber usar o software e as alerações nunca são imediatas para um cliente menos tech- savvy • HTMLpode ser visto e interagido por vários intervenientes, num browser
  14. 14. Vantagens a longo prazo • Alterações à estrutura podem ser feitas em vários momentos do projecto. • O URLdo protótipo é sempre o mesmo, acessível em qualquer browser e em qualquer altura por qualquer pessoa.
  15. 15. Desvantagens • É preciso saber (algum) HTML
  16. 16. Frameworks • Usar frameworks de HTMLagiliza bastante este processo • Amaior parte dos elementos já estão pré-concebidos (ex: menus com sub-menus)
  17. 17. E vocês? • Experiências parecidas? • Reultados semelhantes ou totalmente diferentes? • Outras alternativas?
  18. 18. Obrigado IvoGomes ivo.gomes@co.sapo.pt

×