Pular para conteúdo
Logo
Overview
TRANSFORMANDO A ESCOLHA DE VAGA DE GARAGEM NUMA OPORTUNIDADE DE APRENDER

TRANSFORMANDO A ESCOLHA DE VAGA DE GARAGEM NUMA OPORTUNIDADE DE APRENDER

November 7, 2026
7 min read

Aqui onde moro as vagas são sorteadas a cada 3 anos. 60% das vagas são boas, mas o restante ou é longe ou precisa de muita manobra para entrar.

É o 4º sorteio que participo. Em todos eles tentei fazer algo para facilitar a minha vida e, estratégicamente, escolher as vagas que são melhores para o perfil da minha família. Usei planilha com fórmulas num ano, planilha com macros e, agora com a IA, mais um feriado de 3 dias, fiz uma aplicação completa.

O primeiro desafio era como fazer o app saber onde são as vagas. Recebemos um PDF, de boa resolução, exportado do CAD, e isso foi decisivo para o sucesso.

Do PDF ao mapa clicável

Após algumas interações com o CODEX GPT Sol 6.1, chegamos a conclusão que a primeira solução seria separar o desenho da interação. Renderizamos então a planta como uma imagem e colocamos por cima uma camada SVG, com áreas clicáveis nas posições das vagas. O desenho continua sendo a imagem do PDF, e o SVG cuida das marcações.

Outro desafio foi a orientação das vagas. Algumas são “de pé”, outras “deitadas” e outras tortas. Resolvi isso marcando circulos no meio da vaga, como no video.

Não é feitiçaria, é tecnologia!

Mobile e as ações de tocar, localizar e ampliar

Com a camada pronta, tocar numa vaga destaca as vagas daquele grupo e mostra quais fazem parte dele. Também dá para escolher o grupo pela lista, sem procurar o número no desenho inteiro.

Como eu tinha certeza que a maioria dos vizinhos ia usar celular, coloquei nos docs e no AGENTS.md a instrução de focar em mobile, com as funções de arraste e zoom com pinça como prioridade.

O legal é que esse componente base acabou servindo tanto para consulta quanto para montar as preferências que explico a seguir. A função de localizar um item da lista troca o piso quando necessário, centraliza o grupo e faz as marcações piscarem por alguns instantes.

Minha cola para o sorteio

Depois do mapa, fiz o módulo de minhas vagas preferidas. A idéia era um bloco de notas, que seria preenchido na ordem das vagas que eu escolho. Tocar num grupo inclui ou remove a opção, além de subir, descer e excluir os itens, enquanto as escolhas continuam destacadas na planta.

Lista ordenada de preferências de grupos de vagas, com opções já escolhidas riscadas.

Exemplo de preferência de vagas - as riscadas vem do módulo “Ao Vivo”

Esse bloco de notas é a própria lista ordenada, não um campo de texto livre. A lista pertence ao apartamento, então os moradores cadastrados da mesma unidade consultam e, enquanto as edições estiverem abertas, alteram as mesmas preferências.

Também incluí o envio de uma cópia por e-mail. É uma cola para acompanhar a escolha, não uma reserva de vaga. Conforme os resultados são registrados no acompanhamento do sorteio, os grupos já escolhidos ficam riscados na lista e apagados no mapa, e a próxima opção livre recebe destaque.

Cópia por e-mail da lista de preferências, formatada em três colunas para impressão.

Email enviado formatado para imprimir

A hora mais esperada - o sorteio

Para o sorteio eu fiz um módulo no Admin onde, por torre, escolho o apartamento conforme os grupos, e a vaga que o apartamento escolheu. Esse foi o mais útil, pois já retroalimentava o bloco de notas

Painel administrativo do sorteio, com identificadores dos apartamentos ocultados.

Eu fui o 67º a ser sorteado…

Curiosidade: Esse dev deixei para o final e fiz em 10 minutos… Ou seja, se a fundação é boa, fica fácil!

E depois da escolha?

Acrescentei uma tela para ajudar na troca das vagas, cruzando a atribuição anterior com a nova. Ela mostra de onde o morador sai, para onde vai e quem precisa liberar ou ocupar cada lugar.

Tela de troca de vagas com etapas do sorteio e indicação do grupo atual e do próximo grupo.

Mais didático, impossível!

Há um detalhe interessante nessa parte: a troca pode formar uma cadeia ou um ciclo entre apartamentos. O código percorre essas relações e monta um passo a passo, em vez de mostrar apenas dois números de vaga e deixar toda a coordenação por conta de quem está olhando. E tem explicação na tela também:

Exemplo de um ciclo de troca de vagas entre três apartamentos, com referências de localização ocultadas.

Como dizia Silvio Santos, Roda a Roda!

A parte de comunidade

Troca de vagas ocorre a cada 3 anos, daqui 1 mês não vamos usar mais nada disso…

Mas seria uma pena não aproveitar o cadsastro dos meus vizinhos, então eu já comecei uma “mini comunidade” com 2 módulos

Grupos de Whatsapp: link para entrar nos grupos de desapego e do condomínio

Grupos da comunidade organizados por categoria, com referência de localização ocultada.

Suporta Whatsapp e Telegram

Indicação de Prestadores: Estilo rede social, que você pode tanto indicar um novo prestador como também avaliar um já indicado

Tela de indicação e avaliação de prestadores, com nomes de terceiros ocultados.

Exemplo da tela de prestadores, indicações entre moradores

IA e “Mini RAG” das atas e convenção

Esse aqui eu fiz relativamente rápido. Pedi para o Opencode, com o Deepseek gratuito fazer um scrape dos PDFs das Atas - Com OCR das que não estavam com texto - E guardar em um banco SQLite dedicado. Depois pedi para o mesmo Opencode, com o modelo Stealh “Crouton Alpha”, que dizem ser da Meta, analisar os dados e enriquecer a base com os relacionamentos.

Assistente pesquisando atas e normas para responder a uma pergunta sobre andar de skate.

Nada como uma inferência grátis no café da manhã…

O motor é o SDK da OpenAI, com a API do Openrouter e o modelo Crouton Alpha

Resposta do assistente com restrições por área e referências às fontes consultadas.

Pode ou não andar de skate?

Stack, Login e Admin

Por comodidade, parti do Astro 7 + SQLite com componentes interativos em React. O login fica com o Better Auth, por Google ou link mágico enviado por e-mail, usando o Nitrosend, que tem limites mais generosos que o Resend no plano free.

Incluí uma etapa de aprovação do cadastro para evitar SPAM e quem não é morador.

As plantas, os dados do mapa e os SVGs ficam fora da pasta pública e são entregues por uma API que verifica a sessão e a aprovação do perfil.

Para os dados do app, uso Drizzle no meu banco de dados SQLite em arquivo. A aplicação roda em um contêiner no meu servidor, com volume persistente para o banco sobreviver à troca do contêiner, tudo orquestrado pelo coolLabs Solutions Kft. Coolify. Deploy automático, faço push, “magicamente” está no ar.

Para o design usei meu outro projeto https://designmd.app/library/cad-inspired-blueprint - Só troquei para fundo claro

Tela inicial do app com mapa de vagas, preferências, troca e assistente do condomínio.

Fala aí, ficou até que bonitinho…

Aprendizado, esforço e próximos passos

Ao todo estimo que gastei umas 8h nesse projeto. Diferente de outros que eu fico um tempo inicial nos docs, nesse aqui exercitei um “Vibe Coding”, especificando e criando cada módulo na hora. Lógico que algumas experiências anteriores, de saber de cabeça as regras de sorteio e o que “orna” contou bastante, mas no fim eu fiquei bastante contente com o resultado.

Durante a contrução, identifiquei que uma fragilidade aqui é não validar quem é relamente morador, por isso esse app vou desativar logo após o sorteio, pelo menos as informações de vagas, até que eu descubra uma forma de fazer isso de forma fácil e que não me dê trabalho. Já pesquisei e o app do condomínio oficial expõe uma API, esse talvez seja um caminho.

O aprendizado é que uma POC / MVP precisa ser muito mais que um “mock” bonitinho, ele precisa ser minimamente, além de viável, funcional.

E aí? O que achou? O que falta para você tirar aquela sua idéia do papel? Se até eu consigo, tenho certeza que você consegue!

E, como sempre, se ficou alguma dúvida ou quer trocar idéia sobre qualquer aspecto aqui, só me chamar!

Para conhecer outros projetinhos de fim de semana como esse https://ft.ia.br

Publicado originalmente no LinkedIn em 07/11/2026.

Leitura Relacionada