20
BA online – Centro Universitário Belas Artes de São Paulo

BA online – Centro Universitário Belas Artes de São Paulo › baonline › downloads › ebook.pdf · Módulo 1 – Aspectos gerais do Design Gráfico aplicado aos produtos digitais

  • Upload
    others

  • View
    7

  • Download
    0

Embed Size (px)

Citation preview

Page 1: BA online – Centro Universitário Belas Artes de São Paulo › baonline › downloads › ebook.pdf · Módulo 1 – Aspectos gerais do Design Gráfico aplicado aos produtos digitais

BA online – Centro Universitário Belas Artes de São Paulo

Page 2: BA online – Centro Universitário Belas Artes de São Paulo › baonline › downloads › ebook.pdf · Módulo 1 – Aspectos gerais do Design Gráfico aplicado aos produtos digitais

2

BA online – Centro Universitário Belas Artes de São Paulo

Design e Gestão de Web, Mídias Digitais e Móveis

PublicaçãoEste e-book é uma publicação da

Rua Dr. Álvaro Alvim, nº 90Vila Mariana – SPFone: (11) 5576-7300

É proibida a venda e a reprodução deste material sem autorização prévia do Centro Universitário Belas Artes de São Paulo.

Expediente

Dr. Paulo Antonio Gomes CardimReitor

Prof. Dr. Francisco Carlos Tadeu Starke RodriguesPró-Reitor Administrativo

Prof. Dr. Sidney Ferreira LeitePró-Reitor Acadêmico

Dra. Josiane Maria de Freitas TonelottoSuperintendente Acadêmica

Departamento BA online

Profa. Ma. Leila Rabello de OliveiraCoordenação

Lucas de Mattos MillanClaudio Villa da Costa FilhoDesign Instrucional

Gustavo Nogueira PereiraJoão Paulo Tenório da Silva Web Design

Gabriel KwakMarina de Mello FontanelliRevisão de Texto

Beatriz Melhorine BasílioHanna Carolina Brino BarrettoAnalise Educacional

Page 3: BA online – Centro Universitário Belas Artes de São Paulo › baonline › downloads › ebook.pdf · Módulo 1 – Aspectos gerais do Design Gráfico aplicado aos produtos digitais

3

BA online – Centro Universitário Belas Artes de São Paulo

Design e Gestão de Web, Mídias Digitais e Móveis

Sumário

Para início de conversa ......................................................... 5

Módulo1 - Aspectos gerais do Design Gráfico aplicado aos produtos digitais.................................................................. 6

Page 4: BA online – Centro Universitário Belas Artes de São Paulo › baonline › downloads › ebook.pdf · Módulo 1 – Aspectos gerais do Design Gráfico aplicado aos produtos digitais

4

BA online – Centro Universitário Belas Artes de São Paulo

Professora-autoraMa. Denise de Paiva Tangerino

Meu sonho sempre foi mudar o mundo, trazendo alegria e leveza por onde eu passas-se, e ser professora era apenas consequência desse meu sonho. Sou graduada e pós-gradua-

da em Design Gráfico, com foco em design editorial. Já no mestrado, parti para os estudos da Comunicação e das Práticas do Consumo, na ESPM, visando compreender a juventude e suas rotas de consumo, individuais e coletivas. Em 2011, comecei minha carreira de docente universitária e em 2014 entrei para o time Belas Artes (afinal, deve ser muito triste não ser Belas Artes). Paralelo a isso, mantenho pequenas produções de audiovisual, como gosto, e minha profunda formação em séries e Netflix sempre ativa.

Bon appétit!

Design e Gestão de Web, Mídias Digitais e Móveis

Page 5: BA online – Centro Universitário Belas Artes de São Paulo › baonline › downloads › ebook.pdf · Módulo 1 – Aspectos gerais do Design Gráfico aplicado aos produtos digitais

5

BA online – Centro Universitário Belas Artes de São Paulo

Para início de conversa

Caro aluno, é com satisfação que lhe desejo boas-vindas ao estudo da disciplina de Design e Gestão de Web: Mídias Digitais e Móveis. Você é meu convidado especial para, ao longo de nossa jorna-da, compreender os aspectos que caracterizam o estudo do design gráfico aplicado à web, os pontos técnicos para a criação de algumas plataformas on-line e, principalmente, as formas mais usuais e práti-cas de gestão desses produtos digitais, essenciais para a formação de qualidade de futuros profissionais.

Para tanto, ao longo de oito Módulos estruturados de maneira a facilitar a absorção de seu conteúdo, daremos importância a obje-tivos cruciais relacionados ao ambiente educacional, como fomentar uma visão crítica e estratégica ante os meios de comunicação da web, desenvolver um espírito criativo, dotá-lo de ferramentas básicas e fundamentais para o desenvolvimento de peças, alinhadas ao plane-jamento estratégico, e ensinar a gestão desses meios como processos fundamentais para a ativação de campanhas e retenção de público.

Do mesmo modo, abordaremos temas como: as formas bási-cas do design (ponto, linha e forma) e suas aplicações relacionais; o uso das cores em diversos suportes (impressos e digitais); morfologia e uso coerente e eficiente das diversas tipografias existentes no merca-do; o uso de imagens e as possibilidades de edição das fotografias; criação de marca e desenvolvimento do MIV (Manual de Identidade Visual); aspectos gerais de criação para web (usabilidade e leiturabili-dade); aplicação dos aspectos imagéticos e textuais para a concepção e aplicação em diversos suportes virtuais, especialmente sites e redes sociais; e, por último, a gestão de todos esses aspectos. Tudo isso de maneira leve e dialógica, com elementos que o ajudarão a conhecer o contexto da disciplina, para que você se sinta motivado a atingir, com sucesso, os objetivos propostos em nossos Módulos e consiga, deste modo, êxito em suas carreiras profissional e estudantil.

Design e Gestão de Web, Mídias Digitais e Móveis

Page 6: BA online – Centro Universitário Belas Artes de São Paulo › baonline › downloads › ebook.pdf · Módulo 1 – Aspectos gerais do Design Gráfico aplicado aos produtos digitais

Aspectos gerais do Design Gráfico aplicado aos produtos

digitais

MÓDULO 1

Page 7: BA online – Centro Universitário Belas Artes de São Paulo › baonline › downloads › ebook.pdf · Módulo 1 – Aspectos gerais do Design Gráfico aplicado aos produtos digitais

7

BA online – Centro Universitário Belas Artes de São Paulo

Módulo 1 – Aspectos gerais do Design Gráfico aplicado aos produtos digitais

Objetivos

Ao término dos estudos propostos neste Módulo, você de-

verá estar apto a:

Compreender a importância dos aspectos específicos do Design Gráfico aplicado a produtos digitais;

aprender sistemas tonais utilizados para diferentes su-portes impressos e digitais, com o objetivo de aplicar, com coerência, cores e texturas em concordância com os projetos solicitados;

utilizar as ferramentas já disponíveis como instrumento de facilitação no momento da criação de um produto gráfico digital;

aplicar o sistema tonal na criação de layouts para web, com o objetivo de alcançar os aspectos solicitados no briefing.

Seções

1. Introdução ao conceito de design gráfico

2. Treinamento básico sobre cores

Page 8: BA online – Centro Universitário Belas Artes de São Paulo › baonline › downloads › ebook.pdf · Módulo 1 – Aspectos gerais do Design Gráfico aplicado aos produtos digitais

8

BA online – Centro Universitário Belas Artes de São Paulo

Módulo 1 – Aspectos gerais do Design Gráfico aplicado aos produtos digitais

Introdução

Caro aluno,

Seja bem-vindo ao primeiro Módulo de nossa disciplina Design e Gestão de Web: Mídias Digitais e Móveis. Nele, avaliaremos os obje-tivos propostos, base de conteúdo de suas cinco seções. Elas servirão de apoio para o seu aprendizado e para a construção do seu processo cognitivo.

Com participação e reflexão, você aprenderá, de maneira agradável e conveniente, a compreender a importância dos aspectos específicos do design gráfico aplicado a produtos digitais.

Sendo assim, convido-o a tomar parte desta aventura para que possamos ampliar nossos conhecimentos.

Bons estudos!

Page 9: BA online – Centro Universitário Belas Artes de São Paulo › baonline › downloads › ebook.pdf · Módulo 1 – Aspectos gerais do Design Gráfico aplicado aos produtos digitais

9

BA online – Centro Universitário Belas Artes de São Paulo

Introdução ao conceito de design gráfico

Seção 1

Módulo 1 – Aspectos gerais do Design Gráfico aplicado aos produtos digitais

Caro aluno, bem-vindo à nossa primeira aventura: compreen-der o que é design gráfico.

Ao consultarmos um dicionário, passo mais simples para se compreender o que significa uma determinada pala-vra, encontramos que “design” provém do inglês e está atrela-da aos seguintes conceitos: o ato projetual de criar algo; o desígnio para criar algo; ou, ainda, a concepção física e funcional de um produ-to.

Talvez esses termos e expressões ainda sejam difíceis de serem compreendidos, então facilitarei dizendo:

Vamos destrinchar mais um pouco!

Forma é o formato físico ou digital que um produto (no nosso caso trabalharemos com entregas virtuais, como website, blogs, vídeos, redes sociais, entre outros) vai receber, com o objetivo de alcançar uma função (entreter, informar, representar uma empresa ou pessoa, etc.).

A partir desse conceito, podemos pensar que:

Intrínseco ao conceito de design, está o de usuário. E, de certa forma, onde ele e um produto estão, há também um objetivo, o qual costuma ser comercial. Sendo assim, o design serve para comunicar um conceito, definido previamente pelo cliente, com o objetivo de comunicá-lo ao usuário.

Design é a ação de projetar algo (site, marca, móveis, roupas, espaços, etc.), que tenha como pilar de criação dois aspectos fundamentais, a forma e a função.

Uma cadeira tem uma forma física cujo objetivo promove o conforto na hora de sentar, que é sua função. Ou, ainda, um cadeirão de bebê tem os pés altos e uma mesa acoplada adequada à criança, com a função de promover um espaço pertinente tanto para a alimenta-ção infantil quanto para que o responsável por dar a comida fique confortável nesse momento.

Portanto: forma + função = design

Exemplificando

Page 10: BA online – Centro Universitário Belas Artes de São Paulo › baonline › downloads › ebook.pdf · Módulo 1 – Aspectos gerais do Design Gráfico aplicado aos produtos digitais

10

BA online – Centro Universitário Belas Artes de São Paulo

Ufa! Parece complicado, mas é bem simples: criamos um produto comunicacional para usuários, solicitado no briefing por um cliente e seguindo objetivos bem específicos. No entanto, lembre-se: muitas vezes ele não corresponde ao nosso gosto estético pessoal.

Por último, podemos pensar o design como um produto solici-tado por um profissional liberal ou empresa, que tem custos e envolve pessoas que dependem dele para viver. Nas últimas décadas, muito tem se falado sobre gestão de projeto com o objetivo de sistemati-zar cada etapa do processo criativo e poder controlar questões, como tempo gasto em cada parte do processo, custo de cada ação, gastos que são feitos na criação e na produção, valor de homem-hora, quan-to cobrar do cliente, entre outros. Todos os aspectos são importantes, mas, particularmente, eu gosto de focar na seguinte máxima: todo projeto tem que ter um momento inicial e um prazo de entrega final, senão o cliente não sabe quando pagar pelo trabalho e, pior, quando parar de solicitar mais. Deixe muito claro que cada solicitação tem um custo e um objetivo e, assim, requer um novo trabalho.

De forma imatura, muitas vezes queremos agradar o cliente e acabamos trabalhando muito mais do que o solicitado a princípio, o que nos gera muita mão de obra e imensa frustração. Após a entrega, temos o que chamamos de atualização, que grosso modo é o cotidia-no e a gestão do produto comunicacional. Na prática do dia a dia: o cliente me encomendou um site (ponto de partida), o qual entreguei como solicitado (ponto final do seu projeto), e o cliente me pediu para postar coisas nele (novo projeto, logo, novo valor).

Design e a caixa de ferramentas

Ao compreender o que é design e quais são os principais focos da área, podemos entrar nos aspectos estéticos os quais, para facilitar nossa disciplina on-line, chamarei de caixa de ferramentas. Como toda boa e velha caixa, as ferramentas têm usos específicos, mas muitas vezes acabamos usando mais de uma delas para realizar uma mesma ação. Por exemplo, para colocarmos um quadro na parede precisamos de uma furadeira, obviamente para perfurá-la, contudo, muitas vezes também utilizamos o martelo para encaixar a bucha no buraco perfu-rado. Na área estética temos algumas ferramentas, que podem e devem ser combinadas para chegar a um resultado coerente ao brie-fing solicitado. São elas:

Cor: é o mundo cromático que nos rodeia, aquilo que identi-ficamos como matiz (o nome da cor).

Ponto: a unidade mais simples e irredutivelmente mínima de comunicação visual.

Forma: uma linha fechada determina uma forma. As formas mais básicas da comunicação visual são o quadrado (pouco encontrado na natureza), o círculo e o triângulo.

Linha: um ponto em movimento ou pontos bem próximos entre si dão a sensação de continuidade, estabelecendo uma direção, e assim formam uma linha.

Módulo 1 – Aspectos gerais do Design Gráfico aplicado aos produtos digitais

Page 11: BA online – Centro Universitário Belas Artes de São Paulo › baonline › downloads › ebook.pdf · Módulo 1 – Aspectos gerais do Design Gráfico aplicado aos produtos digitais

11

BA online – Centro Universitário Belas Artes de São Paulo

Textura: é o elemento visual que serve de substituto para as qualidades de outro sentido, como o tato e a audição.

Proporção: nesse caso, é a relação entre dois objetos, que é dada especialmente em função da escala dos objetos.

Direção: existem três direções básicas que conduzem nossos olhares: horizontal e vertical; a diagonal; e a curva.

Movimento: é a sensação real ou virtual de que um corpo não está estático, mas em deslocamento.

Tom: está relacionado ao uso da luz para identificar a grada-ção da cor.

Dimensão: também é um conceito relacional, que se realiza no tamanho de um objeto em vinculação a outro.

Segundo Donis A. Dondis (p. 85, 1997), estudiosa da área e reconhecida pelo seu método de leitura visual, todas essas ferramen-tas nos ajudam a traduzir e analisar mensagens visuais em três níveis:

Representacional

Aquilo que vemos e identificamos com base no meio ambiente e na experiência.

Abstrato

A qualidade cinestésica de um fato visual reduzido a seus componentes visuais básicos e elementares, enfatizando os meios mais diretos, emocionais e mesmo primitivos da criação de mensagens.

Simbólico

O vasto universo de sistemas de símbolos codificados que o homem criou arbitrariamente e ao qual atribuiu significados.

O universo ao nosso redor é repleto de significados, que são diretos ou indiretos, subjetivos ou objetivos. Entender quais as retóri-cas de criação de imagem nos ajuda a analisar com mais profundida-de as imagens de nosso entorno e, assim, dominar com segurança os produtos que criamos.

Módulo 1 – Aspectos gerais do Design Gráfico aplicado aos produtos digitais

Page 12: BA online – Centro Universitário Belas Artes de São Paulo › baonline › downloads › ebook.pdf · Módulo 1 – Aspectos gerais do Design Gráfico aplicado aos produtos digitais

12

BA online – Centro Universitário Belas Artes de São Paulo

O que é criar uma marca, por exemplo? Nada mais do que traduzir simbolicamente todos os valores de um profissional ou de uma empre-sa. E os desenhos animados, como Masha e o Urso? A representação visual da ideia de um urso amistoso que pode ser amigo de uma garota. E a trilha sonora de um vídeo? Simples, o conceito sonoro de sentimentos expresso de forma abstrata, como uma batida mais forte q u e demonstre tensão ou uma flauta para romance. Vamos fazer uma brincadeira associando sons a marcas?

Todas essas informações são bastante pertinentes, mas como utilizamos na web? Por que temos que saber tudo isso?

A resposta é bastante simples, acessamos nossa caixa de ferra-menta básica com a finalidade de conseguirmos transmitir um concei-to a qualquer produto comunicacional que quisermos. Assim, com ela estamos capacitados a estabelecer uma interlocução entre três tipolo-gias: representacional, abstrata e simbólica.

Que tal começarmos a observar o mundo ao nosso redor? Vamos fazer alguns exercícios de compreensão?

Você já pensou que design pode ir além do visual? Que tal pensarmos em design sonoro? Qual o som emitido por um celular da Motorola ao ser ligado? E aquele de um compu-tador, com o sistema operacional Windows, ao ser iniciado? Podemos definir design sonoro como a arte de manipular ondas sonoras e suas frequências, de transmitir sentimentos e sensações por meio de sonoridades diferentes e efeitos de som. Não podemos esquecer das trilhas sonoras que enriquecem e que dão uma sensação de realidade às cenas de um filme ou vídeo. Atualmente, os youtubers abusam desse recurso para tornar os vídeos mais instigantes e cati-var o público. Quando preciso de trilha branca (com direitos autorais liberados), gosto de utilizar um site no qual consigo fazer download gratuitamente de bons sons.

Na prática

Uma tendência atual do design é a referência simbólica dos pictogramas, cada vez mais utilizada como síntese visual de uma determinada informação.

Como assim? Quando vamos ao banheiro de um shopping, por exemplo, encontramos pictogramas que represen-tam os sexos feminino e masculino. Da mesma forma, os aeroportos estão carregados de pictogramas para indicar restaurantes, embarque, check-in, etc. Existe um site muito utilizado pelos designers por disponibilizar gratuitamente milhares de pictogramas gratuitos em vários formatos: ai, jpeg, tiff, entre outros. Faça bom uso!

Multimídia

Módulo 1 – Aspectos gerais do Design Gráfico aplicado aos produtos digitais

Page 13: BA online – Centro Universitário Belas Artes de São Paulo › baonline › downloads › ebook.pdf · Módulo 1 – Aspectos gerais do Design Gráfico aplicado aos produtos digitais

13

BA online – Centro Universitário Belas Artes de São Paulo

Módulo 1 – Aspectos gerais do Design Gráfico aplicado aos produtos digitais

Resp

osta

cor

reta

1

– B

/ 2 –

A /

3 –

C

Identifique a tipologia da linguagem visual utilizada nas imagens

1. 2.

3.

A. ( ) Abstrato

B. ( ) Simbólico

C. ( ) Representacional

Agora é a sua vez!

Page 14: BA online – Centro Universitário Belas Artes de São Paulo › baonline › downloads › ebook.pdf · Módulo 1 – Aspectos gerais do Design Gráfico aplicado aos produtos digitais

14

BA online – Centro Universitário Belas Artes de São Paulo

Treinamento básico sobre cores

Seção 2

De forma geral, o ponto inicial para o estudo das cores é a compreensão de que a conceituação que damos às cores são neces-sariamente três elementos básicos: a luz, um objeto e um observador. A luz, incidindo sobre um objeto, terá suas propriedades físicas alte-radas e, ao chegar aos olhos do observador, será codificada e surgirá a sensação visual chamada de cor. Vale sempre ressaltar que a luz é formada por ondas eletromagnéticas, compreendidas aproximada-mente entre 400 e 700nm, e os seres humanos só conseguem captar as cores que estão nesse espectro de luz.

Uma das etapas mais importantes na hora de trabalhar com criação, seja de produtos impressos ou virtuais, é conseguir definir as cores do projeto e saber como e onde aplicá-las. Para tal atividade, torna-se extremamente importante compreender os sistemas tonais e quando não devemos usar cada um deles. Muitas vezes, em sala de aula, percebemos que o aluno fica perdido na hora de distinguir entre RGB e CMYK, sobre como usar o sistema de cor RGB ou, ainda, sobre por que não usar o CMYK. Indo um pouco mais fundo na questão: o que é grayscale? Você já se perguntou a diferença entre os três? Não? Então, vamos lá!

Conheça os sistemas de cores:

RGB

A sigla RGB é a abreviatura do sistema de síntese aditiva, cores-luz, formadas por Red, Green e Blue (vermelho, verde e azul). Com uma combinação apropriada de superposição das ondas verde, vermelha e violeta, obteremos a luz branca. O principal propósito do RGB é reproduzir as cores nos meios eletrônicos, jamais para impressão. Nesse sistema, ao trabalhar a combinação dessas matrizes tonais em nossos computadores, podemos formar cerca de 16 milhões de diferentes combi-nações entre tons, saturação e brilhos, nos dando uma gama gigantesca de possibilidades de criação.

A primeira coisa que temos que levantar para entender os sistemas tonais é que no universo inteiro todas as cores que vemos são forma-das apenas de duas formas: por luz (cor-luz) ou por pigmento. Como o próprio nome diz, a cor-luz é formada apenas por irradiação de raios luminosos e funciona na reprodução de dispositivos que obrigatoria-mente necessitam de energia luminosa para funcionar, como: moni-tores de TV, computador, retroprojetores, celulares, entre outros. Já a cor-pigmento é formada por materialidade, por tintas, e funciona em suportes impressos.

Módulo 1 – Aspectos gerais do Design Gráfico aplicado aos produtos digitaisMódulo 1 – Aspectos gerais do Design Gráfico aplicado aos produtos digitais

Page 15: BA online – Centro Universitário Belas Artes de São Paulo › baonline › downloads › ebook.pdf · Módulo 1 – Aspectos gerais do Design Gráfico aplicado aos produtos digitais

15

BA online – Centro Universitário Belas Artes de São Paulo

CMYK

A sigla CMYK é a abreviatura do sistema de cores subtrativas, cores pigmento, formado pelo Cian, Magenta, Yellow e Black (Black Key). Isto significa que os pigmentos amarelo (Y), magenta (M) e ciano (C) são cores primárias, ou seja, não resultam da mistura de outras tinturas. Por sinal, as cores primárias mistu-radas entre si podem formar uma vastíssi-ma gama de outras tonalidades.

E o preto (K), como obtemos? Cada tipo de pigmento tem seu próprio poder seletor, ou seja, absorve (subtrai) uma ou mais radia-ções tonais. Dessa forma, a cada sobreposição de um pigmento, dimi-nui o número de radiações refletidas, até conseguir a ausência abso-luta de toda radiação, isto é, a sensação visual de se enxergar o preto, resultado final da mistura subtrativa.

Nas artes gráficas, o uso das quatro cores iniciais (CMYK) é chamada de quadricromia, pois apenas essas quatro matrizes bási-cas são responsáveis pela impressão de todas as outras tonalidades conhecidas.

Sei que, quando tratamos de cor, manipulamos as imagens nos softwares de edição em RGB, porém ao passarmos para o CMYK (envio para impressão, envio para gráfica), perdemos consideravelmente o brilho e a vibração da peça. Esse fato se dá pelo fato do CMYK apresen-tar uma gama menor de combinações de cores, afinal, a composição física das cores se dá pela mistura de pigmentos.

MONOCROMIA

Monocromia, a rigor, é a radiação produzida por apenas uma cor, por apenas um comprimento de onda e que, ao contrá-rio do que muitos acreditam, não necessa-riamente é constituída por preto. Na verda-de, a monocromia é conseguida pelo uso de apenas uma cor (matiz) e os diferentes tons que ela possui. Logo, monocromia (uma cor) é o oposto de policromia (várias cores, como CMYK e RGB).

Módulo 1 – Aspectos gerais do Design Gráfico aplicado aos produtos digitais

Page 16: BA online – Centro Universitário Belas Artes de São Paulo › baonline › downloads › ebook.pdf · Módulo 1 – Aspectos gerais do Design Gráfico aplicado aos produtos digitais

16

BA online – Centro Universitário Belas Artes de São Paulo

CORES ESPECIAIS

Cores especiais são aquelas feitas especialmen-te para um determinado cliente ou projeto, pois são produzidos pigmentos já na cor a ser utilizada, sem a necessidade de misturas. Dentre elas, o sistema mais conhecido é o Pantone, que é também uma indústria de tintas.

Afinal, qual a necessidade de fazer uma cor especial? Na verdade, a grande vantagem de uma cor Pantone é a garantia que a impressão de cores fique entre 95 e 100% estabilizadas, sem variação de tons no produto final. Contudo, a grande desvantagem é o custo, que sai muito mais alto do que o CMYK.

CÍRCULO CROMÁTICO

O círculo cromático, também conhecido como rosácea das cores, é uma das formas de visualização de cores mais comum e serve para nos ajudar a escolher entre as suas diversas possibilidades de harmoniza-ção. A harmonia entre elas é um dos fatores fundamentais para que uma imagem (site, marca, cartaz, estam-pa, etc.) transmita a mensagem para o receptor sem que haja ruídos estéticos (lembrando que estética não se refere apenas à visão, mas a todos os sentidos dos seres humanos).

Você sabe como transformar, no Photoshop, uma imagem em RGB, CMYK e Grayscale? Não? Aproveite a dica!

RGB: Image → Mode → RGB

CMYK: Image → Mode → CMYK

Grayscale (tons de cinza): Image → Mode → Grayscale

Monocromático: a imagem tem que estar em Grayscale → Image → Mode → Duotone → Escolhe a cor → Enter

Preste atenção: se a imagem estiver em cor Index, você não conseguirá alterá-la enquanto não escolher um sistema de cor. Neste caso, sugiro RGB.

Na prática

Módulo 1 – Aspectos gerais do Design Gráfico aplicado aos produtos digitais

Page 17: BA online – Centro Universitário Belas Artes de São Paulo › baonline › downloads › ebook.pdf · Módulo 1 – Aspectos gerais do Design Gráfico aplicado aos produtos digitais

17

BA online – Centro Universitário Belas Artes de São Paulo

Alguns conceitos, relacionados ao círculo cromático, são extre-mamente necessários para nossas escolhas tonais na aplicação visual. São eles:

Cor primária: cor que não possui mistura de pigmen-to. São três: amarelo, azul e vermelho.

Cor secundária: cor composta por duas cores primá-rias. São três: laranja, verde e violeta.

Cor terciária: composta por uma cor primária e uma secundária, vizinhas no círculo cromático. São seis: amarelo-esverdeado, verde-azulado, azul-violeta, vermelho-violeta, vermelho-magenta, magenta-laranja.

Cores complementares: formadas por duas cores primárias opostas no círculo cromático.

Cores análogas: são as vizinhas no círculo cromático.

A Adobe, empresa detentora do Photoshop e outros softwa-res de edição de imagem e áudio, disponibilizou o site Adobe Kuler onde é possível fazer combinações de cores e ver como elas interagem em relação umas às outras. Vale a pena conferir e usar em todos os trabalhos daqui para frente.

Multimídia

Módulo 1 – Aspectos gerais do Design Gráfico aplicado aos produtos digitais

Page 18: BA online – Centro Universitário Belas Artes de São Paulo › baonline › downloads › ebook.pdf · Módulo 1 – Aspectos gerais do Design Gráfico aplicado aos produtos digitais

18

BA online – Centro Universitário Belas Artes de São Paulo

Nesta seção, você pôde compreender a importância dos siste-mas de cores para o processo de criação, bem como seus modos de aplicação. Espero por você na próxima seção!

Uma empresa que deseja ser séria, e manter sua marca e produtos transmitindo confiabilidade, tem a preocupação constante de deixar as cores de seus produtos padronizados. Veja o caso da Coca-Cola, cujo vermelho padrão é conhe-cido internacionalmente, sem nunca apresentar variações de tons. Para que isso aconteça, é criado o que chamamos de Manual de Identidade Visual (MIV), no qual se estabelece o valor em RGB, CMYK e Pantone de cada cor contida na marca. A cor é um dos elementos mais importantes desse material. Não se preocupe, nós dedicaremos uma seção inteira para o estudo detalhado do MIV. Contudo, se você for ansioso, já pode fazer uma pesquisa sobre MIVs e ver como facilitam o uso técnico das cores pelas empresas. Um bom exemplo desse uso é o site do Rio20.

Que tal descobrirmos as cores de algumas marcas do governo? Ao descobri-las, anote ao lado de cada um dos exemplos.

Na prática

Resp

osta

cor

reta

1

– B

/ 2 –

C /

3 –

D /

4 –

A

Relacione os valores que têm a ver com cada frase.

1. É a abreviatura do sistema de cores subtrativas, cores pigmento, formado pelo Cian, Magenta, Yellow e Black (Black Key).

2. Abreviatura do sistema de síntese aditiva, cores-luz, formadas por Red, Green e Blue (vermelho, verde e azul).

3. É obtido pelo uso de apenas uma cor (matiz) e os diferentes tons que ela possui.

4. Conhecido como rosácea das cores, é uma das formas de visualização de cores mais comuns e serve para nos ajudar escolher entre as suas diversas possibili-dades de harmonização.

A. ( ) Círculo cromáticoB. ( ) CMYKC. ( ) RGBD. ( ) Monocromia

Agora é a sua vez!

Módulo 1 – Aspectos gerais do Design Gráfico aplicado aos produtos digitais

Page 19: BA online – Centro Universitário Belas Artes de São Paulo › baonline › downloads › ebook.pdf · Módulo 1 – Aspectos gerais do Design Gráfico aplicado aos produtos digitais

19

BA online – Centro Universitário Belas Artes de São Paulo

Módulo 1

BRINGHURST, Robert. Elementos do estilo tipográfico. São Paulo: Cosac Naify, 2005.

CLAIR, Kate; BUSIC-SNYDER, Cynhtia. Manual de tipografia: a história, as técnicas e a arte. Porto Alegre: Bookman, 2009.

FARIAS, Priscila. Tipografia digital. Rio de Janeiro: 2AB, 1998.

FRUTIGER, Adrian. El libro de la tipografía. Barcelona: Gustavo Gili, 2007.

GRUSZYNSKI, Ana Cláudia. Design gráfico: do Invisível ao Ilegível. São Paulo: 2AB, 2000.

KEEDY, Jeffery. The rules of typography according to crackpots experts. In: Looking closer 2: critical writings in graphic design. BEIRUT, Michael Beirut (org.) et al. New York: Alltworth Press and American Institute of Graphic Arts: 1997, p.27-31.

KLEIN, Simo. Achieving good legibility and readability on the web. Disponível em: <http://klepas.org/achieving-good-legibility-and-readability-on-the-web/#notebook>. Acesso em: 2 mai. 2012.

LUPTON, Ellen. Pensar com tipos: Um guia para designers, escritores, editores e estudantes. São Paulo: Cosac Naify, 2006.

__________. Tipos na tela. São Paulo: Gustavo Gili, 2015.

NIEMEYER, Lucy. Tipografia: uma apresentação. Rio de Janeiro: 2AB, 2010.

PERFECT, Christopher; AUSTEN, Jeremy. The complete typographer. London: Wuatro, 2001.

ROCHA, Claudio. Tipografia comparada – 108 fontes clássicas analisadas e comentadas. São Paulo: Rosari, 2005.

RUDER, Emil. Typography: a manual of design. Suíça: Zollikofer et co. ag, 1967.

SAMARA, Timothy. Guia de tipografia. Porto Alegre: Bookman, 2011.

Referências

Design e Gestão de Web, Mídias Digitais e Móveis

Page 20: BA online – Centro Universitário Belas Artes de São Paulo › baonline › downloads › ebook.pdf · Módulo 1 – Aspectos gerais do Design Gráfico aplicado aos produtos digitais

BA online – Centro Universitário Belas Artes de São Paulo