Professional Documents
Culture Documents
Elementos de interao
Formulrios
Engenharia de Usabilidade Prof.: Clarindo Isaas Pereira da Silva e Pdua
Gestus Departamento de Cincia da Computao - UFMG
l Um
rotulados que podem ser preenchidos pelo usurio, geralmente atravs de digitao ou por escolha em menus.
26/8/2008
Clarindo Pd u a
Caracteres digitados pelo usurio; Escolha feita pelo usurio atravs de uma lista; Valores defaults para campos; Valores requeridos ou opcionais; Valores dependentes.
26/8/2008
Clarindo Pd u a
26/8/2008
Clarindo Pd u a
Elementos de interao > Interface grfica > Formulrios > Tipos de valores usados em campos em um formulrio n
Elementos de interao > Interface grfica > Formulrios > Tipos de valores usados em campos em um formulrio
So valores j preenchidos pelo sistema mas que podem ser modificados pelo usurio.
26/8/2008
Clarindo Pd u a
26/8/2008
Clarindo Pd u a
Elementos de interao > Interface grfica > Formulrios > Tipos de valores usados em campos em um formulrio
Diretrizes
n
n n
Use um leiaute visualmente atraente e conte do consistente No assuma que os formulrios de papel possam ser convertidos diretamente para o desenho na tela e sejam uma boa interface
l l
Valores dependentes
l
So campos que s fazem sentido e tm que ser preenchidos se outro campo tiver sido preenchido com determinados valores.
26/8/2008
Clarindo Pd u a
26/8/2008
Clarindo Pd u a
n n n
Use uma navegao lgica entre os campos. Use uma navegao lgica dentro dos campos. Apoio edio e correo de erros dos campos.
l
indicadores visuais como /.../ para datas organizao em sees: campos opcionais, campos obrigatrios, etc
facilite correo de caracteres individuais sem necessidade de entrar-se com todo o campo novamente em caso de erro.
26/8/2008
Clarindo Pd u a
26/8/2008
Clarindo Pd u a
10
Use mensagens de erros informativas e consistentes para caracteres e valores invlidos. Fornea mensagens explicativas para preenchimento de campos.
l
Caixas
n
Uma caixa (box) uma tela delimitada em formato retangular, usada para mensagens, entrada de textos, comandos, seleo e controle do usurio.
l
Fornea valores defaults nos campos quando possvel. Fornea um indicador de concluso para cada tela de formulrio preenchido.
26/8/2008
Clarindo Pd u a
11
26/8/2008
Clarindo Pd u a
12
Caixa de lista
uma seqncia de itens de escolhas para o usurio, que geralmente aparece dentro de uma pequena janela.
l l
l l l l
26/8/2008
Clarindo Pd u a
13
26/8/2008
Clarindo Pd u a
14
Caixa de mensagem
n
Caixas de entrada
n
utilizada para apresentar mensagens de sada (ex.: mensagem de erro, mensagens de confirmao) para o usurio.
Permite entrada de texto; usualmente possui funes bsicas de edio de texto (como inserir, apagar e quebrar linhas (wraparound).
26/8/2008
Clarindo Pd u a
15
26/8/2008
Clarindo Pd u a
16
Elementos de interao > Interface grfica > Caixas > Caixa de dilogo
Caixas de dilogo
n
uma caixa composta de vrios objetos de interao como listas, botes, caixas, campos para entradas de texto, dentre outros.
l
dilogo modal: restringe o uso de outras janelas dilogo no modal: permite o usu rio trabalhar fora da caixa de di logo
26/8/2008
Clarindo Pd u a
17
26/8/2008
Clarindo Pd u a
18
Diretrizes
n n n
Diretrizes
n
Use instrues breves mas compreensveis; Use as palavras com cuidado para elabora o de mensagens; Organize logicamente agrupamento e ordenao de objetos nas caixas;
n n
Mantenha o layout consistente e o visual atraente; Coloque defaults nos botes de escolha, tornando-os visualmente diferentes; Selees em menus que levam a caixas de dilogo devem conter um indicadores visuais
Use indicadores visuais ou espao em branco para demarcar grupos dentro das caixas;
n
26/8/2008
Clarindo Pd u a
19
26/8/2008
Clarindo Pd u a
20
Elementos de interao
Usaremos o termo interface grfica no sentido de uso de representao visual da informao em contraste com o uso de textos ou nmeros - mais amplo que o conceito WIMP.
n
n
A principal vantagem de interfaces grficas bem colocado por Richard Hamming: The purpose of computing is insight, not number.
n
usado por exemplo em diagnsticos mdicos usando ultrasom, simulao de fluxo de fluido, transferncia de calor, etc
26/8/2008
Clarindo Pd u a
21
26/8/2008
Clarindo Pd u a
22
Animao
n
As tcnicas para navegao atravs de uma representao visual para banco de dados esto se tornando mais populares.
Animao, ou simplesmente desenho animado, pode ser utilizado para representar as sadas de uma simulao.
Constitui um excelente meio para para produ o de simuladores para treinamento. Pode incluir, alm de imagens visuais, sons, vibra es e temperaturas de um ambiente real.
Imagens podem tambm ser geradas a partir de bancos de dados com informao numrica, ex.: imagens geolgicas utilizadas em explora o de petrleo.
n
26/8/2008
Clarindo Pd u a
23
26/8/2008
Clarindo Pd u a
24
Vdeo
n
O vdeo com animao realstica, e o udio que tipicamente o acompanha, pode ser combinado com outros Elementos de interao em uma interface - por exemplo, em uma janela.
n
Multimdia e hipermdia
Envolve a associao de grficos, udios e vdeos, muitas vezes associados a animaes.
n
Os vdeos do uma noo mais realista das atividades do mundo real e, como a animao, pode ser usado de modo especialmente efetivo para treinamento.
26/8/2008
Clarindo Pd u a
25
26/8/2008
Clarindo Pd u a
26
Realidade virtual
DIretrizes
n
Use analogias com o mundo real o tanto quanto poss vel; Mantenha a representao visual o mais simples possvel;
l
26/8/2008
Clarindo Pd u a
27
26/8/2008
Clarindo Pd u a
28
n n
Linguagem de linhas de comandos so strings de caracteres alfanum ricos representando comandos, parmetros e/ou opes que so digitadas pelo usurios.
Pelo custo prefervel no se utilizar v deo a t-lo de baixa qualidade Usar em aplicaes que realmente requeiram vdeo como em treinamento e educao, por exemplo.
n n n n
Representam um estilo de comunicao conciso, poderoso e rpido. Requerem mais treino do usurio e do margem a um maior nmero de erros do que os estilos de manipulao direta. Podem ser utilizadas tambm em associao com entrada de voz.
Ex.
ls -la
26/8/2008
Clarindo Pd u a
29
26/8/2008
Clarindo Pd u a
30
Elementos de interao > Interface grfica > Linguagens de comandos > DIretrizes
Diretrizes
n
O paradigma padro ao-modificador-objeto, que difere do padro para manipulao direta em que muitas vezes seleciona-se o objeto primeiro e depois define-se a ao. n
26/8/2008
Clarindo Pd u a
31
26/8/2008
Clarindo Pd u a
32
Elementos de interao
Sntese de fala
n
Tela de toque: as telas de toque esto entre os mais durveis e robustos de todos os dispositivos de entrada. So indicados para:
l l l l
A gera o de sons audveis e palavras com o computador uma tecnologia relativamente bem dominada, conseguindo-se atualmente que soe mais natural.
usurios novios, em que se-chega-e-usa, pela sua simplicidade; usurios freqentes quando h pouco espao para o teclado e/ou mouse situaes que requerem equipamento robusto; situaes em que os usurios tm que ser guiados atrav s de seqncias complexas de tarefas; exemplos tpicos: ambientes pblicos, de uso pesado, assim como cho de f brica e quiosques de informao ao pblico.
n n
Pode ser usado de forma redundante, associado a textos. Tem aplicao bvia para deficientes fsicos visuais.
26/8/2008
Clarindo Pd u a
33
26/8/2008
Clarindo Pd u a
34
O reconhecimento da fala pelo computador ainda bastante limitado a palavras discretas, e domnios especficos de vocabulrios e situaes. As aplicaes so bvias - comunicao natural com o computador mas existem dificuldades de reconhecimento dos sons e de entendimento da linguagem falada.
26/8/2008
Clarindo Pd u a
35