CAPTULO 2

ELEMENTOS DO PROJETO GRFICO

O centro visual de todo impresso ou de uma tela o layout, onde e como os recursos,
controles e contedo esto dispostos. O layout fornece a estrutura para esses elementos. Tambm
fornece a hierarquia, salientando para os usurios o que importante ou no. Para entender
melhor o layout, preciso entender os elementos que o compem (SAFFER, 2007, p.120).
2.1 Sistema de Grid
Um sistema de grid uma ferramenta que ajuda designers a padronizar a informao de
maneira coerente. Comea-se dividindo a tela ou o papel em algumas partes bsicas. O grid
a sugesto de uma linha guia do projeto. Eles no formam reas rgidas, pois, se necessrio,
elementos so sobrepostos - como imagens - ou blocos maiores de informao so criados. O
grid ajuda a visualizao da hierarquia das informaes dispostas, alm de manter o ritmo e
fluxo dos elementos - na tela e no papel52.
Timothy Samara, autor do livro Grid: Construo e Desconstruo define:
Um grid consiste num conjunto especfico de relaes de alinhamento
que funcionam como guias para a distribuio dos elementos num
formato. Todo grid possui as mesmas partes bsicas, por mais complexo
que seja. Cada parte desempenha uma funo especfica; as partes
podem ser combinadas segundo a necessidade, ou omitidas da estrutura
geral a critrio do designer, conforme elas atendam o no s exigncias
informativas do contedo (SAMARA, 2007, p.24).

As partes bsicas so margens, guias horizontais, zonas espaciais, marcadores, mdulos,

colunas e calhas (figura 35). Margens so os espaos negativos entre o limite do formato e o
contedo que cercam e definem a rea viva onde ficaro os tipos e as imagens. As propores
da margem ajudam a estabelecer a dinmica entre os elementos da composio, alm de serem
usadas para orientar o foco visual, repousar os olhos ou ser usada como uma rea para insero
de informaes secundrias. Guias horizontais ou flowlines so os alinhamentos que quebram o
espao em faixas horizontais, ajudam a orientar os olhos e so usadas para criar diferentes incios
ou pausas para textos e imagens. Zonas espaciais so grupos de mdulos que, juntos, formam
campos distintos cada campo pode receber uma funo especfica ao apresentar a informao;
por exemplo, pode-se reservar um campo para imagens e outro para textos, cada um pode ter
diferentes formatos dentro do grid. Marcadores so indicadores de localizao para textos
secundrios ou constantes, como cabealhos, nome de sees, flios, ou qualquer outro elemento
que ocupe sempre a mesma posio em qualquer pgina. Mdulos so unidades individuais
de espaos separadas por intervalos regulares que, repetidas no formato da pgina, criam colunas
e faixas horizontais. Colunas so alinhamentos verticais que criam divises horizontais entre
as margens. A quantidade de colunas indeterminada; s vezes tm a mesma largura, s vezes
tm larguras diferentes, correspondendo a informaes especficas53. Calhas ou gutters so os
espaos em branco que separam as linhas e colunas (SAFFER, 2007, p.123, traduo nossa).
52
53

Ibid, p.123
Ibid, p.25
Elementos do Projeto Grfico

51

Margens

Guias Horizontais (flowlines)

Calhas (gutters)

Zonas Espaciais

Marcadores

Colunas

Mdulos
Figura 35 - partes bsicas do grid

Existem diferentes tipos de grids (figura 36), como o grid retangular que possui uma
estrutura mais simples geralmente usado para acomodar textos longos e corridos, o grid
de colunas que costuma beneficiar a informao descontnua, pois as colunas podem ser
dependentes umas das outras no texto corrido, independentes para pequenos blocos de texto
ou somadas para formar colunas mais largas, o grid modular geralmente utilizado em
projetos muito complexos, como o de um jornal, os mdulos proporcionam maior controle da
informao e o grid hierrquico que se adapta s exigncias do projeto, esse tipo de grid, seja
em livros, cartazes ou pginas de internet, uma abordagem quase orgnica dos elementos
e da informao que ainda unifica arquitetonicamente todas as partes do espao tipogrfico
(SAMARA, 2007, p.26 a 29).
Elementos do Projeto Grfico

52

Grid Modular

Grid Hierrquico

Grid Retangular

Grid de Colunas

Figura 36 grids: retangular,

modular, hierrquico e de colunas

Saffer demonstra que vrios grids se tornaram padro no design de interfaces, como os
vistos em layouts de diferentes aplicativos, como o Microsoft PowerPoint e o iTunes da Apple
(figura 37), o painel da esquerda fino e h uma grande janela central, junto com linhas e botes
acima e abaixo dessa janela. Existe tambm exemplo usado pelos usurios de e-mails e leitores
de RSS. Outro exemplo o comum grid de trs colunas para web sites. Saffer mostra que alguns
aplicativos que parecem ter a disposio livre, como o Internet Explorer e as telas simples de
telefones celulares, costumam possuir grids simples (figura 37) (SAFFER, 2007, p.124 a 126).
Microsoft Power Point/ iTunes

Elementos do Projeto Grfico

E-mail/ RSS

53

E-mail/ RSS

Web sites comuns

Internet Explorer

Figura 37 - exemplos de grids

Revista Super
A revista Superinteressante possui um grid fluido, baseado em quatro colunas, que podem
ser agrupadas ou dissociadas em vrias outras. Como a revista possui muitas ilustraes e
quadros, alm das sees de infogrficos, esses possuem um grid independente, assim o texto
diagramado de acordo com a ilustrao. Sero analisados infogrficos da revista, e como
esses no possuem grid fixo, a nfase estar nos elementos de navegao da pgina. A figura
Elementos do Projeto Grfico

54

38 foi retirada da edio 248 da revista Superinteressante em janeiro de 2008, pgina 36 e 37,
acompanhado de um possvel diagrama da pgina. A figura 39 foi retirada da edio 278 da
revista Superinteressante em maio de 2010, pgina 44 e 45.

Figura 38 - exemplos de grid da

revista Superinteressante
Elementos do Projeto Grfico

55

Figura 39- exemplos de grid da

revista Superinteressante

Site Super
O site da revista Superinteressante possui diversas sees, a que ser usada para a escolha
dos infogrficos ser a Multimdia. Ele est hospedado no site da Editora Abril, logo a pgina
da revista possui um menu da Editora Abril. Existe tambm um banner publicitrio e a seguir
o menu principal do site da Superinteressante, com as sees do site, busca e um boto para
a pgina principal. Logo abaixo aparece o nome da seo em que o usurio se encontra e o
Elementos do Projeto Grfico

56

infogrfico da pgina inicial da seo. A seguir, nessa janela existem links para as matrias
relacionadas ao infogrfico. Abaixo existe um banner publicitrio e ao lado o menu secundrio
que mostra as sees para os infogrficos digitais ao lado existe outro banner publicitrio e um
navegador de pginas logo abaixo. No final da pgina existem dois menus tercirios, o primeiro
da Editora Abril e o segundo da revista Superinteressante.

Elementos do Projeto Grfico

57

Barra de navegao do Mozilla

Menu da Editora Abril
Banner publicitrio
Menu primrio da revista
Barra de
rolagem da
pgina

Nome da
seo
Chamada

Janela do infogrfico digital

Links relacionados

Banner
publicitrio

Banner
publicitrio

Menu secundrio da
seo Multimdia

Navegador de pginas

Menu tercirio da Editora Abril

Menu tercirio da Revista Superinteressante
Barra de navegao do Windows

Figura 40 e 41 - exemplos de grid

da revista Superinteressante

A figura 40 foi retirada do site da revista Superinteressante e ento foi elaborado um

possvel grid para a pgina mostrada (figura 41). Pode-se concluir que identificar os grids
utilizados importante para compreender a maneira que a informao organizada, facilitando
assim a comparao entre mdia digital e impressa pretendida por este trabalho.
Elementos do Projeto Grfico

58

2.2 Tipografia
Robert Bringhurst autor de Elementos do Estilo Tipogrfico, define tipografia como o
ofcio que d forma visvel e durvel e, portanto existncia independente a linguagem
humana. Um dos princpios da tipografia a legibilidade (BRINGHURST, 2005, p.17 e 23). O
fato que existem muito a se discutir sobre a tipografia, desde a estrutura do tipo at a discusso
da escolha de uma fonte de acordo com gosto pessoal. Para analisar infogrficos impressos e
digitais necessrio discutir os seguintes elementos: usabilidade, categorias, alinhamento de
texto e hierarquia tipogrfica.
Lucy Niemeyer mostra que a usabilidade um elemento importante para o uso da
tipografia em projetos. Os requisitos de usabilidade podem ser determinados por trs critrios
ergonmicos, so eles: legibilidade, leiturabilidade e pregnncia. A legibilidade o atributo de
caracteres alfa-numricos que possibilita que cada um deles seja indentificvel dos outros. Isto
depende de algumas caractersticas como espessura da haste e forma do caractere (SANDERS
& MCCORMICK, 1993, in Niemeyer, 2003, p. 68), ou seja, quando as formas de diferentes
letras podem ser diferenciadas com facilidade, pode-se dizer que o tipo altamente legvel.
A alta legibilidade importante em livros e impressos com leitura intensa. Se um texto no
muito legvel, esta caracterstica vai afetar de modo determinante a velocidade com que o
texto lido e aumentar o esforo mental necessrio para indentificar corretamente as letras
e a consequente compreenso do texto. Lucy Niemeyer ressalta que a legibilidade tambm
afetada por fatores ambientais, como a iluminao, grau de contraste letra e fundo e fadiga visual
do leitor (NIEMEYER, 2003, p. 70 e 71). A leiturabilidade a qualidade que torna possvel
o reconhecimento do contedo da informao em um suporte quando ela est representada
por caracteres alfanumricos em grupamentos com significao, como palavras, frases ou
texto corrido (SANDERS & MCCORMICK, 1993, in Niemeyer, 2003, p. 73). Ela depende
do espao entre os caracteres, de sua combinao, dos espaos entre as linhas e das margens,
mais do que da configurao do caractere. Ou seja, para um alto nvel de leiturabilidade a
composio do texto deve possibilitar o fcil acesso informao contida nas palavras (...)
e depende tambm da dificuldade do vocabulrio, da estrutura frasal e do grau de abstrao
presentes nas relaes expressas pelas palavras (Niemeyer, 2003, p. 72). A pregnncia
a qualidade de um caractere ou smbolo que faz com que ele seja visvel separadamente
do seu entorno (SANDERS & MCCORMICK, 1993, in Niemeyer, 2003, p. 74). A variao
do corpo, peso, entrelinha, inclinao so importantes para tornar partes do texto pregnantes
(Niemeyer, 2003, p. 73).
Dan Saffer categoriza as fontes em serifadas e no serifadas. As serifadas, como
Garamond e Times, so mais fceis de ler em longos textos. Para James Craig serifas no
somente facilitam o fluxo horizontal como tambm quando reduzidas, ajudam a identificar as
letras individualmente (CRAIG, 1992, p.123,), isto pode ser comprovado comparando a parte
superior das fontes Arial e Times (figura 43).
Elementos do Projeto Grfico

59

Figura 43 - exemplos das fontes

Arial e Times, respectivamente

As sem serifa, como Helvetica e Arial, so tradicionalmente usadas em curtas passagens de texto,
porque suas caractersticas facilitam a leitura vertical. Alm disso, as fontes sem serifa se tornaram a
escolha padro para projetos que sero mostrados em telas, algumas fontes, como Verdana e Georgia,
foram especificamente desenhadas para a tela, suas caractersticas estruturais as permitem se adaptar s
mudanas de resoluo da tela e so confortveis para leitura (SAFFER, 2007, p. 128).
Ellen Lupton ainda ressalta quatro formas de alinhamento do texto. O justificado, quando as
margens esquerda e direita do bloco de texto so regulares, esse tipo de alinhamento produz uma forma
limpa na pgina, no entanto, podem aparecer alguns vazios no texto, que forado a caber em uma
coluna com o mesmo cumprimento. O alinhamento esquerda, quando a margem esquerda dura
e a direita suave, esse tipo de alinhamento respeita o fluxo do texto e no produz o espacejamento
irregular, preciso ter cuidado para que no aparea uma linha diagonal do texto, pois o efeito visual
desconfortvel. Dan Saffer comenta que o alinhamento esquerda o mais legvel comparado aos
outros54. O alinhamento direita, quando a margem direita dura, a esquerda suave, fora o leitor
a achar uma nova posio no incio de cada linha, geralmente usado para legendas, notas marginais,
barras laterais, citaes, olhos de texto e outras passagens que comentam o texto ou a imagem. O
centralizado, quando linhas irregulares so centralizadas entre as margens esquerda e direita, usado
para textos clssicos e formais, no entanto esttico e convencional (LUPTON, 2006, p. 84 e 85).
A hierarquia tipogrfica indica um sistema que organiza o contedo, enfatizando alguns
dados e preterindo outros. Ajuda o leitor a se localizar no texto. Cada nvel da hierarquia deve ser
indicado por um ou mais elementos, que podem ser: espaciais - como o recuo, entrelinha ou posio
na pgina - ou grficos - como tamanho, estilo, cor ou fonte55. Ellen Lupton acrescenta em relao
hierarquia na internet:
A maioria dos sites so controlados por hierarquias de um modo ainda mais
sistemtico que nos documentos impressos. A estrutura de arquivos de um
site vai de uma raiz de diretrios que possuem vrios nveis de contedo.
[...] A organizao do site reflete-se na interface da navegao forma do
contedo. A tipografia ajuda a elucidar a hierarquia que governa todas essas
caractersticas. [...] Folhas de estilo tipogrfico ajudam a pesar o contedo
recolhido, ajudando o usurio a encontrar o que quer56.

Revista Super
Segundo Gabriel Gianordoli, existem trs famlias tipogrficas utilizadas pela revista
Superinteressante. A Leitura News, fonte serifada utilizada em blocos de textos maiores, como
Ibid, p.131
Ibid, p.94
56
Ibid, p.99
54
55

Elementos do Projeto Grfico

60

matrias ou textos descritivos das sees da revista (figura 44). A Gloriola, fonte sem serifa
(figura 45). a fonte padro para as legendas, ttulos de seo e tambm para os ttulos de
matrias, mas pode ser substituda de acordo com a proposta visual da matria. E a Omnes,
uma fonte rounded, que usada em ttulos de legenda e nmeros (figura 46).

Figura 44 - Leitura News

Figura 45 - Gloriola

Figura 46 - Omnes

Site Super
Os elementos do site, como o nome das sees e chamadas, possuem uma fonte padro de
internet, que se aproxima Gill Sans (figura 47).
Elementos do Projeto Grfico

61

Figura 47 - Gill sans

2.3 Material e Formato

2.3.1 Papel
Existem caractersticas comuns a todos os papis e elas so importantes para determinar a
escolha do insumo para o projeto grfico. So as seguintes: sentido da fibra que a direo na
qual as linhas se alinham quando o papel feito, importante porque afeta a capacidade de dobra
e impresso. O sentido da pgina ideal para uma revista o paralelo lombada, pois facilita as
pginas de serem viradas facilmente; o peso o referente em quilogramas a uma resma; o corpo
o termo usado para descrever o volume, a espessura do papel, o corpo do papel que determina
a espessura de uma revista; opacidade a capacidade de um papel receber tinta sem que essa
seja vista do outro lado, quando se vira a folha, a opacidade afetada pelo peso e o corpo do
papel, quanto mais pesado e volumoso, maior o nmero de fibras a retardar a passagem da
luz, portanto maior sua opacidade; a cor existe uma ampla variedade de cores e tambm
uma gama de brancos, a brancura do papel controlada pela adio de alvejantes, tinturas
fluorescentes, pigmentos e outros aditivos. Ela vai de um branco cremoso a um branco azulado e
inclui qualquer branco imaginvel entre eles. A cor do papel afeta tudo o que impresso sobre
ele; o acabamento o termo que designa o modo pelo qual a superfcie do papel foi tratada [...]
quanto mais calandrado57 e prensado for o papel, mais fino ele ser e, portanto, ter menor corpo
e menor opacidade (CRAIG, 1980, p.130 a 132).
Segundo Gabriel Gianordoli a revista Superinteressante utiliza na capa o papel couch
115g/m2 no formato fechado 26,5cm x 20,2cm, 4/4. Para James Craig, autor do livro Produo
Grfica o papel couch geralmente brilhante e revestida com uma camada de cola e
pigmento. Muito indicada para impresso em cores. No miolo usado o papel SC, Super
Calandrado, com 52g/m2, 4/4 que possui uma opacidade entre 10 e 15%, dependendo da
imagem impressa no verso, o que no atrapalha a leitura, mas interfere na pgina anterior 58.
A funo da calandra aumentar a lisura e o brilho da superfcie do papel, operao que no difere muito da
passagem a ferro de uma camisa recentemente lavada (CRAIG, 1980, p.129).
58
Ibid, p.133
57

Elementos do Projeto Grfico

62

2.3.2 Tela
O monitor ou ecr, segundo o Dicionrio Aurlio o aparelho eletrnico, ou parte dele,
que comanda o funcionamento de outros aparelhos ou partes de aparelhos. So dois tipos:
os catdicos e os planos. Os catdicos so maioria em escritrios e so monitores volumosos
e pesados que possuem um consumo eltrico elevado. Os planos equipam os computadores
portteis, os assistentes pessoais (PDA) e os aparelhos foto numrico, bem como um nmero
cada vez maior de computadores de escritrio. Ocupam pouco espao, so leves e consumem
pouca energia.
Nos monitores coloridos, as cores provm de trs feixes distintos de luz, referentes s
cores: vermelha, verde e azul, que formam a escala RGB.
Existem algumas caractersticas tcnicas importantes para a tela so elas: a dimenso
medida em polegadas59 da diagonal da tela; a definio o nmero de pontos (pixel) que o monitor
possui, este nmero de pontos est geralmente entre 640x48060 e 2048x1536, mas resolues
superiores so tecnicamente possveis. Existem definies de tela recomendadas para a dimenso
de cada monitor (figura 48); a resoluo o nmero de pixels por unidade de superfcie, chamado
de DPI dots per inch61 uma resoluo de 300 dpi significa que uma polegada quadrada possui
300 colunas horizontais por 300 colunas verticais de pixels. A resoluo tima para apresentar
imagens na tela a 72 dpi porque a imagem possui tamanho menor e mais fcil de ser carregada
pelo computador e no demonstra problemas de leitura em tela.
Dimenso
(em polegadas)
15
17
19
21

Dimenso
(em centmetros)
38
43
48
53

Definio
(em pixels)
800x600
1024x768
1280x1024
1600x1200

Figura 48- tabela com a relao

entre as dimenses das telas de
computador

O site da revista Superinteressante foi desenvolvido para ser utilizado na resoluo de

tela 1024x800 pixels e funciona tambm na resoluo 800x600 pixels. Em relao internet, o
carregamento da templates do site da revista so rpidos. O site depende da conexo do usurio
para carregar a pgina, tanto em javascript e html. Portanto, funciona bem mesmo em uma
conexo discada.
Material e formato so importantes para a anlise comparativa entre o digital e o impresso,
j que se trata do papel da tela. Eles, digital e impresso, tm diferenas cruciais para a interao
do usurio ou leitor. Um exemplo a possibilidade de manusear a revista, j o para o site
59
60
61

Uma polegada equivale a 2,54cm.

Ou seja 640 pontos de comprimento e 480 pontos de altura.
Pontos por polegada.
Elementos do Projeto Grfico

63

preciso utilizar intermedirios, como mouse, tela, sistema, internet, para que o usurio possa
usufruir plenamente do sistema. Ainda sim no site fica mais interessante, porque possvel utilizar
de recursos multimdia vdeos, animaes, zoom - impossveis no impresso. Entendendo o
universo que separa os infogrficos digitais e impressos, possvel fazer uma crtica e anlise
condizente com as duas plataformas.
2.4 Leis da Gestalt
As leis da Gestalt sero utilizadas para embasar e dar sustentao as leituras visuais que sero
importantes para o trabalho. Para isso preciso elucidar as seguintes leis: unidade, segregao,
unificao, fechamento, boa continuao, proximidade, semelhana e pregnncia da forma.
As unidades (figura 49) so os elementos que configuram a forma (GOMES FILHO, 2008,
p.103). Joo Gomes Filho, no livro Gestalt do Objeto, ainda complementa o conceito de unidades:
Um elemento que se encerra em si mesmo ou que faz parte de um todo
[...] pode ser compreendido como o conjunto de mais de um elemento,
que configura o todo propriamente dito, ou seja, o prprio objeto [...]
Uma ou mais unidades formais so percebidas dentro de um todo
por meio de pontos, linhas, planos, volumes, cores, sombras, brilhos,
texturas e outros atributos isolados ou combinados entre si. No caso de
um obejto ser constitudo por um conjunto de numerosas unidades [...]
pode-se adotar o critrio de eleger unidades principais62.

O sumrio da edio 288 da Super (figura 49) forma uma unidade como um todo, no entanto
cada crculo uma unidade que pode ser considerado dentro do todo.

Figura 49 sumrio da edio 288,

representando as unidades
62

Ibid, p.29
Elementos do Projeto Grfico

64

Segregao o ato de separar, perceber ou identificar as unidades 63. Pode-se segregar

uma ou mais unidades, dependendo da desigualdade dos estmulos produzidos pelo campo visual
em funo das foras de um ou mais tipos de contrastes 64. Podem ser utilizados diversos meios
como: pontos, linhas, planos, volumes, cores, sombras, brilhos, texturas, relevos e outros. A figura
50, retirada da edio 274 da Super, mostra diversas unidades segregadas de diferentes formas
tamanho e cores dos crculos.

Figura 50 exemplo de segregao,

os crculos coloridos mostram as
diferentes informaes e tambm a
congruncia entre elas

A unificao da forma consiste na igualdade ou semelhana dos estmulos produzidos

pelo campo visual. Ocorre quando os prncipios de harmonia, equilbrio visual e coerncia do
estilo formal, das partes ou do todo, esto presentes num objeto ou numa composio. As leis da
proximidade e semelhana auxiliam para evidenciar a unificao. A unificao se manifesta em
graus de qualidade, ou seja, varia em razo de uma melhor ou pior composio, como o exemplo
da figura 51, no primeiro quadro, h uma unificao perfeita, pois possui equilbrio e harmonia
segundo as leis da Gestalt; no segundo quadro a unificao prejudicada por uma unidade vazada
e outra amarela, rudos visuais; no terceiro quadro ainda mais prejudicada pelo vazio de duas
unidades e pelo rudo causado pelo crculo verde e; no quarto quadro a unificao desapareceu, pois
est desordenado e irregular 65 . A figura 52 mostra algumas imagens anlogas ao exemplo anterior
retiradas da revista Super, edies 284, 288, 282 e 292 respectivamente.

Figura 51 exemplo retirado do

livro de GOMES FILHO (2008,
p.31) que demosntra os graus de
qualidade da unificao
63
64
65

Ibid, p.103
Ibid, p.30
Ibid, p.31
Elementos do Projeto Grfico

65

Figura 52 exemplos de graus de

unificao retirados das edies da
Superinteressante. Para o contexto
da revista, pode-se afirmar que a
primeira imagem possui unificao
perfeita, a segunda possui a
unificao prejudicada, a terceira
mais prejudicada e a quarta no
possui unificao

O fechamento apresenta caractersticas espaciais que do a sensao de fechamento

visual dos elementos constituintes da forma66. Essa sensao provm da continuidade de
uma ordem estrutural definida, por meio de agrupamento os elementos constituem uma figura
total que d a impresso de ser fechada e completa. Um exemplo a figura 53, retirada da
edio 280 da Super, em que pode-se ver uma banana formada por vrias partes.
66

Ibid, p.103
Elementos do Projeto Grfico

66

Figura 53 exemplo de fechamento

A boa continuao o padro visual originado por configuraes que apresentam

sequncias ou fluidez de formas67, ou seja, a organizao das formas de maneira coerente,
sem quebras ou interrupes que gera a fluidez visual. tambm a tendncia dos elementos
acompanharem uns aos outros, de maneira a permitir a continuidade de um movimento para
uma direo j estabelecida e para isso, utiliza-se de elementos como pontos, linhas, planos,
volumes, cores, texturas, brilhos, degrads e outros. Busca-se inclusive, a forma mais estvel
estruturalmente em termos perceptivos. A figura 54, retirada da edio 282 da Super, um
exemplo de boa continuao.

Figura 54 exemplo de boa

continuao

A lei da proximidade demonstra que elementos pticos prximos uns dos outros tendem
a ser vistos juntos e, por conseguinte, a constiturem um todo ou unidades dentro do todo68.
Elementos prximos, com as mesmas caractersticas de forma, cor, tamanho, entre outros, tero
maior tendncia a ser agrupados e a constituir unidades. A semelhana de forma e cor desperta
tambm a tendncia de se construir unidades, isto , de estabelecer agrupamentos de partes
67

Ibid, p.33

68

Ibid, p.34
Elementos do Projeto Grfico

67

semelhantes, o infogrfico na pgina a seguir, retirado da edio 280 da Super, ilustra bem
ambas as leis (figura 55)69.
A pregnncia pode ser definida da seguinte maneira:
Um objeto com alta pregnncia um objeto que tende espontaneamente
para uma estrutura mais simples, mais equilibrada, mais homognea e
mais regular. Apresenta um mximo de harmonia, unificao, clareza formal e um mnimo de complicao visual na organizao de suas partes ou
unidades compositivas (figura 56)70.

Figura 55 infogrfico que

representa bem as leis de
proximidade e semelhana

Figura 56 exemplo de pregnncia

2.5 Controles
Atualmente grande parte de aplicativos e dispositivos projetados por designers de interao
possuem algum tipo de controles visveis para o usurio usar para manipular recursos do produto,
por exemplo o mostrador e o controle do volume de um som stereo. Os controles fornecem os
affordances necessrios para entender o que o produto capaz de realizar e tambm fornecem
o poder para perceber a capacidade do produto (SAFFER, 2007, p.136).
69

Ibid, p.35

70

Ibid, p.36
Elementos do Projeto Grfico

68