design de interação
TRANSCRIPT
![Page 1: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/1.jpg)
Por Fabricio Araújo & Ítala Celly
![Page 2: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/2.jpg)
![Page 3: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/3.jpg)
![Page 4: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/4.jpg)
![Page 5: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/5.jpg)
![Page 6: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/6.jpg)
![Page 7: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/7.jpg)
![Page 8: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/8.jpg)
![Page 9: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/9.jpg)
![Page 10: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/10.jpg)
![Page 11: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/11.jpg)
![Page 12: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/12.jpg)
![Page 13: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/13.jpg)
![Page 14: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/14.jpg)
![Page 15: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/15.jpg)
![Page 16: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/16.jpg)
Mas o que é,
exatamente, interação?
![Page 17: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/17.jpg)
“Por interação nos referimos a
qualquer comunicação entre o usuário e o
computador, seja direta ou indireta”. DIX, FINLAY, ABOWD e BEALE (1998)
![Page 18: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/18.jpg)
Mau Design
Bom Design
![Page 19: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/19.jpg)
O que projetar
![Page 20: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/20.jpg)
• Considerar no que as pessoas são boas ou não
• Considerar o que pode auxiliar as pessoas na sua atual
maneira de fazer as coisas
• Pensar no que pode proporcionar experiências de
qualidade ao usuário
• Ouvir o que as pessoas querem e envolvê-las no design • Utilizar técnicas baseadas no usuário “testadas e
aprovadas” durante o processo de design
![Page 21: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/21.jpg)
![Page 22: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/22.jpg)
Construir um projeto interativo capaz de atender as necessidades de seus usuários é
uma missão desafiadora [ROCHA e BARNAUSKAS, 2003]
![Page 23: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/23.jpg)
“Por design de interação, entendemos
o seguinte: design de produtos interativos que
fornecem suporte às atividades cotidianas das
pessoas, seja no lar ou no trabalho.” (PREECE, ROGERS e SHARP, 2005)
![Page 24: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/24.jpg)
Arquitetos x Engenheiros
- Terry Winograd
![Page 25: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/25.jpg)
![Page 26: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/26.jpg)
Multidisciplinaridade
(PREECE, ROGERS e SHARP, 2005)
![Page 27: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/27.jpg)
Multidisciplinaridade
(PREECE, ROGERS e SHARP, 2005)
![Page 28: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/28.jpg)
Design da Interação e
Negócios
![Page 29: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/29.jpg)
O PROCESSO DO DESIGN DE INTERAÇÃO
1. Identificação das necessidades do produto avaliado e apresentação de propostas de requisitos para correção do problema.
![Page 30: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/30.jpg)
O PROCESSO DO DESIGN DE INTERAÇÃO
2. Desenvolvimento de designs alternativos ao pré-existente, capazes de preencher os requisitos propostos no item anterior.
![Page 31: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/31.jpg)
O PROCESSO DO DESIGN DE INTERAÇÃO
3. Construção de versões interativas dos designs propostos inicialmente, de maneira a serem analisados posteriormente.
![Page 32: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/32.jpg)
O PROCESSO DO DESIGN DE INTERAÇÃO
4. Avaliação do que está sendo construído, no decorrer do processo de desenvolvimento.
![Page 33: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/33.jpg)
Metas DO DESIGN DE INTERAÇÃO
![Page 34: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/34.jpg)
• Eficácia: Regra geral que busca saber o quanto um sistema é bom ao fazer o que se espera dele, permitindo que o usuário aprenda, realize seus trabalhos, acesse as informações que necessita, e realize os demais serviços que desejar de forma satisfatória.
![Page 35: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/35.jpg)
• Eficiência: Refere-se à maneira de o sistema auxiliar os usuários no desenvolvimento de suas tarefas, fornecendo suporte a serviços comuns, salvando dados a fim de evitar a repetição do fornecimento de dados, e mantendo alto nível de produtividade após o aprendizado inicial.
![Page 36: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/36.jpg)
• Segurança: Segundo PREECE, ROGERS E SHARP (2005) “implica proteger o usuário de condições perigosas e situações indesejáveis, referindo-se às condições externas” (como em maquinas de raios-X ou em indústrias químicas) e às demais situações em que o sistema deve evitar que os usuários realizem ações indesejáveis acidentalmente.
![Page 37: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/37.jpg)
• Utilidade: O sistema deve oferecer ao usuário conjuntos de funções que permitam a realização de tarefas da maneira desejada.
![Page 38: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/38.jpg)
• Learnability (ou capacidade de aprendizagem): Diz respeito ao quão fácil é aprender a utilizar determinado sistema e quanto tempo o usuário leva para iniciar o uso das tarefas fundamentais e para aprender o conjunto de operações necessárias para realizar conjuntos amplos de tarefas.
![Page 39: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/39.jpg)
• Memorability (ou capacidade de memorização): É a facilidade de lembrar como se utiliza o sistema, após já ter aprendido como fazê-lo, mesmo em casos que o sistema não é utilizado com muita freqüência. Diz respeito a que tipos de suporte de interface são fornecidos para auxiliar os usuários a lembrar como realizar tarefas.
![Page 40: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/40.jpg)
Metas DECORRENTES DA
Experiência do Usuário
![Page 41: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/41.jpg)
(PREECE, ROGERS e SHARP, 2005)
![Page 42: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/42.jpg)
PRINCÍPIOS DE DESIGN E USABILIDADE
![Page 43: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/43.jpg)
1. Visibilidade – quanto mais visíveis forem as funções do sistema, mais os usuários saberão o que fazer.
2. Feedback – refere-se ao retorno que o usuário recebe após suas ações, permitindo que ele continue suas atividades. 3. Restrições – diz respeito à especificar quais áreas e quais funções o usuário pode utilizar, desativando opções impossíveis ou, em casos de sites ou softwares, sombreando botões que não podem ser clicados. 4. Mapeamento – diz respeito à relação entre os controles e seus efeitos, geralmente seguindo uma convenção, como no caso dos botões de controle de som. 5. Consistência – diz respeito à projeção de interfaces que possuam operações comuns entre si, utilizando elementos semelhantes para a realização de tarefas parecidas. 6. Affordance – refere-se ao atributo de um objeto que permite às pessoas saber como utilizá-los, ou seja, significa “dar uma pista” (NORMAN, 1988)
![Page 44: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/44.jpg)
Design Centrado no
Usuário
![Page 45: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/45.jpg)
Design with the user, rather than design
for the user... - Terry Winograd
![Page 46: Design de interação](https://reader035.vdocuments.pub/reader035/viewer/2022062304/5593ea6c1a28abed538b4759/html5/thumbnails/46.jpg)
Bibliografia
PREECE, Jennifer; ROGERS, Yvone; SHARP, Helen. Design de Interação: Além da Interação homemcomputador. Editora Bookman, São Paulo: 2005. ROCHA, Heloísa Vieira; BARNAUSKAS, Maria Cecília Calani. Design e avaliação de interfaces humanocomputador. 2000. Disponível em: < http://pan.nied.unicamp.br/download_livro/livro-design-aval.zip>