Você já deve ter visto a imagem: o logo da Apple coberto de círculos perfeitos, todos em proporção áurea, como se a maçã tivesse saído de uma equação. Ela circula em apresentação de agência, em curso de design e em post de rede social com a legenda "por isso é genial". O homem que desenhou a maçã, em 1977, diz que fez tudo à mão, olhando para maçãs de verdade.
A proporção áurea é uma das ideias mais repetidas do design e uma das mais mal contadas. Ela tem história de verdade, tem uso prático e tem muito mito colado por cima. Este artigo separa uma coisa da outra.
O retângulo áureo dividido em quadrados de Fibonacci (13, 8, 5, 3, 2, 1 e 1) e a espiral que passa por dentro deles. É a imagem mais famosa da proporção áurea, e também a mais sobreposta a coisas que nunca foram desenhadas com ela.
O que é a proporção áurea
Dois segmentos estão na proporção áurea quando a soma dos dois, dividida pelo maior, dá o mesmo resultado que o maior dividido pelo menor. Esse resultado é um número irracional, representado pela letra grega φ (phi):
φ = (a + b) / a = a / b ≈ 1,6180339887…
O número aparece também na sequência de Fibonacci, aquela em que cada termo é a soma dos dois anteriores: 1, 1, 2, 3, 5, 8, 13, 21… Divida qualquer termo pelo anterior e o resultado oscila em torno de 1,618, chegando cada vez mais perto.
3 dividido por 2 dá 1,5; 5 por 3 dá 1,667; 8 por 5 dá 1,6. A partir de 21 dividido por 13, a diferença para φ já está na terceira casa decimal.
De Euclides ao "número de Deus"
Euclides já descrevia a relação em Os Elementos, com o nome de "razão extrema e média". Por quase dois mil anos, ela foi assunto de geometria. A virada estética veio no Renascimento, com o livro De Divina Proportione, de 1509, escrito pelo matemático Luca Pacioli e ilustrado por Leonardo da Vinci. O título deu o apelido que pegou: divina proporção.
O salto para "lei universal da beleza" é bem mais recente. Em 1854, o alemão Adolf Zeising publicou um tratado defendendo que φ governava as proporções do corpo humano, das plantas e de toda a grande arte e arquitetura do Ocidente. O matemático Keith Devlin, de Stanford, chama essas ligações de especulação pura. Mas a ideia colou, e é dela que vem boa parte do misticismo em torno do "número de Deus".
O que os livros antigos realmente usavam
Se existe um lugar em que a busca por proporções produziu método de verdade, é o design de livros. No século XX, tipógrafos e pesquisadores como Jan Tschichold, J. A. van de Graaf e Raúl Rosarivo estudaram manuscritos medievais e os primeiros livros impressos para reconstruir as regras que os mestres usavam para posicionar o texto na página. O resultado ficou conhecido como cânones de construção de página.
O mais famoso é o cânone de Van de Graaf. Ele usa só diagonais: as da página dupla e as de cada página. Onde elas se cruzam, nascem os cantos do bloco de texto.
Numa página de proporção 2:3, o cânone divide a folha em nonos: margem interna de 1/9 da largura, superior de 1/9 da altura, externa e inferior com o dobro disso. O bloco de texto ocupa dois terços da página e tem a altura igual à largura da folha.
Em Divina proporción tipográfica, de 1947, Rosarivo mostrou que Gutenberg, Peter Schöffer e Nicolaus Jenson dividiam as diagonais da página em nonos para achar a posição e o tamanho do texto. Tschichold popularizou essas regras em A Forma do Livro e explicou a construção em detalhe.
| Cânone | Página | Margens (interna : superior : externa : inferior) | Quem |
|---|---|---|---|
| Van de Graaf | qualquer proporção, ideal 2:3 | 2 : 3 : 4 : 6 | reconstrução do século XX |
| Cânone de Tschichold | 2:3 | 2 : 3 : 4 : 6 | Jan Tschichold, A Forma do Livro |
| Divina proporção tipográfica | 2:3 | divisão por compasso e régua | Raúl Rosarivo, sobre Gutenberg |
Por que a beleza não mora num número
O primeiro problema é matemático. Como φ é irracional, as casas decimais seguem para sempre sem repetir. "Estritamente falando, é impossível algo no mundo real cair na proporção áurea", disse Devlin à Fast Company. Tudo o que existe é aproximação, e uma página 2:3 ou uma tela 16:9 chegam perto o bastante.
O segundo problema é psicológico. A explicação mais aceita hoje para a sensação de beleza é a fluência de processamento, descrita por Rolf Reber, Norbert Schwarz e Piotr Winkielman em 2004: achamos bonito aquilo que o cérebro processa com facilidade. Simetria, contraste, ordem e repetição ajudam nisso. Uma proporção específica, sozinha, não garante nada.
O terceiro problema é humano. A gente tem uma tendência forte de enxergar padrão onde ele não foi colocado, o nome técnico é apofenia. Desenhe uma espiral áurea por cima de qualquer quadro, rosto ou logo, ajuste a posição com paciência e ela vai "encaixar" em algum lugar. O encaixe diz mais sobre quem desenhou a espiral do que sobre a obra.
E há o olho, que não lê régua. Na tipografia, as formas redondas passam um pouco da linha de base e da altura das letras retas, senão parecem menores. Os traços horizontais costumam ser um pouco mais finos que os verticais para parecerem iguais. A geometria exata, aplicada ao pé da letra, sai torta para quem vê.
Com a mesma altura matemática, o círculo parece menor que o quadrado. Para os dois parecerem do mesmo tamanho, o círculo precisa ultrapassar um pouco as linhas de topo e de base. É assim que se desenham o "O" e o "o" em qualquer fonte bem feita.
A maçã desenhada à mão
Rob Janoff criou o logo da Apple em 1977, na agência Regis McKenna, para o lançamento do Apple II. Numa entrevista ao blog Revert to Saved, ele conta que comprou maçãs, colocou numa tigela e passou uma semana desenhando até simplificar a forma. Na entrevista, ele fala em observar e simplificar; compasso e Fibonacci não entram na história.
A mordida tem uma função bem prática: garantir que a fruta fosse lida como maçã, e não como cereja, quando o logo aparecesse pequeno. As histórias que vieram depois, como a ligação com Alan Turing, Janoff descarta. O trocadilho com byte, o termo de computação, ele chama de acidente feliz.
E os famosos círculos? Quando o Gizmodo mediu os círculos do diagrama, as divisões no canto inferior esquerdo deram 3 : 4,4 : 7,5, uma relação que não é a proporção áurea nem qualquer progressão de Fibonacci. Os diagramas de círculos foram desenhados por terceiros, depois, por cima de um logo pronto.
A Pepsi e as 27 páginas de pseudociência
O caso oposto é o da Pepsi. Em 2008, a agência Arnell Group redesenhou o globo da marca e justificou o trabalho num documento de 27 páginas chamado "Breathtaking Design Strategy". O texto vazou e virou piada no mercado: para defender um logo de refrigerante, ele citava feng shui, o campo magnético da Terra, o teorema de Pitágoras, a Mona Lisa e a proporção áurea, e falava num "Pepsi Ratio". O redesenho custou, segundo relatos da época, mais de US$ 1 milhão.
O documento original ainda circula, e a Creative Bloq o chama de ridículo sem meias palavras. O desenho em si até funcionava. O problema estava na justificativa: a matemática virou fachada para vender ao cliente uma decisão que, como qualquer decisão de design, saiu do briefing e do olho de quem desenhou.
| Apple (Janoff, 1977) | Pepsi (Arnell, 2008) | |
|---|---|---|
| Como nasceu | desenho à mão, depois refinamento óptico | construção vetorial com círculos |
| Por que é assim | legibilidade em tamanho pequeno | narrativa para o cliente |
| Proporção áurea | sobreposta por terceiros, depois | usada como argumento de venda |
| A medição | os círculos não dão 1,618 | geometria funcional, teoria inventada |
| Recepção | clássico da identidade visual | piada do setor |
Desconfie de qualquer apresentação que use a proporção áurea como prova de qualidade. Espiral desenhada por cima de logo pronto é pós-racionalização: a decisão veio antes, a matemática veio depois para impressionar.
Onde a proporção áurea ajuda de verdade
Sem o misticismo, φ continua sendo uma boa ferramenta de partida. No design de sites, ninguém trabalha com 1,618 exato em pixels fixos, porque o layout precisa se adaptar a telas de todos os tamanhos. O que funciona são aproximações: 60/40, ou 3/5 e 2/5 numa grade flexível.
Na primeira dobra de um site, a coluna maior, com cerca de 60%, fica com o título, o texto de apoio e o botão. A menor, com 40%, fica com a imagem. A leitura segue um caminho previsível e a imagem apoia sem competir com a mensagem.
A Elegant Themes tem um passo a passo para montar essa primeira dobra com Flexbox. A outra aplicação útil é a escala tipográfica: partindo de 16 px para o texto, cada nível de título é o anterior multiplicado por 1,618.
A escala de 1,618 dá saltos grandes entre os níveis. Funciona bem em páginas com poucos níveis de título e muito espaço, como landing pages. Em interfaces densas, fatores menores, como 1,25 ou 1,333, costumam funcionar melhor.
No código, dá para registrar a escala em variáveis CSS e usar a função clamp() para o título crescer com a largura da tela:
:root {
--phi: 1.618;
--texto: 1rem;
--h3: calc(var(--texto) * var(--phi));
--h2: calc(var(--h3) * var(--phi));
--h1: clamp(2.5rem, 1.6rem + 3.5vw, calc(var(--h2) * var(--phi)));
}Como usar sem cair no mito
- Use φ como ponto de partida para proporções, escalas e grades, e decida no olho.
- Prefira aproximações que o layout aguenta: 60/40, 3/5 e 2/5, 5:8.
- Para texto longo, estude os cânones de página: margens generosas e desiguais organizam a leitura.
- Corrija no olho o que a régua errou: formas redondas um pouco maiores, traços horizontais um pouco mais finos.
- Na apresentação ao cliente, explique a decisão pelo problema que ela resolve. Espiral por cima do logo não é argumento.
A proporção áurea ajudou a construir alguns dos livros mais bonitos já impressos e ainda organiza bem uma página ou uma escala de títulos. Ela só perde valor quando vira dogma ou enfeite de apresentação. Na Oneck, as decisões de identidade visual saem do briefing e do olho treinado, e a matemática entra como ferramenta, nunca como desculpa.
Fontes
- Wikipedia, Golden ratio
- Wikipedia, De divina proportione
- Keith Devlin, "Fibonacci and Golden Ratio Madness", Devlin's Angle (2017)
- John Brownlee, "The Golden Ratio: Design's Biggest Myth", Fast Company (2015)
- Wikipedia, Canons of page construction
- Retinart, "The Secret Law of Page Harmony"
- Reber, Schwarz e Winkielman, "Processing fluency and aesthetic pleasure", Personality and Social Psychology Review (2004)
- Anthony Waichulis, "Fool's Gold: A Primer on Pictorial Composition"
- Revert to Saved, entrevista com Rob Janoff (2011)
- The Graphic Design School, Apple Logo History
- Gizmodo, "Does the Apple Logo Really Adhere To the Golden Ratio?"
- Logo Design Valley, Pepsi Logo History
- Creative Bloq, sobre o documento do redesenho da Pepsi
- Arnell Group, "Breathtaking Design Strategy" (2008), PDF
- Elegant Themes, hero section em proporção áurea com Flexbox
