52
Técnicas de Prototipação Érico Fernandes Fileno. MSc Designer de Interação Instituto Faber-Ludens de Design de Interação

Prototype - Interaction Design

Embed Size (px)

DESCRIPTION

www.faberludens.com.br

Citation preview

Page 1: Prototype - Interaction Design

Técnicas dePrototipação

Érico Fernandes Fileno. MSc

Designer de Interação Instituto Faber-Ludens

de Design de Interação

Page 2: Prototype - Interaction Design

Crono grama

30/Ago –

Aula 1

Apresentação da disciplina | Introdução ao Processo de Design | Desenvolvimento de Produto | Sketch

13/Set –

Aula 2

Protótipos (Baixa fidelidade e Alta fidelidade)

Modelos Conceituais

20/Set –

Aula 3

Técnicas de Prototipação: Storyboard

e Diagramas

27/Set –

Aula 4 * Primeira avaliação

Oficina de Idéias

04/Out –

Aula 5

Técnicas de Prototipação: Wireframe, Brainstorming

e CardSorting. Lançamento do Projeto Final

18/Out –

Aula 6

Técnicas de Prototipação: Personas

e Cenários

25/Out –

Aula 7

Técnicas de Prototipação: “Dirty

Prototype”

08/Nov –

Aula 8 ** Segunda avaliação

Projeto Final da Disciplina

Page 3: Prototype - Interaction Design

Biblio grafia

Page 4: Prototype - Interaction Design

Biblio grafia

Page 5: Prototype - Interaction Design

Biblio grafia

Page 6: Prototype - Interaction Design

Biblio grafia

Page 7: Prototype - Interaction Design

Érico Fernandes Fileno. MSc

Designer de Interação Instituto Faber-Ludens

de Design de Interação

Aula 1• Apresentação pessoal

• Apresentação da disciplina

• Introdução ao Processo de Design

• Desenvolvimento de um novo produto/serviço

• Importância da prototipagem

Page 8: Prototype - Interaction Design

Introdução ao Processo de Design

1)

Desenvolvimento de novos produtos/serviços

1.1 –

Da visão para a especificação (Jonas Löwgren)

Três níveis de abstraçãoCaminho da concretização Tornar tangível

Page 9: Prototype - Interaction Design
Page 10: Prototype - Interaction Design

1)

Desenvolvimento de novos produtos/serviços

1.0 –

“Senso comum”

Page 11: Prototype - Interaction Design

Kar

ine

Dru

mm

ond

Page 12: Prototype - Interaction Design

1)

Desenvolvimento de novos produtos/serviços

1.1 –

Da visão para a especificação (Jonas Löwgren)

visão

imagemoperacional

especificação

Page 13: Prototype - Interaction Design

O processo de design começa quando o designer “pensa a respeito”.

Page 14: Prototype - Interaction Design

• visãoO processo de design começa quando o designer “pensa a respeito”;

O designer possui dilemas...escolhas que precisa fazer;

A sociedade gera a demanda e/ou designer vá

atrás do problema.

Page 15: Prototype - Interaction Design

• imagemCriação da imagem (forma/função);

É

a primeira externalização

da visão;

A dinâmica (diálogo) entre visão e imagem gera um sub-processo chamado de conceituação;

A passagem da visão para a imagem é

a ponte do abstrato para a criação de uma imagem “não-real”

(ou

virtual)...É

algo que saiu do campo das idéias.

Page 16: Prototype - Interaction Design

É

a primeira externalização

da visão.

Page 17: Prototype - Interaction Design

conceito

Idéia ou plano; idéia ou entendimento geral, sobretudo derivado de exemplos e ocorrências específicos; representação geral ou abstrata de um objeto ou conjunto de objetos; produto da faculdade de conceber a idéia de uma classe de objetos ou noção geral destes; resultado da ação de conceituar. (Luiz Antônio Coelho –

designer)

Page 18: Prototype - Interaction Design

conceituar

Formar conceitos, teorias e idéias a respeito de dado objeto; atribuir valores positivos ou negativos a um objeto. (Luiz Antônio Coelho –

designer)

Page 19: Prototype - Interaction Design

• especificaçãoApós a imagem operacional ser suficientemente detalhada ela passa por uma tarefa de especificação técnica antes de caminhar para a produção (área de engenharia).

Page 20: Prototype - Interaction Design
Page 21: Prototype - Interaction Design
Page 22: Prototype - Interaction Design
Page 23: Prototype - Interaction Design
Page 24: Prototype - Interaction Design

Introdução ao Processo de Design

2) Processo de desenvolvimento

Divisão em 3 grandes fases:

DesignEngenharia Vendas

Page 25: Prototype - Interaction Design
Page 26: Prototype - Interaction Design

P&D Socie-dade

Page 27: Prototype - Interaction Design

Responde a dialética

Empresa Mercado

Gera demandas

Gera produtos/serviços

Page 28: Prototype - Interaction Design

Cultura material

Partindo do conceito primário de cultura, compreendido como expressão política, científica, espiritual, artística de uma determinada sociedade ou grupo, a cultura material se particulariza nos objetos dessas expressões, quando caracterizados como artefatos. (Gustavo Amarante Bonfim –

designer)

Page 29: Prototype - Interaction Design

Artefato

Refere-se aos objetos produzidos pelo trabalho humano e se contrapõe, portanto, aos objetos naturais ou acidentais. A noção de artefato é

elemento básico para interligar

conceito de projetar objetos com a Cultura Material. O ser humano é

um animal que gera artefatos, e os

artefatos são vertígios

mais eloqüentes da nossa ação como cultura e espécie. (Rafael Cardoso –

designer)

Page 30: Prototype - Interaction Design

Projetar faz parte da práxis humana

Page 31: Prototype - Interaction Design

Projetar é

uma eterna corrida atrás da relação problema

e solução

Page 32: Prototype - Interaction Design
Page 33: Prototype - Interaction Design

Problema e Solução

Problema Solução

Não devemos fazer perguntas certas ou erradas.

“Ações que geram conseqüências”Donald Schön

Page 34: Prototype - Interaction Design

Ações que geram conseqüências

Ações orientada pelo conhecimento

Reflexão na ação (inserido) Reflexão da ação (após)

Page 35: Prototype - Interaction Design

tempo

especificação

imagem

visão

Gráfico do processo de design

Relação Processo de Design e Ação orientada pelo conhecimento

“Conhecimento gerado pelo processamento humano das informações”.

Page 36: Prototype - Interaction Design

tempo

especificação

imagem

visão

tempo

especificação

imagem

visão

Relação Processo de Design e Ação orientada pelo conhecimento

Controle e manipulação das informações entre uma fase e outra

Page 37: Prototype - Interaction Design

“Erre logo para ser bem sucedido mais cedo.”

IDEO

Page 38: Prototype - Interaction Design

Informação no Processo de Design

Gerar o conhecimento para realizar um trabalho de Ação Orientada pelo Conhecimento, em oposição a dialética do problema/solução, está

baseada no gerenciamento

das informações.

Page 39: Prototype - Interaction Design
Page 40: Prototype - Interaction Design

Esse processo é

baseado em 3 propostas:

1.

Para formular a idéia.

2.

Para comunicar para você mesmo.

3.

Para comunicar para os outros.

visão imagem

informação

Page 41: Prototype - Interaction Design

Informação

Todo produto possui informação e está

relacionado a Teoria da Informação de Shannon

e Weaver

(1949),

que trata de um sistema de comunicação –

composto de fonte, transmissor, sinal, canal, receptor e destino –

na

presença de ruídos, que influem na modificação de estrutura, sequência

ou conteúdo dos dados transmitidos.

(Luiz Antônio Coelho –

designer)

Page 42: Prototype - Interaction Design

pessoal

coletivo

Contexto

Design é

um processo social -> Troca social

Page 43: Prototype - Interaction Design

Exercício: Desenho às escuras

Page 44: Prototype - Interaction Design

Comunicar como?

Através da prototipação

Sketch (esboço)

Protótipo

visão imagemcomunicação

Baixa precisão

Alta precisãorápida

lenta

Page 45: Prototype - Interaction Design
Page 46: Prototype - Interaction Design

SKETCH é

rápidobaratodiretopouco detalhadolivrediálogodescartávelambíguosugestivoúnico

Page 47: Prototype - Interaction Design
Page 48: Prototype - Interaction Design

Diálogo do sketch

Mente conhecimento

Sketch representação

criação

leitura

Page 49: Prototype - Interaction Design
Page 50: Prototype - Interaction Design
Page 51: Prototype - Interaction Design

Sketch Protótipo

Evocativo

DidáticoSugestivo

Descritivo

Exploratório

RefinadoQuestionador

Resposta

Proposta

TesteProvocativo

Resolução

Tentador

EspecíficoAéreo

Descrição

Page 52: Prototype - Interaction Design

Você não depende dos seus olhos quando você se expande através da imaginação. Mark

Twain