Design de Interação

Instituto Faber-Ludens

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

O Instituto Faber-Ludens está sediado em Curitiba

nós estamos aqui

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

Áreas de Atuaçã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

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

Avaliação de Usabilidade RioShow

Consultorias

UX Bootcamp

InfoGlobo, Goomark Webgoal, ApolloTI

Teste de

Usabilidade

Electrolux

Estratégia de Design em corporações

Diretoria

Produção

Design Thinking

Design Design

Participativo

“Nada substitui o ser-humano.”

Instituto Faber-Ludens

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.

Diferencial

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

Pare de projetar produtos.

A experiência é a única coisa

com que o usuário se importa.”

Peter Merholz, Adaptive Path, 2006

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

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

Outback

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

Recall feito para resolver o problema do Fox

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

Sistemas são ecologias

A base para seu projeto deve ser a atividade humana

Os Três Pilares do produto, Donald Norman Produto

Marketing

Engenharia

Design

O objetivo da Engenharia é que o produto funcione.

O objetivo do Marketing é que o consumidor compre.

Enquanto o Marketing se vale da Propaganda para atrair a

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

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...

Processo de desenvolvimento comum Engenharia

Marketing Marketing

Vantagens/Desvantagens

• Economiza planejamento

• Tentativa e erro

• Design não é importante

• O produto é um frankestein de

funcionalidades

Office XP

Engenharia

Design como embelezamento Marketing

Design Marketing

Vantagens/Desvantanges

• Beleza vende

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

Windows Vista

Ainda é um porco!

Engenharia

Marketing

Design como inovação Design

Marketing

Vantagens/Desvantagens

• Melhora a qualidade

• Economiza retrabalho

• Diminui a velocidade

• Risco de não obter retorno

Office 2007

Marketing

Design como estratégia Design Engenharia

Marketing

• 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

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

Recursos para criar

• Fala

• Rabiscos

• Brainstorming

• Cenários hipotéticos

Etnografia

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

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

Estudo etnográfico realizado no espaço

digital, baseado na participação em redes

sociais na web.

“Etnografia” virtual

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)

• 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

Rabiscos Sketchs ou

Liberte-se!

Criando possibilidades

Focalizando no que é viável

Ferramenta para edição

de quadrinhos online: Pixton

Storyboard

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

Diagrama Sequencial

Diagrama Sequencial Negativo

Momento de definição: Wireframe

especificação

Wireflow

Protótipo em papel

Teste com protótipo

• Portátil

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

• Tarefas de recuperação de

informação

Protótipo em alta fidelidade

+ 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

Livro colaborativo

http://designlivre.faberludens.com.br

Obrigado!

Edyd Junges (@edyd) edyd.junges@faberludens.com.br

Instituto Faber-Ludens www.faberludens.com.br