O documento discute padrões para projetos de sistemas interativos, integrando as visões de engenharia de software e interação humano-computador. Ele apresenta um histórico do uso de padrões em diferentes domínios como arquitetura, engenharia de software e interação humano-computador, conceitos sobre padrões e um conjunto de padrões para projetos web.

1. Desenvolvimento de Sistemas
Interativos
Integração das Visões de Engenharia de Software e
Interação Humano-Computador
Padrões para Projetos WEB
Americo Talarico Neto Júnia Coutinho Anacleto Silva
André Constantino da Silva Rosângela A. Dellosso Penteado
Maio/2005

2. Tópicos
 Introdução e Histórico
 Conceito de Padrões
 Padrões em IHC – Estado da Arte
Apresentação de um conjunto de Padrões
para projetos WEB
2

3. Tópicos
 Introdução e Histórico
 Padrões na Arquitetura
 Padrões na Engenharia de Software
 Padrões na Interação Humano-Computador
 Conceito de Padrões
 Padrões em IHC – Estado da Arte
Apresentação de um conjunto de Padrões
para projetos WEB
3

4. Padrões – Histórico
(Arquitetura)
Início na Arquitetura com o trabalho de Christopher Alexander
–“A Pattern Language”, 1977
•Apresenta 253 padrões para arquitetura e
urbanismo
•São organizados em uma “Linguagem de Padrões”,
que permite o relacionamento entre os padrões
–“The Timeless Way of Building ”, 1979
•Explica os conceitos envolvidos em padrões
•O “porquê” da utilização de padrões
–“The Oregon Experiment”, 1988
•Utilização de padrões em um projeto concreto de
arquitetura na Universidade de Oregon 4

5. Padrões – Histórico
Engenharia de Software (1/2)
1987
– Primeiro provável uso de padrões na ES
– Object-Oriented Programming, Systems and Applications (OOPSLA) em 1987
Beck e Cunningham (projeto da interface com o usuário em Smalltalk)
Abordou os conceitos de Design Participativo.
1994
– Primeira Conferência Pattern Languages of Programming (PloP)
Apresentar, trocar e refinar os padrões e as linguagens de padrões para
programas de computador.
1995
Publicação do livro “Design Patterns: Elements of Reusable
Object-Oriented Software” de Gamma, Helm, Johnson e Vlissides(GoF)
Livro contendo uma coleção de padrões para o projeto de software
Orientado a Objetos
Fornece aos engenheiros de software uma forma mais prática
de transferir sua experiência adquirida em projetos anteriores
5

6. Padrões – Histórico
Engenharia de Software (2/2)
1995
– Publicação do primeiro livro da série
Pattern Languages of Program Design,
reunindo padrões publicados no PLoP
1995 1996
1997 1999
1996
– Publicação do livro Pattern-Oriented Software Architecture,
Volume 1: A System of Patterns, de Buschmann, Meunier,
Rohnert, Sommerlad e Stal
2004
– Publicação do livro Organizational Patterns of Agile
Software Development de Coplien e Harrison
6

7. Padrões – Histórico
Interação Humano-Computador
1999
– Common Ground: a Pattern Language for Human-Computer
Interface Design, de Jennifer Tidwell
2001
– A Pattern Approach to Interaction Design de Jan Borchers
– Padrões para interfaces GUI (Grafical User Interface) de
Welie e Troetteberg
2003
Welie divulga mais padrões para interfaces GUI, e padrões para
interfaces Web e para interfaces de sistemas móveis
– User Interface Patterns And Techniques de Jennifer Tidwell
7

8. Tópicos
 Introdução e Histórico
 Conceito de Padrões
 Conceitos nos diversos domínios de aplicação
 Formato de Apresentação dos padrões
 Linguagens de padrões
 Características e benefícios dos padrões
 Padrões em IHC – Estado da Arte
Apresentação de um conjunto de Padrões
para projetos WEB
8

9. Padrões - Conceito
Não existe uma definição amplamente
aceita
Baseado nas definições encontradas na
literatura, considera-se um padrão
“Solução (Experiência, Comprovada) para um
Problema (Recorrente) em um determinado
Contexto (Instâncias)”
9

10. Padrões - Características
Alexander estudou as interações entre a forma
física das construções e a maneira que essa
forma tem impacto nos comportamentos
pessoal e social
Características dos Padrões
• Permitir aos usuários leigos, os habitantes, a
capacidade de projetar seus ambientes
• Descrevem aspectos do ambiente físico.
Pessoas interagem e vivem nesse ambiente
• Necessitam ser anotados, testados, e
gradativamente melhorados
10

11. Padrões - Características
É importante saber
Padrões não são criados ou inventados
Eles são identificados por um princípio de
invariância
São uma ferramenta útil para registrar as
experiências de projetos
Qualidade Sem Nome
– “verdade essencial que satisfaz as
necessidades humanas e inclui aspectos
como perfeição, harmonia e adaptabilidade”
11

12. Padrões – Formato (1/2)
O formato de apresentação dos Padrões é
dividida em um conjunto de elementos
Diversos formatos existentes
Alexander
GoF
Não existe um formato certo
Coplien ou errado
Welie
Tidwell Formato utilizado dependerá
Coad da ênfase que o autor deseja
Fowler dar ao padrão
...
12

13. Padrões – Formato (2/2)
Segundo Meszaros e Doble (1996)
Mínimo
Nome do Padrão
Problema
Solução
Contexto
Forças
Opcionais
Contexto Resultante
Padrões Relacionados
Exemplos
Exemplos de Código
Raciocínio
Apelidos
Agradecimentos
13

14. Padrões – Formato (2/2)
Segundo Meszaros e Doble (1996)
Mínimo
Nome do Padrão
Problema
Solução A ordem de apresentação
Contexto dos elementos não é fixa
Forças e pode variar
Opcionais
Contexto Resultante
Padrões Relacionados
Exemplos
Exemplos de Código
Raciocínio
Apelidos
Agradecimentos
14

15. Padrões – Formato (2/2)
Segundo Meszaros e Doble (1996)
Mínimo
Nome do Padrão
Problema
Solução
Contexto
Forças
Os elementos opcionais
Opcionais
devem ser escolhidos
Contexto Resultante
Padrões Relacionados pelo autor
Exemplos
Exemplos de Código São para tornar a
Raciocínio compreensão do padrão
Apelidos mais fácil ou para
Agradecimentos relacionar os padrões
15

16. Formato de Apresentação de Alexander
16

17. Formato de Apresentação de Alexander
Número Nome
Confiança
Ilustração Contexto
Resumo do
Problema
Problema
Detalhado 17

18. Formato de Apresentação de Alexander
Solução
Diagrama
Referências
18

19. Formato de Apresentação de Gamma et al.
Name: Memento Nome
Intent: Without violating encapsulation, capture and externalize an Intenção
object's internal state so that the object can be restored to this state
later.
Also Known As: Token Conhecido como
Motivation: Sometimes it's necessary to record the internal state of an
object. This is required when implementing checkpoints and undo
mechanisms …
Motivação
Applicability: Use the Memento pattern when: Aplicabilidade
a snapshot of (some portion of) an object's state must be saved so that it
can be restored to that state later, and ….
Structure:
Estrutura
19

20. Formato de Apresentação de Gamma et al.
Participants:
Memento (SolverState)
Participantes
Originator (ConstraintSolver)
Caretaker (undo mechanism) Colaborações
Collaborations:
A caretaker requests a memento from an originator, holds it for a time,
and passes it back to the originator, as the following interaction diagram
illustrates:
Consequências
Consequences:
The Memento pattern has several consequences
Preserving encapsulation boundaries. Memento avoids exposing
information that only an originator should manage but that must be stored
nevertheless outside the originator...
20

21. Formato de Apresentação de Gamma et al.
Implementation: Here are two issues to consider when implementing the
Memento pattern:
class State; Implementação
class Originator {
public:
Memento* CreateMemento();
void SetMemento(const Memento*);
// ...
private:
State* _state; // internal data structures
// ...
};
class Memento { Note a natureza técnica
public:
// narrow public interface
destes tipos de padrões.
virtual ~Memento();
private: Não existe entendimento
// private members accessible only to Originator
friend class Originator; pelo usuário final leigo
Memento(); em computação.
void SetState(State*);
State* GetState();
private:
State* _state;
}; 21

22. Formato de Apresentação de Gamma et al.
Sample Code:
class MoveCommand {
Código Exemplo
public:
MoveCommand(Graphic* target, const Point& delta);
void Execute();
void Unexecute();
private:
ConstraintSolverMemento* _state;
Point _delta;
Graphic* _target;
};
Usos conhecidos
Known Uses:
The preceding sample code is based on Unidraw's support for
connectivity through its CSolver class [VL90].
Related Patterns:
Command (233): Commands can use mementos to maintain state for
undoable operations. Padrões
Iterator (257): Mementos can be used for iteration as described earlier. Relacionados
22

23. Formato de Apresentação de Welie
23

24. Formato de Apresentação de Welie
Nome Autor Problema
Princípio
Contexto
Influências/
Motivação
Solução
Raciocínio
24

25. Formato de Apresentação de Welie
Exemplos
Usos
Conhecidos
Padrões
Relacionados
Implementação
25

26. Linguagem de Padrões - Conceito
“Uma Linguagem de Padrões nada mais é do que uma
(Alexander, 1977)
26

27. Linguagem de Padrões - Formato
Segundo Meszaros e Doble (1996)
Divide o problema geral e sua solução complexa em
um número de problemas relacionados com suas
respectivas soluções
Cada par problema/solução será um Padrão
É bom que contenha:
Nome evocativo
Descrição do problema geral
Sumário que apresente os padrões
– Padrões devem estar relacionados, especialmente
nos elementos Contexto e Padrões Relacionados
27

28. Linguagem de Padrões – Exemplo
A Linguagem de Padrões de Borchers
28

29. Linguagem de Padrões - Conceito
• “As metas de uma linguagem de padrões
de IHC são compartilhar soluções de
projeto IHC de sucesso entre colegas da
área, e fornecer uma linguagem comum
para projeto IHC para qualquer um que
esteja envolvido no projeto,
desenvolvimento, avaliação ou uso do
sistema interativo.”
INTERACT’99
29

30. Linguagem de Padrões - Conceito
• “As metas de uma linguagem de padrões
de IHC são compartilhar soluções de
projeto IHC de sucesso entre colegas da
Meta 1 área, e fornecer uma linguagem comum
para projeto IHC para qualquer um que
esteja envolvido no projeto,
desenvolvimento, avaliação ou uso do
sistema interativo.”
INTERACT’99
30

31. Linguagem de Padrões - Conceito
• “As metas de uma linguagem de padrões
de IHC são compartilhar soluções de
projeto IHC de sucesso entre colegas da
área, e fornecer uma linguagem comum
para projeto IHC para qualquer um que
Meta 2 esteja envolvido no projeto,
desenvolvimento, avaliação ou uso do
sistema interativo.”
Inclusive o usuário
do sistema INTERACT’99
31

32. Padrões - Benefícios
Fornecimento de um vocabulário de
comunicação
Entre a equipe de desenvolvimento
Melhoram a comunicação
Equipe de desenvolvimento e usuários do
sistema
Permitindo que usuários finais opinem nas
decisões de projeto e que se expressem melhor
Captura de experiência
Transferência de conhecimentos entre pessoas
com níveis de experiência diferentes
32

33. Tópicos

I
n
t
r
o
d
u
ç
ã
o 33

34. Padrões de IHC
• “Uma linguagem de padrões de interação
gera projetos de interação de
espaço/tempo que cria uma imagem do
sistema próxima ao modelo mental do
usuário da tarefa a ser realizada, fazendo
com que a interface humano-computador
seja a mais transparente possível.”
ChiliPLoP’98
34

35. Padrões de IHC
• “Uma linguagem de padrões de interação
gera projetos de interação de
espaço/tempo que cria uma imagem do
sistema próxima ao modelo mental do
usuário da tarefa a ser realizada, fazendo
com que a interface humano-computador
seja a mais transparente possível.”
ChiliPLoP’98
35

36. Padrões de IHC
• “Uma linguagem de padrões de interação
gera projetos de interação de
espaço/tempo que cria uma imagem do
sistema próxima ao modelo mental do
usuário da tarefa a ser realizada, fazendo
com que a interface humano-computador
seja a mais transparente possível.”
ChiliPLoP’98
36

37. Padrões de IHC
• “Uma linguagem de padrões de interação
gera projetos de interação de
espaço/tempo que cria uma imagem do
sistema próxima ao modelo mental do
usuário da tarefa a ser realizada, fazendo
com que a interface humano-computador
seja a mais transparente possível.”
ChiliPLoP’98
37

38. Padrões de IHC - Categorias
Padrões para Interação relacionados com
preocupações de alto
Humano-Computador nível, e algumas vezes
com guidelines,
envolvendo a
psicologia do usuário
Padrões para Interface
Ex.: Navigable Space
com o Usuário
Padrões para Avaliação
de Usabilidade
38

39. Padrões de IHC - Categorias
Padrões para Interação
Humano-Computador
relacionados com
Padrões para Interface problemas de interação
específicos e sua
com o Usuário solução é baseada em
componentes de
interface com o usuário
Padrões para Avaliação Ex.: Liquid Layout
de Usabilidade
39

40. Padrões de IHC - Categorias
Padrões para Interação
Humano-Computador
Expressam como
conduzir o processo de
avaliação de
Padrões para Interface usabilidade, auxiliam a
planejar e executar a
com o Usuário avaliação e editar e
avaliar os dados
coletados
Padrões para Avaliação Ex.: Linguagem de
de Usabilidade padrões para avaliação
de usabilidade de
Gellner e Forbrig
40

41. Principais Trabalhos
Linguagem de Padrões da Tidwell (1998)
Linguagem de Padrões de Borchers (2000)
• Linguagem de Padrões de Montero et al. (2002)
Coleção de Padrões da Tidwell (2003)
Coleções de Padrões de Welie (2003)
41

42. Linguagem de Padrões Common Ground
Autora: Tidwell
– Artigo: Interaction Design Patterns, PLoP 1998.
– Web: http://www.mit.edu/~jtidwell/interaction_patterns.html
Padrões para projeto de interação entre humanos e
qualquer tipo de artefato
60 padrões identificados
Pioneirismo
Mais conhecido e mais usado
Escolha dos padrões:
Através de perguntas que estão relacionadas com o
contexto do padrão
Alguns padrões foram identificados e não escritos
42

43. Coleção UI Patterns and Techniques
Autora: Tidwell
– Web: http://time-tripper.com/uipatterns
desenvolvimento de interfaces com o usuário
40 Padrões
Divisão dos padrões em categorias
Formato do Padrão:
Nome
Exemplo
• Usando quando (Used When)
• Porquê (Why)
• Como (How)
Exemplos
Alguns padrões foram identificados e não escritos
43

44. A Linguagem de Padrões de Borchers
Autor: Borchers
– Livro: A Pattern Approach to Interaction Design
Contendo padrões de ES, IHC e de música (domínio de
aplicação)
– Web: http://www.hcipatterns.org/patterns/borchers/patternindex.html
Apenas os padrões de IHC
Interação com quiosques
Como representar o modelo mental do usuário
como tornar a interação mais atrativa ao usuário
Oferecer um grau de transparência da interação
Divisão dos padrões em níveis de abstração
44

45. A Coleção de Welie
– Autores: Welie e Trætteberg
– Welie e Trætteberg. Interaction Patterns in User
Interfaces, PLoP 2000.
– Web: http://www.welie.com
Padrões para projeto de interfaces para:
Web: 89 padrões
GUI: 26 padrões
Dispositivos Móveis: 7 padrões
Divide os padrões em categorias
45

46. A Linguagem de Padrões de Montero et al.
Linguagem de Padrões
– Montero, Lozano, Gonzáles, Ramos. A First
Approach To Design Web Sites By Using Patterns,
VikingPLoP 2002.
padrões para projeto de interfaces com o usuário
para Web
23 padrões identificados
Divisão dos padrões em três categorias:
Web sites
Páginas Web
Ornamentais
46

47. Comparação dos Trabalhos
Linguagem Coleção Linguagem
Linguagem Coleções de
Common de Motero et
Ground UI Patterns de Borchers Welie
al.
Número de 60 40 17 122 23
Padrões
Uniformidade parcial parcial total parcial total
Organização Linguagem Coleção Linguagem Coleção Linguagem
Propósito Interação Interface Interação GUI, Web e Web
(Desktop ou com Móveis
Web) Quiosques
Disponibiliza- Artigo* Web Livro, Web Artigo
ção Web Web*
Padrões não sim sim não não não
escritos?
*Não contém todos os padrões do autor 47

48. Padrão Undo vs. Padrão Memento
Undo Name: Memento
Intent: Without violating encapsulation, capture and
Author Martijn van Welie externalize an object's internal state so that the
object can be restored to this state later.
Problem Users may do actions they later want
reverse. Also Known As: Token
Motivation: Sometimes it's necessary to record the
Principle Error Management (Safety) internal state of an object. This is required when
implementing checkpoints and undo mechanisms
Context Most applications where restoring the …
state after an erroneous action is relatively hard to
do by hand e.g. when it requires several actions.
Forces
•Users typically explore functionality of an Applicability: Use the Memento pattern when:
application but do not want to be "punished" when a snapshot of (some portion of) an object's state
selecting unwanted functions. must be saved so that it can be restored to that
•Some actions may have side effects that cannot state later, and ….
be undone by the application.
•Often users want to reverse several actions Structure:
instead of just the last action.
Solution Let the users reverse their last actions.
Maintain a queue of executed commands and allow
the user to undo at least the last couple of actions.
Show the history of commands so that users
know... 48

49. Padrão Undo vs. Padrão Memento
Implementation: Here are two issues to consider
Examples when implementing the Memento pattern:
class State;
class Originator {
public:
Memento* CreateMemento();
void SetMemento(const Memento*);
// ...
private:
State* _state; // internal data structures
// ...
As in all MS Office applications, in Word 2000 the };
users can see the history of their actions and undo
one or more of them. The actions are briefly class Memento {
described and the users can select a range of public:
actions to be undo. After selecting undo, users can // narrow public interface
even redo the actions. virtual ~Memento();
private:
Known Uses Most office applications; Word, // private members accessible only to
WordPerfect, CorelDraw Originator
friend class Originator;
Related Patterns Consider the WARNING pattern Memento();
for commands that have side effects that cannot be
undone. void SetState(State*);
State* GetState();
Implementation private:
State* _state;
};
49

50. Padrão Undo vs. Padrão Memento
Undo Memento
(Welie) (Gamma et al.)
Foco Descrição da objetos que
funcionalidade dispõem a
funcionalidade
Leitores Usuários e Engenheiros de
projetistas Software OO
Formato Ênfase na Ênfase nos
descrição da diagramas e
funcionalidade implementação
50

51. Padrão Undo vs. Padrão Memento
• A questão “o padrão Undo do Welie é melhor do
que o padrão Memento do Gamma” está
equivocada
Qual é mais importante para o projetista de interface?
Qual é mais relevante ao projetista?
Eles apresentam visões diferentes
Cada visão é importante em uma parte do projeto
projeto de desenvolvimento
É importante usarmos padrões das duas áreas em
conjunto
51

52. Modelo de Processo do Projeto da
Interação (Dearden, 2002) (1/2)
1. Introdução
O facilitador introduz
– o que são os padrões
– Para que servem
– Como podem auxiliar o trabalho
– Formato
2. Leitura dos Padrões
O facilitador solicita que o usuário leia um padrão de cada
vez
Facilitador pergunta se o usuário entendeu todos os termos
Facilitador pergunta ao usuário sobre o que ele entendeu
sobre o padrão
Facilitador tira as dúvidas do usuário
52

53. Modelo de Processo do Projeto da
Interação (Dearden, 2002) (2/2)
1. Desenvolvimento da interface
Facilitador guia o usuário no desenvolvimento da
interface
Foque uma tela por vez
Permita ao usuário manipular os padrões
Ao terminar uma tela, facilitador verifica se a tela
satisfaz as diretivas dos padrões utilizados
4. Desenvolvimento iterativo começando com protótipos
de papel, chegando em mock-ups e utilização de
ferramentas de autoria em direção a um produto
completo.
53

54. Tópicos

54

55. A Linguagem de Padrões de Montero et al.
Web Sites Páginas Web Ornamentais
55

56. Welcome
56

57. Welcome
Contexto: Usuário necessita saber onde ele está, o que pode fazer e o
que ele necessita para visitar o lugar
Problema: Como o usuário sabe onde ele está?
Solução: Forneça um lugar para recepção onde condições de acesso
podem ser avaliadas
• Possibilitar acesso ao Site (Homepage) (Indication)
• Obtenha informações do usuário como linguagem e
resolução (Ready)
• Informe sobre as melhores condições para visitar o site de
forma adequada (Polyglot)
• Informe sobre o conteúdo (About This) e seu proprietário
(Contact Us)
57

58. Indication
58

59. Indication
Contexto: Os usuários necessitam saber onde eles podem ir e o que
Problema: Como os usuários podem saber onde podem ir e o que eles
acharão
lá?
Solução: Forneça o mecanismo necessário (links significantes) que
per
mit
am
qu
alq
uer
us
uár
io
mo
ver
59

60. A Linguagem de Padrões de Montero et al.
Web Sites Páginas Web Ornamentais
60

61. Homepage
61

62. Homepage
Contexto: Uma página é acessa de várias maneiras, entretanto deve haver
Problema: Como o usuário sabe onde ele está?
Solução: Forneça uma página inicial onde o usuário se sinta como
• Permita ao usuário utilizar retornos caso esteja
• Layout do site coloca importante informações no topo da
• Incluir logos (Tagline), mecanismos de busca (Search) e
62

63. Polite
63

64. Polite
Contexto: As pessoas se diferem amplamente nos termos que utilizam
Problema: Como o usuário acessa o conteúdo da página de modo
Solução: Use a linguagem apropriada de modo mais simples e clara
• Use etiquetas associadas com seus controles (Indication)
• Expresse uma idéia em cada sentença (Tagline)
• Use métodos (como os do Design Participativo e
64

65. Busy
65

66. Busy
Contexto: Downloads podem demorar muito tempo, criando atrasos
significantes ou podem ser completados de modos
diferentes
Problema: Como o usuário sabe quando suas operações terminaram?
Solução: Forneça feedback ao usuário
• Forneça informações
sobre o tamanho de
qualquer elemento que o
usuário pode fazer
download
• Imagens e textos podem
ser carregados sobre
demanda (Size) 66

67. Form
67

68. Form
Contexto: O usuário tem que fornecer informações
Problema: Como o usuário fornece informações para o proprietário do
Solução: Forneça “brancos” apropriados para serem preenchidos,
• Em algumas ocasiões, um formulário pode ocupar uma
• O usuário necessita saber se sua submissão foi
68

69. A Linguagem de Padrões de Montero et al.
Web Sites Páginas Web Ornamentais
69

70. Tag Line
70

71. Tag Line
Contexto: É necessário saber a proposta do website
Problema: Como o usuário sabe qual o propósito do website?
Solução: Forneça um slogan ou imagem que identifique o website e
• Resumida, simples e direta
• Inclua uma descrição do site na janela do navegador
71

72. Print
72

73. Print
Contexto: A leitura de textos num website é diferente da leitura em
textos impressos. A maioria das pessoas lêem blocos de
texto ao invés de ler palavra por palavra
Problema: Como o usuário pode conseguir uma impressão adequada
da informação?
Solução: Forneça a informação de diversas maneiras e formatos
e dê a possibilidade de imprimir ou salvar documentos
grandes.
73

74. Subscription
74

75. Subscription
Contexto: Os usuários não querem visitar o website a todo momento. Eles
desejam saber quando novos produtos ou novidades aparecem.
Problema: Como o usuário pode ficar sabendo de informações
significativas para ele?
Solução: Forneça um formulário no qual o usuário pode conseguir a
informação, que ele deseja, automaticamente.
• o usuário deve ter certeza de que seu email não será
divulgado a todos (Secret).
75

76. Colour
76

77. Colour
Contexto: A cor deve ser considerada no início do projeto de um
website.
Problema: Como o usuário pode acessar informações de uma forma
adequada?
Solução: Forneça a informação usando cores adequadas nas fontes,
fundos de tela e imagens.
• mudança de cores em links visitados e não visitados
• cuidado com contrastes de cores
• use cores brilhantes somente para destacar informações
77

78. Location
78

79. Location
Contexto: Quando um usuário chega em um Website, ele precisa
saber onde está.
Problema: Como o usuário sabe onde está ou qual é a sessão que ele
está?
Solução: Forneça informação sobre a localização do usuário no
79

80. Novelty
80

81. Novelty
Contexto: Usuários gostam de saber se existem novas
funcionalidades, promoções, ofertas, noticias no Website
Problema: Como o usuário pode saber das novidades e ultimas
notícias do website?
Solução: Forneça sugestões e novidades do website de uma maneira
81

82. Size
82

83. Size
Contexto: Balanceamento entre gráficos e tempo real
Problema: Como o usuário pode acessar informações de uma forma
adequada?
Solução: Forneça a informação usando cores adequadas nas fontes,
fundos de tela e páginas.
• Animações, imagens e arquivos longos devem ser
fornecidas sob demanda.
• Tamanho de página, rolagem e tamanho de fontes são
importantes
83

84. Dúvidas?
84

85. Desenvolvimento de Sistemas
Interativos
Integração das Visões de Engenharia de Software e
Interação Humano-Computador
Padrões para Projetos WEB
Americo Talarico Neto Júnia Coutinho Anacleto Silva
André Constantino da Silva Rosângela A. Dellosso Penteado
Maio/2005