Como criar padrões em projetos de design
Pense em quantos padrões você segue em sua rotina diária. Desde acordar e se preparar para o trabalho até adormecer a cada noite, o dia é preenchido com esses pequenos elementos repetitivos que criam ordem e calma. Os padrões no design fazem a mesma coisa: esses elementos repetitivos podem trazer ordem a um projeto e criar uma sensação de calma (ou caos) para definir um tom.
Esse é o verdadeiro apelo de um padrão. Ajuda a direcionar os usuários através de uma estética, seguindo o padrão ou a série de objetos e informa aos usuários como interagir com alguma coisa. Os designers podem criar padrões de várias maneiras - com fundos, objetos, cores, palavras, painéis ou usando uma combinação desses elementos.
Explore o Envato Elements
O que é um padrão?
“Um arranjo de peças repetidas ou correspondentes, motivos decorativos etc.” - Dicionário Collins Inglês
Um padrão pode incluir qualquer forma de repetir objetos, palavras, cores ou formas. Para fins de design, um padrão envolve qualquer elemento em que você possa ver alguma conexão ou repetição na estética geral. Enquanto muitos assumem que os padrões são equivalentes a arranjos ordinais e simétricos, esse nem sempre é o caso. Padrões podem cair em qualquer matriz; às vezes a desorganização é o próprio padrão.
Os padrões podem ser reconhecidos por qualquer número de sentidos. Os padrões visuais costumam ser mais caóticos do que os criados. Os padrões naturais incluem espirais, ondas, rachaduras e rotações. Quase todo padrão têxtil ou perfeito é criado especificamente para harmonia visual, mesmo que as formas básicas sejam derivadas da natureza.
Com Fundos
Uma das primeiras coisas que vem à mente quando se fala em padrões são os fundos. Popularizados pelo papel de parede (as variedades doméstica e de mesa), padrões repetidos pequenos ou sutis são maneiras populares de adicionar profundidade ao espaço básico em um projeto de design. Alguns designers também optam por padrões de fundo maiores ou mais ousados, embora isso não seja tão comum. (Muita atividade em segundo plano pode desviar a atenção da mensagem em primeiro plano.)
Então, quais são algumas técnicas comuns para criar um padrão de plano de fundo atraente?
- Simplicidade: padrões simples de plano de fundo são eficazes e aumentam a profundidade sem que os usuários realmente se concentrem nesse aspecto do design. Os melhores cenários se encaixam no cenário, por si só, e servem apenas para destacar a parte principal do design.
- Logotipos: para muitas marcas, pequenos logotipos repetidos são um estilo de plano de fundo comum. (Embora existam alguns que também superdimensionam com o logotipo de segundo plano.) Logotipos repetidos podem ajudar a estabelecer a conexão da marca.
- Paleta neutra: a cor é um dos fatores mais comuns no design de plano de fundo. E paletas neutras são predominantemente dominantes. Mesmo com a tendência de usar imagens desfocadas para fundos - o que é muito popular no momento - cores e formas são desfocadas até o ponto de neutralidade, onde objetos e cores se misturam.
- Simetria: os padrões de fundo geralmente caem em formas ordinais. Com elementos repetidos, o padrão muitas vezes pode ser alterado, intitulado, revertido ou alterado de várias maneiras e ainda ter a mesma aparência geral.
- Repetição: Objetos repetidos também são populares nos padrões de fundo. Essa técnica simples pode adicionar profundidade a um esquema plano.
Agrupando objetos
Formas e objetos semelhantes quase parecem alinhar-se uns aos outros quando usados em estreita proximidade. Embora a escolha óbvia para agrupar objetos para padrões seja agrupar objetos da mesma forma e tamanho, isso nem sempre é necessário.
Nas imagens acima, o portfólio de Jonathan Patterson cria um padrão óbvio com nove caixas de formas idênticas que contêm formas do mesmo tamanho. O padrão é claro e atraente. O padrão utilizado na imagem para o Dots Printhaus é menos "perfeito", mas igualmente óbvio, com um conjunto de formas semelhantes em tamanhos variados.
Isso mostra que os objetos podem ser agrupados de maneiras diferentes, mas ainda criam uma sensação de padrão:
- Formas semelhantes
- Formas variadas em tamanhos semelhantes
- Formas organizam para criar um objeto
- Formas conectadas por linhas ou outros elementos
- Formas com número semelhante de pontos ou extremidades
Repetindo a cor
É possível estabelecer um padrão criando um tema com cores. Isso inclui objetos ou elementos da mesma cor ou até mesmo o trabalho com elementos com cores semelhantes, como saturação, luminosidade ou matiz. Os padrões de cores são frequentemente usados para informar aos usuários o que fazer com um design. No design do site, por exemplo, é comum que todos os botões clicáveis sejam de uma única cor. Isso cria um padrão esteticamente e para o comportamento do usuário (ou seja, você clica em tudo que está vermelho).
Nos exemplos acima, a cor é usada de maneiras distintas. O Brand Aid Design usa cores para distinguir elementos e criar um padrão com ícones de formas e tamanhos variados. Ro and Co usa cores em segundo plano e o mesmo tom de cor para imagens menores em todo o site. Essa conexão colorida liga cada uma das imagens menores ao design geral em um padrão que não tem simetria e muito pouca distinção óbvia.
Use cores para criar padrões para:
- Estabelecer conexão entre objetos
- Crie um senso de como usar um design
- Defina um tom visual
- Adicione um padrão em que nenhum outro possa existir
- Desenhar usuários de um objeto para o próximo
Com palavras repetidas
Repetir palavras pode criar um padrão visual ou auditivo. Ao ver a mesma palavra repetidamente, você começará a conectá-la ao design ou à mensagem. (O site Casper Sleep, por exemplo, usa a palavra "Sleep" duas vezes em um design que contém menos de 20 palavras. Também usa o nome da marca duas vezes.)
O Bay Street Biergarten faz algo semelhante, mas reproduz você lendo o site em voz alta. A imagem repetida de um urso e a conexão com copos de cerveja e as palavras “caixão de artesanato” começam a apresentar o mesmo padrão. Cada elemento do design diz cerveja. (Inteligente, hein?)
Use palavras para criar padrões de outras maneiras também:
- Repetindo palavras ou frases
- Palavras com aparência semelhante (muitas das mesmas letras)
- Palavras e imagens que dizem a mesma coisa
- Várias palavras que têm o mesmo significado
- Palavras de comprimento semelhante (como muitas frases longas ou curtas para criar ritmo)
Com painéis de tamanho semelhante
Tendências de design, como projetos no estilo de cartões ou sites com rolagem de paralaxe, abriram espaço para os painéis criarem padrões em projetos de design. De grupos de cartões a peças inspiradas no Pinterest, passando por “telas”, grupos de painéis criam padrões óbvios para os usuários. Esses painéis estabelecem diferenças e conexões entre objetos e informam aos usuários sobre alterações nas informações que estão vendo.
Esses painéis podem ter qualquer formato e tamanho, vertical ou horizontal e cores variadas. O site 10 Dez Dez faz um ótimo trabalho ao estabelecer painéis distintos em uma estrutura de paralaxe com cores e posicionamento do produto, para que os usuários possam distinguir claramente uma idéia da seguinte. Artesão Avenida. adota uma abordagem um pouco diferente com um design que apresenta um painel grande, seguido por painéis dentro dos painéis, de forma alternada para um padrão no estilo de padrão.
Use painéis para:
- Vincular elementos semelhantes
- Definir cenas
- Crie um fluxo de informações
- Estabelecer domínio usando várias imagens
- Conte uma história visual
Conclusão
Os padrões podem ser projetados de várias maneiras para variar o impacto. Crie padrões que funcionem com o tom que você deseja que um projeto tenha. Os agrupamentos simétricos são organizados e calmantes; os elementos mais aleatoriamente emparelhados podem parecer perturbadores e excitados.
Não sinta que precisa seguir um tipo de padrão. Misture e combine diferentes tipos de padrões para obter impacto em diferentes lugares. Diferentes partes do mesmo projeto podem incluir diferentes tipos de padrões em diferentes locais. (E isso é totalmente aceitável.)