ferramentas para negociar design de interação

72
Ferramentas para negociar design de interação Frederick van Amstel designer de interação usabilidoido.com.br

Upload: frederick-van-amstel

Post on 28-Jun-2015

2.424 views

Category:

Technology


2 download

DESCRIPTION

Recursos utilizados para criar, experimentar e definir em grupo características de produtos interativos.

TRANSCRIPT

Page 1: Ferramentas para negociar design de interação

Ferramentas para negociar design de interação

Frederick van Amstel designer de interação usabilidoido.com.br

Page 2: Ferramentas para negociar design de interação

IdealistaPositivista

LógicoIndividualista

MaterialistaCrítico

DialéticoColetivo

Page 3: Ferramentas para negociar design de interação

Ferramentas para negociação

• Reuniões

• Dinâmicas de grupo

• Fóruns de discussão

• Conferências à distância

• Blogs

• Wikis

• Murais

• Comunicação de pesquisa

• Prototipação

• Documentação

• ...

Page 4: Ferramentas para negociar design de interação

Reuniões

• Custo alto

• Dificuldade de agendamento

• Descontrole

• Flexibilidade

• Compromisso

• Agilidade

Page 5: Ferramentas para negociar design de interação

Instituto Faber-Ludens

Page 6: Ferramentas para negociar design de interação

Dinâmicas de grupo

• Brainstorming

• Método KJ

• Joint Application Development

• Grupo de foco

Page 7: Ferramentas para negociar design de interação

Grupo de foco

Page 8: Ferramentas para negociar design de interação

Conferências à distância

• Telefone, Skype

• MSN, Gtalk

• Vorticce

• Descontrole

• Problemas técnicos

Page 9: Ferramentas para negociar design de interação

Vorttice

Page 10: Ferramentas para negociar design de interação

Fóruns/listas de discussão

• Assíncrono

• Arquivo

• Impessoal

• Feedback lento

• Efeito “bonde andando”

• Basecamp

Page 11: Ferramentas para negociar design de interação

Basecamp

Page 12: Ferramentas para negociar design de interação

Blogs

• Acompanhamento externo

• Informalidade

• Autoria definida

Page 13: Ferramentas para negociar design de interação

Blogs da Microsoft

Page 14: Ferramentas para negociar design de interação

Wiki

• Controle de alterações

• Autoria difusa

• Coordenação diferente

• Desburocratiza

• Bom repositório

Page 15: Ferramentas para negociar design de interação

Wiki BrOffice.org

Page 16: Ferramentas para negociar design de interação

Murais

• Reprodução impossível

• Visão geral

• Esfera pública

• Flexibilidade

Page 17: Ferramentas para negociar design de interação

SketchboardAdaptivepath

Page 18: Ferramentas para negociar design de interação

Pesquisa i(n)terativa

Page 19: Ferramentas para negociar design de interação

Comunicação de pesquisa

• Traduzir a vivência

• Concisão

• Filtrar o relevante

• Generalizações

• Verdades e mentiras

Page 20: Ferramentas para negociar design de interação

FotografiasNokia Research

Page 21: Ferramentas para negociar design de interação

Vídeo

Page 22: Ferramentas para negociar design de interação

História em quadrinhosNokia Research Team

Page 23: Ferramentas para negociar design de interação

ColagemgoHostel

Page 24: Ferramentas para negociar design de interação

Colagens onlinehttp://www.scrapblog.com/

Page 25: Ferramentas para negociar design de interação

Diagrama de afinidades

SAP

Page 26: Ferramentas para negociar design de interação

Modelos Conceituais

Page 27: Ferramentas para negociar design de interação

Árvore de tarefas

Page 28: Ferramentas para negociar design de interação

Descrições

Pesquisa “O Orkut mudou a minha vida!”

Os participantes da pesquisa comentam que a curiosidade os impele a clicar na foto dos amigos para ver seu perfil. Alguns homens dizem que essa curiosidade está ligada à "boa estética" da foto, o que normalmente leva, em seguida, à uma espiada no álbum de fotos para verificar se a "boa estética" também se verifica sob outros ângulos.

Page 29: Ferramentas para negociar design de interação

Estudo de casoRedesign do Usabilidoido versão Seurat (2005)

Page 30: Ferramentas para negociar design de interação

Versão Mondrian

Page 31: Ferramentas para negociar design de interação

Perfil Semiótico I

Page 32: Ferramentas para negociar design de interação

Perfil Semiótico II

Page 33: Ferramentas para negociar design de interação

Perfil Semiótico III

Page 34: Ferramentas para negociar design de interação

Explorando personalidade

Page 35: Ferramentas para negociar design de interação

Diagrama de afinidade

Page 36: Ferramentas para negociar design de interação

Personas

Page 37: Ferramentas para negociar design de interação

Versão Seurat

Page 38: Ferramentas para negociar design de interação

Versão Seurat ajustada

Page 39: Ferramentas para negociar design de interação

Resultados

• Aumento de 500% na rentabilidade do Adsense em 6 meses

• Pararam os comentários criticando o layout

• Índice de aprovação de 60%

• Maior flexibilidade e durabilidade

Page 40: Ferramentas para negociar design de interação

Prototipação e Evolução

Page 41: Ferramentas para negociar design de interação

Prototipação

• Propósito (demonstrar, testar, explorar)

• Fidelidade (alta, baixa)

• Funcionalidade (funcional, semi-funcional)

• Competência técnica

Page 42: Ferramentas para negociar design de interação

RabiscosJonas Lowgren

Page 43: Ferramentas para negociar design de interação

StoryboardSAP

Page 44: Ferramentas para negociar design de interação

Narrativa em vídeoCiao PDA

Page 45: Ferramentas para negociar design de interação

Bastidores

Page 46: Ferramentas para negociar design de interação

Protótipo estruturalUFPR.br

Page 47: Ferramentas para negociar design de interação

Protótipo de alta fidelidade

Page 48: Ferramentas para negociar design de interação

Protótipo funcionalReactables

Page 49: Ferramentas para negociar design de interação

PerformanceReactables

Page 50: Ferramentas para negociar design de interação

Estudo de CasoNon-Sedentary Gaming for Pediatric Obesity,

Lindsay Rebecca

Page 51: Ferramentas para negociar design de interação

Prototipação da forma

Page 52: Ferramentas para negociar design de interação

Prototipação da aparência

Page 53: Ferramentas para negociar design de interação

Prototipação funcional

Page 54: Ferramentas para negociar design de interação

Avaliação final

Page 55: Ferramentas para negociar design de interação

Documentação e Especificação

Page 56: Ferramentas para negociar design de interação

Documentação

• Demorado

• Polissemia

• Desatualização

• Precisão

• Referência estavel

Page 57: Ferramentas para negociar design de interação

Mapa mental

Page 58: Ferramentas para negociar design de interação

Progressão

Page 59: Ferramentas para negociar design de interação

Cenários• O aluno Alessandro Bernardes casou-se cedo e decide

trancar o curso para trabalhar mais. Ele recorre ao website da Universidade para saber por quanto tempo poderá trancar seu curso e, ao abrir a página, vê uma porção de links relativos aos órgãos da instituição. Como ele está um tanto alheio às funções de cada um, prefere clicar no link intitulado “Matrículas”. Na página aberta, encontra um link para maiores informações sobre trancamento de curso que o leva à página do Núcleo de Acompanhamento Acadêmico (NAA), o órgão responsável por operações dessa ordem. A página informa que é possível trancar o curso por seis meses e mais seis, caso seja aprovado o requerimento. Alessandro encontrou o que queria e, mais, aprendeu que problemas dessa ordem são resolvidos no NAA.

Page 60: Ferramentas para negociar design de interação

Diagrama da situação

Page 61: Ferramentas para negociar design de interação

Relação entre objetos

Page 62: Ferramentas para negociar design de interação
Page 63: Ferramentas para negociar design de interação

Relação entre objetos

Page 64: Ferramentas para negociar design de interação

Especificação de funcionalidades

Mural do usuário

Na página do perfil do usuário, haverá um pequeno mural para outros usuários deixarem recados como, por exemplo, convidando o usuário dono do perfil a responder uma pergunta sua. O dono do perfil poderá optar por desligar o mural.

Page 65: Ferramentas para negociar design de interação

Casos de uso

Page 66: Ferramentas para negociar design de interação

Diagrama Sequencial

Page 67: Ferramentas para negociar design de interação

Diagrama Sequencial

Page 68: Ferramentas para negociar design de interação

MolicSERG - PucRio

Page 69: Ferramentas para negociar design de interação

Vocabulário Visual

Page 70: Ferramentas para negociar design de interação

Wireframe

Page 71: Ferramentas para negociar design de interação

Pesquisa, Protótipos e Documentação

• Propósitos diferentes

• Resultados diferentes

• Combinação

Page 72: Ferramentas para negociar design de interação

Obrigado!

Frederick van Amstel designer de interação usabilidoido.com.br