QuemSobeMaisSobre
Um prédio de vidro no meio do céu onde cada andar é um site brasileiro, e a altura tem preço de tabela.
A ideia
Todo diretório de produto vira concurso de popularidade, com regra que ninguém explica. Aqui a regra é escancarada: o ranking é o extrato bancário. Não existe algoritmo para decifrar — existe um prédio, e o andar de cima é de quem pagou mais por ele.
O que você leva
- Um andar visível com o logo, o domínio e a descrição lidos do seu site.
- Um link direto para visitação, clicável de dentro do prédio.
- Uma página própria em
/andar/seu-dominio, com metadados e canonical próprios. - O selo verde de contratando, se estiver com vaga aberta.
- Chegando ao primeiro lugar: laje dourada, um brilho que atravessa a fachada, uma corneta em cada canto e a faixa do avião que circula o prédio.
Como foi construído
- Next.js no App Router, com React Server Components.
- O prédio em three.js, via React Three Fiber.
- Supabase para banco de dados e tempo real.
- AbacatePay no Pix.
- Tailwind na interface e Vercel na hospedagem.
O prédio, a régua e os anúncios são gerados em tempo de execução: cada faixa de andar é uma textura desenhada em canvas com o logo e a descrição do site.
Créditos dos modelos 3D
Pessoas, carros, árvores, nuvens e móveis vieram do Poly Pizza, com autoria de Quaternius (pessoas, viatura, SUV, poste e sofá), Ignition Labs (sedã), NateGazzard (drone), Vojtěch Balák (avião), Kieran Farr (guindaste), BAS NEGGERS (corneta), Kenney (base do prédio), ParfaitUwU e Poly by Google (árvores e nuvem) e CreativeTrio (mesa).
Inspiração
A mecânica é inspirada no TopFloor.Company. Esta é a leitura brasileira dela: preço em real, altura em metros, Pix no lugar do cartão, categorias daqui e drone circulando o prédio.