Ir para o conteúdo principal

Glossário

Este glossário tem por finalidade facilitar a compreensão de determinados termos inseridos no Guia de Expressão da Marca da Procempa, auxiliando, principalmente, profissionais que não sejam oriundos dos campos de design e comunicação. Sempre que houver necessidade de inclusão de novos termos, entre em contato com a P-COM para avaliação da solicitação.

Área de proteção'

Espaço mínimo obrigatório ao redor da marca que deve ser mantido livre de qualquer elemento gráfico para garantir leitura e destaque.

Um conjunto de três diagramas técnicos ilustrando diretrizes de espaçamento de marca para o logotipo da 'procempa'. O primeiro exemplo (superior esquerdo) mostra o texto azul 'procempa' com linhas tracejadas indicando uma área de proteção 'x'. O segundo exemplo (superior direito) mostra 'procempa' em azul acima de 'na tua vida' em cinza, com a mesma marcação 'x'. O terceiro exemplo (inferior) mostra 'procempa na tua vida' em azul acima de uma fileira de ícones azuis (grávida, livro, bicicleta, coração, ônibus, cadeado, lâmpada, avião), com a área de proteção 'x' marcando o espaçamento obrigatório ao redor de todo o conjunto.

Arquivo bitmap

Imagem composta por pixels; formato ideal para fotografias e ilustrações complexas.

Exemplificação de um arquivo bitmap através de um zoom extremo em uma grade de pixels. A imagem mostra bordas serrilhadas em uma forma branca sobre fundo azul, com um círculo vermelho enfatizando os pixels individuais que compõem a estrutura da imagem.

Arquivo vetorial

Imagem baseada em vetores matemáticos; ideal para logotipos e ícones por permitir redimensionamento infinito sem perda de qualidade.

Exemplificação de um arquivo vetorial através de um zoom extremo em letras azuis. A imagem destaca os pontos de ancoragem e as alças de Bezier que definem as curvas matemáticas do desenho, com um círculo vermelho enfatizando a precisão das linhas e a ausência de pixels mesmo em alta ampliação.

Assessoria de imprensa

Setor responsável pela gestão do relacionamento e fluxo de informações entre a instituição e os veículos de comunicação.

Diagrama de fluxo simplificado com o tema 'Assessoria de imprensa' no centro. Cinco caixas retangulares conectam-se ao núcleo central, representando os pilares do setor: 'Meios de comunicação', 'Produção', 'Distribuição', 'Planejamento' e 'Empresas'.

Assinatura endossada

Aplicação de uma marca secundária vinculada à marca principal, assegurando o vínculo institucional e a unidade visual.

Representação visual de uma assinatura endossada, ilustrando a aplicação da marca Procempa vinculada à marca da Prefeitura de Porto Alegre. A imagem demonstra o vínculo institucional através de dois layouts horizontais — um sobre fundo branco e outro sobre fundo azul — com as proporções e o distanciamento entre os elementos devidamente marcados pela variável "x"

Assinatura visual, marca gráfica ou logo

Conjunto de elementos gráficos (símbolo e/ou logotipo) que identifica visualmente a marca.

Exemplo visual para o termo "Assinatura visual", apresentando o logotipo da Procempa em azul itálico sobre a tagline "na tua vida" em cinza. A imagem ilustra o conjunto de elementos gráficos (logotipo e tagline) que identificam visualmente a marca.

Branding

Gestão estratégica das ações destinadas a construir e manter o posicionamento e os valores da marca.

"Diagrama de fluxo em português sobre o tema 'Branding'. Uma caixa central com este título se conecta a cinco caixas periféricas: 'Design', 'Atendimento', 'Publicidade', 'Comunicação' e 'Propósito'.

CMYK

Sistema de cores subtrativas para impressão baseado em Ciano, Magenta, Amarelo e Preto.

Diagrama de cores subtrativas (CMYK) apresentando três círculos sobrepostos nas cores ciano, magenta e amarelo sobre um fundo branco. As intersecções entre os círculos revelam as cores resultantes da mistura, com o centro comum apresentando a cor preta, exemplificando o sistema utilizado para processos de impressão.

Cores análogas

Cores posicionadas lado a lado no círculo cromático, que possuem baixo contraste entre si.

alt="Exemplificação de 'Cores análogas' através de uma paleta com cinco faixas verticais de cores. A sequência mostra uma transição suave entre tons de azul e violeta: turquesa (#00d3da), azul claro (#0099da), azul escuro (#0003da), azul violeta (#4a00da) e magenta (#b700da). O texto na imagem explica que estas cores estão lado a lado no círculo cromático e possuem baixo contraste entre si.

Cores complementares

Cores localizadas em posições opostas no círculo cromático, que oferecem alto contraste.

Exemplificação de 'Cores complementares' através de uma paleta com cinco faixas verticais de cores contrastantes: amarelo (#ffff00), laranja (#ff9900), azul (#0003da), vermelho-alaranjado (#ff4a00) e vermelho-púrpura (#ff3300). O texto na imagem descreve que estas cores estão em posições opostas no círculo cromático e oferecem alto contraste.

Cores tétrades

Combinação de quatro cores que formam um retângulo ou quadrado no círculo cromático.

Exemplificação de 'Cores tétrades' através de uma paleta com cinco faixas verticais de cores: amarelo (#ffff00), verde-limão (#ccff00), azul (#0003da), violeta (#8a2be2) e laranja (#ff9900). O texto na imagem define o termo como uma combinação de quatro cores que formam um retângulo ou quadrado no círculo cromático.

Cores tríades

Combinação de três cores equidistantes que formam um triângulo no círculo cromático.

Exemplificação de 'Cores tríades' através de uma paleta com cinco faixas verticais de cores: amarelo (#e6e600), laranja (#e65100), azul (#0003da), vermelho (#b30000) e roxo (#800080). O texto na imagem define o termo como uma combinação de três cores equidistantes que formam um triângulo no círculo cromático.

CSS

Linguagem de estilo utilizada para definir a aparência visual e o layout de páginas na internet.

Diagrama de fluxo que conecta um bloco central de código CSS a três áreas de aplicação visual. O bloco superior contém regras de estilo para a classe '.contraste', definindo fundos pretos (#000) e textos brancos (#fff). As conexões levam a ícones que representam: um layout de página web (esquerda), uma paleta de cores com cinco tons (centro-baixo) e tipografia com as letras 'Aa' (direita).

Design

Processo técnico e criativo de planejamento e execução de produtos, sistemas ou peças de comunicação.

Diagrama de fluxo que conecta um bloco central de código CSS a três áreas de aplicação visual. O bloco superior contém regras de estilo para a classe '.contraste', definindo fundos pretos (#000) e textos brancos (#fff). As conexões levam a ícones que representam: um layout de página web (esquerda), uma paleta de cores com cinco tons (centro-baixo) e tipografia com as letras 'Aa' (direita).

Família tipográfica

Conjunto completo de variações (pesos e estilos) de um mesmo desenho de fonte.

Diagrama de fluxo sobre o termo 'FAMÍLIA TIPOGRÁFICA'. Uma caixa central no topo contém o título e conecta-se a três outras caixas que exemplificam variações das letras 'Aa': à esquerda em peso regular, abaixo em estilo itálico e à direita em peso negrito.

Favicon

Ícone simplificado de dimensões reduzidas para identificação da marca em abas de navegadores e interfaces digitais.

Exemplificação de um favicon em uma interface de navegador. A imagem mostra uma aba azul com um pequeno ícone quadrado contendo a letra 'A' branca posicionado à esquerda do endereço URL. Abaixo, visualiza-se a barra de navegação com setas, campo de endereço e ícones de favoritos e menu.

Grid ou Malha

Conjunto de linhas guias que orienta a organização, o alinhamento e a proporção de elementos em uma composição visual.

Infográfico explicativo sobre 'Grid ou Malha' em uma composição visual. O diagrama central identifica, através de blocos coloridos e linhas, os elementos estruturais de um layout: Margem (moldura verde), Colunas (bloco rosa vertical), Módulos (quadrado azul), Zonas (bloco amarelo), Guias Horizontais (linhas vermelhas) e Medianiz ou Calha (espaçamentos entre elementos). Rótulos laterais descrevem a função técnica de cada componente na organização e alinhamento do design.

Harmonia de cores

Combinação equilibrada de cores baseada em relações técnicas e físicas no círculo cromático.

Diagrama técnico ilustrando seis tipos de harmonia de cores em círculos cromáticos de 12 divisões. Cada círculo destaca uma combinação específica através de pontos brancos e linhas pretas de conexão: monocromática (ponto único), complementar (duas cores opostas), análoga (três cores vizinhas), tríade (três cores formando um triângulo), complementar dividida (uma cor e as duas vizinhas da sua oposta) e tétrade (quatro cores formando um retângulo).

Hexadecimal

Código alfanumérico que representa cores no sistema RGB para aplicações digitais.

Interface de um seletor de cores digital (color picker) detalhando as especificações técnicas de um tom de azul profundo. A janela exibe os valores para os sistemas HSB, RGB, Lab e CMYK, com um retângulo vermelho destacando o código hexadecimal '#0003da' na parte inferior. À esquerda, um grande campo de gradiente e uma barra vertical de matiz ilustram o processo de seleção visual da cor.

HTML

Linguagem de marcação utilizada na estruturação e organização de conteúdos para a internet.

Captura de tela de um editor de código em tema escuro exibindo o código-fonte HTML de uma página de perfil profissional. O documento apresenta a estrutura padrão com as tags 'head', 'body', 'header', 'main' e 'footer', contendo textos em português que descrevem a apresentação e a atuação de uma servidora pública municipal. O código utiliza destaque de sintaxe colorido e possui numeração de linhas na lateral esquerda.

Identidade Visual

Sistema composto por cores, tipografia e elementos gráficos que define a unidade e o reconhecimento visual da marca.

Mockup de um manual de identidade visual (Style Guide) disposto de forma organizada sobre uma superfície cinza. A imagem apresenta diversas páginas que detalham os pilares de uma marca, incluindo seções sobre tipografia, tom de voz, cores institucionais e um índice intitulado 'What's Inside'. O design é limpo e utiliza blocos de cores sólidas em tons de azul e verde-água, exemplificando a documentação técnica de uma marca.

Imagotipo

Assinatura visual onde o símbolo e o logotipo são elementos separados, permitindo o uso independente de cada um.

Logotipo da Microsoft exibindo um símbolo composto por quatro quadrados coloridos — laranja, verde, azul e amarelo — dispostos em grade à esquerda do nome 'Microsoft'. O nome da marca está escrito em uma fonte sem serifa na cor cinza sobre um fundo branco.

Isologo ou selo

Assinatura visual onde o símbolo e o logotipo são integrados em um único elemento gráfico indissociável.

Marca circular da Starbucks Coffee apresentando um anel externo verde com as palavras 'STARBUCKS' na parte superior e 'COFFEE' na parte inferior, separadas por duas estrelas brancas laterais. O centro exibe um círculo preto com a ilustração em branco de uma sereia de duas caudas (sereia mística) usando uma coroa, sobre um fundo branco.

Isotipo ou símbolo

Elemento gráfico não textual que representa visualmente a marca.

Símbolo gráfico da Nike, conhecido como 'Swoosh', representado em cor preta sólida sobre fundo branco. A forma consiste em uma curva fluida e dinâmica que começa larga no lado esquerdo, inclina-se para baixo e termina em uma ponta fina e alongada voltada para o canto superior direito.

Kerning

Ajuste do espaço individual entre dois caracteres específicos para melhorar a estética visual.

Exemplificação técnica do termo 'kerning' através da palavra homônima escrita em fonte sem serifa preta. A imagem destaca o ajuste de espaço entre caracteres individuais, utilizando duas linhas verticais tracejadas e uma seta horizontal de ponta dupla para demarcar o intervalo específico entre as letras 'r' e 'n'.

Leading

Distância vertical entre as linhas de base de um texto (espaçamento entre linhas).

Exemplificação técnica do termo 'entrelinha' (leading) através de duas linhas de texto: 'Aqui uma frase' e 'Aqui outra'. A imagem destaca o espaçamento vertical entre as linhas utilizando marcações horizontais tracejadas e uma seta vertical de ponta dupla, ilustrando como a distância entre as linhas de base é medida em uma composição tipográfica.

Logotipo

Representação visual da marca através de texto ou tipografia estilizada.

Logotipo da Procempa em cor azul. A imagem apresenta o nome da empresa escrito em letras minúsculas, utilizando uma fonte sem serifa, em negrito e itálico, sobre um fundo branco.

Marca

Conjunto de atributos, tangíveis e intangíveis, que identificam e diferenciam um negócio ou serviço.

Infográfico explicativo sobre o termo 'Marca'. No topo, o texto define o conceito como um conjunto de atributos tangíveis e intangíveis que identificam e diferenciam um negócio ou serviço. Abaixo, uma nuvem de palavras destaca o termo 'brand' em fonte grande e verde, cercado por diversos conceitos relacionados como 'marketing', 'product', 'management', 'objectives' e 'corporate', escritos em tons de verde, laranja e amarelo.

Mockup

Simulação digital da aplicação da marca em objetos ou cenários reais para avaliação de resultado visual.

Mockup de um outdoor (billboard) instalado na fachada de um edifício, posicionado em uma calçada ao lado de uma vitrine de vidro. O painel apresenta textos técnicos em preto sobre um fundo cinza claro com grid de linhas geométricas: 'Barcelona Sidewalk Billboard Mockup', 'Worldwide Mockup', '4:2 Format' e '2500 x 1250px'. Um selo oval no canto inferior direito contém a instrução 'PLACE YOUR DESIGN HERE', exemplificando a aplicação de uma peça publicitária em contexto urbano.

Monocromia

Composição visual que utiliza apenas uma cor e suas variações de saturação e luminosidade.

Exemplificação técnica do termo 'Monocromia' através de uma paleta de cores em tons de cinza. O texto na imagem define o conceito como uma composição visual que utiliza apenas uma cor e suas variações de saturação e luminosidade. Abaixo, cinco faixas verticais demonstram essa variação, progredindo de um tom de cinza médio-claro para um cinza escuro.

Pantone

Sistema internacional de padronização de cores para impressão por meio de tintas pré-misturadas (escala spot).

Exemplificação do sistema 'Pantone' através de um leque de cores aberto sobre uma superfície branca. A imagem mostra diversas lâminas com amostras de cores organizadas em degradês de verde, azul, roxo e rosa, cada uma com seu código de identificação. O texto no topo define o termo como um sistema internacional de padronização de cores para impressão por meio de tintas pré-misturadas (escala spot).

Policromia

Composição visual que utiliza múltiplas cores; sistema de impressão que utiliza quatro ou mais tintas.

Exemplificação do termo 'Policromia' através de uma fotografia de uma máquina de impressão industrial em funcionamento. A imagem mostra rolos metálicos paralelos aplicando tintas vibrantes nas cores amarelo, magenta, ciano e preto (CMYK) sobre o papel. O texto no topo define o conceito como uma composição visual que utiliza múltiplas cores ou um sistema de impressão com quatro ou mais tintas.

Publicidade

Ações de comunicação que visam promover produtos ou serviços para obter aceitação do público.

Exemplificação do termo 'Publicidade' através de um anúncio antigo da 'Pasta Dentifricia PEBECO'. A imagem, em tons de sépia, mostra uma mulher admirando o sorriso em um espelho de mão à esquerda, acompanhada de textos promocionais e a ilustração de um tubo de pasta de dentes à direita. No topo, o texto define publicidade como ações de comunicação que visam promover produtos ou serviços para obter aceitação do público.

Resolução

Nível de detalhamento de uma imagem bitmap, medido pela quantidade de pixels por polegada (ppi).

Exemplificação técnica do termo 'Resolução' através de uma imagem comparativa da Usina do Gasômetro em Porto Alegre ao pôr do sol. O topo contém a definição do conceito como o nível de detalhamento de uma imagem bitmap medido em ppi. A fotografia abaixo está dividida ao meio: o lado esquerdo, rotulado como 'Alta resolução', apresenta nitidez e detalhes nítidos, enquanto o lado direito, rotulado como 'Baixa resolução', mostra a mesma cena de forma desfocada e pixelizada.

RGB

Sistema de cores aditivas para telas baseado na luz (Vermelho, Verde e Azul).

Diagrama do sistema de cores aditivas (RGB) composto por três círculos sobrepostos nas cores azul, verde e vermelho sobre um fundo preto. As áreas de intersecção exibem as cores secundárias ciano, magenta e amarelo, enquanto o centro comum, onde as três cores primárias se sobrepõem, apresenta a cor branca.

Tagline

Texto explicativo curto que acompanha a assinatura visual para reforçar o propósito ou posicionamento da marca.

Infográfico definindo o termo 'Tagline'. Abaixo da definição, o conceito é exemplificado com o logotipo 'procempa' em opacidade reduzida e a tagline 'na tua vida' em cinza escuro, ambos em fonte itálica e negrita.

Tipografia

Estudo, criação e aplicação técnica de caracteres e fontes em uma composição visual.

Infográfico técnico do termo 'Tipografia' detalhando a anatomia de uma fonte. A palavra 'Tipografia' é apresentada com linhas guia horizontais e rótulos coloridos que identificam elementos como: linha de base, linha de altura, linha ascendente, linha descendente, corpo e altura de x. Partes específicas das letras 'f', 'p' e 'g' estão destacadas em amarelo para exemplificar as hastes ascendentes e descendentes.

Tracking

Ajuste do espaço uniforme entre todos os caracteres de um bloco de texto ou palavra.

Exemplificação técnica do termo 'tracking' através da palavra homônima escrita em fonte sem serifa preta. A imagem ilustra o ajuste de espaçamento uniforme entre todos os caracteres de uma palavra, utilizando linhas verticais tracejadas e setas horizontais de ponta dupla entre cada uma das letras para demonstrar o intervalo global.

Voltar ao topo