Download - Modelo de Componentes de IHC

Transcript
Page 1: Modelo de Componentes de IHC

Diego Martins, Diego Meneses, Felipe Vieira, Jefferson Santos

Modelo de Componentes de IHC

Universidade Federal de SergipeDepartamento de ComputaçãoInterface Humano Computador

Page 2: Modelo de Componentes de IHC

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.

Page 3: Modelo de Componentes de IHC

Componente

O que compõe ou entra na composição de alguma coisa.

Page 4: Modelo de Componentes de IHC

Comunicar-se é difícil!

Page 5: Modelo de Componentes de IHC

Comunicação – Modelo OSI

Imagem retirada de http://www.infocellar.com/networks/images/OSI-1.png

Page 6: Modelo de Componentes de IHC

Comunicação – Funções da Linguagem

Imagem retirada de http://acd.ufrj.br/ead/tema01/lingfuncoes.html

Page 7: Modelo de Componentes de IHC

O real não existe!

Page 8: Modelo de Componentes de IHC

Não há nada novo!

Page 9: Modelo de Componentes de IHC

Vídeo – Waking Life: Language

Vídeo retirado de http://www.youtube.com/watch?v=LXHy28mQO_s

Page 10: Modelo de Componentes de IHC

Representações – mais de 6 bilhões

Imagem retirada de http://blog.rodrigoallemand.com.br/wp-content/uploads/2009/02/mapa_mundi_politico.jpg

Page 11: Modelo de Componentes de IHC

Modelo de Componentes de IHC

Page 12: 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.

Page 13: Modelo de Componentes de IHC

Entendimentos da IHC

● Linguagem● Sistemas de sinais

● Estrutura léxical e sintática

Interface

Sistema Informatizado Usuário

Page 14: Modelo de Componentes de IHC

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

Page 15: Modelo de Componentes de IHC

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.

Page 16: Modelo de Componentes de IHC

Classes de Elementos

● Diálogos (Sintaxe Sequencial)

● Objetos de Interação (Sintaxe Concorrente)

● Sistemas de Significados (Léxico)

● Primitivas

Page 17: Modelo de Componentes de IHC

Diálogos

● Ações● Ação de entrada de dados ou comandos

● Tarefas● Tarefas de diagnóstico

● Tarefas corretivas

● Tarefas destrutivas

Page 18: Modelo de Componentes de IHC

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

Page 19: Modelo de Componentes de IHC

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

Page 20: Modelo de Componentes de IHC

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

Page 21: Modelo de Componentes de IHC

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

Page 22: Modelo de Componentes de IHC

- Janelas

Objetos de Interação – Painés de Controle

Page 23: Modelo de Componentes de IHC

- Caixa de Diálogo

Não Modal Modal

Objetos de Interação – Painés de Controle

Page 24: Modelo de Componentes de IHC

- Caixa de Ação/Tarefa

Objetos de Interação – Painés de Controle

Page 25: Modelo de Componentes de IHC

- Tela de Consulta e Formulário

Objetos de Interação – Painés de Controle

Page 26: Modelo de Componentes de IHC

- Caixa de Mensagem

Objetos de Interação – Painés de Controle

Page 27: Modelo de Componentes de IHC

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

Page 28: Modelo de Componentes de IHC

Objetos de Interação – Controles Complexos

- Painel de Menu

PopUp

Page 29: Modelo de Componentes de IHC

Objetos de Interação – Controles Complexos

- Barra de Menu

Page 30: Modelo de Componentes de IHC

Objetos de Interação – Controles Complexos

- Página de Menu

Page 31: Modelo de Componentes de IHC

Objetos de Interação – Controles Complexos

- Hipertexto

Page 32: Modelo de Componentes de IHC

Objetos de Interação – Controles Complexos

- Barra de Ferramentas

Page 33: Modelo de Componentes de IHC

Objetos de Interação – Controles Complexos

- Lista de Seleção

Page 34: Modelo de Componentes de IHC

Objetos de Interação – Controles Complexos

- Caixa de Combinação

Page 35: Modelo de Componentes de IHC

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

Page 36: Modelo de Componentes de IHC

Objetos de Interação – Grupos de Controle

- Grupos de botões de radio

Page 37: Modelo de Componentes de IHC

Objetos de Interação – Grupos de Controle

- Grupo de caixas de atribuição

Page 38: Modelo de Componentes de IHC

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

Page 39: Modelo de Componentes de IHC

Objetos de Interação – Controles Simples- Botão de Comando

Page 40: Modelo de Componentes de IHC

Objetos de Interação – Controles Simples- Botão de Seleção

Page 41: Modelo de Componentes de IHC

Objetos de Interação – Controles Simples- Cursos do Dispositivo de Apontamento

Page 42: Modelo de Componentes de IHC

Objetos de Interação – Controles Simples- Escala

Page 43: Modelo de Componentes de IHC

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

Page 44: Modelo de Componentes de IHC

Objetos de Interação – Campos de Entrada- Linha e Área de Comando

Page 45: Modelo de Componentes de IHC

Objetos de Interação – Campos de Entrada- Campo de Dado

Page 46: Modelo de Componentes de IHC

Objetos de Interação – Campos de Entrada- Campo de Texto

Page 47: Modelo de Componentes de IHC

Objetos de Interação – Mostrador Simples

• Identificar e Descrever os dados.

• Divide-se em:

• Mostrador de Dados

Page 48: Modelo de Componentes de IHC

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

Page 49: Modelo de Componentes de IHC

- Lista / Coluna de Dados- Tabela de Dados

Objetos de Interação – Mostradores Estruturados

Page 50: Modelo de Componentes de IHC

- Texto

Objetos de Interação – Mostradores Estruturados

Page 51: Modelo de Componentes de IHC

- Gráfico

Objetos de Interação – Mostradores Estruturados

Page 52: Modelo de Componentes de IHC

- Diagrama de Figuras- Diagrama de Fluxo

Objetos de Interação – Mostradores Estruturados

Page 53: Modelo de Componentes de IHC

- Mapa

Objetos de Interação – Mostradores Estruturados

Page 54: Modelo de Componentes de IHC

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

Page 55: Modelo de Componentes de IHC

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)

Page 56: Modelo de Componentes de IHC

Primitivas

● Formas Visuais● Cores

● Fontes

● Bordas

● Arranjo (Layout)

● Fundos (Background)

● Formas Sonoras

Page 57: Modelo de Componentes de IHC

“Novos” Componentes de Interação

Page 58: Modelo de Componentes de IHC

IHC e Inteligência Artificial

● Interfaces Tangíveis

● Interfaces Intangíveis

Page 59: Modelo de Componentes de IHC

AMBIENTE

IHC e Inteligência Artificial

SENSORES

PROGRAMA

ATUADORES

Percepções

Ações

AGENTE

Page 60: Modelo de Componentes de IHC

Vídeo – Microsoft Vision For 2019

Vídeo retirado de http://www.youtube.com/watch?v=VpiIr8wcv0Y

Page 61: Modelo de Componentes de IHC

Microsoft Vision For 2019

● Alguns componentes de interação identificados:

● Botões;

● Janelas;

● Formulários;

● Menus;

● Barra de Ferramentas;

Page 62: Modelo de Componentes de IHC

É possível?

Page 63: Modelo de Componentes de IHC

Vídeo – Nokia Mixed Reality

Vídeo retirado de http://www.youtube.com/watch?v=CGwvZWyLiBU

Page 64: Modelo de Componentes de IHC

• Cybis, Walter de Abreu. Engenharia de Usabilidade: Uma Abordagem Ergonômica. 2003. Florianópolis-SC.

Referência Bibliográficas

Page 65: Modelo de Componentes de IHC

Obrigado!