READY GO — Um site de agência em que o título é o showreel
A READY GO é uma agência digital. O site precisava provar a versatilidade da agência nos três primeiros segundos, então o próprio título é a demonstração: uma frase fixa cuja última palavra não para de mudar.
Desafio
Todo site de agência diz que é versátil, e todos dizem isso num parágrafo. A prova precisa ser o próprio trabalho, não o texto — mas a página inicial ainda tem que dizer com clareza o que a empresa faz, ou vira um portfólio que ninguém consegue classificar.
Abordagem
O título afirma o fato — uma agência digital — e depois a última palavra passa pelos serviços oferecidos: produção, estratégia, merchandising, criação. A afirmação e a demonstração cabem na mesma frase, e as imagens dos projetos se espalham em volta dela em vez de ficarem numa grade embaixo.
Um título que se apresenta
“Somos uma agência digital. As pessoas nos procuram para…” — e então a última palavra muda. Cada variação é desenhada como lettering próprio, e não composta numa fonte, então cada estado da frase é uma peça tipográfica em si.
A primeira linha responde à pergunta “o que é isto?” e a segunda mostra a versatilidade, sem uma única frase de autodescrição.
Lettering como identidade
As palavras grandes são arte vetorial, não texto. É isso que dá a cada rotação o próprio peso e a própria distorção, e é por isso que o título se lê como um objeto desenhado, e não como um efeito de animação aplicado a um texto.
A troca é intencional e vale dizer: como as palavras são contornos, elas são imagens, e não texto selecionável — então o texto ao redor carrega o significado para tudo o que lê a página de forma automatizada.
Projetos espalhados, não em grade
As imagens dos projetos flutuam nas bordas do título, em tamanhos e ângulos variados, e mudam junto com a frase. Uma grade convencional diria “template de agência”; a dispersão diz que o layout foi feito para esse conteúdo.
Contenção em todo o resto
A navegação são três links simples. Não há vídeo na primeira tela, indicador de rolagem nem teatro em volta do aviso de cookies disputando com o título. Tudo o que o site tem para gastar, ele gasta num lugar só.
Desenvolvimento
Next.js, servido por trás do nginx. O título rotativo pré-carrega a arte da próxima palavra para que a troca nunca caia num quadro vazio.
O que entregamos
- Título rotativo com lettering desenhado sob encomenda para cada variação
- Imagens de projetos espalhadas que mudam junto com o título
- Navegação de três links, sem elementos concorrendo na primeira tela
- Desenvolvimento em Next.js e Tailwind CSS num servidor Node.js próprio
Perguntas frequentes
Porque uma agência precisa provar a versatilidade, e não só afirmá-la. Girar a última palavra de uma frase fixa diz o que a empresa faz e mostra o trabalho na mesma linha.
Cada variação é desenhada para ter o próprio peso e a própria distorção. O custo é que essas palavras são imagens, e não texto selecionável, então o texto ao redor carrega o significado para tudo o que lê a página de forma automatizada.
Next.js e React com Tailwind CSS, num servidor Node.js próprio.
Por dentro do site
“Queríamos que o próprio site mostrasse do que a nossa agência é capaz, e a Sakura acertou em cheio. A tipografia em movimento e o layout dão muita personalidade ao site sem deixá-lo confuso.”