Shh! Não compartilhe este segredo interno sobre os princípios de design do CRAP

Usar os princípios de design CRAP é uma maneira incrível de criar um design visual eficaz.

“O QUE É ?!” vocês disseram, não é? Bem, isso com certeza foi uma surpresa para você se você nunca tinha ouvido falar do CRAP antes. Robin Patricia Williams, uma incrível autora americana que escreveu muitos livros relacionados à informática, descreveu um conjunto de princípios de design gráfico em seu livro, The Non-Designer's InDesign Book. Ela o chamou de CRAP.

(Você também pode ler uma breve entrevista com ela aqui ).

Então, o que é CRAP? Não o que conhecemos, claro!

Bem, para criar designs eficazes e atraentes, devemos ser consistentes. A consistência vem com a implementação de fundamentos e princípios básicos que sempre são necessários. Esses princípios são os fundamentos básicos que qualquer designer deve considerar constantemente.

Como designer gráfico, seu trabalho é produzir algo que hipnotize o visualizador de uma forma que ele não consiga sair do site. Os espectadores precisam estar colados às suas cadeiras com seu design gráfico envolvente e, para isso, vem o CRAP.

CRAP é um acrônimo que significa Contraste, Repetição, Alinhamento e Proximidade.

1. Contraste

O contraste é descrito como "justaposição de elementos diferentes (como cor, tom ou emoção) em uma obra de arte". O contraste é o que faz os elementos se destacarem. Antes de entrar nisso, há uma dica que você deve considerar. Se você usar um recurso de contraste muitas vezes, estará simplesmente reduzindo o contraste, não aumentando-o. Por quê? Porque contraste significa o que significa quando você deseja que alguns elementos se destaquem. Se tudo se destaca, nada se destaca! Como um elemento importante nos princípios de design de merda, você deve saber como usá-lo bem. Então vamos fazer isso!

Cor

Você pode usar a diferença de cores para criar contraste. O World Wide Web Consortium (W3C) criou diretrizes sobre o contraste mínimo necessário entre o texto e seu fundo. Embora ter um alto contraste seja obrigatório quando se trata de texto e fundo, isso não é verdade quando falamos de elementos diferentes. Ter um alto contraste entre os diferentes elementos pode forçar os olhos dos usuários. Você pode olhar para uma versão em tons de cinza do seu design para ver se o contraste ideal foi usado ou não.

Como regra geral, pode ser uma boa prática usar tons de cores complementares que não criem um alto contraste exagerado.

Tamanho

As diferenças nos tamanhos dos elementos, especialmente quando se trata de texto, podem ser uma fonte de contraste. Manter o tamanho de um elemento significativamente maior do que os outros ao seu redor o tornará atraente. Os botões de call to action (CTA) também podem se beneficiar desse tamanho maior. Seus espectadores irão notá-los mais e eles o ajudarão com seu CRO. Além disso, se precisar de mais ajuda com suas estratégias de CRO, consulte este guia.

Forma

Ter formas diferentes pode gerar o contraste que você procura. Você pode ver o contraste na forma usada em infográficos de forma eficaz. O uso de formas diferentes próximas umas das outras pode ajudar a envolver a mente dos leitores. Adicionar cantos redondos a formas quadrilaterais ou usar elementos quadrados em conjunto com elementos circulares redondos também podem ser exemplos de contraste na forma.

Fonte

Podemos categorizar as fontes em grupos diferentes. Serif, Sans-serif, script, monoespaçado e display são as classificações básicas de datilografia. O uso de grupos de fontes diferentes pode criar contraste para o texto que queremos representar. Além disso, o uso de diferentes espessuras de fonte (negrito ou regular), estilos de fonte (itálico, opaco ou normal) e decorações de fonte (sublinhado, tachado, etc.) pode levar seu jogo para o próximo nível.

2. Repetição

Como seres humanos, nossas mentes são programadas para gostar de padrões; Nós os procuramos em todos os lugares. O que cria padrões? Repetição! Além disso, criamos um senso de identidade quando encontramos uma repetição de coisas. Pense numa peça musical cujos temas principais não se repetem. Você se sentiria perdido.

A mesma coisa acontece no design. Precisamos repetir cores, formas, texturas, tamanhos e outros atributos em nosso design para torná-lo consistente e dar a ele algum tipo de identidade. Além disso, as empresas usam a repetição no design para construir o reconhecimento da marca. Eles repetem um conjunto predefinido de cores e fontes para trazer consistência às suas diferentes plataformas e canais.

A repetição no design é outro princípio importante nos quatro princípios de design do CRAP. O usuário precisa se sentir seguro, não perdido. Ajuda a otimizar a experiência do usuário do seu site.

3. Alinhamento

O alinhamento, como outro fator crucial nos princípios de design do CRAP, especifica o posicionamento de um elemento no design. É o que dá coesão e sentido de ordem a um design. Em termos de elementos, você pode alinhá-los com base em suas arestas ou centros. No entanto, os textos podem ser alinhados à esquerda, direita, centro ou simplesmente justificados. Dependendo do idioma do texto usado, os alinhamentos à esquerda e à direita, sendo LTR ou RTL, são os mais populares. Podemos usar o alinhamento central para extensões de texto curtas (mas é difícil de ler em textos mais longos). A justificação é uma boa escolha quando o comprimento da linha é longo, o tamanho da fonte é pequeno e as palavras são mais curtas (usá-lo em linhas estreitas que consistem em palavras longas reduz a legibilidade).

Cada desenho deve ter algumas linhas verticais que atuam como guias de alinhamento horizontal. O texto flutuando em todos os lugares da página apenas confunde seu visualizador. Seus visualizadores devem simplesmente ser capazes de perceber a relação de cada parte da página entre si.

4. Proximidade

Por último, mas não menos importante, a proximidade é outro princípio que desempenha um papel vital no design CRAP. A proximidade no design afirma que devemos colocar elementos que se relacionam uns com os outros e estão intimamente associados uns aos outros. Faz sentido, não faz? Você não quer procurar um link relacionado ao artigo que está lendo na barra de navegação, quer? Além disso, o espaçamento uniforme dos elementos em toda a página torna o design mais difícil de seguir. Agrupe os elementos relacionados o máximo possível para tornar mais fácil para o visualizador encontrar as informações desejadas.

A regra dos 3 segundos

“Leva apenas 3 segundos para se apaixonar.”

Então, o teste final que você pode fazer para ver se o seu design CRAP está impecável é verificar se ele é eficaz em 3 segundos. Você pode fazer isso por si mesmo, limpando sua mente e olhando para longe e, em seguida, voltando a ele. Você também pode pedir a opinião de um amigo ou parente após 3 segundos. Nós decidimos se algo nos atrai e se queremos continuar com isso ou não em apenas 3 segundos.

O relacionamento

Não devemos usar esses princípios isoladamente. A repetição e o alinhamento funcionam juntos para fornecer o estado “normal”, que permite alterar a forma ou a localização de um trecho de texto para gerar contraste. Além disso, a repetição e a proximidade trabalham juntas para produzir formatos eficazes, como listas com marcadores - a repetição do marcador dá ênfase à proximidade dos pontos.

Conclusão

Oscar Wilde, no prefácio de seu livro mais famoso, “The Picture of Dorian Gray”, diz: “O artista é o criador de coisas bonitas. Revelar a arte e ocultar o artista é o objetivo da arte ”.

Por fim, o objetivo é que o esforço que você faz para criar um documento desapareça, se torne invisível, permitindo ao seu leitor ou visualizador acesso irrestrito às ideias que você está tentando comunicar - tanto diretamente em seu texto quanto de maneira cada vez mais sutil, via sua escolha de componentes de design. Nesse sentido, é um trabalho ingrato, pois poucas pessoas notarão (ou mesmo notarão) a qualidade do design - mas elas notarão e agirão de acordo com a mensagem. Não é disso que se trata?