Carregar apresentação
PublicouPietra Dinis Balsemão Alterado mais de 9 anos atrás
1
Componentes da interação humano-computador
Diálogos Objetos de interação Sistemas de significados Primitivas
2
Componentes da interação humano-computador
1. Diálogos São seqüências de interações entre o homem e o sistema. O componente elementar de classes de tarefa é uma ação.
3
Componentes da interação humano-computador
1. Diálogos 1.1. Ação Interação elementar. A menor entrada significativa do usuário acompanhada de uma resposta também significativa do sistema. Componentes da interação humano-computador
4
Componentes da interação humano-computador
1. Diálogos 1.1. Ação Em uma ação o sistema deve sempre aguardar pelo término da entrada e fornecer feedback imediato e significativo para ela. Componentes da interação humano-computador
5
Componentes da interação humano-computador
1. Diálogos 1.1. Ação O sistema deve também avisar o usuário sobre os erros nas entradas através de um sinal sonoro. Componentes da interação humano-computador
6
Componentes da interação humano-computador
1. Diálogos 1.1. Ação Nas ações de entrada que envolvem tratamento demorado, deve ser dada atenção às questões de feedback, informando sobre a indisponibilidade, tempo esperado, resultado alcançado e uma opção para a interrupção do processo deve estar disponível. Componentes da interação humano-computador
7
Componentes da interação humano-computador
1. Diálogos 1.2. Tarefa Componentes da interação humano-computador Seqüência de ações ou interações elementares.
8
Componentes da interação humano-computador
1. Diálogos 1.2. Tarefa Componentes da interação humano-computador O sistema de controle informatizado deve apoiar o usuário, apresentando-lhe dados críticos de modo diferenciado e lhe propondo ajuda on-line, com orientações exibidas em linguagem simples e objetiva.
9
Componentes da interação humano-computador
1. Diálogos 1.2. Tarefa Componentes da interação humano-computador É aconselhável que as mensagens de erro tenham um nível de detalhe configurável, de modo a que sejam adaptadas ao tipo de usuário, e que tenham um conteúdo dinâmico, variando no caso da reincidência de erros.
10
Componentes da interação humano-computador
2. Objetos de interação É um objeto de software cujo processamento gera uma imagem que é apresentada ao usuário e com a qual ele pode interagir.
11
Componentes da interação humano-computador
Ocupam as telas das interfaces e podem se basear em metáforas de objetos do mundo não informatizado, representando botões, janelas, menus, interruptores etc. 2. Objetos de interação
12
Componentes da interação humano-computador
A metáfora não tem a função de espelhar os objetos reais fielmente, mas apenas fazer referência a estes. Exemplos: funções copiar, colar e recortar, associadas aos ícones que as representam. 2. Objetos de interação
13
Componentes da interação humano-computador
As partes de um objeto variam de ambiente para ambiente. Geralmente são definidos como primeiro plano, plano de fundo e bordas. O primeiro plano recebe as palavras e ícones, o plano de fundo recebe os motivos e sombras. 2. Objetos de interação
14
Componentes da interação humano-computador - exemplos
Plano de fundo Bordas Primeiro plano
15
Componentes da interação humano-computador
3. Sistema de significado Relações simbólicas estabelecidas na transmissão de um conteúdo de informação. Essas relações referem-se a entidades como símbolos e sinais.
16
Componentes da interação humano-computador
3. Sistema de significado 3.1. Ícones Componentes da interação humano-computador Substituem uma unidade de significado (idéia, conceito, ação…) que representada com texto ocuparia mais espaço.
17
Componentes da interação humano-computador
3. Sistema de significado 3.1. Ícones Componentes da interação humano-computador Pode corresponder a diferentes tipos de representações. É recomendável utilizar sempre ícones prontos, respeitando seus significados.
18
Componentes da interação humano-computador - exemplos
Ícones de
19
Componentes da interação humano-computador - exemplos
Ícones de Compra
20
Componentes da interação humano-computador
3. Sistema de significado 3.1. Ícones Componentes da interação humano-computador Os ícones devem ser significativos, apropriados, coerentes, consistentes, claros, simples e definidos em pequeno número. Seu tamanho deve ser econômico em relação ao espaço de tela.
21
Componentes da interação humano-computador
3. Sistema de significado 3.1. Ícones Autores indicam a necessidade de um rótulo identificativo centrado na margem inferior, ou de bolhas de ajuda (tool-tips) - uma pequena descrição de um objeto que aparece na tela ao se posicionar o cursor do dispositivo de apontamento sobre ele.
22
Bolhas de ajuda (tool tips)
Componentes da interação humano-computador - exemplos Bolhas de ajuda (tool tips)
23
Componentes da interação humano-computador
3. Sistema de significado 3.1. Ícones Componentes da interação humano-computador CUIDADOS: Os ícones são subjetivos, estão sujeitos à interpretação individual e subjetiva de cada pessoa a partir de sua experiência.
24
Componentes da interação humano-computador - exemplos
Disposição de ícones
25
Componentes da interação humano-computador - exemplos
Disposição de ícones
26
Componentes da interação humano-computador - exemplos
Disposição de ícones
27
Componentes da interação humano-computador
3. Sistema de significado 3.2. Código de formas Componentes da interação humano-computador Envolvem os sinais geométricos construídos a partir de primitivas gráficas (linha, arco, retângulo etc.). Os círculos, quadrados, triângulos e retângulos são utilizados por exemplo, para codificar classes de eventos em gráficos estatísticos.
28
Componentes da interação humano-computador - exemplos
Códigos de formas
29
Componentes da interação humano-computador
3. Sistema de significado 3.3. Denominações Componentes da interação humano-computador Constituem códigos de expressão textual cujos termos são retirados da linguagem utilizada pela população de usuários em sua tarefa com o sistema.
30
Componentes da interação humano-computador
3. Sistema de significado 3.3. Denominações Componentes da interação humano-computador A linguagem textual da interface deve ser constituída de termos empregados no contexto de trabalho, portanto significativos e familiares para o usuário.
31
Componentes da interação humano-computador - exemplos
Denominações
32
Componentes da interação humano-computador
3. Sistema de significado 3.4. Abreviaturas Componentes da interação humano-computador Devem ser utilizadas somente quando absolutamente necessário ou quando o seu significado for mais facilmente perceptível pelo usuário do que a denominação que o gerou.
33
Componentes da interação humano-computador
3. Sistema de significado 3.4. Abreviaturas Componentes da interação humano-computador São diminutivos das denominações. As abreviaturas devem ser distintas entre si, claras, curtas e significativas.
34
Componentes da interação humano-computador - exemplos
Abreviaturas
35
Componentes da interação humano-computador
3. Sistema de significado 3.5. Código de cores Componentes da interação humano-computador A utilização das cores em uma interface exerce papel importante, sendo suas finalidades estratégicas: a transmissão de informações, chamar a atenção, contrastar e associar objetos de interação.
36
Componentes da interação humano-computador
3. Sistema de significado 3.5. Código de cores Componentes da interação humano-computador Para uma eficaz utilização deve-se levar em consideração: a legibilidade final da informação; os efeitos das cores sobre a performance cognitiva do usuário e; as possibilidades dos dispositivos físicos.
37
Componentes da interação humano-computador
3. Sistema de significado 3.5. Código de cores Componentes da interação humano-computador Deve respeitar estereótipos naturais: o vermelho deve ser utilizado para perigo, alarme, alerta, calor e comandos de interrupção; amarelo para advertências, teste e lentidão;
38
Componentes da interação humano-computador
3. Sistema de significado 3.5. Código de cores Componentes da interação humano-computador verde para passagem livre, normalidade, vegetação e segurança; o azul para frio, água, céu e calma; cinza para inatividade, neutralidade; o branco é uma cor neutra.
39
Componentes da interação humano-computador
3. Sistema de significado 3.6. Código de textura Componentes da interação humano-computador É utilizada como codificação optativa na apresentação de gráficos e mapas. Se utilizadas juntamente com palavras elas devem ser escolhidas de modo a não prejudicar a leitura e/ou interpretação do texto.
40
Componentes da interação humano-computador
3. Sistema de significado 3.6. Código de textura Componentes da interação humano-computador É interessante o uso das texturas em substituição às cores, quando o dispositivo de apresentação de informação for limitado em relação ao número de cores (monocromático, por exemplo).
41
Componentes da interação humano-computador - exemplos
Código de textura
42
Componentes da interação humano-computador
3. Sistema de significado 3.7. Intermitência visual Componentes da interação humano-computador A intermitência pode ser utilizada para o destaque em situações excepcionais, quando deseja-se chamar a atenção do usuário para a ação a ser tomada, em caráter de urgência, por exemplo.
43
Componentes da interação humano-computador
4. As primitivas Componentes da interação humano-computador Formas para a expressão de um objeto de interação que resultam da articulação de substâncias perceptíveis ao sistema cognitivo humano.
44
Componentes da interação humano-computador
4. As primitivas 4.1. Cores Componentes da interação humano-computador Recomenda-se cuidado com o uso indiscriminado da cor. É aconselhável que primeiro se faça o projeto em Preto e Branco e depois o colora com cuidado, usando cores neutras.
45
Componentes da interação humano-computador
4. As primitivas 4.1. Cores Componentes da interação humano-computador Use poucas cores e com mesma luminância (brilho) e utilize cores brilhantes com cautela. As cores causam sensações às pessoas
46
Componentes da interação humano-computador
4. As primitivas 4.1. Cores Componentes da interação humano-computador verde descansa; o vermelho atrai a atenção e pode causar irritação; azul dá sono; o amarelo desperta.
47
Componentes da interação humano-computador
4. As primitivas 4.1. Cores Componentes da interação humano-computador Usar cores de forma consistente; evitar usar cores opostas em áreas muito próximas.
48
Cromostereopsia - Qual cor está em primeiro plano?
Componentes da interação humano-computador - exemplos Primitivas - Cores Cromostereopsia - Qual cor está em primeiro plano?
49
Componentes da interação humano-computador - exemplos
Primitivas - Cores
50
Qual dos vermelhos é mais brilhante?
Componentes da interação humano-computador - exemplos Primitivas - Cores Qual dos vermelhos é mais brilhante?
51
Os quadrados pequenos são de cores diferentes ou da mesma cor?
Componentes da interação humano-computador - exemplos Primitivas - Cores Os quadrados pequenos são de cores diferentes ou da mesma cor?
52
Os quadrados pequenos são de cores diferentes ou da mesma cor?
Componentes da interação humano-computador - exemplos Primitivas - Cores Os quadrados pequenos são de cores diferentes ou da mesma cor?
53
Componentes da interação humano-computador - exemplos
Primitivas - Cores
54
Componentes da interação humano-computador - exemplos
Primitivas - Cores
55
Componentes da interação humano-computador
4. As primitivas 4.2. Fontes Componentes da interação humano-computador Envolve basicamente o uso da serifa e o espaçamento entre os caracteres.
56
Componentes da interação humano-computador
4. As primitivas 4.2. Fontes Componentes da interação humano-computador Em vídeos de baixa resolução, a leitura de fontes com serifa é prejudicada, pois podem confundir a interpretação do usuário. Recomenda-se, para conteúdos a serem lidos em monitores de computador, a não utilização de serifa.
57
A a A a Componentes da interação humano-computador - exemplos Fontes
Fontes com serifa Fontes sem serifa
58
Componentes da interação humano-computador
4. As primitivas 4.2. Fontes Componentes da interação humano-computador Quanto ao tamanho da fonte, não utilizar menor que 10 pontos, limitando o uso de fontes diferentes para textos (até dois tipos).
59
Componentes da interação humano-computador
4. As primitivas 4.2. Fontes Componentes da interação humano-computador Deve-se evitar também fontes muito grandes, que pareçam “gritar” com o usuário; Evitar textos só com maiúsculas, e não exagerar com o sublinhado, negrito e itálico.
60
Componentes da interação humano-computador
4. As primitivas 4.3. Bordas Componentes da interação humano-computador As bordas desempenham papel importante na leveza desses objetos. Essa característica pode ser assegurada através da natureza simples de seus traços e da distância segura entre as bordas e textos em geral.
61
Componentes da interação humano-computador
4. As primitivas 4.4. Arranjo ou layout Componentes da interação humano-computador É a forma de disposição dos itens de informação em uma janela, caixa de diálogo ou de mensagem.
62
Componentes da interação humano-computador
4. As primitivas 4.4. Arranjo ou layout Componentes da interação humano-computador Procurar definir um grid para o layout das telas. Definir alinhamentos para os elementos conforme as linhas e colunas do grid;
63
Componentes da interação humano-computador - exemplos
Arranjo ou layout
64
Componentes da interação humano-computador
4. As primitivas 4.4. Arranjo ou layout Componentes da interação humano-computador Definir focos de atenção (zonas de trabalho) agrupando os elementos interrelacionados. Colocar em evidência o que for mais importante no grupo (mais à esquerda, colorido etc.);
65
Componentes da interação humano-computador - exemplos
Arranjo ou layout
66
Componentes da interação humano-computador - exemplos
Arranjo ou layout
67
Componentes da interação humano-computador
4. As primitivas 4.4. Arranjo ou layout Componentes da interação humano-computador Distribuir as informações da esquerda para a direita, em função da importância, destaque ou cronologia;
68
Componentes da interação humano-computador - exemplos
Arranjo ou layout
69
Componentes da interação humano-computador
4. As primitivas 4.4. Arranjo ou layout Componentes da interação humano-computador Dar equilíbrio às telas distribuindo os elementos de forma balanceada. Evitar áreas vazias ou altamente carregada de componentes;
70
Componentes da interação humano-computador
4. As primitivas 4.4. Arranjo ou layout Componentes da interação humano-computador Manter a consistência entre os layouts das telas (padronização).
71
Componentes da interação humano-computador - exemplos
Arranjo ou layout
72
Componentes da interação humano-computador - exemplos
Arranjo ou layout
73
Componentes da interação humano-computador
4. As primitivas 4.5. Fundos ou background Componentes da interação humano-computador Deve-se definir os fundos com cores neutras, que garantam um contraste adequado com os textos e rótulos em primeiro plano.
74
Componentes da interação humano-computador - exemplos
Fundos ou background
75
Componentes da interação humano-computador
4. As primitivas 4.5. Fundos ou background Componentes da interação humano-computador É recomendável não carregar o fundo da tela com elementos gráficos (para áreas de trabalho e leitura).
76
Componentes da interação humano-computador - exemplos
Fundos ou background
77
Componentes da interação humano-computador
4. As primitivas 4.5. Fundos ou background Componentes da interação humano-computador As cores e padrões para os fundos podem ser usados para diferenciar tipos de telas/áreas.
78
Componentes da interação humano-computador - exemplos
Fundos ou background
79
Componentes da interação humano-computador - exemplos
Fundos ou background
80
Componentes da interação humano-computador - exemplos
Fundos ou background
81
Componentes da interação humano-computador
4. As primitivas 4.6. Formas sonoras Componentes da interação humano-computador Apresenta os atributos de expressão "timbre" e "freqüência", utilizados para destaque ou diferenciação do sinal sonoro.
Apresentações semelhantes
© 2024 SlidePlayer.com.br Inc.
All rights reserved.