1. Exemplos da guestalt
no Design Digital
Gestalt aplicada no design de
interfaces: exemplos práticos
Material retirado da revista Wide
Edição de n°83
www.revistawide.com.br/index.php/gestalt-interfaces-exemplos/

3. Unidade e Pregnância: “A composição inteira é percebida como mancha
visual harmônica, cujas linhas visuais de leitura se resolvem internamente,
sem remeter a algo externo, gerando ruído. Dá a impressão que não falta
nem sobra nada. Também se percebe que, mesmo com a riqueza de
formas, tudo é assimilado imediatamente como uma entidade visual
harmônica de alta pregnância.”
Unificação, Continuidade e Proximidade: “É um caso interessante de
três níveis perceptivos, com micro-elementos (ícones, textos, boxes,
detalhes menores das ilustrações), as subcomposições, formadas pelo
que se vê no campo visual dentro das dimensões do monitor, e a
composição macro, que é gigante, representando a união de todas as
partes.
Segregação e Semelhança: “Temos um verdadeiro caos controlado aqui.
Percebemos uma riquíssima paleta de cores, formas e elementos visuais,
mas que, pela genialidade do profissional, conseguem ser nitidamente
percebidas individualmente por seguirem uma semelhança estética,
graças ao uso de tipografia única, uma área de fundo sólida (em contraste
com a composição repleta de linhas e formas), bem contrastada e
variando entre círculos e caixas com arestas arredondadas.”
http://200.186.92.250/awards/2007/havaianas/havaianas/port/index.html#

5. Continuidade: houve a preocupação com dois detalhes que quebraram a
‘dureza’ das duas áreas, dando grande continuidade a elas de uma forma sutil:
primeiro, angulou em uns 15 graus a linha, desestabilizando propositalmente a
visão, tirando o aspecto formal da separação e deslocando o peso visual para
o lado esquerdo da composição, onde inseriu um elemento pictórico formado
por caracteres gráficos na mesma cor do fundo, vermelho. Mas, ao mesmo
tempo, inseriu uma ilustração baseada num revólver que sobrepõe parte das
duas áreas, vermelha e branca, servindo como elo entre as áreas, como uma
ponte. Criamos assim, grande continuidade entre as áreas.
Unidade e Similaridade: “Após termos percebido a unidade do layout, que
distribuiu os elementos de maneira a criar um ritmo não-linear na percepção do
campo visual, evitando estacionar o olhar em um ponto específico, vemos aqui
a disposição cognitiva do conteúdo textual: nota-se que títulos são
semelhantes, usando o mesmo estilo, porém, dentro da categoria WORDS,
encontramos um novo estilo com fontes de maior tamanho, denotando
conteúdo mais importante, mais humanizado, mais atualizável do que os
demais, geralmente automatizados. É a similaridade e suas modulações.”
http://www.newtoyork.com/

7. Segregação, fechamento e pregnância: “O pontilhismo tridimensional nos
mostra, de maneira deliciosa, como as partes formam o todo, ponto culminante
da Teoria da Gestalt. Se observarmos os pontos isoladamente (falo da imagem
3D que gira pela tela), jamais notaremos nada inteligível; porém, vendo-as
como uma unidade (pelo princípio do fechamento), fica claro que se trata de
um livro.Vemos também que o posicionamento das estruturas inteligíveis da
interface foram dispostas de maneira magistral, usando alta pregnância, sem
ruídos e sem muito texto para demonstrar os controles usados para manipular
a interface, criando itens isolados de alta pregnância, de grande assimilação
cognitiva.”
Proximidade e Similaridade: “Os livros que ficam ao lado esquerdo estão
todos próximos e possuem forma extremamente parecidas. Porém, ao
destacarmos propriedades específicas de um ou mais deles, como no caso,
brilho e contraste, criamos similaridades que distanciam tais elementos do seu
grupo original, colocando-o num status de item ativo, mas sem romper
totalmente com sua origem comum aos demais elementos.”
http://www.concavescream.com/

9. Unidade e Continuidade: “À primeira vista, temos a sensação exata de que a
composição está absolutamente estabilizada. Sim, formas estáveis, centralizadas,
quadradas e ainda sustentadas por linhas, são, sem dúvidas, composições das
mais estáveis possíveis. Quase impossível desviarmos nossos olhos da mancha
visual central. A unidade então fica claríssima, tudo parece fazer parte de um
mesmo objeto; é tudo muito harmônico e relacionado, até mesmo o logotipo na
parte superior direita, que mesmo não fazendo parte do polígono interno delimitado
pelas linhas, acabou por ser a única referência direcionadora do olhar na
composição. Outra coisa: percebam claramente o princípio e a continuidade ao ler
os itens de menu. Ainda que haja espaçamentos enormes entre algumas letras,
nada disso nos impede de compreender o texto, justamente porque o fechamento
se dá buscando em nosso subconsciente, a imagem do que pode ser mais próximo
entre um C ,um ONT e um ACT -> contact!”
Pregnância: “A utilização do elemento humano (a moça), criando uma ideia de
tridimensionalismo ao arrancar parte do ‘papel’, é fator de alta pregnância. Remete
ao mundo real e não há nada que tenha mais pregnância do que elementos
relacionados ao mundo real, tridimensional – uma vez que o bidimensional é mais
relacionado ao mundo das abstrações, demandando muito mais paciência – e
porque não dizer – talento, para criar mais pregnância usando elementos do
universo abstrato. E podemos falar dos elementos que remetem aos adesivos, aos
papéis sujos, que reforçam ainda mais a tridimensionalidade da proposta.”

11. Unidade, Segregação, Unificação: “Por mais caóticos que pareçam estar os
elementos dessa interface, eles estão, na verdade, extremamente bem
posicionados, criando uma grande unidade visual. Não há elementos faltantes e
nem sobrando. O que, na verdade, parece poluído, na prática é extremamente
limpo e objetivo.Vejamos o seguinte: A leitura do campo visual se faz em uma linha
diagonal que vai do canto superior esquerdo até o canto inferior direito. Há uma
grande unidade na proposta, justamente porque ao fazemos essa varredura,
percebemos que os itens possuem grande unidade gestáltica, não nos remetendo
a nenhum outro ponto específico dentro da interface, fazendo-nos, na verdade,
‘passear’ de modo modularizado por entre os elementos. E é aí que notamos a
preocupação na segregação dos submódulos da composição para que estes
‘conversem’ harmonicamente com os demais itens, gerando a unidade.
Vejamos o grupo MAIS RECENTES, formado por quadrados de arestas
arredondados com baixo contraste, e disposição numa matriz irregular. Existe,
nessa irregularidade, um espaço para o filtro de exibição dos itens, tudo muito
próximo, gerando a unificação cognitiva pela proximidade. Os itens que ficam
próximos foram trabalhados de tal maneira a criar um alto contraste, rompendo o
princípio de semelhança para mostrar que, ainda que estejam próximos, trata-se de
itens completamente diferentes cognitivamente.Cores como lilás, azul claro e
vermelho foram usadas com grande eficácia para separar semanticamente itens
cuja prioridade perceptiva são maiores. Some-se a isso uma área bem arejada do
lado esquerdo onde os vídeos são exibidos, evitando que haja ruídos por parte da
interface na hora de usufruir da experiência com o conteúdo.”