SlideShare uma empresa Scribd logo
Interface Homem-Computador Percepção Visual
Percepção Visual 1 – Organização Visual da Informação Cria a estrutura de navegação mínima para o usuário poder interagir com o sistema Define as áreas.
Percepção Visual 2 – Texto Serifa   vs. Sem Serifa  (Papel vs. Vídeo ) Não usar Caixa Alta Principio do Contraste
Percepção Visual 3 – Ícones Um ícone não deve requerer de texto para ser compreendido.  O significado de um ícone pode variar de acordo ao contexto em que está inserido
Percepção Visual 4 – Cores As cores em si mesmas não possuem significado, mas auxiliam a reforçar uma mensagem. O contexto (região/país) influência no seu significado Existem certas regras para um correto uso das cores (complementares, etc)
Modelo Mental Definição Um estrutura mental criada pelos seres humanos que contêm diversos elementos e suas inter-relações, com o objetivo de fornecer informação e organização.
Modelo Mental Categorias Funcional: Contém a informação necessária para permitir a operação de um dispositivo; (mais simples) Estrutural: Contém a informação a respeito do funcionamento interno de um dispositivo, bem como sua operação. (mais complexo)
Modelo Mental Metáforas O uso de metáforas visuais auxilia na criação de modelos mentais funcionais que permitem a operação de estruturas interativas. Exemplo: Interfaces DESKTOP
Modelo Mental Atenção O maior problema no desenvolvimento de interfaces é que o programador do sistema possui um  modelo mental estrutural , enquanto que o usuário apenas precisa um  modelo mental funcional .  A interface deve fazer a ligação entre estes dois modelos mentais.
Fim

Mais conteúdo relacionado

PDF
Ergonomia cognitiva em EAD
PDF
Percurso cognitivo
PDF
Design de Interação - Método de Inspeção Semiótica
PPT
comunicação e cartaz
PDF
Aula - Interfaces e Estilos de Interação
PPTX
Interface e Usabilidade: Como levar o usuário onde queremos!
PDF
Usabilidade de Interfaces - Parte 1
PPT
Interação Humano Computador Capítulo 9 - Design
Ergonomia cognitiva em EAD
Percurso cognitivo
Design de Interação - Método de Inspeção Semiótica
comunicação e cartaz
Aula - Interfaces e Estilos de Interação
Interface e Usabilidade: Como levar o usuário onde queremos!
Usabilidade de Interfaces - Parte 1
Interação Humano Computador Capítulo 9 - Design

Semelhante a IHC Parte3 (20)

PDF
Aula sobre Projeto de interface de usuário
PPTX
Interface web
PPTX
Interface homem maquina introdução
PPTX
Interface homem maquina introdução
ODP
Aula: Princípios de design de interfaces
PDF
Introducao ihm
PDF
Design de Interação - Entendendo, conceituando e abordagem centrada no usuário
PPTX
Aula 3 - Fatores Humanos
ODP
Design de Interação: O que você tem a ver com isso?!
PDF
Apostial i.h.c - apostila oficial
PPTX
Aula Teste sobre IHC, usabilidade e affordance
PDF
Design de Interação Mobile
PDF
Curso/Aula de Interface Homem Máquina
PDF
Jai apostila
PDF
Aula 6 - Design e Processo de Design de Interfaces de Usuário
PPT
Aula 9 interfaces- graduação Design
Aula sobre Projeto de interface de usuário
Interface web
Interface homem maquina introdução
Interface homem maquina introdução
Aula: Princípios de design de interfaces
Introducao ihm
Design de Interação - Entendendo, conceituando e abordagem centrada no usuário
Aula 3 - Fatores Humanos
Design de Interação: O que você tem a ver com isso?!
Apostial i.h.c - apostila oficial
Aula Teste sobre IHC, usabilidade e affordance
Design de Interação Mobile
Curso/Aula de Interface Homem Máquina
Jai apostila
Aula 6 - Design e Processo de Design de Interfaces de Usuário
Aula 9 interfaces- graduação Design
Anúncio

Último (7)

PDF
Cópia de Sistema Disgestório.pdf.pdfbnn
PPTX
O Rei Leão Resumo do Filme da Disney de forma sintética
PDF
MONOGRAFIA PRONTO GERONTOLOGIA 2025 ABNT.pdf
PDF
Livro+para+colorir+Bah+que+Tri( 1).pdf dezenas
PDF
Apresentação Simples Básica Elegante e Profissional Preto Branco_20250606_001...
PDF
Bah,+que+tri+II_20250716_165646_0000.pdf
PDF
Alem-da-Dislexia-Explorando-a-Disgrafia-Disortografia-e-Discalculia (1).pdf
Cópia de Sistema Disgestório.pdf.pdfbnn
O Rei Leão Resumo do Filme da Disney de forma sintética
MONOGRAFIA PRONTO GERONTOLOGIA 2025 ABNT.pdf
Livro+para+colorir+Bah+que+Tri( 1).pdf dezenas
Apresentação Simples Básica Elegante e Profissional Preto Branco_20250606_001...
Bah,+que+tri+II_20250716_165646_0000.pdf
Alem-da-Dislexia-Explorando-a-Disgrafia-Disortografia-e-Discalculia (1).pdf
Anúncio

IHC Parte3

  • 2. Percepção Visual 1 – Organização Visual da Informação Cria a estrutura de navegação mínima para o usuário poder interagir com o sistema Define as áreas.
  • 3. Percepção Visual 2 – Texto Serifa vs. Sem Serifa (Papel vs. Vídeo ) Não usar Caixa Alta Principio do Contraste
  • 4. Percepção Visual 3 – Ícones Um ícone não deve requerer de texto para ser compreendido. O significado de um ícone pode variar de acordo ao contexto em que está inserido
  • 5. Percepção Visual 4 – Cores As cores em si mesmas não possuem significado, mas auxiliam a reforçar uma mensagem. O contexto (região/país) influência no seu significado Existem certas regras para um correto uso das cores (complementares, etc)
  • 6. Modelo Mental Definição Um estrutura mental criada pelos seres humanos que contêm diversos elementos e suas inter-relações, com o objetivo de fornecer informação e organização.
  • 7. Modelo Mental Categorias Funcional: Contém a informação necessária para permitir a operação de um dispositivo; (mais simples) Estrutural: Contém a informação a respeito do funcionamento interno de um dispositivo, bem como sua operação. (mais complexo)
  • 8. Modelo Mental Metáforas O uso de metáforas visuais auxilia na criação de modelos mentais funcionais que permitem a operação de estruturas interativas. Exemplo: Interfaces DESKTOP
  • 9. Modelo Mental Atenção O maior problema no desenvolvimento de interfaces é que o programador do sistema possui um modelo mental estrutural , enquanto que o usuário apenas precisa um modelo mental funcional . A interface deve fazer a ligação entre estes dois modelos mentais.
  • 10. Fim