Como desenhar com cores monocromáticas

Escolher uma paleta de cores para projetos de design pode ser um processo doloroso.

Se você está começando do zero, sem um guia de estilo ou quaisquer preferências do cliente para seguir em frente, onde você começa? Por um lado, você pode tentar um esquema de cores retirado das páginas de teoria da cor. Está certo, teoria da cor não é apenas para estudantes de arte – ele também pode ajudar os designers a usar a cor de uma forma eficaz , visualmente atraente.

E uma das paletas mais fáceis de usar (e mais difícil de estragar) é uma monocromática. Embora mono não significa “um”, esta abordagem à cor não está apenas usando o mesmo tom único em vários lugares em seu design. Em vez disso, você pode criar uma paleta de cores monocromáticas, escolhendo uma cor base (tradicionalmente um dos 12 na roda de cores) mais qualquer número de variações dessa base. Que tipo de variações ? Vamos olhar para as nossas opções :

  • Shades: a cor de base escurecida com preto.
  • Tones: a cor de base suavizada (ou dessaturada) com cinza.
  • Tints: a cor de base iluminada com branco.

Cores Monocromáticas | Shades, Tones e Tints

Construir uma paleta monocromática de cor, tons e matizes resultados em um espectro versátil, com opções de cores para cada parte do seu design.

Por que você deve tentar um esquema de cores monocromáticas

Em adição à sua versatilidade, uma paleta de uma cor pode beneficiar o seu projeto de concepção e processo de várias maneiras:

  1. Ela cria um visual harmonioso, coeso.
  2. Ela não chama a atenção para si, mas permite que o seu conteúdo brilhe.
  3. Ela pode ajudar a associar marcas a uma cor específica, memorável.
  4. Faz o seu trabalho como designer mais fácil e rápido; você não tem que se estressar sobre escolher cores e combiná-las

9 técnicas para criar  com cores monocromáticas

01. Simplifique o design

Às vezes é inevitável que você precise encaixar uma grande quantidade de informação em um espaço limitado. Em vez de fazer o seu projeto ainda mais lotado e confuso, com um monte de cores, uma paleta de uma cor pode ajudar a fazer um layout mais limpo e organizado.

Por exemplo, este infográfico tem muita coisa acontecendo com as suas ilustrações e tipografia, mas uma paleta azul puxa tudo junto. Pelo amor da praticidade, a maioria dos projetos irá usar algum branco ou preto (para o texto de fundo, etc.), além das cores monocromáticas. Este projeto usa branco e cinza em segundo plano para ajudar os gráficos azuis se destacarem.

Dribbble/Madiha Malik

Dribbble/Madiha Malik

02. Adicione  uma sobreposição de cores para Fotografia

A cor pode ser aplicada a mais do que apenas texto e gráficos. Designs com uso fotografia podem utilizar um esquema de cores monocromático através da aplicação de uma sobreposição de cores transparentes ou tela por cima. Isso funciona muito bem com fotos em preto-e-branco – as máscaras de overlay em preto, branco e cinza através da sobreposição de cor única para criar a impressão de variação de cor:

Rolling Stone France

Rolling Stone France

O exemplo acima mostra como esta técnica pode ser eficaz para o retrato. Note também como a cor ajuda a tornar os textos mais visíveis contra um fundo consistente.

Isso também funciona para fotografia a cores, como acontece com o layout do site abaixo. A página web de fotografia de parede a parede, sem quaisquer margens no meio de outro modo poderiam parecer visualmente esmagadora, mas os tons de roxo ajudam a dar estrutura e continuidade ao layout.

Dribbble/Eric E. Anderson

Dribbble/Eric E. Anderson

03. Criar relações e progressões em seu design

Um dos benefícios de que adere a uma cor em seu projeto é que é fácil de fazer com que pareça que vários elementos estão juntos. Este não é apenas um efeito visual; é também funcional. Mostrando como as características de seu projeto estão relacionadas ou como elas interagem umas com as outras pode ajudar os espectadores a entender instantaneamente a mensagem e objetivo de seu projeto.

Por exemplo, aqui, os tons de verde vão do mais leve ao mais escuro para mostrar uma progressão no preço. Os aumentos de preço corresponde ao valor da cor – mais escura a cor, maior o custo. Este tipo de sinalização visual é uma jogada inteligente, sutil, que faz o projeto mais amigável.

Dribbble/Medialoot

Dribbble/Medialoot

04. Use uma cor brilhante ou intensa de um jeito discreto

Como designer, pode ser divertido experimentar diferentes combinações de cores. Mas, muitas vezes, tons ousados ou brilhantes não são apropriados para um projeto profissional ou para o negócio do cliente. Uma paleta monocromática pode ajudá-lo a adicionar alguma variedade para as opções de cores habituais, esmaecendo cores “gritantes” para uma aparência mais profissional. Designers, muitas vezes, fazem isso tomando uma cor de base tipicamente brilhante (como vermelho, no exemplo abaixo) e criar uma paleta com tons mais escuros e principalmente menos saturadas (ou seja, varições menos intensas).

Este design de cartão do feriado para uma empresa de construção é um bom exemplo dessa técnica. Cores tradicionais do Natal (vermelho e verde brilhante) deixam de ser berrantes. O projeto ainda apresenta o vermelho como um toque sazonal, mas uma vez que o cartão é proveniente de um negócio, ele mantém tom profissional pelo esmaecimento da seleção de cor.

Dribbble/Leanda Xavian

Dribbble/Leanda Xavian

05. Tente uma sofisticada Escala de Cinza (Grayscale)

Escala de cinza é uma configuração de impressão que utiliza tons de cinza para reproduzir variação de cor. É muitas vezes usada para poupar dinheiro em tinta colorida ao exibir um design onde a cor não é absolutamente necessária. No entanto, mesmo se você não está trabalhando em um projeto de impressão, você pode pedir essa ideia de escala de cinza e aplicá-lo para o seu próprio esquema de cores.

Por que eu iria querer fazer isso? você pode perguntar. Design totalmente cinza não seria sem graça? Não necessariamente. Como preto e branco, uma paleta de cores que apresenta cinzas pode dar visual minimalista, sofisticado para seu projeto. O design do site abaixo combina fotografia em preto-e-branco, texto cinza no menu, e uma sobreposição de tons cinza para complementar um fundo branco básico com texto preto.

Dribbble/Alan Tippins for Litmus

Dribbble/Alan Tippins for Litmus

06. Divida o seu projeto em seções

Cor, particularmente blocos de cor, pode ser usada para dividir seu projeto em seções – que é uma parte importante da criação de uma organizada, layout de fácil navegação com uma boa hierarquia visual.

Este projeto para um aplicativo de calendário apresenta tons monocromáticos de roxo para várias tonalidades distintas e mostra aos usuários onde eles podem ajustar as configurações. Aqui a cor também tem um aspecto interativo, mudando à medida que os usuários clicam em diferentes áreas.

Dribbble/Ivan Volca

Dribbble/Ivan Volca

07. Mantenha-o simples

Provavelmente há um número infinito de luminosidade, tons e matizes que você pode usar para qualquer cor de base… mas isso não significa que você precisa usar um monte de variações de cores em um design monocromático. Em algum momento, as sutis diferenças entre cores não vão mesmo ser visualmente distinguíveis. Uma forma de manter as suas cores em um número gerenciável é usar apenas o que for necessário separar seus elementos de design – por exemplo, um layout de três cores é bastante típico e pode consistir de cor de fundo, uma cor de texto , e um cor de destaque para gráficos ou outros elementos.

Ou aproveitar esta série de conceitos de logotipos. Eles poderiam facilmente ter sido projetados usando várias cores, mas porque o estilo é mais ilustrativo e detalhado, duas cores da paleta monocromática mantém as coisas simples e não distrai  da estética retrô.

Dribbble/Tyler Anthony

Dribbble/Tyler Anthony

08. Cores em dobro

Se você tiver dois projetos relacionados – talvez vários folhetos para uma série de concertos ou um par de rótulos de produtos para a mesma marca, como abaixo – ele pode criar um efeito impressionante de usar duas paletas monocromáticas contrastantes. Isto mostra que os dois modelos são diferentes, ainda ligados.

Esses rótulos de água mineral abaixo destacam o contraste ainda mais porque as duas cores escolhidas (azul e laranja) são complementares, ou opostas, na roda de cores. Na tradicional teoria de cores (veja, teoria da cor vem a calhar para designers!) esquemas de cores complementares são consideradas as opções mais dramáticas e de alto contraste em contextos de arte e design.

The Dieline/Timo Thurner for Aqua Monaco

The Dieline/Timo Thurner for Aqua Monaco

09. Tente um esquema quase monocromático

Como mencionado anteriormente, por vezes, uma paleta de cores estritamente monocromática pode ser prática. Mas você pode dobrar as regras um pouco e ainda manter a essência de um esquema de cores monocromática – tanto seu efeito visual e sua funcionalidade. Aqui estão algumas abordagens comuns que você pode experimentar:

Paleta monocromática + uma cor de destaque:

Um toque de cor além de sua seleção de tons monocromáticos pode ajudar a destacar partes importantes do seu projeto ou simplesmente adicionar interesse visual extra. Este tipo de sistema é mais eficaz quando a cor extra tem uma finalidade específica no projeto – por exemplo, para destacar um logotipo ou destacar informações de contato ou uma chamada à ação .

Este conjunto de cartões de visita salva seu azul cor de destaque para realçar o primeiro nome do designer:

Dribbble / Garrett Sanderson

Dribbble/Garrett Sanderson

Aqui está outro exemplo. Em vez de cinza como a cor de base para a paleta monocromática como na imagem anterior, desta vez temos uma cor (turquesa) , com uma variação média no fundo e um tom mais escuro para a parte do texto. Limitando as cores monocromáticas para apenas dois mantém a seleção de cores de ser esmagadora. Como um toque agradável, o elemento laranja envolve e destaca o logo, além de ter uma finalidade decorativa.

The Dieline/Interact for Bandar

The Dieline/Interact for Bandar

Preto & Branco

Designers podem diferir na opinião quanto ao fato de um esquema de cores preto-e- branco se qualifica como monocromático (tecnicamente, o preto é a ausência de cor, e branco é a combinação de todas as cores) – mas é o esquema de cores mais básico e pode ser facilmente utilizado com ou sem um ou mais cores de destaque.

Como comparação, você pode conferir dois projetos de websites abaixo, um com uma paleta estritamente preto-e-branco e o outro com a adição de vermelho como uma cor de destaque:

Dribbble/Mik Skuza

Dribbble/Mik Skuza

Dribbble/Forefathers

Dribbble/Forefathers

Mesma família de cor

Embora não seja tecnicamente monocromático, uma paleta de cores desenhada a partir da mesma família de cores pode ter o mesmo efeito em termos de harmonia visual e organização de informações. Esse revista apresenta azuis e verdes para destacar os dados comunicados por suas tabelas e gráficos. Embora existam pelo menos quatro ou cinco cores diferentes aqui, suas semelhanças – em temperatura de cor (frias) e saturação (brilhante) – criam uma aparência coesa. Isso provavelmente não seria o caso se uma cor quente como laranja fizesse parte da paleta.

Dribbble/Bureau Oberhaeuser

Dribbble/Bureau Oberhaeuser

Resumindo…

Monocromático, ou de uma cor, paletas são uma opção versátil e fácil de se aplicar a qualquer tipo de design. Ao longo deste artigo, vimos exemplos para websites, logotipos, cartões de visita, embalagens de produtos, e muito mais. Mas você não tem que ser um defensor para a definição tradicional de monocromática – adicionando uma cor extra ou dois podem complementar ou melhorar o efeito. Agora é a sua vez … com essas dicas e técnicas, você pode começar a tentar esquemas de cores monocromáticas em seus próprios projetos de design. Como sempre, feliz criação!

Fonte: Janie Kliever / Canva Design School