Grupos de Controles Ferramentas - Heuber Lima · Interface Homem X Máquina - É o canal de...
Transcript of Grupos de Controles Ferramentas - Heuber Lima · Interface Homem X Máquina - É o canal de...
Projeto de Interface
Grupos de ControlesFerramentas
Projeto de Interface Homem-Máquina
Prof. Esp. MBA Heuber G. F. Lima
Conceitos e Fundamentos
� Interface Homem X Máquina - É o canal de comunicação entre o homem e o computador, através do qual interagem, visando atingir um objetivo comum.
� Usabilidade - Norma ISO 9241 – Usabilidade como sendo ”a capacidade que um sistema interativo oferece ao seu usuário, em determinado contexto de operação para a realização de uma tarefa de
Page � 3
determinado contexto de operação para a realização de uma tarefa de uma maneira eficaz, eficiente e agradável.”
� Ergonomia - é a disciplina científica relacionada ao entendimento das interações entre seres humanos e outros elementos de um sistema, e também é a profissão que aplica teoria, princípios, dados e métodos para projetar a fim de otimizar o bem-estar humano e o desempenho geral de um sistema [AIE, 2000]
� Sistemas Ergonomicos -são aqueles que estão adaptados à maneira como seus usuários realizam suas tarefas.
A interface dentro do ciclo de vida...
Page � 5
� http://www.hlera.com.br/clientes/ciclo_de_vida/index.php?s=introducao
�Sãos os elementos da interface que possibilitam a interação Homem X Máquina.
� Existem inúmeros tipos de controle;
� Podem variar de acordo com a linguagem de programação utilizada;
� Podem ser customizados na aplicação;
Controles
Page � 8
� Podem ser customizados na aplicação;
� Devem ser de fácil manuseio;
� Intuitivos na sua utilização.
Grupo de Controles
� Grupos de ferramentas/controles disponíveis para a construção de interfaces interativas;
� Variam de uma linguagem de programação para outra;
� Em aplicações web, podem ser criadas figuras que assumem o lugar de controles tradicionais;
� Devem ser utilizadas com critérios: estéticos, ergonômicos,
Page � 9
� Devem ser utilizadas com critérios: estéticos, ergonômicos, de usabilidade, acessibilidade...
� Seguem as regras de observarem: O ambiente, o usuário, a tarefa e a própria interface que está sendo proposta.
�Controles que permitem ao usuário executar ações programadas no sistema;
�O grupo de botões de comando deve ser definido nas situações em que as opções de comandos possíveis forem em número reduzido.
– Seu arranjo pode seguir duas regras:
Botões de comando
Page � 11
– Seu arranjo pode seguir duas regras:
• Eles podem ser alinhados verticalmente e a direita do objeto a que fazem referência, ou
• Horizontalmente e abaixo deste objeto.
– Um botão "por default" deve ser definido, visualmente diferenciado e posicionado:
• Ao alto, se a orientação for vertical, ou
• A esquerda, no caso de uma orientação horizontal.
Botão de seleção
� O botão de seleção é utilizado quando uma entrada de dados corresponder a ativação e desativação de um atributo ou entidade (on-off).
� Eles correspondem aos check-boxes, interruptores, radio-buttons e outros
� interadores similares. Em grupos, os check-boxes e radio-buttons tem
Page � 12
� interadores similares. Em grupos, os check-boxes e radio-buttons tem um comportamento estabelecido por convenção.
� Os primeiros permitem escolhas múltiplas enquanto que os radio-buttons trabalham com escolhas simples e mutuamente exclusivas.
� Segundo essa convenção a utilização de botões de rádio isolados não tem sentido e deve ser evitada
Botões de rádio
�Controles utilizados para a entrada de dados deve prever botões de rádio (radio-button), quando:
– O conjunto de valores possíveis para um dado forem conhecidos;
– Não excederem 7 alternativas; e
– Forem mutuamente exclusivos.
Page � 13
– Forem mutuamente exclusivos.
Caixas de atribuição
�Se os valores possíveis para uma entrada não forem mutuamente exclusivos, estando envolvidos em uma escolha múltipla, deve-se prever um grupo de caixas de atribuição (check-box).
Page � 14
�O layout de um grupo de caixas de atribuição (check-box) está sujeito às mesmas recomendações propostas para um grupo de botões de rádio.
Barra de rolagem (escala)
� A barra de rolagem, ou escala, é um controle que permite ao usuário a introdução de um valor numérico pelo ajuste de um cursor em uma determinada posição sobre uma linha graduada.
Page � 15
� A barra de rolamento é um
exemplo deste tipo de objeto.
Campo de dados
� Um campo de dado é por definição unilinear. Eles recebem dados cujos valores não podem de ante mão, ser previstos pelo projetista e cujos comprimentos não excedam os 40 ou 50 caracteres.
� Todo o campo de dado deve apresentar
Page � 17
� Todo o campo de dado deve apresentar um rótulo identificativo e convidativo (prompt), para apoiar o usuário na entrada de um dado.
� Isso pode ser feito através da explicitação do formato (dd/mm/aaaa) do dado, de sua unidade (cm, pol) e dos valores possíveis (1 a 10).
Projetando um campo de dados
� Com o objetivo de minimizar as ações do usuário o projetista pode especificar um valor a ser proposto "por default" ao usuário.
� Na escolha de um modo de edição, "inserir entre" deve ter a preferência sobre o modo "escrever sobre".
� Nesse particular, seja qual for a definição ela deve ser mantida consistente durante o projeto da interface.
Page � 18
consistente durante o projeto da interface.
� Os métodos para o tratamento dos valores entrados podem considerar equivalentes as letras maiúsculas e minúsculas.
� O preenchimento dos zeros e dos pontos decimais desprezados pelo usuário também deve ser considerado.
Campo de texto
� O campo de texto é por definição multilinear.
� Seu tamanho em termos do número e do comprimento de linhas deve ser adequado para proporcionar um desempenho eficiente na tarefa de entrada de textos.
� Para a facilidade de leitura o comprimento das linhas não deve exceder os 40 caracteres e a altura do campo deve proporcionar a apresentação de um mínimo de 4 linhas.
Page � 19
de um mínimo de 4 linhas.
Rótulo
� Também conhecido como Label, controle que serve para nomear/rotular outros controles que não possuem essa indicação na interface;
� Como regra, todo controle deverá ser rotulado. Caso não possua rótulo próprio, utiliza-se esse controle para esse fim.
Page � 20
Caixa de Combinação
� Combo-box: É a combinação de uma caixa de texto com uma lista de dados. É usada quando:
– O conjunto de valores possíveis para um dado forem conhecidos;
– Excedem sete alternativas; e
– Forem mutuamente exclusivos.
Page � 21
Alguns erros comuns
� Por quê esse assistente do Office 97 é tão chato?
� Por que fazer uma barra de rolagem com 3 opções?
Page � 22
� Por que fazer opções que se excluem?
Novos Tipos de Controles
� Baseados em imagens, animações;
� Utilizados em linguagens de alto nível;
� Interfaces Ricas;
� SDK de determinados tipos de
Page � 24
� SDK de determinados tipos de Hw;
� Dependem do Ambiente, tarefa que está sendo proposta a interface.
� Há uma grande confusão entre “layout visual” e design;
� Ainda mais confusão sobre design e usabilidade
� Há quem aposte na estética visual “antes” da usabilidade por acreditar mais no impacto (Hilhorst)
Estética e Layout Visual X Usabilidade
Page � 27