Colofão

Como este site foi feito.

O site de um estúdio é o primeiro produto que você avalia. Este é o registro de como ele foi desenhado e construído — as decisões, os materiais e o carimbo.

№ 01

A obra assinada

Na tradição coreana, um trabalho terminado recebe o dojang — o carimbo pessoal entalhado à mão, prensado em pasta de cinábrio. O carimbo é o certificado: uma pessoa fez isto, e assina.

É exatamente o que o estúdio vende: design e engenharia pelo mesmo par de mãos, do primeiro traço ao deploy. Por isso o site trata cada projeto como uma obra catalogada e selada — fichas, números de registro e o 강 (Kang) prensado ao final.

№ 02

Tinta e papel

A paleta vem do material, não de uma tendência: papel hanji, tinta preta quente e um único acento — o cinábrio do carimbo, racionado a momentos de assinatura e aos numerais de registro. Nada de sombras nem cantos arredondados; a profundidade fica por conta dos fios de tinta, da inversão para o preto no rodapé e do grão de papel sobre a página inteira.

#F6F2E8 · papel · paper
#1B1712 · tinta · ink
#575044 · tinta 2 · ink 2
#BE3B1F · cinábrio · cinnabar
#161209 · noite · night
№ 03

Tipografia

O display e o texto são Hahmlet, da Contrast Foundry — uma serifa variável desenhada para o convívio entre o hangul e o alfabeto latino, com linhagem nos primeiros tipos móveis coreanos. É a única família que é, literalmente, sobre o nome deste estúdio.

A voz de apoio é a IBM Plex Mono: rótulos, fichas técnicas, números e formulários — o livro-razão do engenheiro. A ênfase nos títulos não usa itálico: é contraste de peso, do 600 entalhado ao 300 leve, como pressões diferentes da mesma faca.

Neste redesenho a metáfora ficou literal. Nos títulos da capa e dos estudos de caso, o peso da Hahmlet (300 a 650) acompanha a proximidade da sua mão, palavra por palavra, amortecido por uma mola — o tipo cede como papel sob pressão, e volta ao peso de descanso quando a mão se afasta. O corpo do texto nunca se move. No toque, uma única prensada sutil; com prefers-reduced-motion, pesos estáticos.

№ 04

O carimbo vivo

O carimbo da capa não é uma imagem — é prensado ao vivo. Um gerador determinístico (mulberry32) alimenta uma máscara de ruído que desgasta as bordas, varia a densidade da pasta e desloca o registro alguns décimos de grau, como um carimbo de verdade nunca imprime igual duas vezes. Cada impressão ganha um número.

E agora a impressão vive. Depois de assentar, os próprios pixels carimbados se dissolvem em 2.000–6.000 partículas de cinábrio suspensas no papel, que respondem à sua mão como tinta em água rasa — pesadas, viscosas, arrastando fantasmas de tinta 2. Quatro segundos de quietude e a tinta escorre de volta: o selo se prensa de novo, com número novo e desgaste novo. Tocar no selo força a prensa na hora.

Tudo em canvas 2D e arrays tipados — sem WebGL, sem bibliotecas. Um único loop, pausado quando o herói sai da tela ou a aba dorme. A quantidade de partículas escala com o hardware e com um orçamento de quadro medido ao vivo: se um quadro estoura, o campo derrama tinta; se insiste, volta a ser só a prensa. Sem JavaScript, fica a impressão estática em SVG. Com prefers-reduced-motion, o selo fica prensado e quieto — zero partículas, zero deriva.

toque para carimbar de novo

№ 05

Movimento

O inventário completo. O selo prensa e dissolve na capa. A navegação é uma lâmina de tinta — cinábrio na frente, tinta atrás — que varre a tela em ~450 ms: indo, da esquerda para a direita; voltando ao catálogo, ao contrário. O conteúdo não faz fade — imprime: um assentar de carimbo de 200 ms, sem quique, com os numerais de registro prensando com uma deriva mínima de rotação, eco do grão do selo. Nos trabalhos, um sangramento de cinábrio varre sob o título e um 강 em miniatura, com desgaste próprio, prensa no canto da prancha — clicar é carimbar aquela obra. Nos estudos de caso, um trilho de registro acompanha a leitura como as marcas de margem numa prova de gráfica, em CSS puro. E o rodapé assina uma vez por sessão: o 강 desenhado na ordem dos traços. Animação é oração, não papel de parede.

Cada momento acima se justifica em uma frase com as palavras tinta, selo, prensa ou papel. O que não passou nesse teste, não entrou. Com prefers-reduced-motion, a navegação vira um crossfade de 150 ms e todo o resto fica parado — e completo.

№ 06

Medidas

Astro estático, sem framework no cliente além do necessário para o carimbo, a pressão do tipo e o formulário. O JavaScript do site inteiro cabe em menos de 60 KB comprimidos — o campo de tinta, sozinho, em menos de 30 — e o estúdio não deve nada a nenhuma biblioteca de animação nem a scripts de terceiros. Fontes hospedadas junto com o site, em subsets — o hangul só baixa a fatia que a página usa. Bilíngue de verdade (pt-BR e inglês, com hreflang), contraste mínimo de 4,5:1, foco visível em tudo, e o mesmo cuidado nas páginas que ninguém indexa.