TUDO que você PRECISA saber

sobre GESTALT no DESIGN

GRÁFICO
Este conteúdo foi disponibilizado pelo canal Nadine Fronza.

O que é GESTALT no design gráfico e porque você precisa saber disso

Os princípios de Gestalt são um conhecimento de psicologia responsável pela teoria

da forma. Nós usamos o Gestalt em projetos de design o tempo todo, muitas vezes
até de maneira inconsciente. Essa teoria nos ajuda a entender e assimilar as
informações que são transmitidas através das imagens.
Hoje eu vou te contar quais são os 08 princípios de Gestalt e dar exemplos práticos
de como você pode aplicá-los ao seu design, Vamos lá?!
Oi designers e criativos, tudo bem?! Talvez você esteja se perguntando porque
temos conhecimentos de psicologia sendo estudados no design. O designer precisa
conhecer sobre a percepção humana para transmitir a mensagem desejada, criar
um layout atrativo e proporcionar uma boa experiência para o espectador.

Vantagens de aplicar os princípios de GESTALT ao design

E existem algumas vantagens em aplicar a teoria da forma nos seus designs, como
por exemplo:

Melhorar o resultado final de seu projeto

Impressionar o espectador com design único e memorável

Permitir possibilidades diferentes de criação

Quais são os princípios de GESTALT?

1 Unidade
Uma unidade pode ser identificada como um único elemento no design (que
pode se encerrar em si mesmo), ou até mesmo um conjunto de elementos que é
visto como um todo.
Nosso cérebro sempre percebe o contexto como um todo antes de se atentar
aos detalhes e partes que podem estar separadas dentro desse mesmo

TUDO que você PRECISA saber sobre GESTALT no DESIGN GRÁFICO 1

 conjunto.
Essas partes são chamadas de unidades formais, que podem ser detalhes
como pontos, linhas, formas, cores, luzes, sombras, texturas e outros
elementos.

A letra S é um excelente exemplo de unidade. Ela começa a forma e encerra em

si mesma. Identificamos como um único elemento. Outras letras também
poderiam encaixar-se no princípio de unidade.

TUDO que você PRECISA saber sobre GESTALT no DESIGN GRÁFICO 2

 O formato do círculo também começa e encerra em si mesmo. Ele possui uma
linha própria contornando o elemento, podendo ser preenchido ou não. Outros
elementos poderiam se encaixar neste exemplo como o quadrado, triângulo e
formas diferentes.

Aqui o logotipo da Ford pode ser percebido de formas diferentes: Você pode
enxergá-lo como um todo. Ou você pode notar cada letra de forma individual,
inclusive o formato azul e a borda branca. Outra forma é visualizar as letras
como uma unidade e as formas ovais como outra unidade.

TUDO que você PRECISA saber sobre GESTALT no DESIGN GRÁFICO 3

 A árvore também é um excelente exemplo de princípio de unidade. Primeiro
nosso cérebro enxerga ela como um todo. Depois nós podemos nos atentar aos
detalhes, como quantidade de galhos, grupos de folhas, texturas, cores e outros
elementos.

2 Segregação
Segregação significa a capacidade da nossa percepção de separar, evidenciar
ou notar unidades dentro do todo, mesmo que estes elementos estejam
sobrepostos. Naturalmente nós separamos uma ou mais unidades do conjunto,
dependendo do contraste.

Quanto maior o contraste entre esses elementos, maior nossa capacidade de

segregação. Quanto menor o contraste, menos estímulo temos para separar
estes elementos visualmente.

Na primeira estrela conseguimos destacá-la com muita facilidade do círculo ao

fundo, pois possui um alto contraste entre os elementos. Automaticamente,
nosso cérebro é mais estimulado. A medida que o contraste vai diminuindo,
essa separação vai se tornando menos perceptível aos nossos olhos.

TUDO que você PRECISA saber sobre GESTALT no DESIGN GRÁFICO 4

 Este exemplo também é muito legal. No primeiro bloco podemos separar o
círculo laranja ao centro dos círculos vermelhos, mas ele não está em muito
destaque. Já o bloco à direita, temos maior facilidade em separar o círculo do
centro, pois este azul contrasta mais com os círculos vermelhos das laterais.

Aqui, todas as formas são iguais. Mas nós separamos o elemento de cima, pois
ele encontra-se bem menor que os demais. Quanto maior a diferença entre os
elementos, maior nossa capacidade de segregação.

TUDO que você PRECISA saber sobre GESTALT no DESIGN GRÁFICO 5

 O teclado do computador também é um excelente exemplo. Podemos enxergar
ele como um todo, um grupo de várias teclas. Ou podemos separar ele em
pequenos grupos, de teclas menores (correspondentes às letras), a tecla maior
de espaço), e as teclas de formatos diferentes como o Enter e o Shift.

3 Unificação

A unificação, ao contrário da segregação, trata-se da capacidade de unir e

enxergar simetria em elementos diferentes entre si. Quanto melhor o equilíbrio
visual e harmonia entre os elementos, maior nosso poder de unificação.

Mesmo que os elementos não sejam completamente iguais, podemos unificá-los

quando estão posicionados de forma simétrica e contrabalanceados na imagem.

TUDO que você PRECISA saber sobre GESTALT no DESIGN GRÁFICO 6

 A Manda é um incrível exemplo de unificação. Se você reparar bem, existem
muitos elementos diferentes aqui. Porém eles estão bem posicionados e há uma
grande harmonia entre as partes. É por isso que podemos unificar e enxergar
simetria em formas como essa.

O Pneu da bicicleta também é muito interessante. Ele possui vários raios, que
são os filetes de várias direções que se encontram ao centro. Mas eles se
encontram em posições harmônicas que nos permitem enxergar de maneira
unificada.

TUDO que você PRECISA saber sobre GESTALT no DESIGN GRÁFICO 7

 O Yin Yang tem um equilíbrio simétrico completamente oposto, com pesos
visuais contrabalanceados bem distribuídos visualmente. Com o alto contraste e
harmonia, nosso cérebro se sente atraído pela imagem e valoriza o todo.

Na arquitetura também podemos notar muitos exemplos do princípio de

unificação. Existem várias partes deste teto com geometrias diferentes, mas
bem equilibradas. Isso agrada visualmente nossos olhos.

4 Fechamento

TUDO que você PRECISA saber sobre GESTALT no DESIGN GRÁFICO 8

 Nosso cérebro é capaz de produzir contornos que não existem, com a finalidade
de fechar as formas. Isso acontece quando os elementos estão próximos uns
aos outros e parecem se completar.

É importante reforçar que essa sensação de fechamento sensorial é diferente

do fechamento físico, onde as formas possuem um contorno real.

Temos apenas 04 cantos desenhados na primeira imagem, mas nosso cérebro

automaticamente enxerga um quadrado ali. É incrível nossa capacidade de
produzir linhas imaginárias e criar contornos em locais que não existem.

TUDO que você PRECISA saber sobre GESTALT no DESIGN GRÁFICO 9

 Este é o logo famoso da WWF. O desenho do urso panda não está
completamente fechado, vemos apenas algumas partes dele como as patas,
orelhas e uns detalhes do rosto. Mas nosso cérebro vê tranquilamente o urso.

No logo da Mitsubishi podemos enxergar um triângulo, mas na verdade ele não

encontra-se preenchido. É apenas uma necessidade do nosso cérebro de fazer
um fechamento sensorial das formas.

TUDO que você PRECISA saber sobre GESTALT no DESIGN GRÁFICO 10

 Nessa imagem, a mão está posicionada sob um bocal de lâmpada. Ela cria o
contorno da lâmpada, mas essa forma também não está completamente
fechada. Porém, pela nossa capacidade de fechamento, conseguimos visualizar
a lâmpada tranquilamente.

5 Continuidade
A continuidade ou continuação é a lei que define a impressão visual que temos
de partes que estão organizadas de maneira coerente. Ou seja, temos uma
sequência de elementos com muita fluidez, sem interrupção e sem quebras
visuais.
É a tendência dos elementos de acompanharem uns aos outros, de maneira
que sigam um movimento. Seria como se a gente já pudesse esperar a posição
da próxima parte do grupo. Pode ser definido por pontos, linhas, formas, cores,
texturas, gradientes e outros.

Depois de ver a posição da primeira bolinha, já podemos prever o movimento

das próximas, pois todas elas estão posicionadas de maneira fluída. A
impressão que temos é que as bolinhas encontram-se em movimento, mesmo
com a imagem estática.

TUDO que você PRECISA saber sobre GESTALT no DESIGN GRÁFICO 11

 Aqui as barras acompanham uma lógica de ordem crescente, seguindo a
mesma proporção de crescimento. Isso cria fluidez e não quebra a continuidade
visual. Se as barras do gráfico crescessem de maneira desproporcional, o
princípio de continuidade não seria aplicado.

Nessa paleta de cores, já podemos esperar qual a tonalidade da cor seguinte.

Começa do verde azulado mais fraco e vai intensificando até o tom mais forte.

TUDO que você PRECISA saber sobre GESTALT no DESIGN GRÁFICO 12

 As escadas também são um excelente exemplo de continuidade. Os degraus,
quando exatamente iguais, nos proporcionam conforto visual. Sabemos
exatamente qual a posição do próximo elemento. Você já sentiu desconforto ao
caminhar em uma escada com degraus irregulares?

6 Proximidade
Elementos que estão próximos uns aos outros, tendem a serem vistos juntos.
Uma consequência disso é que construímos uma unidade com as partes que
estão próximas.
Quanto menor a distância entre os elementos, maior nosso poder de unificá-los.

TUDO que você PRECISA saber sobre GESTALT no DESIGN GRÁFICO 13

 Temos vários círculos, mas nosso cérebro automaticamente formou 04 grupos:
01 grupo com 04 círculos, 01 grupo com 05 círculos, 01 grupo com 03 círculos e
01 grupo com 06 círculos.

No piano, todas as teclas são iguais, mas nosso cérebro separa em pequenos
grupos de 3 em 2, pela proximidade dos grupos.

TUDO que você PRECISA saber sobre GESTALT no DESIGN GRÁFICO 14

 Neste layout podemos ver um primeiro grupo de informações sobre o Desktop,
um segundo grupo com um botão de interação da Amazon e dentro deste grupo
vemos subgrupos com outras informações. Isso acontece pela proximidade dos
elementos e contraste.

Este é outro exemplo de layout onde separamos cada bloco por proximidade
dos elementos. Outros fatores também contribuíram para o sucesso desse
design como a aplicação dos princípios de design gráfico.

7 Semelhança

TUDO que você PRECISA saber sobre GESTALT no DESIGN GRÁFICO 15

 Objetos iguais ou semelhantes, sejam na forma ou na cor, também despertam
em nós a construção de unidades. Quando vemos vários elementos parecidos,
nosso cérebro agrupa-os de forma simples.

Aqui nós podemos ver um grupo de formas azuis intercalado por um grupo de
formas vermelhas. Dificilmente vemos em primeira mão formas azuis e
amarelas em sequência. Isso acontece pois quando vemos objetos parecidos
nosso cérebro agrupa-os.

TUDO que você PRECISA saber sobre GESTALT no DESIGN GRÁFICO 16

 O mesmo acontece com estes círculos, nosso cérebro cria pequenos grupos de
círculos verdes, intercalados por rosas e verdes novamente na sequência. A
separação acontece de duas formas: pelas cores e pelo tamanho dos
elementos.

Essa imagem de publicidade é um excelente exemplo do princípio de

semelhança. Todas as bolas são de sinuca, mas podemos enxergar o desenho
de um copo de chopp pela diferença cor das bolinhas. Nosso cérebro criou 03
grupos: 01 para a espuma, 01 para a cor da cerveja e outro para o pegador do
copo.

TUDO que você PRECISA saber sobre GESTALT no DESIGN GRÁFICO 17

 Agora nós vemos uma coluna de círculos e triângulos no rosa claro intercalada
por outra no rosa escuro, diferente do primeiro exemplo. Isso acontece porque
neste momento o contraste das cores foi mais forte.

8 Pregnância
Essa é a lei básica da percepção visual de Gestalt, que afirma que um objeto
com alta pregnância são aqueles que possuem estruturas e formas mais
simples possíveis, equilibradas, homogêneas e regulares.
Nosso cérebro não gosta de complicações visuais, então as formas
simplificadas apresentam para nós muita harmonia, unificação, clareza e
organização. Quanto mais clareza e organização visual do objeto, mais
facilidade de compreensão e rapidez na interpretação da imagem nós temos.

TUDO que você PRECISA saber sobre GESTALT no DESIGN GRÁFICO 18

 O símbolo da Nike é querido e memorável pois possui uma forma muito simples,
que transmite clareza e pode ser rapidamente interpretada pelas pessoas. O
design é limpo, os traços são regulares e a estrutura é organizada.

Outro exemplo de pregnância que podemos aplicar ao design é através das

fontes. Observe como fontes mais simples possuem alta pregnância e são
fáceis de serem lidas, a medida de que fontes com mais detalhes prejudicam a
legibilidade e acabam afetando o interesse na leitura.

TUDO que você PRECISA saber sobre GESTALT no DESIGN GRÁFICO 19

 O exemplo deste acervo de livros também é muito legal. Na primeira imagem os
livros estão posicionados de qualquer jeito, em posições verticais e horizontais.
Já na segunda imagem, todos os livros encontram-se na vertical.

As cidades são outro um exemplo. Temos fios, calçadas, cada casa possui um
formato e cor diferente. Somos carregados pelo excesso de elemento visual
constantemente. Já na natureza, podemos ver como possui poucos elementos e
muita simetria.

TUDO que você PRECISA saber sobre GESTALT no DESIGN GRÁFICO 20

 Os conhecimentos deste vídeo foram embasados no livro Gestalt do Objeto, sistema
de leitura visual da forma do autor João Gomes Filho.
Infelizmente este livro não possui edições novas sendo vendidas, mas você pode
encontrar exemplares usados em sebos ou no site Estante Virtual.

TUDO que você PRECISA saber sobre GESTALT no DESIGN GRÁFICO 21