Design de Interação

64
Instituto Faber-Ludens Edyd Junges (@edyd) Instituto Faber-Ludens (@faberludens)

description

um panorama rápido sobre o design de interação e alguns métodos que podem ser utilizados.

Transcript of Design de Interação

Page 1: Design de Interação

Instituto Faber-Ludens

Edyd Junges (@edyd) Instituto Faber-Ludens (@faberludens)

Page 2: Design de Interação

O Instituto Faber-Ludens está sediado em Curitiba

nós estamos aqui

Page 3: Design de Interação

Instituto Faber-Ludens

• Entidade sem fins lucrativos fundada em 2007

• Promover Design + Tecnologia = Inovação Social

• Quatro áreas de atuação

• Ensino

• Pesquisa

• Consultoria

• Projetos Sociais

Page 4: Design de Interação

Áreas de Atuação

Page 5: Design de Interação

Experiências na Pós-Graduação em Design de Interação com Post-It, Lego Mindstorms e Arduino.

Lego Mindstorms

Arduino

Especialização Design de Interação

Page 6: Design de Interação

Treinamentos In-Company com dinâmicas práticas e divertidas sobre os assuntos que as empresas precisam dominar

Page 7: Design de Interação

Avaliação de Usabilidade RioShow

Consultorias

UX Bootcamp

InfoGlobo, Goomark Webgoal, ApolloTI

Teste de

Usabilidade

Electrolux

Page 8: Design de Interação
Page 9: Design de Interação

Estratégia de Design em corporações

Diretoria

Produção

Design Thinking

Design Design

Participativo

Page 10: Design de Interação

“Nada substitui o ser-humano.”

Instituto Faber-Ludens

Page 11: Design de Interação

Design de Interação

Page 12: Design de Interação

O que é Design de Interação?

Design de Interação é uma área profissional, uma sub-disciplina do Design

e um processo voltado ao projeto das interações entre pessoas e sistemas.

Page 13: Design de Interação

Diferencial

Engenharias IHC / Design de Interface Design de Interação Antropologia / Marketing

Page 14: Design de Interação

Pare de projetar produtos.

A experiência é a única coisa

com que o usuário se importa.”

Peter Merholz, Adaptive Path, 2006

Page 15: Design de Interação

User Experience (UX) são aqueles momentos na vida em que tudo está perfeito ao seu redor.

Page 16: Design de Interação

Design é o projeto de ambientes, produtos e serviços visando uma User Experience integrada.

Page 17: Design de Interação

Outback

Page 18: Design de Interação

As empresas só investem quando o negócio fica grave...

Page 19: Design de Interação

Recall feito para resolver o problema do Fox

Page 20: Design de Interação

Experiência do Usuário não é requisito. É estratégia.

Page 21: Design de Interação

Sistemas são ecologias

Page 22: Design de Interação

A base para seu projeto deve ser a atividade humana

Page 23: Design de Interação

Os Três Pilares do produto, Donald Norman Produto

Marketing

Engenharia

Design

Page 24: Design de Interação

O objetivo da Engenharia é que o produto funcione.

Page 25: Design de Interação

O objetivo do Marketing é que o consumidor compre.

Page 26: Design de Interação

Enquanto o Marketing se vale da Propaganda para atrair a

atenção, o Design trabalha a sedução pelo próprio produto.

Page 27: Design de Interação

o que o marketing sugeriu o que foi

produzido

o que a administração aprovou como foi montado

o que foi projetado pela engenharia o que o consumidor queria...

Page 28: Design de Interação

Processo de desenvolvimento comum Engenharia

Marketing Marketing

Page 29: Design de Interação

Vantagens/Desvantagens

• Economiza planejamento

• Tentativa e erro

• Design não é importante

• O produto é um frankestein de

funcionalidades

Office XP

Page 30: Design de Interação

Engenharia

Design como embelezamento Marketing

Design Marketing

Page 31: Design de Interação

Vantagens/Desvantanges

• Beleza vende

• Que inovação é possível a essa altura do campeonato?

Windows Vista

Page 32: Design de Interação

Ainda é um porco!

Page 33: Design de Interação

Engenharia

Marketing

Design como inovação Design

Marketing

Page 34: Design de Interação

Vantagens/Desvantagens

• Melhora a qualidade

• Economiza retrabalho

• Diminui a velocidade

• Risco de não obter retorno

Office 2007

Page 35: Design de Interação

Marketing

Design como estratégia Design Engenharia

Marketing

Page 36: Design de Interação

• Integra Pesquisa & Desenvolvimento

• Aumenta o ritmo de inovação

• Fortalece a marca

• Custo elevado

• Depende da cultura organizacional

Loja Apple em Nova Iorque

Vantagens/Desvantagens

Page 37: Design de Interação

inovação qualitativa inovação

quantitativa

competição pela qualidade mercado

saturado competição pela

quantidade

sem competição novo

mercado início da

competição

Page 38: Design de Interação

Recursos para criar

• Fala

• Rabiscos

• Brainstorming

• Cenários hipotéticos

Page 39: Design de Interação

Etnografia

Busca a compreensão aprofundada do comportamento a partir da observação de situação reais.

Page 40: Design de Interação

Estudos etnográficos sobre uso de TV Móvel realizados pela Nokia

Page 41: Design de Interação
Page 42: Design de Interação

Estudo etnográfico realizado no espaço

digital, baseado na participação em redes

sociais na web.

“Etnografia” virtual

Page 43: Design de Interação
Page 44: Design de Interação
Page 45: Design de Interação

Algumas palavras-chave dos boleiros: moral (e não "força",por exemplo) fera (e não "jogador",por exemplo) time (e não "equipe",por exemplo)

Page 46: Design de Interação

• Propósito (demonstrar,testar,explorar) • Fidelidade (alta,baixa) • Funcionalidade (funcional,semi-funcional) • Etapa e Competência técnica

Prototipação das representações

visuais das interfaces

Page 47: Design de Interação

Rabiscos Sketchs ou

Liberte-se!

Page 48: Design de Interação

Criando possibilidades

Page 49: Design de Interação

Focalizando no que é viável

Page 50: Design de Interação

Ferramenta para edição

de quadrinhos online: Pixton

Storyboard

Page 52: Design de Interação

Representa a interação entre papéis de usuários

Diagrama Sequencial

Page 53: Design de Interação
Page 54: Design de Interação

Diagrama Sequencial Negativo

Page 55: Design de Interação

Momento de definição: Wireframe

especificação

Page 56: Design de Interação
Page 57: Design de Interação

Wireflow

Page 59: Design de Interação

Teste com protótipo

• Portátil

• Arquivos HTML apenas com as opções de menu

• Tarefas de recuperação de

informação

Page 60: Design de Interação
Page 61: Design de Interação

Protótipo em alta fidelidade

Page 62: Design de Interação

+ acompanhamento (shadowing)

+ fly on the wall

+ diários de uso continuado

+ sondas culturais (cultural probes)

+ história de vida

+ um dia na vida (real ou simulado)

+ levantamento demográfico

+ questionários

+ porquê,porquê,porquê

Muito + no Corais.org

Page 63: Design de Interação

Livro colaborativo

http://designlivre.faberludens.com.br

Page 64: Design de Interação

Obrigado!

Edyd Junges (@edyd) [email protected]

Instituto Faber-Ludens www.faberludens.com.br