Como reduzir a carga cognitiva através do design?

Quando você usa todos os tipos de aplicativos, muitas vezes você sente que “a interface deste aplicativo é muito feia”, “este aplicativo é muito difícil de usar, você nem consegue encontrar a entrada”, qual é o motivo dessa sensação ?
Existe um conceito na psicologia cognitiva chamado “carga cognitiva”, que representa a quantidade de recursos de memória utilizados pelo cérebro no trabalho, que afetará a leitura de informações do usuário e a experiência com o produto.
Tentarei demostrar algumas formas de reduzir a carga cognitiva dos usuários em alguns níveis.

1. Nível de informação

1.1 Distinguir camadas por contraste de cor, tamanho da forma e localização
O princípio de fechamento da psicologia nos diz que quando as pessoas percebem algo, a primeira coisa que veem é o todo, não as partes individuais. Como você pode ver na imagem, a primeira coisa que você vê é uma letra U azul e um perfil de cabeça humana marrom escuro, seguido dos vários detalhes que compõem a forma.

Do ponto de vista do princípio de imagem do sistema visual humano, os humanos são naturalmente muito sensíveis ao contraste de cores (a visão de cores é causada pela percepção de cores específicas por três tipos de células cone na retina. Quando o usuário vê várias cores diferentes em ao mesmo tempo, cones diferentes As células são ativadas e os olhos sentem o forte contraste).

Portanto, ao projetar uma interface, geralmente é usada uma grande área de contraste de bloco de cores para destacar informações de nível superior.

Para resumir, muitas vezes usamos diferenças de forma e tamanho e diferenças de contraste de cor para abrir a hierarquia de informações em nosso design usual.

Além disso, devido à acuidade visual do olho humano (o campo de visão vertical confortável é de -30°~25°) e o ângulo de leitura do usuário ao usar dispositivos diferentes, o olho humano tem diferenças naturais na atenção prestada diferentes áreas da tela.

Portanto, se quisermos abrir o nível de informação durante o projeto, além de usar contraste de área e cor, também podemos conseguir isso por meio do contraste posicional, ou seja, colocando informações de nível superior em uma área de leitura confortável. Conforme mostrado na figura, as informações na parte superior central da tela do dispositivo móvel são mais confortáveis ​​de ler do que as informações na parte inferior da tela.

1.2 Os níveis de informação não devem exceder 4
Sabemos distinguir os níveis de informação através de meios de design, então é melhor distinguir mais níveis de informação?

Obviamente que não, muitos níveis de informação também aumentarão a carga cognitiva do cérebro humano (a página inteira parece extravagante); se houver muito poucos níveis de informação, o conteúdo da página será exibido uniformemente e pode não destacar todos os principais em formação. De um modo geral, podemos dividir a informação em informação importante, informação menos importante, informação geral e informação auxiliar, ou seja, é mais adequado controlar o nível de informação dentro de 4.

Conforme mostrado na figura, o nível de informação interno fica claro à primeira vista.

2. Estrutura da informação
   2.1 Unidade de informação = corpo de informação + recipiente de informação

Antes de discutir a estrutura de informação, primeiro desmontamos a unidade básica de informação: unidade de informação = ontologia de informação + recipiente de informação, aqui definimos a ontologia de informação como o elemento de informação que ativamente deixamos o usuário perceber e pode auxiliá-lo na próxima ação sendo que o container é definido como um suporte de informação com separação visual óbvia. O corpo de informações geralmente inclui imagens, texto, ícones, botões de ação, etc., e o contêiner de informações pode ser tão grande quanto uma pequena página para controles modais e não modais gerais.
Conforme mostrado na figura, em um cenário típico de e-commerce, o cartão de mercadoria pode ser dividido em corpo de informação (mapa de mercadoria, nome da mercadoria, preço da mercadoria, ponto de interesse) + recipiente de informação (cartão):

2.2 Estrutura do contêiner de informações – triângulo, grade, lista
Mencionamos anteriormente que unidade de informação = corpo de informação + recipiente de informação (um recipiente é um portador de informação com separação visual óbvia), e a disposição dos recipientes de informação também tem suas regras inerentes.

Depois de experimentar um grande número de produtos, o autor resume aproximadamente 3 estruturas comuns de disposição de contêineres, a saber, estrutura triangular, estrutura de grade e estrutura de lista sendo estas características diferentes cenários aplicáveis.

Estrutura triangular
Todos sabemos que o triângulo é a estrutura mais estável do polígono, e seu arranjo de contêineres é primário e secundário (pode ser dividido em estrutura superior e inferior e estrutura esquerda e direita de acordo com a relação posicional entre o contêiner principal e o secundário container )

2.3 A orientação visual melhora a taxa de leitura de informações
Equipes de pesquisa de várias universidades pelo mundo descobriram, por meio do experimento AB de mapas de calor de movimento dos olhos, que adicionar orientação visual de expressões faciais humanas a imagens pode melhorar significativamente a taxa de leitura de informações. Como mostra a foto, na primeira foto do anúncio, a maior parte do foco visual do usuário está no rosto do bebê, enquanto a cópia do lado direito raramente é abordada pelos usuários. Na segunda foto, o rosto do bebê é transformado de frontal Ao mesmo tempo, os olhos olham para o texto à direita e a imagem térmica do movimento dos olhos do texto à direita é significativamente melhorada.

3. Densidade da Informação
   A densidade da informação não deve ser muito alta ou muito baixa. A densidade de informação aqui se refere à quantidade de informação apresentada em um contêiner de unidade (cartão, página). Por exemplo, se a densidade de informação é alta em uma página, o efeito de tela é relativamente alto, mas é fácil aumentar a capacidade cognitiva do usuário. Por outro lado, se a densidade de informações em uma página for baixa, o efeito da tela será relativamente baixo e a carga cognitiva do usuário será relativamente baixa.

Vejamos um caso sobre o impacto da densidade de informação na experiência de leitura: nos Estados Unidos, as pessoas são frequentemente multadas por estacionamento ilegal porque não conseguem ler as placas de estacionamento na rua. Podemos ver que as placas de estacionamento a foto da esquerda está densamente compactada.

John Dieter é uma designer australiano que quando veio pela primeira vez para os Estados Unidos encontrou muitos inconvenientes. Em resposta a esse problema, ele simplificou as necessidades dos usuários, ou seja,

• Posso estacionar neste local neste momento?
• Por quanto tempo você pode parar (de graça)
  Assim, ela visualizou as informações de texto e reduziu bastante a densidade de informações do sinal de pare por meio de menos texto + blocos de cores, para que o motorista possa vê-lo rapidamente. Este design é hoje amplamente adotado por municípios nos Estados Unidos.

Na mídia tradicional, a densidade informacional de um jornal cheio de palavras e imagens é mais evidente do que a de uma capa de revista de moda, e a experiência de leitura e a carga cognitiva trazida aos leitores também são completamente diferentes, razão pela qual poucas pessoas o lerão pacientemente.
O design de cartazes e revistas também envolve o conceito de plate rate, que é simplesmente a relação entre a área da imagem e o layout geral. De um modo geral, quanto maior a plate rate, mais forte a expressividade e afinidade.

4. Redação

4.1 A redação deve atender às necessidades e compreensão da maioria do público
No cenário publicitário, quando o usuário é atraído pelo foco visual da imagem, o copywriting é particularmente importante. Neste ponto, precisamos descobrir 3 perguntas:

• Quem é nosso principal público-alvo?
• O que podemos trazer para os usuários?
• O que o usuário precisa pagar?

Em primeiro lugar, temos que descobrir quem é o público-alvo principal. Jovens trabalhadores e pessoas de meia-idade podem ter preocupações e motivos de pagamento completamente diferentes para o mesmo produto (por exemplo, ambos são telefones celulares, jovens em cidades podem ser trabalhadores que prestam mais atenção à aparência e desempenho, enquanto pessoas de meia-idade prestam mais atenção ao preço e qualidade).
Depois de responder às 3 perguntas acima, você também precisa prestar atenção se nosso copywriting descreve se o público-alvo pode entender, porque diferentes grupos de pessoas têm diferentes níveis de educação e compreensão.