Identidade Visual é a representação gráfica de uma empresa, instituição, produto ou ideia. Trata-se de ícones, símbolos ou tipos organizados de forma estética com um significado objetivo atribuído.
Mas e logomarca? Existe ou não existe?
Há uma discussão muito grande em torno dos termos logomarca, logotipo e identidade visual, dentro da área do design gráfico e publicidade. Diversos livros sobre publicidade definem logomarca como sendo uma coisa diferente de identidade visual, confundindo por diversas vezes a definição deste último com o de identidade corporativa.
Muitos sites e designers defendem o termo logomarca, ou o atacam, utilizando argumentos como origens etimológicas ou a popularização do nome. Mas é nítido que usar um termo errado pode complicar a comunicação com outros profissionais ou, simplesmente, torná-la menos prática.
Logomarca é uma dos diversos erros de interpretação de palavras estrangeiras como tantos outros que existem no português brasileiro. O termo foi usado como tradução livre da palavra inglesa logo mark. No inglês, a palavra mark é usada como sinal, notação, aceno, algo que aponta para algo visível, ou seja marcação. A marca, como usamos, no inglês é escrito como brand. Não é incomum termos palavras usadas de forma errada devido a traduções brasileiras. A palavra porta, por exemplo, como em porta UBS, é uma tradução errada de port, que significa porto (local de entrada e saída de items). Ou até de neologismos como customizar (do inglês custom) e randômico (do inglês random), que em português seria personalizar e aleatório respectivamente.
Em alguns livros de publicidade, entretanto, é fácil encontrar o termo logomarca e vários publicitários o utilizam normalmente. As definições mais comuns nesse meio diferenciam Logomarca de Identidade Visual afirmando que, o primeiro, trata-se da criação gráfica pura, sem conceito, enquanto que o segundo seria a logomarca vinculada a um conceito. Entretanto, como um designer pode desenvolver um projeto sem criar um conceito e um estudo? Seria no mínimo irresponsabilidade.
Em resumo, logomarca é uma tradução inapropriada do termo logomark que, por sua vez, foi originalmente usado para representar símbolos e marcações de empresas em diversos ambientes. O uso do termo logomarca pode ser usado sem problemas entre leigos, para facilitar a comunicação, mas deve ser desencorajado em ambientes profissionais.
Mas e quanto a logotipo?
O logotipo, assim como o símbolo, é uma parte da identidade visual, trata-se da parte referente a tipografia, não pura, mas a tipografia “estilizada”. O logotipo é a tipografia modificada e organizada para se comunicar com o conceito e o símbolo (quando houver). Algumas identidades visuais são compostas apenas de logotipo, como a Samsung, a Aiwa, dentre outras. As vezes a identidade visual é composta somente de símbolo, como a Apple e a Pepsi.
Mas afinal, quanto custa uma identidade visual?
O custo de uma identidade visual depende principalmente da responsabilidade acerca dela. Basicamente da quantidade de pessoas que irão apreciá-la, da quantidade de lugares que ela será exposta, diversificação de público, valor de mercado e sua importância para a venda do produto.
Sendo direto, o valor médio de uma identidade visual gira em torno de R$8.000,00 para pequenas empresas. Esses são os valores baseados em algumas tabelas verificadas como a ADG, Adegraf, Abap, dentre outras. Essas tabelas já foram poucos praticáveis e com valores bem mais altos, mas adaptações mais recentes trouxeram para uma realidade mais aceitável.
Para empresas de médio e grande porte, o valor vai depender muito da importância da marca em relação ao produto. Partindo de 10 mil à milhões de reais.
Por exemplo, uma marca que não é focada no consumidor final tende a ter uma responsabilidade menor que o oposto, possuindo assim um custo de produção menor.
O custo de um serviço como esse não deve estar atrelado ao tempo ou horas, mas sim à responsabilidade. O tempo que o designer leva para projetar ou tomar decisões não é proporcional ao seu estudo e conhecimento prévio, ao contrário. A tendência é que profissionais com mais experiência consigam tomar decisões mais rápidas, porém bem pensadas.
Rascunho da criação da identidade visual da Atlasian
Por que esse valor supostamente tão alto?
Criar uma identidade visual não é algo simples. Todo o comportamento gráfico da empresa vai girar em torno dessa identidade. Todas as cores, tipografias, formas, campanhas publicitárias, etc. vão ser baseadas nas decisões tomadas pelo designer responsável por essa identidade visual.
Desde o site até o endo marketing, tudo vai girar em torno dos conceitos criados para essa identidade. Conceitos esses que vão perdurar por anos e serão determinantes para o sucesso da empresa.
Essas escolhas são pensadas a partir de estudos profundos sobre mercado, concorrência e público, seguindo o planejamento estratégico da empresa. Além disso, o designer precisa pensar na complexidade, relacionamento com outras marcas, tamanho mínimo e máximo, possibilidades de uso, acessibilidade, adequação, etc. E nem todo designer está apto a fazer qualquer identidade visual. Muitas formas de comunicação estão agregadas a estilos e compreensão aprofundada de um público e direcionamento específico. Por isso, estúdios de design consideram pessoas diferentes para nichos diferentes.
Apesar de alguns atropelos do jornalista, o mini-documentário Alexandre Wollner e a Formação do Design Moderno no Brasil, ajuda a entender melhor a importância do desenvolvimento do design de uma identidade visual (é um vídeo um pouco cansativo, mas muito instrutivo).
Identidades Visuais de Alexandre Wollner
Valores das Gráficas Rápidas e Pseudo-Designers
Uma identidade visual definirá como a empresa será representada por anos. É uma compactação do conceito da identidade corporativa da empresa, é a imagem fixa de seus consumidores e apreciadores. Por isso, existem estudos, testes de comportamento, escolha de cores, medidas, formas e padrões baseados em antropologia e interpretações sociais. É necessário conhecer a empresa, pesquisar histórico, o comportamento dos consumidores atuais e dos quais se deseja atingir.
Mas não é isso o que acontece com gráficas rápidas e pseudo designers. Estes simplesmente abrem um “CorelDRAW” e começam a pegar pedaços de identidades visuais e “logomarcas” que encontram em sites de pesquisas, como o Google. Alguns usam imagens prontas de sites como o freepik, sob a justificativa de ser aberto para qualquer um usar. Com isso, montam algo não apropriado, sem estudo e conceito, igual a montar um quebra cabeças de vários jogos diferentes e ainda colar o encaixe das peças com cola branca.
Com isso, como não há um real trabalho sério e acabam por cobrar valores irrisórios como 120 ou no máximo 300 reais, mas que geralmente não tende a ser algo funcional.
Então empresas muito pequenas não podem ter identidades visuais?
Podem, claro. Mas primeiro vamos entender a necessidade de cada empresa.
Uma padaria pequena não necessariamente precisa ter uma identidade visual própria. Muitas nem mesmo tem fachada e apenas escrevem o nome “Padaria (…)” em seu topo. Alguns fazem apenas letreiros mais bonitinhos, onde o profissional é contratado para fazer um letreiro (e não a identidade visual) o que justificaria, nesse caso, usar imagens do freepik ou sites similares.
Todavia, chega a um momento na vida de um empresário em que ele realmente quer fazer algo que represente a marca dele. Na grande maioria das vezes, esses pequenos comerciantes buscam ajuda do Sebrae ou de consultorias que os auxiliam e buscam profissionais para fazer esse serviço.
É aí onde deve entrar o estudante ou o profissional ainda novato. E como estudante não me refiro a universitários apenas, mas àquela pessoa que se interessa em aprender. Refiro-me as pessoas que leem livros teóricos, que começam a estudar colorimetria, psicodinâmica, física, psicologia, filosofia do design, etc. e não simplesmente as pessoas que acompanham tutoriais na internet. Esses indivíduos precisam fazer seu portfólio e desenvolver trabalhos próprios, por isso não só podem como devem cobrar menos.
É muito provável que alguém inexperiente cometa alguns erros básicos, por isso que estão começando com negócios pequenos em que a responsabilidade não seja tão grande (mas ainda sim há). O importante é a ética e o comprometimento de tentar fazer o melhor que puder, sem roubar imagens prontas da internet e revender (o que é até ilegal).
Esses aspirantes podem cobrar valores de no mínimo R$1.200,00 reais e ir aumentando com o tempo. Vale lembrar que os custos de um profissional ou de um aluno são maiores do que parecem, e o tempo para o desenvolvimento de uma identidade visual séria gira em torno de um mês. Esse valor serve como uma base para iniciar no mercado.
Nomes como Paul Rand, Massimo Vignelli e o próprio Alexandre Wollner são exemplos clássicos de profissionais focados na criação de identidades visuais e responsáveis por diversos trabalhos importantes pelo mundo. Sendo estes referência para estudo e inspiração.
American Airlines – A identidade visual original foi criada por Massimo Vignelli
Concluindo
Criar uma identidade visual é um trabalho dispendioso e pode se estender por meses dependendo da importância do projeto. Não é o tipo de trabalho que pode ser feito em poucos dias ou em duas semanas. O contratante tem que estar ciente que é algo que vai muito além de gosto e a decisão do que haverá na identidade visual deverá ser do profissional capacitado. A opinião e decisão de formas, cores e padrões não podem partir de pessoas inexperientes, pois elas tendem a basear suas escolhas em gostos pessoais. Como um médico que faz um diagnóstico e passa os remédios corretos, o mesmo fará o designer, e a receita deve ser seguida à risca para um bom resultado.
Criar uma Identidade Visual é responsabilidade demais para uma Gráfica Rápida fazer ou um pseudo profissional. Além disso, o preço ridículo cobrado por esses engôdos faz com que os empresários não compreendam os reais custos de um profissional, além de sujar a imagem da categoria.
As empresas também precisam entender que a identidade visual é de uma importância incomensurável para a empresa. Um designer de verdade não está lá para agradar seus clientes diretamente, mas o cliente do seu cliente. A função social do designer é ajudar a melhorar os resultados de uma empresa ou artefato.
Talvez um dos assuntos mais polêmicos na área do design gráfico é a preparação para impressão. Não espere aqui um tutorial sobre como preparar seu arquivo no Photoshop, Illustrator ou InDesign, nada disso. Precisamos falar sobre questões teóricas acerca da tecnologia da impressão para que você, designer ou aspirante, compreenda melhor e tome decisões racionais acerca do material impresso. Para isso, vamos precisar entender um pouco de história.
O ano é 1985 e a Apple havia lançado a pouco o Macintosh. Esse computador nos trazia uma tecnologia surpreendente de uso de tipografias fantásticas na tela, porém, apenas na tela. As impressoras matriciais eram as principais tecnologias de impressão. A editoração eletrônica ainda era um mercado inexistente. Até que uma nova empresa apareceu no mercado, a Adobe, trazendo uma nova tecnologia no quesito de WYSIWYG (What You See Is What You Get – O que você vê é o que você obtém): a tecnologia PostScript.
PostScript é uma linguagem de programação que descreve o comportamento de uma página para um dispositivo de saída, em especial uma impressora. Ela foi criada com o objetivo específico de montar páginas, imagens e tipografias para interpretação de impressoras à laser, fazendo com que o Macintosh realmente pudesse imprimir as impressionantes tipografias que estavam na tela. Graças a isso, foi criado um novo e fascinante mercado que abriu as portas da tecnologia da informação aos profissionais de design gráfico. Com o tempo, foi se tornando mais e mais integrada, graças a programas como o Illustrator, CorelDRAW, PhotoPhinish, Pagemaker e demais.
Mas como funciona a impressora e a impressão?
A impressora recebe as informações da página através de um sistema/equipamento chamado spooler. Esse spooler codifica e descreve as informações passadas pelo computador para informações que a impressora consegue interpretar. Existem diferentes tipos de impressoras e cada uma se comporta de uma forma específica, mas vamos nos focar nos tipos de impressoras que usam tecnologias WYSIWYG.
Hoje, os dois principais métodos de impressão profissional mais usados são os chamados Impressão Offset e Impressão Digital.
Na Impressão Offset, a gráfica cria chapas de impressão, que serão usadas como uma espécie de “carimbo” para cada cor usada. Nas chapas, as retículas (pequenos pontos que compõe a imagem) já estão estabelecidas. O mesmo papel então passa por todas as chapas que “carimbam” a cor. Quando a impressora trabalha com mais de uma cor, as retículas, por estarem muito próximas, dão a sensação de que novas cores foram geradas. A esse fenômeno damos o nome de cores subtrativas. Ao usar o CMYK, quatro chapas passam pelo papel. Caso haja uma cor especial a mais, como dourado, prateado, verniz ou cores fora do gamut comum, uma chapa adicional é colocada para essa cor. Por usar chapas, ou seja, um processo mecânico e analógico, esse sistema é mais recomendado para grandes tiragens, pois a chapa é o maior custo da impressão, em contra partida a impressão em volume é muito mais rápida. Nesse caso, o PostScript está não na impressora em si, mas no equipamento que vai gerar a matriz.
Exemplo de chapa flexível em uma impressora offset.
Por outro lado, a Impressão Digital (nada a ver com o dedo) destina-se ao conceito mais linear onde a impressão das cores são feitas diretamente no papel simultaneamente, através de um processo direto sem matriz. Daí vem as impressoras à laser, jato, plotters, etc. Esse processo é muito interessante pois você tem uma resposta direta ao material que está produzindo. Para pequenas tiragens ele pode ser o ideal porque não precisa da criação de chapas, porém acaba por ser um processo lento por depender de informações passadas para a impressora. Nesse caso, o PostScript tende a estar diretamente na impressora ou em um spooler externo. A impressão digital também é muito usada para fazer provas, pois ajudará o gráfico (profissional de uma gráfica) a fazer ajustes e testes que calibrem melhor para aquele resultado aprovado.
Hoje, a tecnologia de impressão digital vem melhorando muito, com impressoras cada vez mais rápidas e com mais quantidade de cores, garantindo melhor qualidade com degradês, que antes só eram atingidos por impressão offset. Não é muito incomum você encontrar processos híbridos, onde apenas as cores especiais são adicionadas por offset e a impressão CMYK é feita diretamente pelas impressoras digitais.
Para entender mais sobre cores, leia nosso artigo sobre fidelidade de cores na impressão:
Antes mesmo de preparar o arquivo, precisamos entender os tipos de imagens computacionais existentes. Podemos gerar imagens de três de formas: Matricial, Vetorial e Fractal. Como fractal é algo específico para simulações e ambientação 3D, não iremos nos prender a esse tipo de imagem agora. Porém, se quiser saber mais, leia nosso artigo sobre O Número de Ouro no Design.
Imagens Vetoriais: São imagens geradas a partir de cálculos matemáticos vetoriais, ou seja, que representam uma função e é estendida em um plano cartesiano. Cada função é definida por equações que determinam as localizações de seus pontos. São totalmente baseadas na geometria euclidiana e utilizam cálculos feitos em tempo real para imprimir a imagem na tela. O que é armazenado em memória são as informações das equações. A cada vez que a imagem é exibida ela precisa ser renderizada novamente pelo processador. Por ela ser gerada de forma dinâmica, a qualidade dela não é perdida, pois sempre que altera um tamanho são recalculados os traços a partir de novos valores dessa equação.
São exemplos de arquivos de imagens vetorais os arquivos gerados nativamente pelo Illustrator, CorelDRAW e instruções como SVG, EPS, tipografias em geral, etc.
O comprimento de um vetor é expressado pela seguinte equação (considerando apenas duas dimensões):
Para adicionar mais dimensões (sim, é possível trabalhar com mais do que 3, mas aí você começa a adentrar o fractal), basta adicionar mais um somando à equação, que corresponda ao eixo desejado.
Imagens Matriciais: São imagens compostas por uma matriz matemática que define informações através de blocos. Uma matriz nada mais é do que um arranjo (array) em duas dimensões. Cada informação pode conter outras matrizes, matematicamente falando, ou vetores nela. Imagens matriciais são altamente usadas na área de fotografia por poderem guardar informações individualmente em blocos. As imagens matriciais geralmente são confundidas com o modelo Bitmap, até por erro semântico de muitos softwares. Mas Bitmap é na verdade um modelo de cor usado em matrizes que possuem apenas duas variações em cada célula.
São exemplos de arquivos de imagens matriciais os gerados nativamente por programas como Photoshop, CorelPhotoPaint, Paint, pós-processamento de máquinas fotográficas e instruções como JPG, TIFF, PNG, etc.
Uma imagem matricial comum pode ser expressada da seguinte forma:
Entretanto, as imagens matriciais não são apenas formadas por instruções fixas, elas podem ser formadas por camadas sobrepostas, chamadas de canais de cor, que não necessariamente precisam ser de cor, fisicamente falando, mas sim instruções relacionadas com suas matrizes.
Por exemplo, uma imagem RGB possui 3 canais de cor, sendo uma camada para o vermelho, uma camada para o verde e uma para o azul. A Imagem CMYK possui quatro camadas de cor, sendo uma ciano, uma magenta, um amarelo e um preto. Algumas imagens também podem possuir mais camadas que representem cores especiais ou transparência, como no caso do RGBA, onde a quarta camada é chamada de alpha, que corresponde as instruções de transparência.
Programaticamente, o que determina a quantidade de cores que uma imagem matricial pode ter é baseado na quantidade de variações de informação em cada vetor na célula de uma matriz. Ou seja, a quantidade de variações de cada camada de cor. Quanto mais bits em uma imagem, mais cores ela vai ter e é expressada matematicamente pela expressãoX = (2^b)*c, onde X é a quantidade de variações, b é a quantidade de bits por canal e c é a quantidade de canais.
Isso quer dizer que quando a imagem é dita que tem 8 bits e um único canal, ela só pode ter 256 variações (0-255), que é o modelo padrão dos tons de cinza. Caso eu adicione mais canais, no caso do RGB: 3 canais, eu vou ter 256 variações em CADA camada, ou seja, 24 bits. É possível aumentar a quantidade de bits por camada, como 16 ou 32, porém é necessário ter um monitor com um gamut de cores muito maior e também será necessário um poder muito maior de processamento para executar determinadas tarefas nessa imagem. Para a grande maioria dos casos, 8 bits de cor é suficiente. Até porque é raro encontrar impressoras e monitores que façam bom uso de um range superior.
É importante salientar que todo vetor é convertido em matriz em um dispositivo de saída. Mesmo o PostScript sendo capaz de enviar e interpretar cálculos vetoriais, a impressora e o monitor dependem de pontos ou pixels para exibir as imagens.
Resolução e Densidade de Pixels
Diferente do que pode ser aprendido em muitos cursinhos e tutoriais do Youtube, a quantidade de PPI aplicada não é simplesmente 300 para impressão. Na verdade, isso vai depender da aplicabilidade do material que você está construindo.
Resolução é um termo utilizado para compreender a relação entre a quantidade de pontos em uma imagem e o seu tamanho físico. Como estamos tratando de editoração eletrônica, deveremos considerar esses pontos = pixels (mais à frente abordaremos os pontos na impressão). Todo o monitor moderno é composto de uma matriz de pixels que possuem um vetor de 3 pixels dentro deles. Cada pixel no monitor representa diretamente um pixel do seu arquivo. Então quando é usada uma imagem com a resolução 1920×1080 (ou pouco mais de 2 megapixels, pois é o resultado da razão da multiplicação de largura e altura dividido por 1000² – pois mega representa mil kilos) não é uma definição de tamanho físico da imagem, mas sim da quantidade de pontos que a imagem vai ocupar em um dispositivo de saída. Por isso que uma imagem fullHD em um monitor 4K vai parecer menor, mesmo que as telas tenham o mesmo tamanho físico, pois o monitor 4K possui muito mais pixels na mesma área.
A essa densidade de pixels damos o nome de PPI (Pixel per Inch) e ela representa a quantidade de pixels que temos em uma polegada. Dispositivos de saídas digitais são definidos em polegadas diagonais, ou seja, um monitor de 21 polegadas tem a dimensão de 21 polegadas em sua diagonal e a densidade de pixels é a razão entre a quantidade de pixels e suas dimensões. Por exemplo, um monitor de 23 polegadas, Full HD, vai ter menos pontos por polegadas que um monitor de 21 polegadas. Isso porque o monitor de 23 polegadas irá ter pixels maiores ou um espaçamento entre pixels maiores e, literalmente, a nitidez do monitor vai ser pior, por conta de sua baixa densidade de pixels.
Quanto maior o PPI, maior a quantidade de informações em uma polegada diagonal, logo, a imagem será melhor.
Com essa informação, podemos começar a tentar compreender como devemos preparar o arquivo para impressão, pois devemos definir a quantidade de pixels por polegadas para nosso trabalho. Mas aí entramos em um outro problema, as impressoras possuem pixels?
Impressoras não possuem pixels, por tanto, não podemos aplicar a lógica do PPI em impressoras, mas sim o DPI (Dots per Inch) ou Pontos por Polegada. O DPI trabalha com as medidas físicas dos pontos da impressora. Na verdade, tratam-se de pequenas retas extremamente curtas, e por isso seu nome é retícula (lembre-se que uma reta é um conjunto de pontos que não podem ser reconhecidos).
As impressoras trabalham com dois tipos de retículas, as retículas lineares e as retículas estocásticas. Ambos os tipos de retículas ainda podem ter variações em sua padronização e fusão (sobreposição), causando diferentes resultados. As retículas lineares são mais usadas em impressões offset e de grandes formatos. Elas causam um comportamento de pontos que chamamos de rosetas, que são essas pequenas “flores” geradas pela proximidade dos pixels. Essas rosetas podem ser de vários tipos e por isso cabe ao designer observar bem as chapas antes da impressão. Já em impressoras digitais, elas costumam resultar no que chamamos de retículas estocásticas (porém também há offsets que usam esse tipo de retícula), que possuem um pontilhamento menos uniforme e mais sobreposto. Essas retículas, por sua vez, podem ser organizadas de forma padronizada (onde elas respondem a uma lógica matricial) ou por erro difusão (onde são aparentemente mais aleatórias, mas compõe melhor a imagem).
Dica: Para analisar a qualidade dos impressos, use um conta-fios. Caso você não tenha à disposição de conseguir um (pela dificuldade de encontrar), compre uma daquelas lentes macro de 10 reais para smartphones. São suficientes para você visualizar bem as retículas de seu projeto e analisar a qualidade da impressão ou da chapa.
Então, o DPI, diferente do PPI, especifica a quantidade de retículas (ou pontos) supracitadas, em uma polegada quadrada, para ser impresso. Ou seja, uma imagem com muito PPI, por exemplo 600PPI, poderá ter uma perda de qualidade considerável caso a seja impresso em apenas 50DPI. Essa relação pode parecer um pouco complexa, mas o exemplo abaixo poderá ajudar a compreender a diferença.
Existe uma relação entre DPI e PPI? Sim, mas não é um relacionamento direto. Essa relação é mais teórica para que o profissional possa escolher suas imagens (principalmente as que compra) de acordo com sua necessidade. Uma imagem que vai ser impressa em um outdoor, por exemplo possui apenas 10LPI, o que não faz sentido uma imagem muito pesada, se só vai imprimir a 20DPI.
Sim, além de DPI, PPI, você também deve se lembrar de LPI. Em dispositivos que usam meio-tom (ou seja, que a percepção da graduação depende dos espaçamentos dos pontos), trabalha-se com uma unidade de medida de resolução chamada LPI ou Lines Per Inch. Essa unidade de medida usa a quantidade de linhas que há em uma polegada, porque essas linhas especificam os espaçamentos entre os pontos. Isto pois, os dispositivos que trabalham com LPI usam a base de retículas lineares padronizadas para poder gerar suas imagens. O cálculo na verdade é simples, x DPI = 2.x LPI.
—
Atualização: Um rapaz na comunidade do Illustrator Brasil no Facebook me lembrou que o LPI não está relacionado apenas a capacidade técnica da impressora, mas a possibilidade do papel de suportar uma impressão mais precisa sem danificá-lo, a partir de sua gramatura. Vale salientar também que isso pode depender também do tipo de pigmento.
—
Dessa formas deixamos claro que a relação entre DPI e PPI vai depender da complexidade do documento em relação a quantidade de pontos em sua impressão. Isso quer dizer que de nada adianta você ter uma imagem de 300PPI em uma impressão de 20DPI (como um outdoor), de modo que você pode usar imagens com menor resolução em pixels, garantindo uma maior agilidade e menor custo de desenvolvimento.
ATENÇÃO: Muitas vezes alguns programas e gráficas confundem o termo PPI e DPI, por isso fique atento ao buscar ou utilizar uma imagem de qualidade suficiente.
Tipos de Imagens
Como estamos falando de editoração eletrônica, precisamos conhecer os tipos de imagens que temos disponível no mercado. Cada tipo de imagem trabalha com uma tecnologia específica de compactação e armazenamento, que faz com que ela seja mais ou menos ideal dependendo do tipo de trabalho que vai ser desenvolvida com ela.
Além das imagens de projeto, como .PSD e .PSB (do Photoshop), .AI (do Illustrator), .INDD (do InDesign) e outros formatos que são específicos de certos aplicativos, devemos ficar atentos na hora de utilizarmos fotos e imagens para outros fins.
Sempre que possível é imprescindível que usemos imagens vetoriais, pois elas irão garantir uma melhor adaptação a qualquer PPI ou DPI. Imagens vetoriais podem ser armazenadas em arquivos EPS, SVG e PDF, de forma a ser utilizada em QUALQUER programa gráfico. Mas o problema mesmo é quando entramos para a questão das imagens matriciais. Para imagens matriciais temos, como principais:
PNG: Não deve ser utilizada de forma alguma para impressão. Ela só suporta 24 bits para cores, ou seja, não vai funcionar em CMYK, o que faz ser impossível incorporar um perfil de cor ideal para impressão nela. Muitas pessoas a exportam por conta de sua possibilidade de trabalhar com 32 bits apenas para o canal alpha, de forma a produzir transparência. Mas mais cedo ou mais tarde, ela vai ter que ser convertida para outro formato para imprimir (mesmo que você não perceba), e isso vai causar uma perda de qualidade das cores.
JPG: Não deve ser utilizada para impressão também. O JPG, ou Jpeg, é um tipo de compactação que remove pixels com cores e tons similares e os deixa iguais a outros, reduzindo assim a quantidade de variações dentro da imagem matricial. A imagem JPG compacta essas informações dos pixels e reconstrói as imagens sempre que é aberta. A questão é que sua qualidade de compactação depende de quantos pixels similares ela vai “juntar” em um único modelo de pixel, criando artefatos e borrões. Essa compactação não é tão visível em um display, mas é extremamente visível na impressão, principalmente nas de alta qualidade, por isso não se deve usar esse formato.
TIFF: Agora sim um formato ideal para impressão. Além do suporte a diversos canais (inclusive o alpha), ele permite que você use compactações que não agridam a qualidade da imagem, como o LZW e o ZIP. Estas compactações não removem informações da imagem e isso até ajuda para uma modificação posterior. Em contra partida, por ser bem pouco compactada e compactável, o TIFF apresenta um peso até 40 vezes maior em tamanho de arquivo do que o JPG, mas com uma qualidade infinitamente superior.
Como preparar as fotos e imagens para impressão?
A preparação do arquivo para impressão deve começar desde sua criação. Começando pelas imagens.
O ideal é que antes mesmo de começar a ajustar as fotos, você já saiba qual gráfica vai utilizar. Caso não saiba, você pode configurar (em caso de impressão no Brasil), seu perfil de cores CMYK para FOGRA39, que é uma convenção nacional. Muitas gráficas optam por enviar um arquivo de perfil ICM ou ICC para você. Se for o caso, importe o perfil enviado.
No Photoshop:
No Illustrator:
Caso você use programas similares, como o Affinity, CorelDRAW, Inkscape ou Gimp, procure em suas documentações sobre o gerenciamento de cores.
No caso do Photoshop, você pode trabalhar o arquivo em RGB sem problemas. O importante é você se certificar que está trabalhando com cores de prova. Para isso, acesse o menu Visualizar > Cores de Prova e você poderá trabalhar com cores mais próximas ao impresso, caso seu monitor esteja corretamente calibrado. No caso do Illustrator, essa opção pode ser trocada no menu Arquivo > Modo de Cor do Documento > CMYK e você vai trabalhar com cores mais próximas ao impresso.
Definir 300 DPI PPI é verdade ou mito que é para impressão?
Mito. Isso dependerá completamente do que você vai trabalhar. Outdoors ou outros impressos cujo DPI da impressora não será muito grande, pode utilizar tranquilamente poucos Pixels por Polegada na imagem e não terá perdas de qualidade. Mas se você vai trabalhar com altíssima definição de impressão com até mais que 1000 DPI, e que se trata de conteúdo para ver de perto, você deverá usar imagens com um PPI muito maior.
Em geral, se a ideia for reutilizar a imagem, é ideal que você trabalhe com uma quantidade mais alta de PPI para poder reutilizar em outros projetos. Geralmente para revistas, você deve considerar algo como à partir de 300PPI e não 300PPI exatamente. Quanto mais PPI mais nítida vai ser a imagem final, e em caso de revistas o DPI da impressão costuma ser bem mais alto.
Em contra partida, se o seu foco for ePub ou algo web, depende do seu público. Como calculamos acima, a densidade de pixel média atual para um monitor é de 96PPI. Porém, para smartphones, pode chegar a até mais de 400PPI, então isso vai depender do uso que você fará da sua imagem.
Atenção a você que é usuário do Illustrator. Você deve configurar para que a renderização de efeitos seja feita em 300PPI, caso contrário você poderá encontrar problemas na qualidade da impressão dos mesmos. Uma opção similar deve ser configurada caso use o CorelDRAW ou Inkscape, por isso, fique atento também.
Finalizando o arquivo para Impressão
É importante salientar que os arquivos a serem enviados para a gráfica devem ser o mais bem finalizados possível de acordo com o que a gráfica pede. Siga os padrões pedido pela gráfica e sempre envie os arquivos em PDF. Mas atenção, PDFs tendem a compactar imagens em JPG nos padrões pedidos por muitas gráficas (A maioria pede X1-A). Por isso, opte por desabilitar a compactação das imagens de seu PDF quando for gerá-lo em seu programa.
Fique atento também para incorporar o perfil de cores ao arquivo para que ninguém cometa uma gafe na hora de abri-lo, pois o programa da pessoa pode estar com outro perfil de cores configurado. A incorporação do perfil garante que o que você escolheu esteja atrelado ao arquivo (sabe aquela mensagem sobre perfil que aparece as vezes quando você abre um arquivo no Photoshop?).
Outra opção que você tem ao salvar arquivos para impressão é através do EPS (Encapsulated Post Script) que, diferente do PDF, possui uma informação de página por arquivo. Ou seja, um arquivo uma página. A vantagem desse formato está principalmente na impressão de livros. Apesar de não fazer mais tanta diferença hoje em dia, antigamente o tempo para envio do arquivo para o spooler era muito longo. Esse tempo quando se fala em um livro ilustrado de 400 páginas acabava por sendo muito demorado. Com o EPS você pode enviar apenas a página que pode ter tido um eventual problema, agilizando o processo de produção.
A seleção de DPI é feita apenas no momento da impressão e se a impressora tiver suporte ao DPI desejado. Nem todos os programas possuem essa opção nativamente, mas você sempre poderá configurar o DPI através das opções do sistema operacional. No caso do Windows, as opções avançadas da impressora garantem o acesso ao DPI da impressora (mesmo as caseiras, como na imagem abaixo).
Concluindo
Apesar de parecer um pouco longo, este artigo é apenas uma breve pincelada para introduzir questões acerca de uma melhor impressão. Para saber mais, consulte termos como tipos de rosetas, tabelas de LPIs, moiré, trapping, tipos de impressoras, impressão sobreposta, dispositivos de saída e outras coisas sobre impressão.
Se você ainda não o fez, visite uma gráfica offset e peça para acompanhar o processo de impressão passo a passo. Acompanhe como os profissionais gráficos trabalham, para que você possa entender determinados pontos do processo. Por fim, evite ao máximo gráficas online, pois você não possuirá o controle real da prova e analisar o resultado final da impressão em tempo hábil será uma tarefa difícil.
Quando se fala em design, muitas pessoas compreendem como algo artístico ou estético, geralmente relacionado com o visual. Mas design vai muito mais além. Design é projeto. É entender o comportamento do usuário de acerca de um artefato e otimizar para que sua função seja executada da forma mais simples e objetiva possível.
Na área de TI, temos uma vertente do design que é chamada de Design de Interação. Como o próprio nome diz, corresponde aos fatores de interatividade do usuário com o sistema. É função do designer de interação projetar como o usuário vai enviar, receber e responder (ou seja, interagir) o sistema ao qual está usando. Por conta disso, o designer de interação precisa possuir uma série de habilidades específicas que adentram a área de desenvolvimento como um todo, com conhecimentos que vão desde movimentos artísticos à performance de banco de dados. Abaixo vamos listar as algumas das competências agregadas a um designer de interação.
Estética
Sem dúvida a parte do design que as pessoas mais lembram é a estética e por isso estamos falando dela primeiro. A estética depende do conhecimento relacionado a arte e filosofia. Estética não significa beleza, mas sim ajustar a aparência de acordo com a proposta do projeto. Muitas vezes, a estética é uma consequência de algo bem desenvolvido e é a última parte em que o designer trabalha.
Um termo muito usado na área de TI para se referir a estética de um sistema ou aplicativo é Look & Feel (Aparência e Sensação). Esse termo define a sensação que o usuário tem acerca de todo padrão estético de uma interface gráfica. Essa ideia é clara a medida em que as pessoas tendem a sentir sensações distintas ao utilizar aplicativos e, principalmente, sistemas operacionais diferentes. A sensação de usar o Windows, o MacOSX ou uma GUI (Graphic User Interface – Interface Gráfica de Usuário) para Linux / Unix, mesmo que usando o mesmo aplicativo, é diferente e até um pouco difícil de explicar tal diferença.
Legibilidade
A legibilidade é um conceito que envolve a compreensão simples dos elementos da tela. Lembre-se que, dentro da visão de comunicação, texto não são somente palavras escritas, mas sim qualquer símbolo que possua um significado, como um ícone, uma imagem ou um som. A legibilidade é o que torna o texto compreensível em seu contexto. Trocando em miúdos, trata-se de como os elementos podem ser facilmente interpretados pelo usuário.
A legibilidade vai desde as escolhas dos termos e palavras escolhidas à iconografia e tipografia. Até mesmo qual fonte será usada e sua espessura, se os ícones forem esqueumórficos ou minimalistas, se os espaçamentos vão ser maiores ou menores, tudo isso está envolvido no conceito de legibilidade.
É neste ponto do projeto que também se pensa em contrastes. Compreende-se contraste não apenas a diferença do preto no branco, mas em todas as reduções de nuances que facilitam a legibilidade. Quanto menos etapas de algo, mais contraste ela tem. Grande/Pequeno, Claro/Escuro, Cores Opostas, etc.
Usabilidade
Uma das principais preocupações do designer de interação é o quão fácil pode ser para o usuário chegar ao seu objetivo. A usabilidade está vinculada a legibilidade, mas vai além. Para isso, o designer precisa definir elementos que direcionem a atenção do usuário e que facilite a localização instintiva dos items interativos. É pensando na usabilidade que o profissional irá diagramar a tela e preparar protótipos de comportamento.
Dentro da usabilidade, o Designer de Interação deve fazer pelo menos um desses materiais:
Wireframe: Trata-se de um rascunho que define as funcionalidades do sistema. Pode ser um desenho à mão ou feito no computador, mas não possui compromisso com a fidelidade do projeto final. Sua importância é definir conceitos básicos enquanto está sendo desenvolvido o design final da interface.
Mockup: Imagens estáticas que representam as interfaces com a aparência mais próxima possível da final. O objetivo é demonstrar para equipe ou para o investidor como o projeto deverá ficar no final. O mockup também serve como base para criação do código referente a GUI do sistema.
Protótipo: Similar ao Mockup, porém simulando as interações, com ações de cliques e movimentos. Contudo, os dados geralmente são fictícios e funciona em ambiente controlado. Seu objetivo é permitir um melhor planejamento da interação, como também mostrar exemplos a investidores ou usuários teste.
É fazendo testes de usabilidade que o designer de interação vai determinar diversos fatores de espaçamentos, tamanhos de ícones e acessibilidade. Ainda, é neste momento que deve-se sair da zona de conforto e experimentar o leiaute em diferentes contextos.
Funcionalidade e Programação
Design é dar uma função à forma. Uma forma sem função, sem motivo de existir, não é design, mas arte. Diferente da arte, o design necessita de um função à quem este serve. Tudo o que se decide em um projeto, desde a sua elaboração estética até sua agilidade, existe para retornar um resultado, que é o objetivo da existência de um determinado sistema ou aplicativo.
Por isso, o designer de interação não deve apenas conhecer da parte gráfica e estética, mas também das idiossincrasias referente a área na qual está trabalhando. Neste caso, tecnologia e desenvolvimento.
Assim como um designer de moda precisa entender de costura e um designer de interiores de arquitetura, um designer de interação precisa saber como programar, ao menos o front-end, e como implementar o design que ele próprio elabora. Mesmo que ele não seja o responsável direto por aplicar esse código, é necessário que possua um conhecimento profundo de front-end e razoável quanto a back-end e banco de dados. Inclusive, muitas vezes, a responsabilidade de criação de novos componentes de interatividade é justamente do designer de interação.
Isso é necessário pois a Experiência do Usuário (UX- User eXperience), item chave do trabalho de um designer de interação, depende de todos os fatores tecnológicos que acompanham o desenvolvimento de um projeto (e até mesmo antes do usuário ter acesso ao sistema). Em determinado ponto, o designer precisa testar a confiabilidade dos dados, o tempo de resposta, praticidade de atualização, necessidade de fragmentação e, inclusive, o tempo de reparo de um eventual problema e a saúde do código. O relacionamento com o programador as vezes é esquecido, mas a experiência do programador e dos outros profissionais da empresa são tão importantes quanto a experiência do usuário, pois isso se refletirá em todo desempenho e qualidade do projeto.
Afim de compreender, conversar, sugerir e implementar, o designer de interação precisa ter conhecimentos específicos de diferentes linguagens de programação e marcação, além de suas tecnologias agregadas, tendo foco principalmente (mas não apenas) no front-end, como:
HTML;
CSS;
Javascript;
Lógica de programação;
Documentos DOM específicos de algumas plataformas;
Kits de plataformas (como Android Kit, iOS e UWP);
Linguagens Back-End como PHP, Java, Python, ASP ou outras que forem sendo necessárias aprender em seu cotidiano.
Ambiente Controlado vs Produção
Se por um lado o designer de interação deve possuir conhecimentos acerca do comportamento e da área de tecnologia, por outro, grande parte daqueles que se afirmam profissionais não estão trabalhando pensando em ambiente de produção.
Não é incomum ver os chamados “Designers de Dribble“, ou “Designers de Ambiente Controlado“. Basicamente, quando alguém busca no Google por UI Design vai encontrar centenas de interfaces impressionantes e incríveis, com cores vibrantes e lindas que nem a Apple conseguiria fazer tão perfeito. A verdade é que esses designs funcionam apenas em ambiente controlado, que não representam a usabilidade real e ainda frustram aqueles que estão começando.
Na próxima vez que buscar por inspiração (se for o seu caso), comece a refletir quando achar algo no Google, coisas como: E se o nome da cidade for maior do que o desse exemplo? E se o número nessa área superar o esperado? Será que o usuário vai compreender esse nome truncado? Qual o tempo hábil para fazer determinado efeito e se vale a pena? Qual o funcionamento em telas menores? Além disso, uma das coisas mais complexas do design de interfaces é criar padrões para formulários que sejam funcionais independente do tamanho de seus dados ou localização. O que é ainda mais complicado em sistemas densos como ERPs e outros específicos.
Pensando nessas respostas é que empresas que desenvolvem sistemas operacionais possuem suas próprias guidelines, que descrevem o comportamento de usabilidade em ambientes reais e traz fortes sugestões de padronização.
Claro que um profissional não precisa seguir à risca esses padrões, porém eles são fundamentais para a base do desenvolvimento de interfaces mobile e desktop pois não é bom que fujam demais do padrão do Sistema Operacional e o usuário sinta-se perdido. Entretanto sites e sistemas web possuem maior flexibilidade, ficando a cargo do Designer de Interação desenvolver o próprio Guidelines para os serviços e produtos relacionados com esse sistema.
Concluindo, Design é Projeto
Design não é desenho. Design não é ilustração. Design não é leiaute. Design é projeto. Então, diferente do que muitos pensam, alguns inclusive que se intitulam design, a área não é arte pela arte. O design serve à função e, como tal, o profissional que projeta algo precisa possuir conhecimento em diversas áreas relacionadas àquela específica vertente na qual está trabalhando. Logo, o designer de interação, além dos conhecimentos empíricos do design, como tipografia, colorimetria, filosofia, matemática (geometria), antropologia e comportamento, também precisa possuir a habilidades específicas em programação front-end e back-end (full-stack), história e negócios da área de Tecnologia da Informação.
Se você gostou deste post, curta e compartilhe ele nas mídias sociais. Caso não tenha gostado, tenha alguma dúvida ou queira fazer uma observação, deixe um comentário.
A Adobe lançou o preview do Experience Design. Trata-se de uma aplicação para que designers de interação possam criar leiautes e protótipos para webapps e aplicativos mobile. Atualmente a versão preview está disponível apenas para MacOSX, porém foi prometido uma versão para Windows até o final do ano (2016). No site da Adobe você poderá se cadastrar para pegar o preview para Windows assim que sair. Vale lembrar que você precisa ter uma conta válida da Adobe para poder usufruir do aplicativo.
Uma informação interessante é que o responsável pelo projeto é o brasileiro, Demian Borba, famoso no Brasil por trazer o Adobe e o FlashCamp, além de ter sido representante principal do BlackBerry há alguns anos. O Demian Borba sempre foi envolvido com design de interação, desde a época do desenvolvimento de RIAs com o Flex.
Outro dia andei discutindo com um rapaz pelo Twitter porque ele usa templates free, ou “piratas”, instala em um WordPress e assina como se ele fosse o designer (ou desenvolvedor) responsável. Isso se repete em todos os sites que ele fez, inclusive no seu próprio. Não fez nem questão de mudar uma cor ou uma forma. O problema é que essas pessoas revendem os sites para clientes. Alguns até compram, mas também somente para revender. A discussão começou por conta de uma notícia antiga, sobre o bispo que disse que, para manter seu blog, gasta mais de 107 mil reais por mês e ainda pediu ajuda dos seus seguidores para manter.
Você sabe quanto custa ser um designer? E quanto custa ser um programador? E pior! Sabe quantas pessoas fizeram faculdade (ou até autodidatas), estudaram muito, fizeram bons cursos e/ou leram bons livros? Pois é… mas para alguns, isso não tem valor.
Porém, esse rapaz não foi o primeiro a fazer esse tipo de trambicagem. Empresas estão se fortalecendo baseado nessa ideia absurda. Isso está acontecendo muito com gráficas rápidas, que resolvem vender sites para aumentar sua renda. O problema é que elas geralmente não fazem os sites, mas pegam templates grátis e trocam o “desenvolvido por”. E nem tomam o cuidado de disfarçar e no código, podemos até ver o nome dos templates.
Na imagem abaixo, vocês podem ver um detalhe de uma das conversas que eu tive com uma ex-aluna de mídias sociais que trabalhava em uma empresa que fazia esse tipo de “trabalho” (ocultei o nome e a foto porque ela não necessariamente é a responsável, mas uma funcionária).
Depois dessa conversa ela me bloqueou. Ela e seus colegas de trabalho. Porém, eu fui na página do Facebook deles e deixei uma mensagem “bonita”. Claro, que eles apagaram, aí eu deixava de novo. Mas na terceira vez fiz melhor. Resolvi colocar no Twitter dos clientes deles um link para o site original de onde eles pegavam os templates. Infelizmente, é comum que essas mesmas empresas que prestam esse serviço são quem tomam conta das mídias.
O Site de um rapaz, chamado Nilton Câmara (que foi a vítima), foi um dos maiores exemplos de cara de pau de uma prestadora de serviço da área de tecnologia. Realmente não mudaram nada, nem uma cor ou um símbolo, e ainda colocaram no canto: Website Design by Conhecimento Digital. Copyright 2012.
Afinal, qual o problema disso?
Primeiro lugar, vamos a questão ética. Você gostaria de comprar um iPhone 6 da Samsung? Eu sei que a pergunta parece absurda, mas é isso o que acontece. Simplesmente, ao invés de fazer um produto novo, está sendo terceirizado um serviço oferecido. Se você soubesse que poderia ter algo totalmente genérico a um preço muito mais baixo, ou até de graça, você pagaria por essa mão de obra inútil?
Ainda na questão ética, assinar um projeto de outra pessoa é certo? Imagina se eu assinasse um site feito por outra pessoa, um quadro feito por outro artista. Isso não seria correto e traria grandes problemas para o comprador, que acha que está adquirindo um produto original, quando na verdade, é genérico.
Segundo, os problemas legais. Terceirizar serviço (quarteirizar) oferecido é ilegal! Eu mesmo já processei uma empresa por isso, e ganhei, sem discussão. Não se pode oferecer um serviço e pagar outra empresa para fazer. Tanto que, no meu caso, resolveram mudar o nome e o tipo de serviço para consultoria. Além disso, isso fere os direitos de propriedade intelectual, que é irrevogável! Isso mesmo, não pode ser repassado para ninguém. A propriedade intelectual garante a autoria de projeto, o que é diferente dos direitos comerciais. O autor pode abrir mãos de seus direitos comerciais, mas não pode se abdicar do intelectual. Roubar a autoria do projeto de outro também é ilegal.
O que isso traz de ruim para o cliente e para a prestadora de serviços?
A contratante pode se sentir lesada, pois comprou, muitas vezes, um projeto original. Além disso, o leiaute de uma empresa, instituição ou órgão, deve seguir uma identidade corporativa que é definida em todos os projetos gráficos. O SEO desses templates geralmente não são dos melhores e a semelhança desse site com outros templates genéricos também não são bem trabalhados e podem dificultar o encontro do site pelo Google.
A prestadora de serviço, além do fato da ilegalidade, também está perdendo experiência e estabilidade no mercado. Tornar-se-á pouco confiável.
Mas como deve ser feito então?
Existem 3 formas corretas de trabalhar corretamente com isso:
Criar um Layout e Template Original;
Modificar um Template Free existente, dando devida referência ao template original e deixando claro ao cliente que é uma alteração;
Usar um template free ou pago, mas dar a devida referência ao autor e não ter nenhum lucro direto com isso.
O site da PortilloDesign usa um CMS próprio, criado por nós, que prentendemos abrir o código futuramente. Porém, também trabalhamos com outros CMSs em alguns clientes, onde todos os sites são montados primeiro no Photoshop e depois implementado no código referente ao CMS escolhido. Cada template é único e pensado para a necessidade e estética de cada cliente. Os layouts não aprovados são jogados na lixeira para que não sejam reaproveitados.
O blog The Pink Geeks usou um template modificado e as garotas colocaram no rodapé a assinatura junto com os criadores do template original, por exemplo. O Mesmo acontece com o site do E-Farsas, onde ele coloca: “Tema modificado do FabThemes.com”
Não tem problema nenhum em usar um template free, só deixe no rodapé o autor original e não cobre por algo autêntico, somente pela modificação que fizer. Não mude a autoria do trabalho, isso não vai desmerecer de forma algum o seu conteúdo. Todas as pessoas confiáveis precisam ser transparentes.
Concluindo
Não existe um real monitoramento, registro, fiscalização ou cadastro de empresas e profissionais de TI. Da mesma forma, não existe uma fiscalização sobre o que eles fazem. Existem muitas leis sendo criadas para defender pessoas que aparecem peladas na internet, ou um ou outro xingamento preconceituoso. Mas a parte de negócios continua sendo terra de ninguém. Pessoas disfarçadas de profissionais continuam tripudiando empresários e blogueiros que querem melhorar o seu trabalho.
Vale lembrar de que de forma alguma você pode pegar um template pronto e simplesmente revender, ou modificar e revender, se você foi contratado para fazer o site. Se a ideia é modificar algo pronto, então deixe isso claro e revelado como o serviço. Lembre-se que terceirização de serviço oferecido é ilegal e anti-ético.
Existe até uma ferramenta especializada em verificar se o site usa um template comum ou não, para WordPress: http://www.wpthemedetector.com
Mas o que vocês acham disso? Tem uma opinião diferente sobre a ética nesse caso? Deixe sua opinião.
Você conhece o Adobe Capture CC? É um aplicativo mobile criado pela a Adobe que permite capturar informações do mundo real para serem usadas dentro de sua biblioteca da Adobe.
Ele é a união do Adobe Color CC (antigo Kuler), Shapes, Brushes e Hue em um único aplicativo, porém com melhorias consideráveis.
Através do Capture CC você pode criar novos pincéis, vetorizar desenhos reais, criar paletas de cores e filtros para fotos. Os objetos gerados são compartilhado a partir da biblioteca do Adobe Creative Cloud e pode ser utilizado em programas como Photoshop, Illustrator, InDesign, Premiere e outros, além dos apps móveis.
O Adobe Capture CC está disponível para iOS e Android para todos que possuem a suite Adobe profissional ou estudante.
Quem nunca imprimiu uma cor e apareceu outra completamente diferente? Cada dispositivo possui um modo diferente de interpretar as cores. Este artigo foi feito para explicar como funcionam as cores e como garantir uma melhor fidelidade entre tela e impressora.
Existem várias formas no mundo de se gerar cores. É possível misturar tinta, luz ou simplesmente causar uma ilusão de ótica por aproximação. Quimicamente, aprendemos, ainda no pré-escolar, o conceito de cores primárias, onde misturamos o azul, vermelho e amarelo para ter as cores secundárias e terciárias. Todavia, o conceito de cores primárias mudam de acordo com o meio em que a cor vai ser exibida. Para compreender quais são esses modos de cor, precisamos primeiro entender como funcionam os principais dispositivos usados por designers gráficos, para geração de cores, os monitores e as impressoras.
Monitores
A grande maioria dos monitores e displays LCDs usados hoje em dia ainda trabalham da mesma forma, mas com tecnologias diferentes que foram sendo implementadas conforme a evolução tecnológica e barateamento dos custo de produção. Basicamente, tratam-se de filamentos de metal acomodados em uma grade matricial. Cada campo dessa matriz possui 3 partículas de cristais líquido, que ao serem eletricamente estimuladas adquirem a característica de absorção de uma determinada área do espectro de luz e se solidificam, deixando vazar o restante. Cada uma das 3 partículas é responsável por deixar passar um pedaço do espectro, baseado no que chamamos de cores primárias da luz, que são vermelho, verde e azul (RGB). Aumentando ou diminuindo a solidificação, mais luz ou menos luz é absorvida. Porém, o cristal líquido não emite luz própria e, por isso, precisa ser retro-iluminado por uma luz branca, que vai ser filtrada por pelo LCD.
Lembrando que essa é um explicação bem simplificada e o que diferencia na qualidade das cores, hoje em dia, é o tipo de retroiluminação. Aí se é OLED, AMOLED, IPS, é uma outra história.
Impressoras
As impressoras, diferente dos monitores, jogam tinta (ou produzem tinta a partir de pigmentos) em pontos muito, muito próximos, mas não chegam a misturar os pigmentos (a não ser que ele sobreponha uma tinta na outra, mas isso não é bem misturar). Esses pontos, chamados de retículas, são fixados no papel (ou no material escolhido), que de tão próximos faz parecer que eles formam outra cor. Isso funciona porque a luz do ambiente, quando bate nesse pigmento, absorve um intervalo do espectro de luz e reflete outro. Esse intervalo chega aos olhos e são interpretados. As cores básicas para impressão são ciano, magenta e amarelo, que, por justamente ser reflexão e não emissão, são as cores secundárias do RGB (e vice-versa). Todavia, como os tons não emitem feixes, mas sim os refletem, eles acabam sendo mais fracos que as cores dos monitores, dependendo da quantidade e tom de luz do ambiente para prover uma boa leitura. Quando colocamos pontos cianos, magentas e amarelos próximos, temos uma sensação amarronzada, meio acinzentado escuro e, por isso, é necessário um complemento de pigmento preto, tornando o conhecido CMYK (onde K, outrora chamado de Bk, é uma letra usada para se diferenciar do Blue, representa o blacK).
Concluímos dessa forma que os monitores trabalham com modelos de cores aditivos (geralmente o RGB), por adicionar luz, e o impresso com modelos de cores subtrativos (geralmente o CMYK), por retirar luz.
Deixar RGB para monitor e CMYK para impressão é suficiente para fidelidade das cores?
A resposta é não. Isso porque você deve levar em consideração diversos outros fatores. Cada aparelho é de uma marca diferente e possui uma tecnologia diferente e ainda é calibrado de uma forma diferente. Essa forma diferente de calibração acaba causando diferenças que muitas vezes comprometem o resultado do trabalho.
O designer deve, em primeiro lugar, calibrar o sue monitor. Essa calibração é feita de forma pessoal, e depende do ambiente em que você trabalha e da capacidade de seus olhos de interpretar as cores. Para fazer a calibração, geralmente usa-se um aplicativo próprio do sistema operacional. Essa calibração gera um arquivo icc, ou icm, que é conhecido como Perfil de Cores.
Gamut de Cores
Cada aparelho possui um perfil de cores padrão. Se você abrir agora o gerenciador de cores do sistema operacional, poderá ver alguns perfis de cores configurados. Isso é necessário porque cada equipamento tem uma quantidade diferente de cores que pode gerar / interpretar, dependendo de sua tecnologia. Essa quantidade de cores é representada em um mapa de cores o qual chamamos de GAMUT. Que não somente são diferentes entre si por quantidade, mas também por capacidade de exibição de determinadas cores. Por exemplo, o gamut CMYK, por padrão, é menor do que o RGB, mas possui uma quantidade muito maior de variações de amarelo do que o modelo aditivo. O que usamos para atingir esses tons que estão fora do gamut do CMYK, e até do RGB, na impressão, é a adição de Cores Especiais, que são tintas ou pigmentos fabricados com uma cor específica e, geralmente, somados ao CMYK.
Porém, essa diferença de cores gera uma problemática muito grave que é a diferença absurda de cores entre dispositivos diferentes, mesmo que seja do mesmo modelo. Para web, por exemplo, quando queremos que todos os monitores exibam as cores mais próximas possíveis do planejado, utilizamos as Cores Seguras, que, por conta dessa necessidade, acaba por diminuindo ainda mais o gamut de cores utilizáveis.
Fidelidade de Cores
Para garantirmos uma melhor fidelidade de cores na impressão, precisamos configurar o nosso dispositivo de produção para que tenha o mesmo perfil de cores que o dispositivo de impressão. Ou seja, precisamos configurar o gerenciamento de cores de nosso software de edição gráfica com o perfil de cores da impressora. Obviamente que precisamos saber, enquanto estamos produzindo o material finalizado, em qual gráfica será impresso. Para conseguir esse arquivo, o melhor é você ligar para a gráfica
– Gráfica Enrolada, bom dia! Em que posso ajudar?
– Olá, eu gostaria de saber qual o procedimento para impressão e se vocês podem me mandar o perfil de cores.
– Ah, um momento que vou perguntar para o pessoal de produção.
(música de Beethoven)
– Senhor, é só enviar em CMYK mesmo.
– Não, não, amiga, estou querendo saber qual o perfil icc, queria que vocês me mandassem para eu poder trabalhar melhor nas cores.
– Um minuto, Senhor.
(música de Beethoven)
– É isso, mesmo, CMYK.
– Tá OK, obrigado.
Se isso acontecer com você, troque de gráfica. Se por acaso for uma gráfica parceira, vá até lá e explique o que é um perfil de cores. Muitas vezes, esses perfis de cores são geradas durante a calibração da impressora e podem mudar de calibração para calibração e até com a marca da tinta/pigmento que a gráfica utilizar.
Todavia, pode acontecer de gráficas seguirem padrões. Nas configurações dos aplicativos Adobe, vocês poderão ver padrões de perfis de cores CMYK, como FOGRA 39, US WebCoated, dentre outros. Se a gráfica mandar o perfil de cores, vocês devem carregar o perfil de cores CMYK em seus softwares gráficos para finalizar as imagens, se elas indicarem um padrão, basta selecionar qual padrão ela pediu. Atenção que vocês devem também configurar também o Cinza, para garantir a fidelidade de preto, de acordo com as indicações da gráfica. Lembre-se de também atribuir o perfil de cor RGB de seu monitor (ou o que você calibrou), caso esteja trabalhando com um impresso.
Perfis de Cor Incorporados
Arquivos de imagem possuem perfis de cores incorporados, por padrão. Então, quando forem utilizar um software gráfico de impressão, vocês devem incorporar o perfil que está configurado no aplicativo ao arquivo. Quando você incorporar (ou converter) para o perfil de impressão, na mesma hora o software irá reconfigurar a calibração de cores e se adaptará ao do perfil, mudando as cores da imagem, tornando-a mais próxima possível ao resultado impresso.
A imagem deve ser finalizada já com o perfil incorporado, fazendo as adaptações necessárias nas cores e luminosidade.
Incorporações de Perfis na Exportação do InDesign
Uma vez com seu arquivo finalizado e todos os perfis de cores configurados nas imagens que serão utilizadas pelo InDesign, a exportação para PDF (que é o mais comum) também deve se atentar a incorporação do perfil de cores. Ao exportar, na guia Saída, deve-se marcar para converter em destino. Essa opção não é 100% necessária, se você configurou corretamente antes o InDesign enquanto trabalhava, e os arquivos de imagem já tem incorporados os perfis, mas é uma segurança a mais que tudo vá correr bem. O destino escolhido, obviamente, deve ser o perfil CMYK que foi enviado / recomendado pela gráfica. Por padrão, o InDesign já deixa marcado para incluir o perfil, o que, obviamente, é o mais recomendado de se fazer.
Concluindo
Se você busca fidelidade nas cores de impressão, fique atento a manter sempre o seu monitor calibrado e bem configurado. Se usa Windows, lembre-se que o monitor deve ser instalado ou reconhecido, nada de Monitor Plug And Play. Faça regularmente calibragem no seu ambiente de trabalho e sempre incorpore os perfis de cor enviados / recomendados pela gráfica em seu material impresso.
Lembre-se que a cor é essencial para um projeto gráfico, e para atingir o resultado esperado, você precisa planejar e reconhecer muito bem a cor.
O Adobe Character Animator é uma nova Ferramenta da Adobe que tem por objetivo facilitar a criação de animação de personagens 2D. Ela funciona tanto como extensão ao AfterEffects quanto em um aplicativo separado.
Para criar as animações, é utilizado um sistema de reconhecimento facial que detecta os detalhes do rosto e os converte em pontos de controle. Esses pontos são importados para uma personagem feito a partir de camadas do Photoshop ou do Illustrator e, com um conjunto de informações pré-estabelecidas pelo animador, gera o movimento na imagem. A voz também é importante para essa animação, pois o sistema de reconhcimento de som detecta as vogais que podem ser relativadas a diferentes aberturas da boa da personagem.
Algumas pessoas que são inscritas no programa de pre-release e beta receberam o convite para testar as builds de pré-lançamento do Projeto Animal (codenome do projeto). Nós recebemos esse convite e a primeira coisa que fizemos foi verificar as permissões do que podemos divulgar.
Como o projeto foi divulgado oficialmente no dia 8 de Abril de 2015, já podemos divulgar bastantes coisas, inclusive tutoriais, vídeos explicativos, exemplos e os resultados finalizados.
Então se quer saber dicas, tutoriais, ou se simplemente tiver alguma pergunta, deixe aqui um comentário que faremos mais vídeos e fotos explicativos sobre o Projeto Animal, da Adobe.
