Interação Homem-Computador:

As Interfaces
O que é Interface?

É o conjunto de instrumentos/dispositivos disponíveis

para que alguém possa manusear algum equipamento.

É por meio dela que encontramos as opções,

informações, características.
Interação Humano-Computador

É uma subárea da computação que busca entender

como as pessoas utilizam os computadores, bem como
investigar outras formas de interação, para que o uso
do computador seja cada vez mais fácil e natural.

Outra definição: É o conjunto de processos, diálogos, e

ações através dos quais o usuário humano interage com
um computador.
Interação Humano-Computador
É uma área interdisciplinar abrangendo:
Ciência da computação (aplicação, projeto e
engenharia de interfaces humanas);

Psicologia (aplicação de teorias dos processos

cognitivos e análise empírica do comportamento do
usuário de computadores);

Sociologia e Antropologia (interações entre tecnologia,

trabalho e organização) e projeto industrial (produtos
interativos).
Interação com o Computador

O que se vê na tela do
computador influência na
forma que interagimos com
ele.

Manusear significa manipular

os dispositivos de entrada.
Interação com o Computador

Logo a interface que serve de interconexão entre dois

sistemas que trocam informações, sendo eles:

1 - de um lado o computador
2 - e de outro, o ser humano
Qual seria a interface ideal?

O ideal seria ter uma interface tão simples e fácil de

utilizar, que as pessoas iriam, naturalmente, interagir
com ela, sem se preocupar em entender toda a
complexidade das funcionalidades.
Nielsen (2000), Rocha e Baranauskas (2003) e Norman (2006).
 A importância da Interface

Muitas pessoas consideram ruim o sistema por não

conseguirem utilizá-los.

A interface é um fator decisivo na escolha do software.

Quais as funcionalidades existentes no sistema?
É possível entender o que há nele?
Ele atende às minhas necessidades?
 Terceira fase: WINP GUIS
(Window, Icons, Menus,
Pointing Devices –
Graphical User Interface)
Realidade aumentada
Interfaces orgânicas
Tecnologias usáveis
 Interfaces tangíveis
Mais interfaces tangíveis
http://tangible.media.mit.edu/projects.php
Princípios de um bom Design

Desenvolvido pelo pesquisador Norman (2006).

Baseado nas frustrações que as pessoas experimentam
com objetos do cotidiano.
“Quando algo é desenvolvido sem pensar nos
fatores humanos ou sem considerar a maneira que as
pessoas pensam e agem, muitas vezes, torna-se
impossível de ser utilizado de modo satisfatório.”
Interface Gráfica do Usuário

Na Interação Humano Computador, a interface de gráfica do usuário

(Graphical User Interface - GUI) refere-se às informações gráficas,
textuais e auditivas apresentadas ao usuário e às sequências de
controle (como comandos de teclado ou movimentos do mouse) para
interagir com o programa.

O usuário seleciona símbolos (widgets), que são elementos gráficos,

como: janelas, botões, menus, ícones, barras de rolagem etc.
IHC – Estilos de interação
Estilos de interação encontrados nas interfaces:

1. LINGUAGEM DE COMANDO
2. JANELAS
3. MENUS
4. FORMULÁRIOS
5. CAIXAS
6. INTERFACES GRÁFICAS
7. OUTROS ESTILOS DE INTERAÇÃO
o TOUCHSCREENS
o SÍNTESE DE VOZ
o RECONHECIMENTO DE FALA
 IHC - Estilos de interação - Linguagem de
comando
Um dos primeiros estilos de interação foi a Linguagem de comando,
feita a partir de comandos, parâmetros e/ou opções que são
digitadas pelo usuário.

Compreendem um estilo de comunicação rápido e poderoso,

preferido pelos usuários avançados e com habilidade de digitação.
Entretanto, estes comandos necessitam de treinamento e boa
capacidade de memória do usuário para lembrar a sintaxe
precisamente.
IHC - Estilos de interação - Linguagem de
comando

Exemplo: Linguagem de Comandos do DOS .

 IHC - Estilos de interação - Janelas
Toda a interação entre o usuário e o sistema ocorre através das
janelas, que constituem o elemento central das interfaces gráficas.

As janelas representam uma grande evolução na interação humano-

computador, entretanto se o usuário abrir muitas janelas durante a
interação, sua área de trabalho pode se tornar bastante confusa.

Existem dois tipos de janelas:

o Janela primária
o Janela secundária
 IHC – Elementos gráficos de interface
Menu
Menu em 2 níveis (menu e submenu)
 IHC – Elementos gráficos de interface

Menu – conceito

Um menu é uma lista de itens na qual uma ou mais seleções podem

ser feitas pelo usuário. É um dos mais populares estilos de interação,
pois reduz o número de memorizações (o usuário seleciona os itens
da lista diretamente), reduzindo o número de erros possíveis.
Entretanto, usuários experientes geralmente acham lenta a operação
de ativação e desativação de menus, além do espaço na tela ficar
comprometido quando são ativados.
A função básica de qualquer menu é oferecer escolhas ao usuário.
Existem várias formas de realizar isto, como por exemplo, menus push-
button, menus radio-button ou radio-box, menus check-button ou
check-box e dentre outros.
 IHC – Elementos gráficos de interface
Menu
Menu em cascata
 IHC – JANELA

Janela é a área de trabalho para o projetista de interface. Na

janela são inseridos os objetos (elementos de interação com o
usuário).

Janelas primárias
A janela primária é a janela principal de uma aplicação, através
da qual são geradas todas as restantes janelas. É a única janela
a partir da qual a aplicação pode ser fechada.
 IHC – JANELA

Janelas secundárias
As janelas secundárias são geradas através da janela primária.
Por exemplo, numa aplicação de processamento de texto, cada
documento aberto aparece numa janela secundária.
- output de mensagens (quadros de mensagem)
- input de informações adicionais (quadros de diálogo,
formulários)

OBS: As caixas de diálogo e de mensagens podem ser

consideradas como janelas secundárias.
 IHC – JANELA

Janelas podem ser do tipo:

1. SDI (Single Document Interface);

2. MDI (Multiple Document Interface);
3. Modal;
4. Não Modal;
 IHC – JANELA

SDI – Single Document Interface

Modelo mais simples de janela:

Permite que apenas uma janela

(documento) seja aberta por vez.

Este tipo de janela evita que

atividades de diferentes naturezas
se misturem, diminuindo assim o
risco de o usuário se “perder” no
sistema.

Exemplo: WordPad (Microsoft)

 IHC – JANELA

MDI – Multiple Document Interface

Modelo mais complexo de janela:

Permite que várias janelas sejam

abertas de uma só vez dentro de
uma janela principal.

Este tipo de sistema é

recomendado para janelas de
mesma natureza.

Exemplos: Arquivos do Word e Arquivos do PowerPoint.

 IHC – JANELA

MDI – Multiple Document Interface (continuação)

Sistemas do tipo MDI são possíveis fontes de problemas.

Podem causar confusão para os usuários e devem ser
evitados principalmente quando se tratar de janelas que
se destinam à execução de tarefas de diferentes
naturezas.

Exemplo: Cadastrar Aluno, Consultar Nota de Aluno, Emitir

Histórico Escolar.
 IHC – JANELA

JANELA MODAL

Janelas modais capturam o

foco do “sistema”. Enquanto
a janela modal não for
fechada, outra janela não
pode ser utilizada.

Exemplos: Janela de Abrir, Janela de imprimir, Janela de login do sistema.

 IHC – JANELA

JANELA MODAL (continuação)

OBS:
Existem 2 tipos de janela modal:
 Janela Modal ao programa
 Janela Modal ao sistema
 IHC – JANELA
JANELA MODAL ao programa:
Neste tipo de janela, o usuário só pode executar outra tarefa no
mesmo programa caso a janela modal seja finalizada.
Exemplo: Janela Abrir, Janela de Imprimir.

Neste tipo de janela a funcionalidade de outros programas não é de

forma alguma afetada.

Exemplo: Utilizando o Microsoft PowerPoint um usuário pode acionar

a janela de Abrir Arquivo e, deliberadamente, alterar para o
programa Microsoft Word e executar suas tarefas sem o menor
problema.
 IHC – JANELA
JANELA MODAL ao sistema:
Neste tipo de janela, o usuário só pode executar uma tarefa no sistema
operacional até que a janela modal ao sistema seja finalizada:

Neste tipo de janela a funcionalidade

de todos os programas é afetada, até
que a janela modal seja finalizada.

Exemplo: Utilizando determinado

programa (no Windows
principalmente) acontece alguma
operação que compromete o sistema
operacional.

Exemplo: Janela de login, Janela de erro fatal!

 IHC – JANELA
JANELA NÃO MODAL:

Neste tipo de sistema, é possível que várias janelas sejam

abertas e o usuário pode, livremente, ‘transitar’ entre as
janelas sem que nenhuma restrição seja feita.

Exemplo: Utilizando o Microsoft PowerPoint, um usuário pode

abrir vários arquivos ao mesmo tempo e mudar de um
arquivo para outro sem o menor problema.
 IHC – JANELA
JANELA NÃO MODAL (continuação)

Exemplo de sistema MDI e janelas não modais (Photoshop).

 IHC – Componentes Visuais Interativos
Permitem ao usuário interagir
Disponíveis em bibliotecas
Podem ser agrupados
Precisam ser associados à
funcionalidade e aos objetos da
aplicação
Exemplos:
Janelas;
Menus (pull-down, pop-up);
Ícones;
Cursores;
Botões;
Barra de Rolagem;
Barra de Ferramentas;
e outros
 IHC – MENUS (TIPOS)

Menus pull-down
Seleção simples: radio buttons

Toolbars e palettes

Seleção múltipla: check boxes

 IHC – PADRONIZAÇÃO DE MENUS

A Microsoft adotou um padrão para seus produtos

 IHC – PADRONIZAÇÃO DE MENUS

Este padrão deve ser adotado em seu programa?

Esta é a melhor forma de exibir a funcionalidade do seu programa?

O usuário espera o item “arquivo” no menu?

Um programa para apresentações, um processador de textos, uma planilha e

um gerenciador de banco de dados possuem a mesma funcionalidade?

Por que programas com funcionalidades tão diferentes (Power Point, Excel,
Word e Access) devem possuir o mesmo menu?

Pode-se afirmar que fica mais fácil a utilização de um programa após conhecer
outro ?

Quantas pessoas utilizam todo o Office?