A ênfase no design determina para onde o teu público olha primeiro, segundo e nunca. É o princípio responsável por transformar um layout plano numa conversa visual clara, em que a mensagem mais importante chama a atenção antes de qualquer outra coisa na página.
Sem ênfase, todos os elementos de uma tela competem pela atenção ao mesmo tempo. Os títulos confundem-se com o corpo do texto. Os apelos à ação desaparecem no fundo. O espetador desloca-se, sem saber o que interessa.
Para uma leitura relacionada, vê o nosso guia sobre design inclusivo tornar os visuais acessíveis.
Com ele, controlas a sequência da atenção. Decide o que domina a página, o que a apoia e o que recua. Quer estejas a criar um gráfico para as redes sociais, uma apresentação ou um relatório de dados, a ênfase dá-te o poder de direcionar o olhar do espetador ao longo de um caminho deliberado.
Este guia analisa sete técnicas para criar ênfase, explora a psicologia por detrás do seu funcionamento e mostra-te exemplos reais de design para a Web, impressão e redes sociais.
O que é a ênfase no design?
A ênfase no design envolve fazer com que certos elementos se destaquem mais do que outros. Ajuda-te a chamar a atenção do espetador para informações específicas e guia-o através do design.
O nosso cérebro está programado para reparar em coisas que são maiores, mais brilhantes e mais ousadas do que o resto do conteúdo. A ênfase é uma escolha intencional para utilizar esta tendência e dirigir a atenção do teu público para onde queres que ela vá.
Ao aplicar os princípios da ênfase, o folheto passa de monótono e aborrecido a algo que chama imediatamente a atenção e comunica uma mensagem clara.
Estás pronto para utilizar os mesmos métodos nos teus desenhos?
Porque é que a ênfase é importante no design
A ênfase é a diferença entre um layout que as pessoas analisam em dois segundos e um layout com o qual realmente se envolvem. Quando controlas o elemento que tem mais peso visual numa página, estás a controlar a ordem pela qual a informação chega ao cérebro. Para qualquer design destinado a informar, persuadir ou incitar à ação, os riscos são elevados: se a hierarquia estiver correta, o público absorve a mensagem principal quase instantaneamente; se estiver errada, vai-se embora.
Guia o olhar do espetador ao longo de um percurso planeado
A visão humana não processa uma página inteira de uma só vez. O olho move-se em saltos rápidos (sacádicos) entre pontos de fixação e gravita em direção ao elemento com maior contraste, tamanho ou isolamento relativamente ao que o rodeia. A ênfase dá-te influência direta sobre esses pontos de fixação. Um título em negrito no topo de uma infografia, um botão colorido de apelo à ação num fundo neutro, uma estatística de grandes dimensões no centro de um relatório: cada um funciona como um sinal que diz ao espetador: “Começa aqui”.
Cria uma hierarquia de comunicação
O design raramente transmite uma única mensagem. Uma página de destino pode ter de comunicar o nome de um produto, uma declaração de valor, um preço e um passo seguinte. A ênfase atribui uma classificação a cada uma destas mensagens. O ponto focal principal recebe o sinal visual mais forte (maior tamanho, maior contraste). Os detalhes de apoio recebem sinais moderados. A informação de fundo fica para trás. Sem estes níveis, o espetador tem de fazer o trabalho de seleção, e a maioria não se dará ao trabalho.
Melhora a velocidade de compreensão
A investigação sobre o processamento visual mostra que os leitores formam uma primeira impressão de uma página Web em cerca de 50 milissegundos. Nesses momentos iniciais, a ênfase determina o que é notado. Um ponto focal bem colocado reduz a carga cognitiva do espetador, respondendo à pergunta “A que devo prestar atenção?” antes que a mente consciente termine de a fazer. Para relatórios com muitos dados, gráficos sociais e apresentações com várias secções, esta vantagem de velocidade compõe secção após secção.
Também podes achar útil o nosso artigo sobre design de informação.
Promove o envolvimento e a conversão
Em contextos digitais, o destaque é uma ferramenta de conversão. Estudos de comércio eletrónico revelam consistentemente que a cor, o tamanho e o espaço branco circundante do botão afectam as taxas de cliques em percentagens de dois dígitos. Um apelo à ação com grande ênfase (contraste elevado em relação ao fundo, preenchimento generoso, colocação proeminente acima da dobra) supera um botão enterrado entre elementos concorrentes. A mesma lógica aplica-se a cabeçalhos de e-mail, gráficos de redes sociais e diapositivos de apresentação: o elemento sobre o qual queres que as pessoas actuem deve ter o maior peso visual.
É um princípio fundamental juntamente com o contraste, o alinhamento, a repetição e a proximidade
A ênfase não funciona de forma isolada. Acompanha outros quatro princípios fundamentais do design: contraste, alinhamento, repetição e proximidade (por vezes agrupados sob o acrónimo CARP). O contraste fornece as ferramentas que a ênfase utiliza. O alinhamento e a repetição criam o padrão de base do qual um elemento enfatizado se pode libertar. A proximidade agrupa conteúdos relacionados para que o ponto focal se destaque. Compreender a ênfase como parte desta família, e não como um truque autónomo, separa os layouts competentes dos excepcionais.
A psicologia por detrás da ênfase no design
A forma como o olho humano analisa o design é em parte biologia e em parte influência cultural. Há alguns padrões que os nossos olhos tendem a seguir:
- Movimento sacádico: Os nossos olhos têm tendência para saltar em vez de fazer uma leitura suave
- Padrão Z: Nas culturas ocidentais, os nossos olhos movem-se frequentemente do canto superior esquerdo para o canto superior direito, depois saltam na diagonal para a esquerda e depois para o canto inferior direito
- Padrão F: Quando estamos a ler algo com muito texto, os nossos olhos seguem muitas vezes um padrão F, concentrando-se principalmente no conteúdo do lado esquerdo
7 técnicas para dar ênfase ao teu design
É provável que já utilizes estas técnicas. Saber porque é que cada uma delas funciona ajuda-te a aplicá-las intencionalmente.
O resultado? Gráficos apelativos que inspiram o teu público a agir.
1. Dimensão e escala
Os elementos maiores atraem naturalmente o olhar e parecem mais importantes, enquanto os elementos mais pequenos se desvanecem no fundo. O nosso cérebro associa o tamanho à hierarquia, por isso, quanto maior for um elemento, mais importante o vemos.
Faz com que o conteúdo mais importante – como os títulos e o CTA – seja maior do que os outros elementos. No entanto, mantém as tuas escolhas de tamanho proporcionais para que os teus elementos maiores não ofusquem os gráficos mais pequenos.
Vê-o em ação
Mesmo antes de leres o título deste relatório, os ícones e gráficos de grandes dimensões tornam claro o que os leitores podem esperar aprender. Uma vez que as pessoas passam quase sempre os olhos pelo conteúdo, esta é uma forma eficaz de captar a sua atenção.
2. Cor e contraste
Cores brilhantes ou contrastantes ajudam os elementos a sobressair. Utiliza um contraste elevado – como o preto no branco – e cores complementares para chamar a atenção.
Utiliza o contraste de cores para realçar elementos importantes, como o botão CTA ou a navegação no site, para que as pessoas nunca estejam à procura de informações importantes. No entanto, 4,5 por cento da população é daltónica, por isso não te baseies demasiado neste princípio.
Vê-o em ação
Os teus olhos são imediatamente atraídos para a secção de índices desta brochura com três dobras, onde as caixas verdes e brancas brilhantes se destacam contra o fundo azul profundo.
Estás à procura de mais? Vê os princípios do design de unidade.
3. Espaço em branco
Rodear um elemento com espaço vazio faz com que pareça mais importante e mais fácil de reparar. O espaço em branco, também designado por espaço negativo, dá um descanso aos teus olhos e evita que os espectadores sejam demasiado estimulados pelo teu design.
Utiliza espaço em branco à volta de quaisquer elementos importantes para que não se percam num mar de conteúdo. Esta técnica é especialmente eficaz se quiseres transmitir uma sensação de luxo ou minimalismo.
Quando estiveres a determinar onde será o teu espaço negativo, considera como podes manter o teu layout equilibrado. Demasiado espaço em branco numa área fará com que o design pareça desequilibrado, e um espaçamento irregular pode parecer descuidado.
Vê-o em ação
A abundância de espaço em branco neste modelo de currículo comunica que apenas foram incluídas informações importantes – e o espaço negativo à volta dos detalhes de contacto facilita o contacto com o gestor de contratação.
4. Tipografia e peso do tipo de letra
O tamanho, a ousadia e o estilo do teu tipo de letra comunicam várias mensagens. O negrito chama a atenção, o itálico sugere subtileza e as maiúsculas indicam que algo é urgente.
Geralmente, é preferível utilizar texto a negrito para títulos e cabeçalhos, tipo de letra normal para o corpo do texto e itálico para dar ênfase ocasional.
Mantém o teu design consistente, mantendo duas famílias de tipos de letra para não sobrecarregar os teus leitores. Sugerimos que utilizes um tipo de letra principal para os títulos e um tipo de letra secundário para o corpo do texto. Sabe mais sobre os diferentes tipos de tipos de letra.
Vê-o em ação
Acredites ou não, todo o texto deste certificado tem o mesmo tipo de letra: Palanquin Dark. Alterar o tamanho, a espessura e o estilo do tipo de letra permite-te destacar secções específicas, mantendo a consistência.
5. Posição e alinhamento
Embora os jornais físicos estejam a tornar-se obsoletos, manter o conteúdo importante “acima da dobra” continua a ser uma técnica valiosa. Os itens no topo ou no centro do teu design têm mais probabilidades de serem notados.
Coloca o teu conteúdo mais importante onde possa ser visto imediatamente. Nas páginas Web, é o centro superior e, nos materiais impressos, é a frente e o centro.
Podes quebrar as regras de alinhamento padrão, mas tens de criar um equilíbrio assimétrico. O desalinhamento intencional é uma forma de criar ênfase, mas o desalinhamento não intencional pode parecer desleixado.
Vê-o em ação
É impossível não reparar no ambiente de trabalho posicionado à frente e ao centro deste folheto e, por isso, é mais provável que os espectadores leiam o texto.
6. Textura e padrão
Os nossos olhos são rápidos a reparar no que é diferente – basta perguntar a qualquer pessoa que tenha tido o seu padrão de azulejos desalinhado durante uma renovação da casa. Quando interrompes um padrão ou adicionas textura a um design, é fácil enfatizar os elementos próximos.
Adiciona um padrão ao teu fundo ou uma textura aos teus elementos de destaque para criar interesse visual. Isto também pode definir o ambiente para todo o design; por exemplo, qualquer coisa com uma textura de madeira parece rústica, enquanto um fundo de tijolo tem um toque acolhedor.
O contraste é importante quando escolhes um padrão ou um fundo. Algo com pouco contraste mistura-se ao ponto de todo o design parecer caótico e esmagador.
Também abordamos este assunto no nosso artigo sobre a psicologia das formas.
Vê-o em ação
O fundo folhoso texturizado deste folheto permite que o texto no centro brilhe, e as suas cores acrescentam calor ao design.
7. Movimento e direção
O movimento, real ou implícito, guia o olhar do teu espetador através do design. Podes utilizar animações, linhas e setas para ajudar as pessoas a encontrar os elementos que pretendes destacar.
Utiliza o movimento e a direção para apontar para a tua CTA ou criar um fluxo visual quando apresentas informações complexas.
As linhas e as setas são úteis, mas utiliza-as com moderação. Demasiado movimento implícito faz com que seja difícil para os espectadores saberem para onde olhar.
Vê-o em ação
A linha vertical que atravessa este modelo orienta os leitores para baixo à medida que lêem, ajudando-os a percorrer toda a página.
Exemplos de ênfase em diferentes contextos de conceção
Sentes-te bloqueado? Aqui estão algumas formas de incorporar ênfase e fazer passar a tua mensagem.
Conceção Web
O formulário de captura pop-up de e-mail da PBH Foods utiliza o tamanho e a cor para incentivar os visitantes a partilharem as suas informações de contacto em troca de um desconto.
Gráficos para redes sociais
Esta miniatura do rolo da Milk Makeup utiliza o espaço em branco para chamar a atenção do espetador para os seus produtos.
O fundo texturado deste gráfico do Instagram acrescenta profundidade e a sua cor escura contrasta bem com o texto branco.
Design de impressão
As setas à esquerda deste cartaz criam movimento e guiam os teus olhos para o texto à direita.
Uma página de título texturizada para esta brochura acrescenta dimensão e interesse visual para que os leitores não possam deixar de a pegar.
Apresentações
A ordem de trabalhos desta apresentação utiliza o movimento para indicar uma experiência perfeita ao percorrer os diapositivos.
Entretanto, como esta apresentação tem muitos dados, utiliza vários princípios para destacar as principais informações financeiras. O contraste, o espaço em branco e o tamanho do tipo de letra chamam a atenção para os dados de 145 mil milhões de dólares.
Como criar ênfase no teu design com o Piktochart
O Piktochart está equipado com uma variedade de ferramentas e funcionalidades para te ajudar a dar ênfase aos gráficos que desenhas.
Para uma leitura relacionada, vê o nosso guia sobre hierarquia visual.
Técnica 1: Utiliza as ferramentas de texto para dar ênfase
Na secção de componentes de design, podes escolher entre títulos e frases pré-criados ou emblemas e autocolantes. Estes modelos utilizam tipos de letra e cores mistos para ajudar o teu texto a destacar-se.
Para texto normal, ajusta o tamanho e o peso do tipo de letra para chamar a atenção para os títulos ou outro texto importante. Também podes alterar a cor do teu texto utilizando o seletor de cores ou introduzindo um código HEX específico.
Na publicação do Instagram abaixo, o título original está lá, mas é difícil de ver entre todo o outro texto.
Só por deslocar alguns elementos e dar espaço ao título para brilhar, atrai imediatamente a tua atenção.
Técnica 2: Utiliza formas e ícones
Adicionar texto dentro de uma forma é uma forma perfeita de realçar estatísticas importantes ou uma CTA. Utiliza molduras para agrupar conteúdos relacionados e criar secções distintas que chamam a atenção do leitor.
Como está destacada no retângulo roxo, a estatística de 47% salta à vista, realçando o facto de os candidatos a emprego deverem ter conhecimentos sobre a empresa a que se estão a candidatar.
Técnica 3: Espaço em branco
O espaço em branco não faz com que o teu design pareça vazio – ajuda-o a parecer limpo. Para garantir um espaçamento branco uniforme em torno de cada elemento, utiliza as ferramentas de grelha e alinhamento.
Técnica 4: Caraterísticas de cor e contraste
As cores brilhantes e contrastantes ajudam os espectadores a identificar instantaneamente as informações mais importantes. O Piktochart oferece esquemas de cores pré-fabricados que proporcionam um elevado contraste, como estas opções disponíveis para um relatório de análise financeira
Se pretenderes criar a tua própria paleta de cores, utiliza um verificador de contraste para determinar a relação de contraste. Embora esta ferramenta seja frequentemente utilizada para manter a acessibilidade do site, também pode garantir que duas cores são suficientemente diferentes para que o teu texto seja percetível contra o fundo.
Os especialistas sugerem que mantenhas um rácio de 4,5:1, embora 3:1 seja adequado para textos grandes, como títulos.
Começa a desenhar hoje com o Piktochart
Criar os teus próprios elementos visuais torna-se muito menos assustador quando compreendes os princípios que os ajudam a ter bom aspeto e a serem eficazes. Se estiveres pronto para começar a desenhar, consulta a nossa biblioteca de modelos ou utiliza o Piktochart AI.
Ferramentas como o nosso gerador de infográficos com IA podem ajudar-te a criar um design de qualidade em segundos, sem necessidade de conhecimentos especializados.
Perguntas frequentes sobre a ênfase no design
Qual é o principal ponto de ênfase?
O principal objetivo da ênfase é chamar a atenção dos espectadores para as informações mais importantes. Ajuda a comunicar a mensagem mais importante para que, mesmo que passem ao lado do resto do conteúdo, retirem a ideia principal.
Como dar ênfase ao design
Para dar ênfase ao teu design, utiliza estratégias como:
- alterar o tamanho e a escala dos elementos
- utilizar a cor e o contraste para criar um foco
- inclui bastante espaço em branco à volta dos elementos-chave
- alterar a tua tipografia e o peso do tipo de letra
- colocação estratégica de elementos
- incluir textura ou padrão no teu desenho
- utiliza setas e linhas para sugerir movimento
