IHC Aula06A (1)

Prévia do material em texto

Prof. Robson Rodrigues Lemos
Semestre 2018/1
2
 A seguir serão apresentados regras
ergonômicas aplicáveis à seleção e à
configuração de estilos de diálogo, janelas,
caixas de diálogo, formulários, menus, listas,
tabelas, botões, campos, rótulos, códigos,
cores, etc
 O objetivo é trazer uma amostra de
recomendações ergonômicas grande e
variada de modo a apoiar atividades de
projeto de IHC
3
Objetos de Interação
 Os objetos de interação são definidos como
objetos de software com recursos para gerar
uma série de imagens e para reagir conforme
as ações dos usuários sobre estas imagens
 Os objetos de interação ocupam as telas de
um sistema interativo e são tipicamente
baseados em metáforas de objetos do
mundo não informatizado
4
Objetos de Interação
 Os objetos de interação são construídos a
partir dos recursos dos sistemas
gerenciadores de janelas
 Verifica-se a existência de uma padronização
das interfaces de aplicativos construídos
sobre uma mesma plataforma de operação
(Windows, Macintosh e Unix)
5
Objetos de Interação
Painéis de Controle
 Os painéis de controle são composições de
objetos de todo tipo (manipulação, seleção,
edição, informação) necessários para
realização de uma ação ou tarefa
6
Objetos de Interação
Painéis de Controle
▪ Janelas
▪ As janelas apresentam graficamente os
comandos, as ferramentas e os dados de
determinada aplicação
▪ Toda janela deve possuir um título único, curto
e significativo, localizado em sua barra superior,
centrado ou alinhado pela esquerda
7
▪ Janelas
Ambiente de múltiplas janelas sobrepostas (Windows)
8
Objetos de Interação
Painéis de Controle
▪ Janelas
▪ O layout da janela deve ser padronizado,
propondo uma diagramação equilibrada, com
uma boa distribuição das áreas livres e
diferenciação clara entre as zonas funcionais
9
▪ Janelas
Janela principal apresentando diferentes zonas funcionais
10
Objetos de Interação
Painéis de Controle
▪ Formulários
▪ O formulário é uma janela desprovida de
menus e caixas de ferramentas, destinada
especificamente à entrada e consulta de dados
com opções de comandos específicos para o
registro e a manutenção desses dados
▪ O layout deve diferenciar e ordenar logicamente
as diversas categorias de dados apresentadas
11
Objetos de Interação
Painéis de Controle
▪ Formulários
▪ A distribuição dos campos de um formulário
devem respeitar a estrutura lógica dos dados e
falicitar a interação com o usuário
▪ As ações de entrada devem iniciar-se pelo
preenchimento do primeiro campo no alto à
esquerda
12
Objetos de Interação
Painéis de Controle
▪ Formulários
▪ A norma ISO 9241:17, sobre diálogos por
preenchimento de formulários, recomenda que
os rótulos e os dados sejam diferenciados
visualmente
13
▪ Formulários
Formulário onde os campos obrigatórios têm seus rótulos 
sublinhados
14
Objetos de Interação
Painéis de Controle
▪ Formulários
▪ Existem formulários especialmente destinados
a apoiar a entrada de parâmetros para a
execução de comandos
▪ Para diminuir a carga de trabalho do usuário,
os campos e seletores neste tipo de formulário
devem estar preenchidos com valores default
adequados
15
▪ Formulários
Exemplo de formulário para configuração de impressão
16
Objetos de Interação
Painéis de Controle
▪ Caixas de Diálogo
▪ Uma caixa de diálogo apoia a operação de
funções específicas e bem delimitadas
▪ Operações comuns: Definir a formatação de um
parágrafo, realizar a busca de um fragmento de
texto, controlar o acesso a um sistema, etc
17
Objetos de Interação
Painéis de Controle
▪ Caixas de Diálogo
▪ Uma caixa de diálogo pode ser modal ou não
modal. Será modal quando exigir atenção
exclusiva, ficando o usuário impedido de
realizar qualquer outra ação sobre o sistema
enquanto não terminar de interagir com ela.
Uma caixa de diálogo não modal não exige
atenção exclusiva do usuário. Ela pode ficar em
segundo plano em uma sessão de trabalho
18
▪ Caixas de Diálogo
Caixa de diálogo de uma função de controle de acesso
19
Objetos de Interação
Painéis de Controle
▪ Caixas de Mensagem
▪ São usadas para informar ao usuário sobre:
▪O que fazer nas interações
▪Em que estado se encontra o sistema
▪A resposta do sistema a uma ação do usuário
▪Uma situação perigosa, de erro ou de
anormalidade
▪Como recuperar a normalidade do sistema
20
Objetos de Interação
Painéis de Controle
▪ Caixas de Mensagem
▪ Normalmente são modais
▪ Um ou mais botões de comando (por exemplo,
Sim e Não) devem ser previstos nas caixas de
mensagem como meio de receber a
confirmação do usuário
21
▪ Caixas de Mensagem
Caixa de mensagem de status do sistema
22
Objetos de Interação
Objetos para manipulação
▪ Cursores dos dispositivos de entrada
▪ Representam a classe de objetos
verdadeiramente manipuláveis pelo usuário em
uma interface gráfica
▪ Sua forma deve ser diferenciável, ao mesmo
tempo em que não devem prejudicar a
visualização dos objetos que encobrem
23
▪ Cursores dos dispositivos de entrada
Cursor em forma de mão (IRPF 2004)
24
Objetos de Interação
Objetos para seleção
 Estes objetos de interação facilitam entradas
dos usuários por meio da seleção de uma
entre várias opções disponíveis
 Estes objetos buscam a redução do esforço
físico por parte do usuários
25
Objetos de Interação
Objetos para seleção
▪ Estruturas de menus
▪ Estruturas de menus é constituída por um
conjunto de menus individuais associados aos
comandos de um sistema
▪ Os menus que abrigam um grande número de
opções devem ser organizados em grupos ou
submenus de no máximo sete mais ou menos
duas
26
Objetos de Interação
Objetos para seleção
▪ Estruturas de menus
▪ O projetista também deve definir um balanço
adequado entre a largura e a profundidade de
uma estrutura de menus
▪ Em uma interface gráfica com o usuário clássico,
as estruturas de menu são formadas por barras
e painéis de menus
27
▪ Estruturas de menus
Exemplo de estruturas de menu
28
Objetos de Interação
Objetos para seleção
▪ Barra de menu
▪ Abriga as opções do menu principal, as quais
levam os menus secundários de um sistema ou
aplicação em interfaces baseadas em janelas
▪ A barra de menu não deve apresentar mais do
que sete mais ou menos duas opções
▪ Sua retirada da tela deve ser expressamente
comandada pelo usuário
29
Objetos de Interação
Objetos para seleção
▪ Painel de menu
▪ Composições gráficas cujas opções são
dispostas verticalmente, umas abaixo das outras
▪ Recomenda-se que os painéis de menu
apresentem sempre todas as opções
simultaneamente, diferenciando, ou
esmaecendo, as que não se encontrem ativas em
um contexto específico
30
Objetos de Interação
Objetos para seleção
▪ Painel de menu
▪ Os menus autoadaptativos que não
apresentem as opções menos usadas (por
exemplo, painéis de menus do MS Office) são
criticados por proporcionarem momentos de
incerteza aos usuários novatos e intermitentes
31
▪ Painel de menu
Indicadores de submenus (A) e de continuidade de diálogo 
(B), marcador de estado ativado (C) e teclas aceleradoras 
(D) (IRPF 2004)
32
Objetos de Interação
Objetos para seleção
▪ Barra de ferramentas
▪ É um painel de menu sem continuidade (em
submenus) cujas opções em forma de ícones
estão associadas aos comandos de que o usuário
mais necessita durante suas tarefas
▪ Objetivando a praticidade, as barras de
ferramentas devem estar organizadas à
personalização por usuários mais experientes
33
▪ Barra de ferramentas
Barra de ferramentas (IRPF 2004)
34
Objetos de Interação
Objetos para seleção
▪Lista de seleção
▪ É um menu de valores possíveis (conhecidos de
antemão pelos projetistas) para os dados a
serem entrados pelo usuário
▪ O limite máximo de opções de entrada em
uma lista é de algo em torno de 50 itens, os
quais devem ser ordenados segundo lógicas
como a frequência de uso, ordem alfabética ou
numérica
35
▪ Lista de seleção
Listas de seleção do estilo de caracteres (MS Office)
36
▪ Lista de seleção
Listas de seleção com recurso de combinação via teclado 
(IRPF 2004)
37
Objetos de Interação
Objetos para seleção
▪ Grupos seletores exclusivos (radio button)
▪ Recurso usado para tornar a entrada de dados
mais rápida e segura
▪ É empregado sempre que uma escolha simples
envolver um conjunto reduzido de valores
conhecidos (entre cinco e nove) para uma
determinada entrada
38
▪ Grupos seletores exclusivos (radio button)
Grupo de seletores exclusivos
39
Objetos de Interação
Objetos para seleção
▪ Grupos seletores não exclusivos (check box)
▪ Caso o usuário possa escolher diversas dentre as
diferentes opções para uma entrada, deve-se
prever um grupo de seletores não exclusivos
▪ Aplicam-se as mesmas recomendações para o
grupo de botões de rádio (radio buttons)
40
▪ Grupos seletores não exclusivos (check
box)
Grupo de seletores não exclusivos do gerenciador de 
filtro de mensagens 
41
Objetos de Interação
Objetos para Edição
▪ Esta classe de objetos proporciona aos
usuários a entrada de valores não
antecipáveis pelos projetistas, o que torna
a entrada crítica, pois está especificamente
sujeita a erros
42
Objetos de Interação
Objetos para Edição
▪ Campos de dados
▪ Para minimizar a possibilidade de erros, todo
campo de dados deve, além de apresentar um
rótulo identificador e convidativo, dispor de
recursos extras, como valor default, a
explicitação do formato (dd/mm/aa) e de sua
unidade (cm, pol) e dos valores possíveis (1 a 10)
43
▪ Campos de dados
Campos de dados unilineares
44
Estudo deCaso deObjetos de Interação
 Apresentação de estudo de Experiencia do
Usuário (User Experience) em Objetos de
Interação para Tecnologias Sensíveis ao
Toque e Móveis (notebooks, tablets e smart
phones)
 https://software.intel.com/en-
us/videos/how-to-rethink-navigation-for-
2in1s