Design de Sistemas Interativos, capítulo 9 do livro Interação Humano-Computador do autor David Benyon. Acompanhe nosso playlist de IHC no Youtube.

1. Interação Humano-Computador
Design

2. Objetivo
• Entender a natureza do design conceitual e do
design físico;
• Entender como a metáfora funciona em design;
• Aprender a realizar uma análise do objeto
ação;
• Especificar um design que possa ser
implementado pelos programadores.

3. O que estudamos?
• Cap 2: PACT;
• Cap 3: Design baseado em personas;
• Cap 7: Entendimento;
• Cap 8: Antecipação.

4. Processo de Design

5. Design Conceitual
• Os designers precisam garantir que seu
conceito de sistema seja facilmente aprendido
pelas pessoas e que se encaixe nas suas
expectativas e preferências.
• Um bom modelo conceitual será decorrência
de se levar em consideração a metáfora
subjacente usada para fornecer a estrutura do
design.

6. Design Conceitual
• Uma parte vital do trabalho de design é
explorar o espaço de design no abstrato;
• Mantendo-se no abstract o design entende e é
entendido pelo usuário.

7. Explorando conceitos de design
• Bill Verplank (2007) argumenta que o design se
concentra em três pontos principais:
• Como você faz? Trata-se de como nós afetamos
o mundo
• Como você sente? Trata-se de como damos
sentido ao mundo e as qualidades
• Como você sabe? Como as pessoas aprendem
e planejam

8. Explorando o espaço de design
• Um espaço de design restringe o design em
algumas dimensões enquanto permite a
exploração de alternativas em outras
dimensões.
• Brainstorming pode ser usado para expandir os
limites do cenário analisando outras
alternativas e idéias fora das dimensões
estabelecidas.

9. Metáfora em Design
• Tomar conceitos de um domínio e aplica-los
em outro é o que geralmente chamamos de
metáfora.
• No desenvolvimento de sistemas interativos
estamos constantemente tentando descrever
um novo domínio e a metáfora é uma
ferramenta chave para descrever tal domínio
com domínios que já conhecemos.

10. Exemplo

11. Exemplo

12. Combinação de Domínios
• A combinação que resulta de juntar dois
domínios terá algumas características que não
estavam nos dominós originais.
• Para que metáforas funcionem deve haver
entre os domínios conceitos genéricos que
permitam associar dois domínios originais.

13. Domínios de Conceitos

14. Design e Metáfora
• Uma das tarefas do designer de interação é
criar uma boa metáfora que ajudará as
pessoas a aprender a usar o sistema e a
entenderem o conteúdo.

15. Princípios de Design de Metáfora
• O designer deve seguir princípios para manter
boas metáforas, segue nos próximos slides
alguns detalhes que devem ser mantidos.

16. Integração
• O objetivo é manipular toda a combinação,
mantendo a teia dos relacionamentos das
idéias (metáfora).

17. Desagrupamento
• As pessoas devem ser capazes de desagrupar
a combinação e entender de onde vieram os
componentes e como eles funcionam.

18. Topologia
• Refere-se a forma como os conceitos são
organizados e estruturados.

19. Análise
• O design deve se concentrar em obter a
funcionalidade e os conceitos adequados
explorando as ramificações da metáfora.

20. Design
• Como representar através de metáforas
objetos e ações.

21. Desing Conceitual
• As histórias ajudam no entendimento e os
cenários conceituais são abstraídos de
histórias para fornecer atividades genéricas;
• Embora seja superficialmente fáceis de
construir, há sempre uma série de maneira nas
quais os cenários podem se tornar mais
eficazes, segue lista:

22. Cenários Eficazes
• Complemente os cenários com algumas das técnicas
de antecipação mais visuais;
• Em um grande grupo de design, inclua dados e
materiais reais;
• Pense bastante sobre as suposições fundamentais;
• Inclua uma boa caracterização e desenvolva várias
personas;

23. Cenários Eficazes
• Proporcione um background conceptual rico (acelera
a aceitabilidade);
• Os membros da equipe podem escrever suas próprias
versões concretas de um cenário conceitual.

24. Corpus de Cenários
• Uma boa maneira de fazer design conceitual é
realizar uma análise objeto/ação do corpus de
cenários.
• Para cada um dos cenários no corpus o
analista deve refletir sobre as descrições do
cenário, identificando os objetos que são
mencionados e as várias ações que são
realizadas..

25. Técnicas Diagramáticas
• O resultado da análise de objeto pode ser
representado como um modelo de objeto ou
como um modelo entidade-relacionamento.
• O modelo de entidade-relacionamento e o
modelo de objetos são técnicas de
diagramação comumente utilizados pelos
design.

26. Exemplo Diagrama

27. Titulo
• xx.

28. Design Físico
•

29. Linguagem de Design
• Uma linguagem de design consiste no
seguinte:
• um conjunto de elementos de design;
• alguns princípios de composição;
• grupos de situações qualificadoras.

30. Linguagens de Design
• Desenvolvendo Linguagens de Design
• Caracterização - o processo de desenvolver suposições;
• Rerregistro - criação de um novo conjunto de suposições;
• Desenvolvimento de demonstrações - usando storyboards,
protótipos, etc.;
• Avaliação das reações - Entender a reação das personas
aos designs montados;
• Evolução da linguagem - sempre pode ser melhorada.

31. Design de Interações
• A passagem de design conceitual para físico
requer que os designers aboquem funções e
conhecimento a pessoas ou dispositivos e que,
por tanto, criem intereações.
• O design de interações é a alocação de
funções a pessoas ou dispositivos.

32. Padrões de Interação
• A idéia de padrão foi adotado pelos designers
de sistemas interativos e aparece como
padrões interação.
• Pense, se mantemos padrões mantemos a
familiaridade com as ações e com o
comportamento de suas reações.

33. Técnicas de Diagramação
• Diagramas são bons elementos para
demonstrar a interação de usuários.
• Um simples fluxograma, um modelo de
sequência, um diagrama de transição de
estado ou até mesmo um diagrama de
estrutura de tarefas.

34. Fluxograma

36. Referência
• BENYON, David. Interação Humano-
Computador. 2. ed. São Paulo: Pearson, 2011.