Gestalt UX

Princípios da Gestalt
em UX Design -
traduzido por
in brunadecastroalves
Princípio da proximidade
O princípio da proximidade diz que percebemos que os elementos

que estão próximos um do outro parecem estar relacionados. Mesmo
se houver mais objetos, os que estão mais próximos parecem ser mais
correlativos do que os elementos que são colocados mais longe.
Nosso cérebro percebe esses conjuntos de elementos intimamente

colocados como grupos. A proximidade é tão essencial para a nossa
percepção que é mais forte do que outros recursos, como forma ou cor.
traduzido por
Princípios da Gestalt in brunadecastroalves
Proximidade
traduzido por
Proximidade - como é usada no UI Design?
Graças ao uso de proximidade, os designers coneseguem criar um conteúdo mais
confortável de ser percebido pelos usuários. As páginas são mais fáceis de serem
visualizadas. Isso se aplica não apenas aos controles da interface do usuário, como
botões ou entradas, mas também ao conteúdo escrito e à tipografia.
A proximidade pode ser usada para agrupar conteúdo e ações relacionados entre si.
Também está ligado ao espaço em branco que desempenha um papel essencial no
princípio. Isso aumenta as relações entre os elementos e fortalece a intenção do
designer. Graças a isso, o usuário não tera dúvida do que acontecerá se ele fizer uma
ação. No final, os usuários podem visualizar o conteúdo mais rapidamente e alcançar
seus objetivos com muito mais eficiência
traduzido por
Proximidade
traduzido por
Princípio da Similaridade
Elementos com aparência visual semelhante parecem estar mais relacionados ou
agrupados do que os que não compartilham os mesmos atributos.
As principais características que aumentam a impressão de semelhança são tama-

nho, forma e cor. A semelhança não é tão mais fraca que a proximidade, mas
também é uma lei poderosa da percepção humana.
traduzido por
Similaridade
traduzido por
Similaridade - como é usado no UI Design?
Quando os usuários percebem um elemento semelhante na interface do usuário,
eles os categorizam como padrões específicos. Graças a isso, eles reconhecem rapi-
damente o significado de controles da interface. É por isso que é tão crucial que os
botões principais tenham a mesma aparência em todas as páginas.
No grupo de elementos "semelhantes", tendemos a ver objetos com a semelhança de

cores primeiro, depois o tamanho e a forma.
traduzido por
Similaridade
traduzido por
traduzido por
Princípios
Princípios da
da Gestalt
Gestalt in brunadecastroalves
in brunadecastroalves
Princípio de Continuação
Princípio de Continuação
Quando o olho é orientado a passar de um objeto para outro, falamos sobre a lei da
continuidade. Nossa percepção tende a ver objetos organizados em linhas ou curvas
como mais relacionados ou agrupados.
traduzido por
Continuação
traduzido por
Continuação - como é usado no UI Design?
Quando vemos grupos de elementos, como um carrosel em galeria de
fotos, tabs ou até listas, é possível perceber que estão usando continuação.
Os objetos estão posicionados próximos do outro, possibilitando os olhos
fazerem uma leitura contínua sem se perderem.
traduzido por
Continuação
traduzido por
Princípio do Fechamento
Os objetos são frequentemente percebidos como uma coisa só, mesmo
quando estão incompletos. Nossa mente preenche rapidamente as
lacunas e nos ajuda a encontrar o significado e a intenção de uma coisa
em particular.
traduzido por
Fechamento
traduzido por
Fechamento - como é usado no UI Design?
Toda vez que você vê um indicador de carregamento (loader), uma barra
de progresso ou slider, a lei do fechamento foi usada para tornar a solução
mais compreensível para o usuário. O outro uso do fechamento é o espaço
negativo. Vemos isso em logotipos e iconografia. Torna o design mais legí-
vel ou até agradável.
traduzido por
Fechamento
Fechamento
traduzido por
Princípio da Simetria
Nossa mente percebe objetos simétricos como partes do mesmo grupo.

Eles criam uma impressão de estabilidade e ordem.
traduzido por
Fechamento
Simetria
traduzido por
Simetria - como é usado no UI Design?
Elementos de interface que são simétricos com outros, ajudam a visualizar
o conteúdo e reconhecer padrões. Simetria permite usu'rios a focar no que
é essencial. Menus de navegação simétricos tendem a ser percebidos
como estáveis.
Por outro lado, um pouco de assimetria pode tornar algumas coisas mais
excitantes e dinâmicas.
traduzido por
Fechamento
Simetria
Simetria
traduzido por
Principio de Continuidade
Quando os elementos tendem a se mover na mesma direção,
nós os percebemos como parte do mesmo grupo.
traduzido por
Fechamento
Simetria
Continuidade
traduzido por
Continuidade - Como é usado no UI Design?
Este princípio é fundamental no motion design. Toda animação
significativa usa um destino comum para orientar os olhos dos usuários da
maneira certa. Isso ajuda a conectar o conteúdo com a ação que usuário
tomou.
A continuidade também se aplica a elementos como menus

aninhados(nested) , menus suspensos ou accordeon, que mostram
como o elemento do menu se comportará.
traduzido por
Fechamento
Simetria
Continuidade
traduzido por
Princípio da pregnância da forma
O olho humano é capaz de separar objetos em diferentes planos de foco.
Sabemos quais elementos são colocados em primeiro plano e os que estão
em segundo plano intuitivamente.
traduzido por
Fechamento
Simetria
Pregnância da Forma
traduzido por
Princípios
Princípios da
da Gestalt
Pregnância da forma - como é usado no UI Design?
Toda vez que você vê a página modal ou o pop-up, consegue ver o uso da
pregnância da forma. Existem várias técnicas para distinguir os planos de
foco no smartphone: você pode usar fundo de paralaxe, sobreposição
semi-transparente, sombras ou desfocar os elementos em segundo plano.
O Material Design, por exemplo, usa sobreposições e sombras, mas as diretri-

zes human interface do iOS recomendam o uso de desfoque.
traduzido por
Fechamento
Pregnância da Forma
traduzido por
Princípios
Princípios da
da Gestalt
Princípio da Região Comum
Objetos colocados na mesma região são percebidos como estando
no mesmo grupo.
traduzido por
Fechamento
Região Comum
traduzido por
Princípios
Princípios da
da Gestalt
Região Comum - Como é usado no UI Design?
Essa é uma lei muito útil no UI Design. Vamos dar um exemplo de cards do
Material Design. Eles podem incluir vários elementos, como imagens, ícones,
blocos de texto ou botões. No entanto, graças ao card(retângulo arredonda-
do branco com sombra sutil), eles são percebidos como um único objeto.
A Região Comum ajuda a estruturar o conteúdo e facilita a visualização.

Também se aplica a elementos como barras de navegação, tabelas, menus,
seções de formulário etc.
traduzido por
Fechamento
Região Comum
traduzido por
Princípios
Princípios da
da Gestalt
Princípio da Periodicidade
Elementos que aparecem várias vezes em distâncias semelhantes
são percebidos como relacionados.
traduzido por
Fechamento
Periodicidade
traduzido por
Princípios
Princípios da
da Gestalt
Periodicidade - Como é usado no UI Design?
Periodicidade ajuda o usuário a reconhecer padrões na interface. Essa regra
é usada em tabs (os elementos são colocados no mesmo ritmo), você rola a
lista ou a grade (os objetos aparecem várias vezes na mesma distância).
Também pode ser usado em seções de página da web, para criar um ritmo.
traduzido por
Fechamento
Periodicidade
traduzido por
Princípios
Princípios da
da Gestalt

Gestalt UX

Încărcat de

Informații document

Titlu original

Drepturi de autor

Formate disponibile

Partajați acest document

Partajați sau inserați document

Opțiuni de partajare

Vi se pare util acest document?

Este necorespunzător acest conținut?

Drepturi de autor:

Formate disponibile

Gestalt UX

Încărcat de

Drepturi de autor:

Formate disponibile

Princípios da Gestalt

O princípio da proximidade diz que percebemos que os elementos

Nosso cérebro percebe esses conjuntos de elementos intimamente

As principais características que aumentam a impressão de semelhança são tama-

No grupo de elementos "semelhantes", tendemos a ver objetos com a semelhança de

Nossa mente percebe objetos simétricos como partes do mesmo grupo.

A continuidade também se aplica a elementos como menus

O Material Design, por exemplo, usa sobreposições e sombras, mas as diretri-

A Região Comum ajuda a estruturar o conteúdo e facilita a visualização.

S-ar putea să vă placă și