[email protected] [email protected]
DSC/CCT/UFCG
Prof.: José Eustáquio Rangel de Queiroz
Carga Horária: 60 h
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
 Tela bem projetada
 Reflexo das habilidades, necessidades e tarefas de
seus usuários
 Desenvolvimento
[email protected] [email protected]
fundamentado nas limitações
físicas impostas pelo hardware no qual é exibida
 Uso efetivo das facilidades de seu software de
controle
 Focalização nos objetivos do sistema para o qual
foi projetada
 Necessidade
do conhecimento/compreensão
dos princípios que regem bons projetos de tela
2
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
 Considerações Humanas em Projetos de Telas
 Quanta informação deve ser apresentada
 Como a informação deve ser distribuída
[email protected] [email protected]
 Qual a linguagem que deve ser utilizada
 Quão discrimináveis devem ser as componentes da
tela
 Quão estética é a apresentação da informação
 Quão consistente é uma tela com relação às demais
3
Princípios de Bons Projetos de
Tela
Telas Deficientes
DSC/CCT/UFCG

[email protected] [email protected]
 Distração do Usuário (Barnett, 1993)

Legendas confusas e questões mal formuladas

Ênfase inadequada de tipos e gráficos

Cabeçalhos desorientadores

Solicitações de
desnecessárias

Solicitações de informações que impliquem
retrospecto de respostas e/ou contextos

Distribuição
restrita
componentes na tela

Deficiência em nível da qualidade da apresentação,
legibilidade, aparência e disposição da informação
informações
e/ou
irrelevantes
desordenada
ou
o
das
4
Princípios de Bons Projetos de
Tela
Telas Deficientes
DSC/CCT/UFCG

[email protected] [email protected]
 Distração do Usuário (Howlett, 1995)

Inconsistência visual na apresentação dos detalhes
na tela e com o SO

Necessidade de restrição no uso de características e
elementos de projeto

Sobrecarga de apresentações 3D

Sobrecarga de cores muito brilhantes

Uso de ícones mal projetados

Deficiência tipográfica

Uso de metáforas autoritárias ou excessivamente
engraçadas ou literais com relação a opções de
projeto com restrições
5
Princípios de Bons Projetos de
Tela
Telas Deficientes
DSC/CCT/UFCG

[email protected] [email protected]
 Distração do Usuário - Web (Galitz, 2002)

Interrupções visuais/audíveis numerosas

Desordem visual excessiva

Legibilidade da informação insuficiente

Componentes de tela incompreensíveis

Navegação confusa e ineficiente

Operações ineficientes com dispêndio excessivo de
tempo do usuário

Rolamento de página excessivo ou ineficiente

Sobrecarga de informações

Inconsistência no projeto
6
Princípios de Bons Projetos de
Tela
Telas Deficientes
DSC/CCT/UFCG

[email protected] [email protected]
 Distração do Usuário - Web (Galitz, 2002)

Informações desatualizadas

Projeto ultrapassado devido à imitação ou cópia de
documentos
impressos
ou
sistemas
tecnologicamente superados
7
Princípios de Bons Projetos de
Tela
Telas Deficientes
DSC/CCT/UFCG

[email protected] [email protected]
 Expectativas mais comuns dos usuários

Aparência ordenada, clara e bem distribuída da
informação exibida

Indicação clara da informação que está sendo
exibido e do que fazer com ela

Apresentação da informação exatamente onde o
usuário a esperaria

Indicação evidente das relações entre opções,
cabeçalhos, dados, dicas, legendas, etc.
8
Princípios de Bons Projetos de
Tela
Telas Deficientes
DSC/CCT/UFCG

[email protected] [email protected]
 Expectativas mais comuns dos usuários

Modo simples de acesso a todas as funcionalidades
presentes no sistema e de saída de cada uma delas

Indicação clara de quando uma ação pode causar
uma alteração permanente nos dados ou no sistema
9
Princípios de Bons Projetos de
Tela
Telas Deficientes
DSC/CCT/UFCG

[email protected] [email protected]
 Metas de Projeto de Interfaces

Redução da carga de trabalho visual

Redução da carga de trabalho intelectual

Redução da carga de trabalho motora

Redução da carga de trabalho mental

Minimização ou eliminação de quaisquer encargos
ou instruções impostas por aspectos tecnológicos

Elevação da produtividade

Aumento do grau de satisfação
10
Princípios de Bons Projetos de
Tela
Significado e Propósito da Tela
DSC/CCT/UFCG

[email protected] [email protected]
 Cada elemento na tela…

Todos os controles

Todo o texto

A organização da tela

Toda a ênfase dada à informação

Cada cor

Todos os elementos gráficos

Toda a animação

Cada mensagem

Todas as formas de retorno da informação (feedback)
11
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
 Significado e Propósito da Tela
[email protected] [email protected]
 Devem…

Ter significado para os usuários

Ter uma função no contexto das tarefas do usuário
12
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
 Organização Clara e Significativa dos Elementos
 Consistência
 Ordenação dos Dados e do Conteúdo da Tela
[email protected] [email protected]
 Definição de um Ponto de Partida
 Navegação entre Telas e Fluxo em cada Tela
 Composição Visualmente Agradável
 Quantidade de Informação
 Facilidade de Discriminação
 Foco e Ênfase
 Uso de Profundidade e Aparência Tridimensional
13
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
 Equilíbrio
[email protected] [email protected]
Balanceamento
Instabilidade
14
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
 Simetria
[email protected] [email protected]
Simetria
Assimetria
15
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
 Regularidade
[email protected] [email protected]
Regularidade
Irregularidade
16
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
 Previsibilidade
Ícone
Barra de Título
Ícone Ícone
Previsibilidade
[email protected] [email protected]
Barra de Menu
Controle
Controle
Controle
Controle
Controle
Controle
Botão
Botão
Botão
Ícone
Controle
Controle
Ícone
Botão
Controle
Botão
Controle
Controle
Controle
Barra de Menu
Espontaneidade
Barra de Título
Botão
Ícone
17
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
 Sequencialidade
[email protected] [email protected]
Sequencialidade
Aleatoriedade
18
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
 Economia
[email protected] [email protected]
Modicidade
XXXXXXXXXXX
XXXXXXXXXXX
XXXXXXXXXXX
XXXXXXXXXXX
XXXXXXXXXXX
XXXXXXXXXXX
XXXXXXXXXXX
XXXXXXXXXXX
Ornamentação
XXXXXXXXXXX
XXXXXXXXXXX
QQQQQQQQQQ
QQQQQQQQQQ
ZZZZZZZZZZZZ
ZZZZZZZZZZZZ
JJJJJJJJJJJJJJ
JJJJJJJJJJJJJJ
19
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
 Proporcionalidade
[email protected] [email protected]
Unidade
Fragmentação
20
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela

 Proporcionalidade


1
1
[email protected] [email protected]
1
1,618

1,414
1
1

1,732
1
2
21
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
 Simplicidade
[email protected] [email protected]
Simplicidade
Complexidade
22
Princípios de Bons Projetos de
Tela
Agrupamento
DSC/CCT/UFCG

 Recomendações
 Formação de agrupamentos de elementos associados
[email protected] [email protected]
 Criação de agrupamentos espaciais tão próximos quanto
possível de 5 graus de ângulo de visão (1,67” de
diâmetro ou cerca de 6 a 7 linhas de texto, 12 a 14
caracteres de largura)
 Reserva de ⅛ a ¼” entre cada controle de espaçamento
introduzido em um agrupamento
 Reforço visual de agrupamentos
 Separação adequada entre agrupamentos mediante
uso apropriado de espaços brancos
 Inserção de bordas lineares em torno dos grupos
 Associação de títulos significativos a cada agrupamento
23
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
[email protected] [email protected]
 Agrupamento
24
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
[email protected] [email protected]
 Agrupamento
25
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
 Agrupamento
TEST RESULTS
SUMMARY:GROUND
TIP GROUND
GROUND, FAULT T-G
14 K
[email protected] [email protected]
3 TERMINAL DC RESISTANCE
>
3500.00 K OHMS T-R
=
14.21 K OHMS T-R
>
3500.00 K OHMS T-R
3 TERMINAL DC VOLTAGE
=
8.82 K OHMS T-R
=
14.17 K OHMS T-R
=
628.52 K OHMS R-G
LONGITUDINAL BALANCE POOR
=
39
DC RESISTANCE
DC VOLTAGE
3500 K T-R
AC SIGNATURE
9 K T-R
14 K T-R
0 V T-G
14 K T-R
3500 K R-G
0V R-G
629 K R-G
BALANCE
CENTRAL OFFICE
39 DB
VALID LINE CKT
DIAL TONE OK
DBB
COULD NOT COUNT RINGERS DUE TO
LOW RESISTANCE
Reprojetada
VALID LINE CKT CONFIGURATION
CAN DRAW AND BREAK DIAL TONE
Original
26
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
 Agrupamento usando Espaços Brancos
 Recomendações (Galitz, 2002)
 Separação
[email protected] [email protected]
adequada
entre
agrupamentos
mediante uso apropriado de espaços brancos
 Consideração cuidadosa do compromisso entre
uso de espaçamento em branco e requisitos para
rolamento de página para páginas da Web
27
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
 Agrupamento usando Espaços Brancos
 Contradições
 Uso
[email protected] [email protected]
comedido
(usability.com)
de
espaços
em
branco
 Baixa pontuação de usuários para sites com
grandes quantidades de espaços em branco e
texto esparso (Fiesta, 1998)
 Minimização do uso de espaços em branco em
tarefas em tarefas de busca (Bailey, 1999)
28
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
 Agrupamento usando Espaços Brancos
 Contradições
 Grandes quantidades de espaços
em branco
[email protected] [email protected]
(grok.com) (top 100 Web sites)
 Sugestão
 Definição do compromisso entre as diversas
partes do conteúdo da tela, o rolamento das
páginas e os requisitos de busca visual
29
Princípios de Bons Projetos de
Tela
Agrupamento usando Bordas Lineares
DSC/CCT/UFCG

 Recomendações
 Incorporação de bordas lineares para
 Focalização
[email protected] [email protected]
da atenção
informações correlatas
em
agrupamentos
ou
 Orientação do olho ao longo da tela
 Uso de uma representação hierárquica padronizada para
a representação de linhas, não excedendo 3 espessuras
e 2 estilos de linha
 Criação de linhas consistentes em altura e comprimento
 Alinhamento das bordas de agrupamentos adjacentes
(sempre que possível) pela esquerda, direita, topo e
base
30
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
 Agrupamento usando Bordas Lineares
 Recomendações
 Alocação de espaço suficiente entre a informação e as
bordas circundantes
[email protected] [email protected]
 Uso moderado de bordas e frisos
 Em projetos de páginas da Web
 Uso cauteloso de linhas horizontais como separadores
de seções de página
 Utilização preferencial de linhas horizontais para a
discriminação de áreas adjacentes
31
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
 Agrupamento usando Bordas Lineares
ESCORES
DO TORNEIO
[email protected] [email protected]
CÓDIGO
DE CORES
BÁSICO
preto
marrom
vermelho
laranja
amarelo
verde
azul
violeta
cinza
branco
0
1
2
3
4
5
6
7
8
9
Raul
Sílvio
Roberto
67
76
99
LISTA
DE BENS
Bagagem
18 mesas
Rapel
72 cadeiras Passagens
Férias
14 camas
Praia
Viagem
Passaporte
Guia
Dunas
Notificar
Eiry
sobre
a
devolução do livro de Nielsen.
ATENÇÃO!!!
Um projeto de tela
deficiente pode exercer
um impacto fortemente
negativo
sobre
a
excelência subjacente do
software e do hardware.
Detalhes
gráficos
de
projeto não são apenas
tópicos de enfeite ou
aspectos decorativos.
Jantar às 19:30
PROGRAMAÇÃO
08:30
Abertura
09:00
Palestra 1
09:30
Palestra 2
10:00
Palestra 3
10:00
Coffee Break
10:30
Palestra 4
11:00
Palestra 5
11:30
Palestra 6
PREVISÃO DO TEMPO
Durante o dia de hoje,
céu
parcialmente
nublado, com mínima de
23 °C e máxima de 26,5
°C. À noite, possibilidade
de ocorrência de chuvas.
LEI DE MURPHY
Se algo pode dar errado,
então dará.
O que há em comum na lista abaixo?
São Luís
Teresina
Campina Grande
Belém
Salvador
Fortaleza
Cabeça do Peu
Caranguejo
Casa Grande
Ipióca
51
Pitú
Serra Branca
Triunfo
Arroz de cuchá
Maria Isabel
Buchada
Pato no tucupi
Acarajé
Caldeirada
Nesta
figura,
ilustra-se o efeito
do
uso
de
fronteiras
gráficas sobre a
percepção
humana
de
grupos em uma
tela
32
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
 Agrupamento usando Bordas Lineares
ESCORES
DO TORNEIO
[email protected] [email protected]
CÓDIGO
DE CORES
BÁSICO
preto
marrom
vermelho
laranja
amarelo
verde
azul
violeta
cinza
branco
0
1
2
3
4
5
6
7
8
9
Raul
Sílvio
Roberto
67
76
99
LISTA
DE BENS
Bagagem
18 mesas
Rapel
72 cadeiras Passagens
Férias
14 camas
Praia
Viagem
Passaporte
Guia
Dunas
Notificar
Eiry
sobre
a
devolução do livro de Nielsen.
ATENÇÃO!!!
Um projeto de tela
deficiente pode exercer
um impacto fortemente
negativo
sobre
a
excelência subjacente do
software e do hardware.
Detalhes
gráficos
de
projeto não são apenas
tópicos de enfeite ou
aspectos decorativos.
Jantar às 19:30
PROGRAMAÇÃO
08:30
Abertura
09:00
Palestra 1
09:30
Palestra 2
10:00
Palestra 3
10:00
Coffee Break
10:30
Palestra 4
11:00
Palestra 5
11:30
Palestra 6
PREVISÃO DO TEMPO
Durante o dia de hoje,
céu
parcialmente
nublado, com mínima de
23 °C e máxima de 26,5
°C. À noite, possibilidade
de ocorrência de chuvas.
LEI DE MURPHY
Se algo pode dar errado,
então dará.
O que há em comum na lista abaixo?
São Luís
Teresina
Campina Grande
Belém
Salvador
Fortaleza
Arroz de cuchá
Maria Isabel
Buchada
Pato no tucupi
Acarajé
Caldeirada
Cabeça do Peu
Caranguejo
Casa Grande
Ipióca
51
Pitú
Serra Branca
Triunfo
Nesta
figura,
ilustra-se
o
efeito do uso
de
fronteiras
gráficas sobre
a
percepção
humana
de
grupos em uma
tela
33
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
 Agrupamento usando Planos de Fundo (Backgrounds)
 Recomendações
 Incorporação de planos de fundo contrastantes
[email protected] [email protected]
para informações correlatas
 Atenção para que a ênfase seja dada à informação,
não para o plano de fundo incorporado ao projeto
para ressaltá-la
 Uso reservado de maior contraste ou de técnicas de
“enfatização” para componentes de tela para as
quais a atenção do usuário deva ser prioritariamente
dirigida
34
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
 Agrupamento usando Bordas Lineares
ESCORES
DO TORNEIO
[email protected] [email protected]
CÓDIGO
DE CORES
BÁSICO
preto
marrom
vermelho
laranja
amarelo
verde
azul
violeta
cinza
branco
0
1
2
3
4
5
6
7
8
9
Raul
Sílvio
Roberto
67
76
99
LISTA
DE BENS
Bagagem
18 mesas
Rapel
72 cadeiras Passagens
Férias
14 camas
Praia
Viagem
Passaporte
Guia
Dunas
Notificar aos alunos de IHM que
a prova será dia 11/02/2003.
ATENÇÃO!!!
Um projeto de tela
deficiente pode exercer
um impacto fortemente
negativo
sobre
a
excelência subjacente do
software e do hardware.
Detalhes
gráficos
de
projeto não são apenas
tópicos de enfeite ou
aspectos decorativos.
Jantar às 19:30
PROGRAMAÇÃO
08:30
Abertura
09:00
Palestra 1
09:30
Palestra 2
10:00
Palestra 3
10:00
Coffee Break
10:30
Palestra 4
11:00
Palestra 5
11:30
Palestra 6
PREVISÃO DO TEMPO
Durante o dia de hoje,
céu
parcialmente
nublado, com mínima de
23 °C e máxima de 26,5
°C. À noite, possibilidade
de ocorrência de chuvas.
LEI DE MURPHY
Se algo pode dar errado,
então dará.
O que há em comum na lista abaixo?
São Luís
Teresina
Campina Grande
Belém
Salvador
Fortaleza
Arroz de cuchá
Maria Isabel
Buchada
Pato no tucupi
Acarajé
Caldeirada
Cabeça do Peu
Caranguejo
Casa Grande
Ipióca
51
Pitú
Serra Branca
Triunfo
Nesta
figura,
ilustra-se
o
efeito do uso
de planos de
fundo sobre a
percepção
humana
de
grupos em uma
tela
35
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
[email protected] [email protected]
 Agrupamento usando Bordas Lineares
36
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
 Quantidade de Informações
 Recomendações
 Apresentação
[email protected] [email protected]
da quantidade
informações para a tarefa
apropriada
de
 Informação insuficiente reflete ineficiência
 Informação excessiva causa confusão
37
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
 Quantidade de Informações
 Recomendações
[email protected] [email protected]
 Apresentação de toda a informação necessária
ao desempenho de uma ação ou à tomada de
uma decisão, sempre que possível
 Memorização de detalhes apresentados em telas
anteriores é contraproducente para a execução
de tarefas
38
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
 Quantidade de Informações
 Recomendações
1
 Restrição dos níveis de densidade das telas ou
[email protected] [email protected]
das janelas a valores que não excedam 30%
39
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
 Quantidade de Informações
 Densidade Global
 Medida do percentual de posições de caracteres
[email protected] [email protected]
na tela inteira que contêm dados
40
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
 Quantidade de Informações
 Densidade Local
 Medida do quão “fortemente compactada” é a
[email protected] [email protected]
tela considerada
012222201
0123445443210
023456777654320
01235679+97653210
023456777654320
0123445443210
012222201
41
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
 Quantidade de Informações
TEST RESULTS
 Densidade global: 17,9%
 Densidade global: 58,0%
SUMMARY:GROUND
GROUND, FAULT T-G
[email protected] [email protected]
3 TERMINAL DC RESISTANCE
>
3500.00 K OHMS T-R
=
14.21 K OHMS T-R
>
3500.00 K OHMS T-R
3 TERMINAL DC VOLTAGE
=
8.82 K OHMS T-R
=
14.17 K OHMS T-R
=
628.52 K OHMS R-G
LONGITUDINAL BALANCE POOR
=
39
DBB
COULD NOT COUNT RINGERS DUE TO
LOW RESISTANCE
VALID LINE CKT CONFIGURATION
CAN DRAW AND BREAK DIAL TONE
Original
42
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
 Quantidade de Informações
TIP GROUND
[email protected] [email protected]
DC RESISTANCE
14 K
DC VOLTAGE
3500 K T-R
 Densidade global: 10,8%
 Densidade global: 35,6%
AC SIGNATURE
9 K T-R
14 K T-R
0 V T-G
14 K T-R
3500 K R-G
0V R-G
629 K R-G
BALANCE
CENTRAL OFFICE
39 DB
VALID LINE CKT
DIAL TONE OK
Reprojetada
43
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
 Tamanho de Página da Web
 Recomendações
 Minimização da altura da página
[email protected] [email protected]
 Restrição a 2 ou 3 telas de informação
 Posicionamento
de informações críticas ou
importantes o mais próximo possível do topo da
página, de modo a torná-las visíveis quando a
página for aberta
 Distribuição nas 4” (≈ 10 cm) do topo da página
44
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
 Tamanho de Página da Web
 Recomendações
 Minimização da altura da página
[email protected] [email protected]
 Restrição a 2 ou 3 telas de informação
 Posicionamento
de informações críticas ou
importantes o mais próximo possível do topo da
página, de modo a torná-las visíveis quando a
página for aberta
 Distribuição nas 4” (≈ 10 cm) do topo da página
45
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
 Tamanho de Página da Web
 Argumentos para páginas mais curtas
 Alocação
[email protected] [email protected]
de mais memória do usuário
(informação mais espalhada e nem sempre
visível)
 Possível condução a um senso de perda de
contexto quando os botões de navegação e links
principais desaparecem do campo de visão do
usuário
 Exibição de um conteúdo mais extenso e de uma
gama mais abrangente de links de navegação
(dificuldade de localização e decisão sobre o
caminho a seguir)
46
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
 Tamanho de Página da Web
 Argumentos para páginas mais curtas
 Requisito de rolamento excessivo de página
[email protected] [email protected]
(confusão e ineficiência)
 Condução menos efetiva ao “encadeamento” do
esquema de organização da informação
comumente empregada em sites da Web
47
DSC/CCT/UFCG
Princípios de Bons Projetos de
Tela
 Tamanho de Página da Web
 Argumentos para páginas mais longas
 Aparência
[email protected] [email protected]
com a estrutura familiar
documentos em papel (formulário contínuo)
de
 Demanda de um número menor de “cliques” para
a navegação através de um site da Web
 Maior facilidade de download e impressão para
leitura posterior
 Maior facilidade de manutenção (número menor
de categorias de links de navegação para outras
páginas)
48
Princípios de Bons Projetos de
Tela
Tamanho de Página da Web
DSC/CCT/UFCG

[email protected] [email protected]
 Páginas Longas vs Páginas Curtas
Localização rápida de
informações específicas
Vários
links
páginas curtas
Compreensão de um
tema
inteiro
sem
interrupção
Apresentação de todo o
tema em uma página
com links internos para
sub-tópicos
para
49
Princípios de Bons Projetos de
Tela
Tamanho de Página da Web
DSC/CCT/UFCG

[email protected] [email protected]
 Páginas Longas vs Páginas Curtas
Impressão de todo ou
maior
parte
do
conteúdo para leitura
posterior
Carga
de página via
modems lentos e todas
as páginas não são
necessárias
Uso de uma página longa
ou preparação de uma
versão com uma página
Criação de uma página
para a apresentação de
um índice compreensivo
com links para várias
páginas curtas
50
Princípios de Bons Projetos de
Tela
Rolamento
DSC/CCT/UFCG
[email protected] [email protected]

51
Princípios de Bons Projetos de
Tela
Rolamento vs Paginação
DSC/CCT/UFCG

 Paginação
 Inclusão
[email protected] [email protected]
de elementos que estimulem a
visualização da informação na tela mediante
“paginação”
 Criação de uma segunda versão de um site da
Web,
consistindo
de
telas
visualizáveis mediante “paginação”
individuais
52
Princípios de Bons Projetos de
Tela
Exemplo 1
DSC/CCT/UFCG
[email protected] [email protected]

Descrição:
CD-ROM
para
pacientes portadores
de
câncer
e
profissionais da área
de saude. Contém
informação detalhada
do contexto.
Características:
• 1.400 telas únicas
• 180.000 palavras
• 200 diagramas e
ilustrações
• 2½ h de entrevistas
em vídeo
53
Princípios de Bons Projetos de
Tela
Exemplo 2
DSC/CCT/UFCG
[email protected] [email protected]

Descrição:
CD-ROM componente
de uma série de 23
títulos produzida para
pacientes portadores
de tumores cerebrais e
profissionais da área
de saude.
Características:
• 1.000 telas únicas
• 60.000 palavras
• 300 diagramas e
ilustrações
• 2 h de entrevistas
em vídeo
54
Princípios de Bons Projetos de
Tela
Exercício
DSC/CCT/UFCG

 Analise o link http://www.usoftrecords.com/ à luz do
conteúdo estudado e das recomendações de
Galitz (2002)
[email protected] [email protected]
 Aponte as deficiências do projeto de tela, se
existirem
 Sugira soluções para cada aspecto deficiente
identificado, caso se façam necessárias
55