gui1

Aplicações Multimídia no Ambiente GUI

Segredos de Projeto de Interface Gráfica

MINASI, Mark. Segredos de Projeto de Interface Gráfica com o Usuário, Infobook, Rio de Janeiro, 1994.

Mark Minasi, destaca vários detalhes sobre como se deve construir uma interface gráfica, ele faz suas sugestões para o Windows, usando o Visual Basic 1.0 como ferramenta e exemplo.

Inicialmente ele sugere:

A GUI deve ter todos os elementos gráficos colocados, e no local adequado.

Um bom designer deve saber quando deve quebrar as regras.

Os programas GUI devem ser previsíveis, fáceis de ler, personalizáveis, interativos com o usuário, capaz de lidar com erros, tornar as pessoas mais produtivas, antecipar ações, e ser consistentes.

Os programas GUI devem permitir a integração entre aplicativos do Windows.

Minasi, relaciona os elementos de interface gráfica:

Barras: Título, Menu, Status

Janelas de Aplicativo

Janelas de Documento (MDI)

Janelas de Ajuda

Menus: em cascata e destacáveis

Janelas de Diálogo

Caixas de Diálogo / Mensagem

Caixas de Controles

Barras de ferramenta

Partes de uma janela: Minimizadas, Maximizadas ou Janeladas.

Área de comunicações: Barra de Título e Status

Tipos de entrada de dados:

Apontar

Seleção

Entrada de dados

Facilitando a entrada de dados:

Mouse: bom para apontar, ruim para seleção múltipla e exigem mais manutenção.

Teclado: Variedade de entradas, familiar, veloz, bom para seleção em grande escala, ruim para desenhar ou apontar.

Ao usar cores observe:

Não torne a tela muito brilhante ou escura

Forneça refúgios visuais

Cuidado com a distinção de cores

Torne as cores personalizáveis

Não seja extravagante

Use o menor número de cores, não mais de 5 cores

Use cores contrastantes: Vermelho, Laranja, Amarelo, Verde, Azul, Índigo, Violeta

Organize-se com as cores

Use associações comuns

Cuidado com o significado cultural das cores

Escolher cores de primeiro e segundo plano com contraste e complementares

Use recursos de 3D com sombras e iluminação

A cor afeta a percepção da profundidade de um objeto. No desenho abaixo, é demonstrado um esquema de como os olhos vêem as cores:

2-Vermelho, azul ou amarelo, azul

3-Vermelho, verde ou azul, ou Vermelho, amarelo e azul

4-Vermelho, amarelo, verde, azul

5-Vermelho, laranja, amarelo, verde, azul

6-Vermelho, laranja, amarelo, verde, azul, roxo

Construir menus úteis:

Escolha correta: drop-down, cascata, pop-up, destacáveis

Menus padrão do Windows (arquivo, editar..)

Menus organizados e agrupados

Ao usar textos

Ambiente texto: tela escura, letras claras

Ambiente gráfico: tela clara, letras escuras simulando o papel

Esforce-se pela clareza (explicações técnicas)

Evite a primeira pessoa

Mensagens curtas

Observe a terminologia

Evite as palavras: terminar, erro, abortar, números

Cuidado com a gramática, vocabulário, e concordância, jargões, e gírias

Faça perguntas diretas

Use fonte: System ou MS Sans Serif

Ao editar o texto use as teclas corretas: backspace, delete, insert

Caixas de diálogo que falam com clareza. Características:

não-modal (corretor)

aplicativo modal (impressão)

sistema modal (erros fatais)

aplicativo semimodal (funções do Excel)

moveis ou fixas

podem desdobrar ou não

caixas de mensagens ou caixas de diálogo

Arranjar elementos da caixa esteticamente

agrupe funções

botões na horizontal/vertical

botões grandes p/ acomodar o texto

botão mais importante à esquerda ou superior

evite colocar muitos botões (3 ou 4)

botões com mesmo tamanho (altura e largura

uma única linha de texto

Usar caixas de diálogo comuns: abrir, novo; salvar, salvar como..; fontes, imprimir

Usar caixas de mensagens comuns

Usando controles

Botões de Comando (ação, saltar, desdobrar, dobrar)

Botões de Opção/Rádio

Botões deslizantes / aumentar e diminuir

Caixas de Verificação

Caixas de Lista (padrão, drop-down) de 3 a 8 linhas + barra de rolagem

Caixas de Texto

Campos de texto estático

Caixas de Grupo / de Combinação

Controles de rótulo

ç Voltar