Como fazer com que as sobreposições de cores funcionem no seu design
A cor é uma parte importante de praticamente qualquer design. Se você é fã de tons claros e arrojados ou prefere um preto e branco mais minimalista, a maneira como você usa as cores pode ter um grande impacto no design geral.
Uma maneira de usar cores para fazer uma declaração é com um design que incorpore uma sobreposição de cores. Isso significa que você cobre uma imagem ou vídeo com uma caixa colorida semitransparente. O efeito pode adicionar significado a uma imagem, chamar a atenção para um design e ajudá-lo a fazer a maioria das escolhas limitadas de arte.
Hoje, veremos várias sobreposições de cores para servir de inspiração para criar a sua.
Explorar recursos de design
Experimente um gradiente
Os gradientes são legais novamente. Eles também são uma ótima opção (e atraente) quando você deseja trabalhar com uma sobreposição de cores.
O que é particularmente interessante em um gradiente é que você pode trabalhar com algumas cores - pense sobre sua marca aqui - ou use uma única cor para criar o foco. Emparelhamentos brilhantes podem ajudar a atrair usuários para o design e dar às imagens alguma faísca.
Grande parte dessa tendência pode ser vinculada ao Spotify, que começou a usar sobreposições de gradiente e duotônicos para destacar listas de reprodução. A cor deu nova vida às imagens que os usuários estavam acostumados a ver (fotos da imprensa de músicos).
Esse é um conceito fácil de replicar também.
- Escolha uma foto.
- Crie um gradiente com as cores da marca.
- Diverta-se!
Cores sólidas definir um tom
Uma sobreposição de cores sólidas pode ser tão marcante quanto um padrão de gradiente, mas geralmente tem um significado mais distinto que pode ser associado à escolha de cores. Considere uma sobreposição sépia, por exemplo. Imediatamente desperta sentimentos dos velhos tempos e da história.
O mesmo pode ser dito da seleção de uma opção de cor da moda. Ao usar uma das cores brilhantes e saturadas associadas ao design plano ou material, você pode evocar sentimentos de modernismo ou alta moda.
Ao usar uma única cor como sobreposição, pense no grau de saturação e transparência da cor. Esses elementos também podem adicionar significado. Combinações de cores mais pesadas - menos transparentes e mais saturadas - dão mais foco à cor do que à imagem por trás dela. Combinações mais leves e mais sutis dão mais foco à imagem.
Considere Escuro ou Claro
Você nem sempre precisa usar uma cor em si para criar uma sobreposição. Às vezes, pode ser preto, branco ou cinza. O uso desses tons pode realmente mudar o humor de um projeto.
Como seria de esperar, as sobreposições mais escuras criam um ambiente mais sombrio. As sobreposições mais claras estão associadas à diversão. Outro fator de contribuição quando se trata desses sentimentos e do preto e branco é a própria imagem. Como funciona com o tom ou tom? A imagem, a cor e as mensagens funcionam juntas?
Chame-me Ish (acima) usa uma sobreposição de branco para ajudar a focar as palavras na tela em cima de uma foto em preto e branco. Mas observe a expressão no rosto do fotógrafo: ele está sorrindo com um sorriso largo. A combinação de cores e fotos é convidativa e faz você querer interagir com o fotógrafo, e possivelmente até contratá-lo para um trabalho.
Opte por imagens de alto contraste
Ao planejar uma sobreposição de imagem em um projeto de design, a composição da foto (ou vídeo) é importante. Uma imagem branda deixará você com um resultado de sobreposição de cores branda. Você obterá os melhores resultados se começar com uma foto com muito contraste com os espaços escuros e claros da imagem.
Se sua imagem não tiver contraste suficiente, considere adicionar contraste no software de edição de fotos ou escolher outra imagem. Caso contrário, o efeito da imagem pode cair.
Há outro truque para conseguir esse efeito é começar com uma foto em preto e branco. Especialmente para iniciantes, pode ser mais fácil ver e aprimorar o contraste em uma imagem em preto e branco. Just Actions fornece um ótimo exemplo de uma imagem em preto e branco ao lado de imagens com sobreposição de cores. (Além disso, é um efeito interessante parear imagens sem cor e contraste colorido).
As imagens devem parecer naturais (ou não)
Quando se trata de trabalhar com sobreposições de cores, você tem duas opções:
- As imagens ainda devem parecer naturais. Cor, iluminação e sombras devem aparecer em um local natural. A sobreposição é um pouco sutil, como o Abednego Coffee (acima).
- As imagens parecem completamente alteradas. Não há suposição de que uma sobreposição de cores tenha sido usada (como a maioria dos exemplos deste artigo).
Não há realmente um meio termo aqui. Se as imagens não caírem em um desses "extremos", os usuários podem pensar muito sobre as opções de cores e não se concentrar no conteúdo do site. Você não quer se distrair com uma técnica de sobreposição de cores; deve melhorar o design.
Experimente um sotaque de sobreposição
Embora os exemplos anteriores tenham mostrado maneiras de usar uma sobreposição de cores para imagens grandes, como opções de estilo de cabeçalho de herói, essa não é a única maneira de aproveitar ao máximo essa técnica. Os efeitos de sobreposição de cores também podem funcionar muito bem como acentos.
Os dois exemplos acima mostram maneiras diferentes de realizar isso de forma eficaz.
O Knot Clothing (parte superior) usa uma barra de navegação verde brilhante com transparência. É destacado ainda pelo curso sólido acima dele. O efeito ajuda a manter a paleta de cores da marca em todo o design, exibindo itens em uma variedade de outras cores. O efeito é simples, ajuda a página a parecer um pouco mais suave do que se a navegação estivesse dentro de uma cor sólida e chama a atenção pela página e pelo design.
Nuts and Woods adota outra abordagem. O design usa uma sobreposição de cores como efeito de foco para falar mais sobre itens específicos no site. Qualquer elemento que obtiver uma sobreposição vermelha também é um elemento clicável. O que é notável nesse design é que a sobreposição de cores serve como uma dica visual para os usuários, informando exatamente o que eles querem saber e fornecendo um caminho para os links em todo o conteúdo.
Conclusão
Usar uma sobreposição de cores é uma daquelas técnicas que não funcionam o tempo todo. A maioria dos designers acha que só pode se dar bem com um ou dois projetos antes que pareça exagerado. (É aí que uma sobreposição de sotaque pode ser uma opção melhor.)
Como em qualquer técnica de design, aplique-a no contexto certo. Você nunca deve usar uma sobreposição de cores apenas porque se inspirou em outro projeto; salve a ideia e use-a para o design certo.
