Um dos princípios mais importantes do design é a hierarquia visual. Seja na criação de impressos ou digitais é preciso fazer o layout e administrar o conteúdo de forma organizada. No processo criativo, é preciso definir as prioridades da peça para passar a mensagem ao público de forma mais simplificada, para isso saber trabalhar com todos os detalhes que podem compor o layout, seja na escolha das fontes, cores, tamanhos, contrastes, posições e principalmente, no que incluir e excluir da sua criação.
Com a quantidade de informações disponíveis e o tempo é preciso passar a mensagem rápido e a primeira impressão é a que vale, se a mensagem não for colocada de forma pensada, ela não terá o impacto que gostaria. É preciso ter atenção em todos os elementos que compoe a arte e distribui-los de forma a conduzir o público pelos caminhos mais importantes.
Separamos seis princípio que podem ajudar a passar a mensagem com a melhor experiência possível.
- VISUALIZAÇÃO DAS PÁGINAS – PADRÃO “F” E “Z”
Todas as pessoas lêem de cima para baixo e a maioria das culturas da esquerda para a direita. Além desta informação influenciar no layout de uma página, estudos recentes mostram que as pessoas olham a página inteira antes de começar a ler, esses padrões de visualização tendem a ter duas formas a “F” e a “Z”.
O padrão “F” é aplicado em páginas com mais textos, como artigos ou posts de blogs. O leitor verifica o lado esquerdo procurando palavras-chave interessantes em tópico, títulos, geralmente alinhados à esquerda, achando algo que lhe interessa o leitor continua a leitura no sentido da direita.
Imagem acima: Estudo feito com eyetracking pelo grupo Nielsen Norman Group. Imagem abaixo: Exemplo de utilização de padrões “F”
Para utilizar este princípio, tente alinhas as informações importantes a esquerda e utilize-se de títulos curtos e em negrito, tópicos, imagens e outras formas que possam quebra a atenção do leitor e despertar interesse na leitura.
Já o padrão “Z” é aplicado para páginas de sites, anúncios e banners onde a informação não é apresentada em texto contínuos e parágrafos. Os olhos do leitor verificam a página como um todo, passando os olhos do topo da página, onde geralmente existe uma informação relevante, então dirigem-se para baixo, no canto oposto na diagonal, e segue com o olhar em linha reta na parte inferior da página concluindo a sua análise inicial. É ai que devemos prestar atenção e posicionar os elementos que mais importam nessas áreas em que tem maior importância para quem lê.
- TAMANHO
Essa é a regra mais simples e direta: As pessoas leem as coisas grandes primeiro.
Veja este exemplo do site Google Creative Lab é bem provável que o seu primeiro foco de atenção tenha sido “HAPPY PARTY”. Isto não é por acaso, esta é a mensagem principal, o que a empresa deseja passar.
O tamanho é uma ferramenta muito importante, principalmente para textos, faz com que as regras de leitura possam ser quebradas, isso significa que uma palavra de um tamanho maior pode estar localizado no canto inferior direito e ser a primeira coisa que uma pessoa lê. Além disso, o tamanho do texto pode dar ênfase ao conteúdo e tornar a mensagem mais clara e significativa.
- ESPAÇAMENTO E TEXTURA
Uma outra forma de chamar a atenção ao conteúdo desejado é simplesmente deixar um espaço, um respiro. Se houver um espaço amplo substancial, separando o conteúdo em blocos, ou colocar uma margem de respiro para um botão, estes elementos serão mais legíveis para o leitor, desta forma o conteúdo fica mais organizado e prioriza cada elemento.
O espaçamento é uma alternativa ou até mesmo um adicional para a utilização dos grandes tamanhos na criação de um site. Reduzir o número de informações e o ruído visual cria pontos mais claros de evidência para a criação. O espaço vazio ou em branco também colabora para que o conteúdo seja mais legível.
- TIPOGRAFIA – A ESCOLHA DAS FONTES
A escolha das fontes é fundamental para estabelecer uma boa hierarquia visual. Dentre os atributos mais importantes o peso – a largura dos traços que compõem uma letra – e o estilo, com ou sem serifa, além de outras variações como itálico e negrito podem ser importantes também.
- CORES
Outra regra simples é a escolha das cores, as cores brilhantes destacam-se de cores suaves ou em tons de cinza. Você deve pode explorar isso para chamar a atenção do leitor. Além disso, as cores podem ajudar a definir o ramo de atividade e o clima do site (vermelhos mais agressivos, amarelos mais intensos e verde pode dar um ar de natureza e calma, etc).
No site Fitbit podemos reparar que é utilizado o padrão de layout “Z” através das cores. O uso da cor magenta coloca a atenção o para o topo do site e deixa claro a hierarquia visual, passando o foco para o botão “Get Active”, sinalizando que os dois conceitos estão relacionados.
- DIREÇÃO
Os layouts são criados geralmente com grids verticais e horizontais, por serem os formatos mais legíveis. Nestes exemplos um novo sistema acontece: textos posicionados na diagonal ou em curva, irão chamar atenção e se destacar dos textos blocados restante layout.
Fontes: Design Culture | Creative Bloq | Formed Funcion | Luke Wroblewski
