Objetos de Interação

Universidade Federal de Sergipe
Departamento de Computação
Interface Humano Computador
Modelo de Componentes de IHC
Diego Martins, Diego Meneses, Felipe Vieira, Jefferson Santos
Modelo
●
Cópia de algo em tamanho bem menor que o original;
●
Um tipo ou design particular de algo;
●
Representação simplificada de algo do mundo real.
Componente
O que compõe ou entra na composição de alguma coisa.
Comunicar-se é difícil!
Comunicação – Modelo OSI
Imagem retirada de http://www.infocellar.com/networks/images/OSI-1.png
Comunicação – Funções da Linguagem
Imagem retirada de http://acd.ufrj.br/ead/tema01/lingfuncoes.html
O real não existe!
Não há nada novo!
Vídeo – Waking Life: Language
Vídeo retirado de http://www.youtube.com/watch?v=LXHy28mQO_s
Representações – mais de 6 bilhões
Imagem retirada de http://blog.rodrigoallemand.com.br/wp-content/uploads/2009/02/mapa_mundi_politico.jpg
Modelo de Componentes de IHC
Entendimentos da IHC
●
Subsistema do Software Interativo
●
Estrutura
●
Processos
Créditos: Anderson Luiz Mendes Matos, 2009. Título: Modelo MVC.
Entendimentos da IHC
●
Linguagem
●
Sistemas de sinais
●
Estrutura léxical e sintática
Interface
Sistema Informatizado
Usuário
Camadas de Abstração
●
Nível de Objetivos
●
Nível Pragmático
●
Nível Semântico
●
Nível Sintático
●
Nível Lexical
●
Nível de Primitivas
●
Nível Físico
Os Componentes das IHC
O modelo representa uma maneira de organizar a
estrutura dessas interfaces e os conhecimentos para
selecionar, configurar e avaliar os elementos.
Classes de Elementos
●
Diálogos (Sintaxe Sequencial)
●
Objetos de Interação (Sintaxe Concorrente)
●
Sistemas de Significados (Léxico)
●
Primitivas
Diálogos
●
Ações
●
●
Ação de entrada de dados ou comandos
Tarefas
●
Tarefas de diagnóstico
●
Tarefas corretivas
●
Tarefas destrutivas
Diálogos
●
●
Estilos de Diálogos
●
Diálogo por menu
●
Diálogo por linguagem de comando
●
Diálogo por preenchimento de formulário
●
Diálogo por manipulação direta
Estruturas de interações
●
Estruturas sequenciais
●
Estruturas paralelas
●
Estruturas repetitivas
Objetos de Interação
• Objetos de Interface que interagem com o usuário.
• Podem ser baseados em metáforas do mundo real.
• Padronizam elementos lexicos e sintáxicos da interface.
• Demanda de atenção.
• Containers.
• Noção de Parte
• Primeiro Plano
• Plano de Fundo
• Bordas
Objetos de Interação
• Classificação
• Paineis de Controle
• Controles Complexos
• Grupos de Controle
• Controles Simples
• Campos de Entrada
• Mostrador Simples
• Mostradores Estruturados
• Orientações
Objetos de Interação – Painés de Controle
• Objetos compostos.
• Proporcionam cenários adequados
• Divide-se em:
• Janela
• Caixa de Diálogo
• Caixa de Ação/Tarefa
• Tela de Consulta/Formulário
• Caixa de Mensagem
Objetos de Interação – Painés de Controle
- Janelas
Objetos de Interação – Painés de Controle
- Caixa de Diálogo
Não Modal
Modal
Objetos de Interação – Painés de Controle
- Caixa de Ação/Tarefa
Objetos de Interação – Painés de Controle
- Tela de Consulta e Formulário
Objetos de Interação – Painés de Controle
- Caixa de Mensagem
Objetos de Interação – Controles Complexos
• Objetos com estrutura composta.
• Navegação interna
• Seleção de outros controles e comandos
• Divide-se em:
• Painel de Menu
• Barra de Menu
• Página de Menu
• Hipertexto
• Barra de Ferramentas
• Lista de Seleção
• Caixa de Combinação
Objetos de Interação – Controles Complexos
- Painel de Menu
PopUp
Objetos de Interação – Controles Complexos
- Barra de Menu
Objetos de Interação – Controles Complexos
- Página de Menu
Objetos de Interação – Controles Complexos
- Hipertexto
Objetos de Interação – Controles Complexos
- Barra de Ferramentas
Objetos de Interação – Controles Complexos
- Lista de Seleção
Objetos de Interação – Controles Complexos
- Caixa de Combinação
Objetos de Interação – Grupos de Controle
• Organiza por Contexto as ações e controles da interface
• Divide-se em:
• Grupos de botões de comando
• Grupos de botões de radio
• Grupo de caixas de atribuição
• Grupo de campos/ mostradores de dados
Objetos de Interação – Grupos de Controle
- Grupos de botões de radio
Objetos de Interação – Grupos de Controle
- Grupo de caixas de atribuição
Objetos de Interação – Controles Simples
• Objetos com ações unicas.
• Divide-se em:
• Botão de Comando
• Botão de Seleção
• Cursor do dispositivo de apontamento
• Escala
• Dial
Objetos de Interação – Controles Simples
- Botão de Comando
Objetos de Interação – Controles Simples
- Botão de Seleção
Objetos de Interação – Controles Simples
- Cursos do Dispositivo de Apontamento
Objetos de Interação – Controles Simples
- Escala
Objetos de Interação – Campos de Entrada
• Controles editáveis.
• Textos e objetos gráficos.
• Divide-se em:
• Linha e área de comando
• Campo de Dado
• Campo de Texto
• Campo Gráfico
Objetos de Interação – Campos de Entrada
- Linha e Área de Comando
Objetos de Interação – Campos de Entrada
- Campo de Dado
Objetos de Interação – Campos de Entrada
- Campo de Texto
Objetos de Interação – Mostrador Simples
• Identificar e Descrever os dados.
• Divide-se em:
• Mostrador de Dados
Objetos de Interação – Mostradores Estruturados
• Representação dos dados.
• Facilita o exame de dados numerosos.
• Identificação de relações entre os dados.
• Critério lógico de agrupamento dos dados.
• Divide-se em:
• Lista / Coluna de dados
• Tabela de dados
• Texto
• Gráfico
• Diagrama de Figuras
• Diagrama de Fluxo
• Mapa
Objetos de Interação – Mostradores Estruturados
- Lista / Coluna de Dados
- Tabela de Dados
Objetos de Interação – Mostradores Estruturados
- Texto
Objetos de Interação – Mostradores Estruturados
- Gráfico
Objetos de Interação – Mostradores Estruturados
- Diagrama de Figuras
- Diagrama de Fluxo
Objetos de Interação – Mostradores Estruturados
- Mapa
Objetos de Interação – Orientações
• Representação dos dados.
• Facilita o exame de dados numerosos.
• Identificação de relações entre os dados.
• Critério lógico de agrupamento dos dados.
• Divide-se em:
• Rótulo
• Mensagem
• Indicador de Progressão
• Efeito Sonoro
• Motivo Melódico
• Locução e Fala
Sistemas de Significado
●
Símbolos e Sinais Arbitrários
●
Representação Concreta
●
Componentes:
●
●
●
●
●
●
●
●
Ícones
Denominações
Abreviaturas
Cores
Fontes
Textura
Vídeo Reverso
Intermitência Visual (pisca-pisca)
Primitivas
●
●
Formas Visuais
●
Cores
●
Fontes
●
Bordas
●
Arranjo (Layout)
●
Fundos (Background)
Formas Sonoras
“Novos” Componentes de Interação
IHC e Inteligência Artificial
●
Interfaces Tangíveis
●
Interfaces Intangíveis
IHC e Inteligência Artificial
AGENTE
SENSORES
Percepções
AMBIENTE
PROGRAMA
Ações
ATUADORES
Vídeo – Microsoft Vision For 2019
Vídeo retirado de http://www.youtube.com/watch?v=VpiIr8wcv0Y
Microsoft Vision For 2019
●
Alguns componentes de interação identificados:
●
Botões;
●
Janelas;
●
Formulários;
●
Menus;
●
Barra de Ferramentas;
É possível?
Vídeo – Nokia Mixed Reality
Vídeo retirado de http://www.youtube.com/watch?v=CGwvZWyLiBU
Referência Bibliográficas
• Cybis, Walter de Abreu. Engenharia de Usabilidade: Uma
Abordagem Ergonômica. 2003. Florianópolis-SC.
Obrigado!