terça-feira, 20 de novembro de 2012

DESIGN: proporções

Projetar um layout seja de um livro ou de um cartão de visitas pode ser bastante difícil se você resolver começar "do nada". É importante pré-estabelecer posicionamentos e distâncias proporcionais entre elementos. Para isso, podemos nos guiar intuitivamente através da composição para dispor os elementos ou, seguir parâmetros, muito mais utilizado, usando uma abordagem lógica e proporcional para solucionar visualmente a composição. 

Intuitivamente o designer pode organizar seu layout verificando as relações entre os elementos e suas formas, levando em consideração o espaço "em branco" (já falei sobre a importância do branco aqui) e se a disposição dos mesmo são coerentes com o conceito do trabalho. Essa abordagem até pode parecer ser mais rápida, mas exige uma percepção bem avançada do designer e uma excelente visão e noção espacial, uma vez que o olho será a única “ferramenta" para a avaliação de distâncias, centralização, etc.

Particularmente, fui ensina a utilizar o sistema proporcional, e acho muito prático! Você pode pensar que os elementos compositivos serão forçados a se adequarem as proporções do grid. Mas não é bem assim não, viu? Utilizando proporções na sua composição você consegue um layout muito mais harmônico por conta da proporção entre os elementos e em relação ao conjunto, o que dá unidade ao trabalho (ver Gestalt). Isso permite uma abordagem mais teórica sobre a composição. 

É fato que por vezes alguns elementos podem não se ajustar perfeitamente a grade. Designers inexperientes podem fazer com que a composição crie padrões desconectados entre si, ou seja, dentro da composição o conceito pode não ficar bem claro parecendo mal definido. Mas basta escolher a melhor opção de proporção e adequar seu layout a ela. E quando digo adequar quero dizer que você pode diminuir e expandir elementos, proporcionalmente em relacionando uns aos outros, sempre que necessário.

Quando bem aplicado, layouts proporcionais garantem excelentes resultados. Aprender a aplicar proporções em layouts de forma harmônica exige estudos de grids, teoria da composição, além de prática é claro. Mas tudo na vida é assim, não é? Se você quer ser bom no que faz, tem que estudar! Em um layout bem construído a malha de construção não se sobressai aos elementos visuais, ela garante movimento e dinamismo à composição, sem fazer com que ela caia em inércia.

Proporção áurea

A Proporção Áurea vem sendo usada desde a Grécia Antiga, onde foi descoberta por Fídias e Ictinos. A Proporção Áurea consiste em uma relação entre retângulo e quadrado; se criarmos um retângulo com as medidas áureas e formos dividindo-o sempre usando essa proporção, chegaremos na seguinte imagem (e também criando um semi-círculo de canto a canto de cada quadrado):
retangulo-aureo
Essa técnica pode ser usada em praticamente tudo, e acredite, torna o design muito mais bonito e eficiente. Afinal, quando vemos algo que está dentro das proporções áureas, associamos este objeto automaticamente à beleza, pois é uma proporção que está em tudo no nosso dia a dia. No entanto, é necessário destacar que não basta que você se utilize desta técnica para que magicamente todos seus trabalhos saiam bonitos. Muitas outras variáveis influenciarão a composição como o peso, a cor, o contraste, a luz, a tipografia, etc… Abaixo um exemplo de diagramação de página de livro usando a proporção áurea:
book-golden
A imagem mais famosa do mundo tem proporções áureas. Aliás, as pessoas mais bonitas são assim consideradas porque além da simetria entre o lado direito e o esquerdo, existe também proporcionalidade entre todos os elementos no rosto e em relação a distância entre eles.


Retângulos dinâmicos

Retângulos dinâmicos são retângulos construídos através de proporções geométricas obtidas a partir do quadrado. Miltom Ribeiro, autor do livro Planejamento Visual Gráfico define retângulos dinâmicos da seguinte forma:

O retângulo dinâmico é aquele em que n é um número euclediano incomensurável. Sua obtenção é conseguida pelo deslocamento da diagonal do quadrado sobre um dos lados, resultando no retângulo raiz de 2. Para se obter um retângulo raiz de 3, procede-se de maneira idêntica, tomando-se como base o retângulo raiz de 2, e assim por diante.

A imagem abaixo exemplifica de forma bem prática como se procede para obter os retângulos dinâmicos:


Esquema de construção do retângulo raiz de 2

Cabe ao profissional saber quando é possível desenvolver o projeto através destes sistemas de proporção, uma vez que eles possuem tanto aspectos positivos quanto negativos.


Regra dos terços

A regra dos terços é um dos sistemas proporcionais mais conhecidos e mais utilizados, não apenas no design, mas também em outras áreas, como as artes visuais e a fotografia. Esse é o sistema mais fácil de ser aplicado, principalmente em fotografias. Garante bons resultados se usado corretamente permite equilibrar os elementos e harmonizar o todo.

Foto por Claudia Regina

A regra dos terços se baseia na divisão da área da composição em 3 divisões horizontais e 3 verticais. Os pontos onde as linhas se sobrepõem são os locais com maior impacto visual, sendo assim, são as melhores zonas para localizar elementos importantes da composição.

Quando se faz uso da regra dos terços, é importante que se leve em consideração que alguns pontos devem ser ocupados com espaço "em branco" ou negativo, para criar áreas de respiro dentro da composição.

Lógica matemática

Outra estratégia de composição é usar sistemas matemáticos para solucionar a composição, uma técnica bastante utilizada quando combinada com proporções áureas, por exemplo. Exige certo trabalho mas garante excelentes resultados.

Uma das técnicas mais conhecidas e mais antigas é a seqüência Fibonacci, desenvolvida pelo matemático Leonardo Fibonacci no século XIII. Na sequência Fibonacci, a soma dos dois termos anteriores resulta no próximo valor (1,1,2,3,5,8,13,21,…). Embora seja a mais conhecida e uma das mais utilizadas, a seqüência Fibonacci não é a única possibilidade de sistema proporcional com lógica matemática. Qualquer tipo de progressão matemática pode ser um ponto de partida: números ímpares (1:3:5:7…), sistemas de metades (1:2:4:8…), você pode inclusive multiplicar ou dividir elementos da sua composição por um mesmo número, conforme a sua necessidade.

O mais interessante em relação à sequência de Fibonacci é que, conforme os números aumentam, eles vão se aproximando da proporção áurea caso você divida um número pelo número anterior, veja os exemplos:
1 / 1 = 1
2 / 1 = 2
3 / 2 = 1,5
5 / 3 = 1,66
8 / 5 = 1,6
13 / 8 = 1,625
21 / 13 = 1,615
34 / 21 = 1,619 (na trave)
55 / 34 = 1,617 (na trave)
89 / 55 = 1,6181818… (Wow! muito próximo da proporção áurea)

E assim vai. A sequência Fibonacci nunca chegará exatamente à proporção áurea, mas se aproxima bastante. Por esse motivo, podemos usá-la (a partir do número 21, de preferência, pois os números anteriores estão ainda longe da proporção áurea). Por exemplo, se você está diagramando um artigo, uma coluna pode ter 21cm enquanto a outra tem 13cm, e assim fugimos dos números quebrados.

Conclusão

Com estas técnicas você pode desenvolver qualquer layout para folders, sites, livros, revistas e  inclusive cartões de visita. Algumas pessoas pensão que cartões de visitas (falei um pouquinho sobre como fazer um cartão de visitas aqui) são simples de fazer e não se preocupam com proporções entre os elementos porque acham que é apenas um pedaço de papel. Não é bem assim! Mas isso já é assunto para outro post.