f5 - design de interação

23
Design de Interação marcos nähr F5 - Design de Interação | 14 de julho de 2009

Upload: marcos-naehr

Post on 05-Dec-2014

5.703 views

Category:

Design


2 download

DESCRIPTION

Apresentação sobre Design de Interação feita durante o F5, evento mensal da AGADI

TRANSCRIPT

Page 1: F5 - Design de Interação

Design de Interaçãomarcos nähr

F5 - Design de Interação | 14 de julho de 2009

Page 2: F5 - Design de Interação

• Desmistificar o design de interação

• Entender os paradigmas do computador

• Analisar o processo do design de interação

• Definir os elementos por trás deste processo

Design de Interação

Page 3: F5 - Design de Interação

mistificarJesse James Garret

Page 4: F5 - Design de Interação

mistificarDan Saffer

Page 5: F5 - Design de Interação

mistificarChallis Hodge

Page 6: F5 - Design de Interação

mistificarChallis Hodge

Page 7: F5 - Design de Interação

mistificarNathan Shedroff

Page 8: F5 - Design de Interação

Desmistificarpor Bill Verplank

Page 9: F5 - Design de Interação

Desmistificarfazer Design de Interação

é contar uma história

• Foque em pessoas...• Que estão fazendo alguma coisa...• Em um lugar específico...• Por razões específicas...• Para atingir um objetivo específico.A interface é menos importante que as tarefas, o contexto e os objetivos!

Page 10: F5 - Design de Interação

Entenderos Paradigmas do Computador

Page 11: F5 - Design de Interação

Analisaro Processo do Design de Interação

motivação significado modo mapeamento

Page 12: F5 - Design de Interação

Definiros Elementos por trás deste Processo

barreirassíntese

estrutura

ideação

tangibilizaçãoincertezas

seleção

visualização

prototipagem

avaliação

Page 13: F5 - Design de Interação

Definiros Elementos por trás deste ProcessoBarreiras•Necessidades e desejos•Percepções•Modelos mentais e expectativas•Conhecimento da marca•Barreiras funcionais•Tecnologia•Ambiente•Barreiras financeiras...

Page 14: F5 - Design de Interação

Definiros Elementos por trás deste ProcessoSíntese•Absorção de todos elementos chave•Idéias e características de design•Normalmente é subconsciente•E aparece melhor em ambientes calmos

Page 15: F5 - Design de Interação

Definiros Elementos por trás deste ProcessoEstrutura•Articula a síntese •Faz as idéias acontecerem•É também uma forma de síntese•Momento de ordem após o caos das barreiras

Page 16: F5 - Design de Interação

Definiros Elementos por trás deste ProcessoIdeação•Serve para “coar” as idéias•Uma boa estrutura = melhores idéias•Brainstorming ajuda no processo•Idéias aparecem a todo momento

•Uma boa idéia pode reiniciar todo o processo!!

Page 17: F5 - Design de Interação

Definiros Elementos por trás deste ProcessoTangibilização•Descrever as idéias•Sair das nuvens e por os pés no chão

Page 18: F5 - Design de Interação

Definiros Elementos por trás deste ProcessoIncertezas•Tendem a aparecer após a tangibilização•Fator precursor da seleção•Trabalha questões sem resposta até agora•“é simples o suficiente para ser entendido?”

Page 19: F5 - Design de Interação

Definiros Elementos por trás deste ProcessoSeleção•Hora de escolher•Lista “gerenciável” de alternativas•Idéias boas ficarão para trás

Page 20: F5 - Design de Interação

Definiros Elementos por trás deste ProcessoVisualização•Primo da tangibilização e da prototipagem•Leva a tangibilização mais adiante•Representação mais completa•Realista, mas ainda não funcional

Page 21: F5 - Design de Interação

Definiros Elementos por trás deste ProcessoPrototipagem•Testar como o design deve funcionar•Protótipos complexos x simples•Protótipo inicial: rápido e bruto•Protótipo final: interações realistas

Page 22: F5 - Design de Interação

Definiros Elementos por trás deste ProcessoAvaliação•Deve aparecer + vezes durante o processo•Pelos designers ou usuários/clientes•Resultados devem alimentar as barreiras

Dica:comece a avaliar cedo, com frequência e o mais tarde possível.

Page 23: F5 - Design de Interação

Design de Interação

Marcos Nä[email protected]@marcosnahr