Oficina intensiva de design de interação
-
Upload
robson-santos -
Category
Education
-
view
1.655 -
download
0
description
Transcript of Oficina intensiva de design de interação
![Page 1: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/1.jpg)
Oficina Intensiva de Design de Interação
Robson Santos, D.Sc.
![Page 2: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/2.jpg)
PARCERIA COM CONTENT MIND
![Page 3: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/3.jpg)
Robson Santos
Doutor em Design, PUC-‐Rio, Departamento de Artes e Design
Mestre em Design, PUC-‐Rio, Departamento de Artes e Design
Bacharel em Desenho Industrial Escola Superior de Desenho Industrial/Uerj
Especialista em Inovação em Tecnologia e Experiência do Usuário no grupo Itaú Unibanco
Anteriormente, pesquisador sênior no InsLtuto Nokia de Tecnologia
Docente e palestrante
![Page 4: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/4.jpg)
1. Considerar o que implica fazer design de interação
2. DiscuLr algumas questões importantes sobre o processo de design de interação
3. Exercitar o design de interação por meio de aLvidade práLca
OBJETIVOS
![Page 5: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/5.jpg)
O que é Design de Interação Conceitos básicos
ALvidades do design de interação
Modelo de processo de design de interação
O QUE VEREMOS AKvidades práKcas O desafio 1. Entendimento 2. Síntese 3. Ideação 4. ProtoLpagem
![Page 6: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/6.jpg)
![Page 7: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/7.jpg)
CONCEITOS BÁSICOS
![Page 8: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/8.jpg)
ALvidade práKca e criaKva, cujo objeLvo final consiste em desenvolver um produto que ajude as pessoas alcançarem seus objeLvos.
Configuração, concepção, elaboração e especificação de um artefato.
ALvidade técnica e criaKva, orientada por uma intenção ou objeLvo, ou para a solução de um problema.
DESIGN
![Page 9: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/9.jpg)
![Page 10: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/10.jpg)
Simplificando: design é projeto.
Design trata de compensações, de equilibrar necessidades conflitantes.
DESIGN
![Page 11: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/11.jpg)
hWp://dcavedon.wordpress.com/2011/05/11/design-‐centrado-‐no-‐usuario/
DESIGN CENTRADO NO USUÁRIO
![Page 12: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/12.jpg)
É uma área do design especializada no projeto de artefatos interaLvos, como websites, PDA, jogos eletrônicos e so`wares.
DESIGN DE INTERAÇÃO
![Page 13: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/13.jpg)
O foco do Design de Interação são as relações humanas tecidas através dos artefatos interaKvos, que funcionam também como meios de comunicação interpessoal.
DESIGN DE INTERAÇÃO
![Page 14: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/14.jpg)
![Page 15: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/15.jpg)
![Page 16: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/16.jpg)
![Page 17: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/17.jpg)
CaracterísKcas chaves 1. Foco no usuário 2. ObjeLvos específicos da experiência
idenLficados, documentados e acordados no início do projeto.
3. Iteração que permite refinar a proposta com base em respostas de usuários e de clientes
DESIGN DE INTERAÇÃO
![Page 18: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/18.jpg)
AKvidades do Design de Interação
![Page 19: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/19.jpg)
Conhecer quem são pessoas e que Lpo de produto interaLvo úLl pode ser oferecido.
IDENTIFICAR NECESSIDADES E ESTABELECER REQUISITOS
![Page 20: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/20.jpg)
Quem interage diretamente com o produto
Quem gerencia os usuários diretos Quem recebe os resultados do sistema
Quem testa o sistema Quem toma decisão de compra
Quem uLliza produtos concorrentes
CONHECER OS USUÁRIOS
Usuário primário: usam com frequência
Usuário secundário: usam ocasionalmente ou por meio de intermediários
Usuários terciários: afetados pela introdução do sistema na empresa, ou terão influência na sua compra
![Page 21: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/21.jpg)
CONHECER OS USUÁRIOS
![Page 22: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/22.jpg)
Indivíduos ou organizações que serão afetados pelo sistema e que têm influência direta ou indireta nas necessidades atendidas por este sistema.
CONHECER OS STAKEHOLDERS
![Page 23: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/23.jpg)
USUÁRIOS E STAKEHOLDERS
![Page 24: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/24.jpg)
Não se trata de perguntar à pessoa: “Do que você precisa?”
É importante conhecer
Suas caracterísLcas Suas capacidades Seus objeLvos Como fazem isso Como fariam, se houvesse possibilidade de mudar
ENTENDER REAIS NECESSIDADES
![Page 25: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/25.jpg)
![Page 26: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/26.jpg)
![Page 27: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/27.jpg)
![Page 28: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/28.jpg)
Antes do celular não havia como levantar necessidades de uso. Mas era possível observar comportamentos de usuários de telefones convencionais:
Anotar números Procurar em agendas
Anotar recados para outras pessoas
ENTENDER REAIS NECESSIDADES
![Page 29: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/29.jpg)
![Page 30: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/30.jpg)
Sugerir ideias que atendam aos requisitos. Um modelo conceitual descreve o que o produto poderia fazer.
O design concreto considera detalhes como cores, sons, imagens, posicionamentos.
DESENVOLVER SOLUÇÕES ALTERNATIVAS
![Page 31: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/31.jpg)
![Page 32: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/32.jpg)
Implica tomar decisão considerando caracterísLcas:
Visíveis Internas
Adequação à tarefa Adequação ao perfil do usuário Adequação ao contexto
SELECIONAR ALTERNATIVAS
![Page 33: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/33.jpg)
Apresentar soluções alternaLvas que os usuários possam manipular.
A maneira mais sensata de os usuários avaliarem é interagir.
AVALIAR SOLUÇÕES
![Page 34: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/34.jpg)
![Page 35: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/35.jpg)
Documentação escrita não consegue captar a dinâmica do comportamento.
ProtóLpos evitam desentendimentos com o cliente e permite testar a viabilidade técnica da solução.
COMUNICAR A SOLUÇÃO
![Page 36: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/36.jpg)
Modelos de Ciclos de Vida
![Page 37: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/37.jpg)
1. ProblemaKzação [definição do que melhorar, fatores essenciais e influentes do problema]
2. Análise [listas de verificação | análise das funções | documentação ou análise fotográfica | recodificação do material existente | matriz de interação |desenhos esquemáLcos, técnicos e estruturais]
3. Definição do problema [lista de requisitos | valorização do peso e estabelecimento de prioridades entre os requisitos formulação do projeto: introdução, finalidade ou objeLvos, programa de trabalho e recursos humanos e de tempo]
4. Anteprojeto ou Geração de alternaKvas [técnicas de geração de alternaLvas]
5. Realização do projeto [desenvolvimento do projeto]
PROCESSO CLÁSSICO DE DESIGN
![Page 38: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/38.jpg)
MODELOS DE PROCESSO
![Page 39: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/39.jpg)
Validar com stakeholders
Consultar stakeholders
Reunião de entendimento
Levantamentos Elaborar fluxo
(modelo conceitual)
Dados sufici-‐entes?
Fluxo ok?
Elaborar protóLpo Protó-‐Lpo ok?
Testes com usuários Protó-‐Lpo ok?
Validar com demandante
Altera ção de escopo
?
ProtóLpo ok?
Iniciar desenvolvimento
Acompanhar desenvolvimento
Homo-‐logar?
Pós-‐implantação
7
13
S
N
S
N
S
N
S
N
S
N
3
S
N
7
S
N
FIM
INÍCIO 1 2 3 4
5
6
7 8
9
10
11
12
13
14 15
16
17
Altera ção de escopo
?
3
S
7N
MODELO DE PROCESSO
![Page 40: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/40.jpg)
AKvidades práKcas
![Page 41: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/41.jpg)
MODELO DUPLO DIAMANTE
Entendimento Síntese Ideação ProtoKpagem
![Page 42: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/42.jpg)
Que soluções de auto-‐atendimento podem ser propostas para a região da
Avenida Paulista?
O DESAFIO
![Page 43: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/43.jpg)
![Page 44: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/44.jpg)
![Page 45: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/45.jpg)
O que sabemos sobre auto-‐atendimento?
O que sabemos sobre Avenida Paulista e seus frequentadores?
• Desk research • CSD • Observações e entrevistas
1. ENTENDIMENTO
![Page 46: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/46.jpg)
Quais dados e informações temos?
O que esses dados e informações nos dizem?
• Insights • Personas • Requisitos
2. SÍNTESE
![Page 47: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/47.jpg)
Como atender aos requisitos levantados?
• Geração de ideias • Agrupamento e seleção de ideias
• Definição do conceito • Storyboards
3. IDEAÇÃO
![Page 48: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/48.jpg)
Mercado
Tecnologia Oportunidade
Sociedade
Necessidades
DIRECIONADORES
![Page 49: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/49.jpg)
Como comunicar e tangibilizar o conceito?
• Mapa do serviço
• Jornada de uso • ProtóLpos de baixa fidelidade • Testes com protóLpos
4. PROTOTIPAGEM
![Page 50: Oficina intensiva de design de interação](https://reader034.fdocuments.net/reader034/viewer/2022050801/5407a2468d7f7288088b4db7/html5/thumbnails/50.jpg)
Robson Santos www.interfaceando.com
@interfaceando
Muito obrigado!