Design Gráfico

Cartões · 54

Hierarquia visual

Títulos em fonte bem maior e mais pesada que o corpo de texto em um jornal para guiar a leitura primeiro à manchete.

Contraste

Texto preto puro sobre um fundo amarelo brilhante em placas de sinalização de perigo para garantir legibilidade à distância.

Espaço em branco (espaço negativo)

Página inicial do Google com fundo limpo ao redor da barra de pesquisa para direcionar toda a atenção ao campo de busca.

Alinhamento

Alinhar texto e imagens à esquerda ao longo de uma mesma margem imaginária em uma revista para criar ordem e clareza.

Proximidade

Agrupar o botão 'Comprar' logo abaixo do preço e da foto do produto em uma loja virtual, afastando-os do rodapé.

Repetição (consistência)

Usar o mesmo padrão de cores, botões e fontes em todas as telas de um aplicativo bancário para reforçar a identidade.

Equilíbrio simétrico

Um convite de casamento clássico com texto centralizado e ornamentos idênticos em ambos os lados transmitindo sobriedade.

Equilíbrio assimétrico

Uma fotografia grande de um lado da página equilibrada por três blocos de texto menores no lado oposto em uma revista de arte.

Escala e proporção

Ilustração gigante de um produto ocupando quase todo o cartaz publicitário para evidenciar um detalhe inovador.

Ponto focal

Um único botão de chamada para ação vermelho brilhante em uma landing page com tons predominantemente neutros e azuis.

Ritmo visual

Sequência repetida e alternada de ícones e textos em uma linha do tempo corporativa para guiar o fluxo de leitura.

Grid (malha de diagramação)

Estrutura modular de colunas no layout de um feed de rede social ou portal de notícias para organizar o conteúdo.

Tipografia serifada

Uso da fonte Times New Roman em livros impressos e teses acadêmicas para facilitar a condução contínua da leitura.

Tipografia não-serifada (sans-serif)

Uso da fonte Roboto em interfaces digitais de celular devido à excelente legibilidade em telas de baixa ou alta resolução.

Kerning

Ajuste manual da distância entre as letras 'A' e 'V' no logotipo de uma marca para evitar que pareçam desconexas.

Leading (espaçamento entre linhas)

Aumentar a entrelinha em parágrafos de um romance digital para que as linhas não fiquem coladas e cansem a visão.

Tracking

Aumentar levemente o espaçamento uniforme de palavras inteiras em títulos curtos escritos com todas as letras em caixa-alta.

Legibilidade (readability)

Dividir um texto de blog em parágrafos curtos de no máximo três frases para permitir uma leitura fluida sem cansaço.

Visibilidade tipográfica (legibility)

Escolher uma fonte cujos caracteres 'I' maiúsculo, 'l' minúsculo e '1' sejam claramente distinguíveis em uma senha.

Cores primárias

Criação de embalagens infantis usando vermelho, azul e amarelo para transmitir energia, ludicidade e simplicidade.

Cores secundárias

Uso do verde e laranja em embalagens de sucos naturais para remeter a frutas frescas e folhas.

Cores complementares

Pintura de um botão laranja contra um fundo azul escuro para criar contraste máximo instantâneo na tela.

Cores análogas

Identidade visual de um spa combinando verde-azulado, verde e amarelo-esverdeado para transmitir tranquilidade e harmonia.

Cores monocromáticas

Cartaz de filme minimalista que utiliza apenas variações de tom, claridade e saturação da cor vermelha.

Modelo de cor RGB

Definição de paleta cromática para o banner digital de um site que será visualizado em telas de computador e celular.

Modelo de cor CMYK

Fechamento de arquivo de folheto promocional enviado para uma gráfica offset para garantir fidelidade de tinta no papel.

Escala Pantone (cores spot)

Impressão da cor exata do vermelho da Coca-Cola em latas e anúncios físicos sem variação de tom entre fábricas.

Saturação de cor

Tons dessaturados e acinzentados usados na capa de um documentário histórico para evocar nostalgia e solenidade.

Brilho e luminosidade

Ajuste da claridade de uma imagem em um aplicativo de fotos para destacar detalhes que estavam em sombras escuras.

Temperatura da cor

Uso de tons quentes (vermelho e amarelo) em logotipos de redes de fast food para estimular fome e dinamismo.

Psicologia das cores

Uso da cor azul em logotipos de bancos e empresas de tecnologia para transmitir confiança e segurança.

Textura visual

Aplicação de efeito de papel reciclado no fundo de um rótulo de cosmético artesanal para sugerir sustentabilidade.

Padrão (pattern)

Repetição contínua de ilustrações geométricas no verso de um cartão de visitas ou na fita decorativa de um pacote.

Formas geométricas

Logotipos baseados em círculos perfeitos e quadrados para marcas de tecnologia transmitirem solidez e precisão técnica.

Formas orgânicas

Linhas fluidas, curvas e sem simetria rígida no rótulo de um produto vegano para reforçar a conexão com a natureza.

Linhas-guia (leading lines)

Traços diagonais em um infográfico que conectam visualmente um dado inicial até sua conclusão no final da página.

Regra dos terços

Posicionamento do rosto de uma modelo na interseção das linhas imaginárias superiores em um anúncio de perfume.

Proporção áurea (Golden Ratio)

Construção geométrica das curvas do logotipo da Apple baseada em proporções harmoniosas da espiral áurea.

Imagem vetorial

Criação de um logotipo em arquivo .AI ou .SVG que pode ser impresso do tamanho de um broche até um outdoor sem pixelar.

Imagem raster (bitmap)

Fotografia digital de alta definição salva em JPEG ou PNG para compor o banner principal de um portal de notícias.

Resolução de imagem (DPI/PPI)

Exportação de arte para impressão a 300 DPI e para banners de redes sociais a 72 PPI para otimizar velocidade.

Sangria (bleed)

Extensão do fundo colorido 3 mm além da linha de corte de um flyer para evitar bordas brancas indesejadas após o corte.

Margem de segurança

Posicionamento de textos a pelo menos 5 mm para dentro da borda da página para não serem cortados pela guilhotina.

Profundidade de campo visual

Desfoque intencional do plano de fundo da foto para destacar a imagem nítida de um smartphone em um catálogo.

Isótipo

O swoosh da Nike usado isoladamente sem o nome da marca, sendo reconhecido instantaneamente pelo público.

Logotipo

A palavra Coca-Cola escrita com sua tipografia cursiva personalizada sem depender de um ícone separado.

Imagotipo

A logo da Lacoste contendo o jacaré acima da palavra escrita, onde ambos funcionam juntos ou separados.

Manual de identidade visual

Guia que define a paleta de cores oficial, proibições de distorção de logo e fontes corporativas de uma empresa.

Favicon

Pequeno ícone quadrado de 16x16 pixels exibido na aba do navegador ao lado do título da página web.

Wireframe

Esboço monocromático em linhas cinzas que define a estrutura de botões e textos de um site antes do design visual.

Mockup

Apresentação de um rótulo aplicado digitalmente sobre uma garrafa 3D realística para o cliente aprovar o resultado final.

Princípio de Gestalt: Fechamento

Logotipo da WWF onde manchas pretas sugerem o corpo completo de um urso panda completado pelo cérebro do observador.

Princípio de Gestalt: Continuidade

Uma linha curva suave desenhada em um infográfico que faz o olho percorrer naturalmente o gráfico da esquerda para a direita.

Princípio de Gestalt: Figura-fundo

O logo do zoológico de Pittsburgh que exibe uma árvore onde os espaços vazios formam as silhuetas de um gorila e de um leão.