Imagina só: cada linha de código que você escreve, cada repositório que você cria, virando um prédio numa metrópole digital? Pois é, a Git City fez isso!
Em um feito impressionante de desenvolvimento e viralização orgânica, a plataforma Git City emergiu em apenas 12 dias, transformando dados do GitHub em uma paisagem urbana virtual. Com zero investimento em marketing, o projeto não só atraiu milhares de desenvolvedores, mas também gerou receita significativa, desafiando as convenções do lançamento de produtos digitais.
A Cidade que Nasceu do Caos e da Colaboração: Como a Git City Moldou sua Experiência
Sabe aquela sensação de ver seu trabalho ganhando forma? A Git City pegou essa ideia e elevou a outro nível. A sacada genial foi transformar as contribuições do GitHub em algo visual, palpável. De repente, seu perfil não era só um monte de commits, mas um arranha-céu imponente numa metrópole digital. E, claro, a internet pirou!
A ideia viralizou mais rápido que meme de gatinho. Um post simples no X (antigo Twitter) explodiu, alcançando mais de 1 milhão de visualizações. A comunidade de devs abraçou a proposta, e o que era uma ideia virou um fenômeno orgânico, sem um centavo gasto em publicidade. De repente, a Git City estava em todo lugar: Reddit, TabNews, nos feeds de todo mundo que respira código.
Mas, como em toda cidade que nasce do nada, o caos inicial foi inevitável. Imagina só: um dev com um currículo de GitHub tão gigante que o prédio dele simplesmente quebrou a cidade inteira! Os outros prédios viraram pontinhos, e a paisagem urbana ficou desequilibrada. Esse tipo de "bug" não foi um problema, mas uma oportunidade. Cada novo usuário, cada interação, trazia um desafio inesperado, um edge case que o criador não tinha previsto. Foi a própria comunidade que, ao "quebrar" a cidade, ajudou a moldá-la e a torná-la mais robusta e justa para todos.
A experiência do usuário foi sendo lapidada dia após dia. O layout inicial, que era mais "tosco" (palavras do próprio criador!), deu lugar a uma metrópole organizada em espiral, com blocos de 4x4 prédios, ruas bem definidas e até um rio separando distritos. É como se a cidade tivesse passado por um processo de urbanismo digital, tudo para garantir que a navegação e a visualização fossem fluidas e intuitivas.
E não para por aí! A Git City não é só um visual bonito; ela é um ecossistema vivo e gamificado. Para manter a galera engajada, o projeto implementou:
- Achievements: Mais de 20 conquistas (Bronze, Silver, Gold, Diamond) para quem se destaca.
- Streaks: Check-ins diários para recompensar a consistência.
- Kudos: Um sistema para devs elogiarem o trabalho uns dos outros.
- Raids: Sim, batalhas PvP onde você pode "atacar" prédios de outros devs!
- Leaderboards: Rankings por contribuições, repositórios, estrelas e atividade.
Essa pegada de jogo transformou a plataforma em algo viciante, com uma taxa de bounce rate de apenas 12% (enquanto a média do mercado é 40-60%!). Ou seja, a galera entra e fica, explorando cada cantinho dessa cidade virtual. E o mais impressionante: quase metade dos visitantes (48% de conversão) faz o OAuth com o GitHub, mostrando o nível de interesse e confiança na plataforma.
E como toda cidade que se preze, a Git City já tem sua economia girando. Em apenas 12 dias, a plataforma faturou mais de R$1.586 com:
- Sky Ads (R$1.550): Marcas compram aviões, dirigíveis e outdoors voadores para anunciar na cidade. Um sistema self-serve que já atraiu 24 campanhas de 12 marcas únicas.
- Loja de Cosméticos (R$36): Itens visuais para personalizar o prédio, como antenas estilosas, jardins no topo, auras neon e hologramas. É o toque de design que a gente ama!
- Pixels (em breve): Uma moeda virtual própria para a cidade, prometendo expandir ainda mais as possibilidades de interação e personalização.
É a prova de que, com uma ideia inovadora e uma execução ágil, é possível construir um produto que não só engaja, mas também gera valor real, tudo isso com a comunidade como principal motor de crescimento.
Por Trás dos Pixels e Prédios: A Engenharia Inteligente da Git City e o Toque da IA
Por trás de toda essa cidade vibrante, existe uma arquitetura tecnológica de ponta, construída com uma agilidade que faria qualquer startup de unicórnio chorar de inveja. O criador da Git City sentou no dia 19 de fevereiro e, em apenas um dia, entregou o MVP (Produto Mínimo Viável). Do npx create-next-app ao deploy na Vercel, tudo funcionando: login com GitHub, prédios subindo na tela. Era tosco? Sim! Mas estava no ar, e isso fez toda a diferença.
A stack tecnológica escolhida é um show à parte, combinando ferramentas modernas para garantir performance e escalabilidade: Dev Tradicional Morreu?
- Frontend: Next.js 16 (App Router) + React 19 – O combo perfeito para interfaces dinâmicas e responsivas.
- 3D Engine: Three.js + @react-three/fiber v9 + drei v10 – A mágica por trás da renderização 3D da cidade, garantindo gráficos fluidos e imersivos.
- Database: Supabase (PostgreSQL + Auth + RLS) – Um backend robusto que cuida do banco de dados, autenticação e segurança.
- Pagamentos: Stripe (USD) + AbacatePay (PIX) – Soluções flexíveis para transações financeiras, incluindo o queridinho PIX brasileiro.
- Hosting: Vercel – Para um deploy rápido e eficiente, mantendo a cidade sempre online.
- Estilo: Tailwind CSS v4 + fonte pixel "Silkscreen" – O toque final para um visual moderno e com a cara do universo dev.
A forma como os prédios são gerados é um espetáculo de engenharia. Cada arranha-céu é uma representação visual de três métricas cruciais do GitHub, com pesos específicos para garantir uma cidade equilibrada:
- Contributions (55%): Definem a altura do prédio (entre 35 e 600 unidades). Quanto mais contribuições, mais alto seu império digital!
- Public Repos (10%): Influenciam a largura (de 14 a 38 unidades). Mais repositórios públicos, mais espaço seu prédio ocupa.
- Stars (35%): Determinam a porcentagem de janelas acesas (de 5% a 95%). Suas estrelas iluminam sua presença na cidade!
Para renderizar mais de 11 mil prédios sem travar o navegador, a solução foi usar instanced meshes. Em vez de criar um objeto 3D para cada prédio, o GPU é instruído a renderizar o mesmo modelo milhares de vezes em posições e transformações diferentes. É como ter um carimbo digital super eficiente. E para as janelas acesas, um atlas de texturas de 2048x2048 pixels, com 6 faixas de luminosidade pré-calculadas, garante um efeito visual incrível e super rápido.
O layout da cidade, como já mencionamos, é um primor de design. Organizado em espiral, com o dev rank #1 no centro, blocos de 4x4 prédios e ruas de 12 unidades. Um rio de 40 unidades separa distritos, adicionando um toque de realismo. E para manter o framerate lá em cima, um sistema de LOD (Level of Detail) simplifica os prédios distantes, garantindo que a experiência seja fluida mesmo em máquinas menos potentes.
Mas o que realmente faz a Git City ser um case de sucesso é a forma como ela foi construída: 100% do código foi escrito pelo Claude Code, uma inteligência artificial. O criador atuou como arquiteto, gerente de produto e QA, enquanto o Claude foi o engenheiro. Não é um simples "copia e cola" de prompts; é uma conversa contínua onde a IA tem acesso total ao projeto, entende a arquitetura, edita arquivos e até corrige erros. Quando o bug do prédio gigante apareceu, bastou descrever o problema para o Claude propor e implementar a solução da curva de potência. Esse ciclo de feedback rápido e a capacidade da IA de entender o contexto do projeto foram cruciais para a velocidade de iteração.
Essa jornada de 12 dias trouxe lições valiosas para qualquer um que sonha em tirar uma ideia do papel:
- Lance tosco, melhore rápido: O MVP inicial era imperfeito, mas estava no ar. A janela de viralização não espera pela perfeição.
- Usuários reais quebram tudo: Nenhuma simulação substitui a interação de pessoas reais. Os bugs são oportunidades de aprendizado.
- IA amplifica, não substitui: A inteligência artificial é uma ferramenta poderosa, mas exige um arquiteto humano que saiba o que pedir e entenda os conceitos por trás.
- O contexto é tudo: Uma IA integrada ao projeto, que "entende" o código, é infinitamente mais eficaz do que um chat genérico.
- Construa em público: Compartilhar o progresso gera engajamento, feedback valioso e uma comunidade apaixonada.
A Git City é um exemplo brilhante de como a inovação, a comunidade e a inteligência artificial podem se unir para criar algo verdadeiramente único e impactante no universo digital. Google Acelera IA em SP
A Git City continua a evoluir, um testemunho da inovação impulsionada pela comunidade e pela tecnologia.