Quem anuncia quer ver onde a tela está.

O problema

Mídia indoor se vende por lugar. O dono de uma loja só paga para aparecer numa tela se souber em qual estabelecimento ela está, que público passa por ali e se ainda há espaço. Uma lista de endereços num folheto não responde nada disso, e envelhece na semana em que uma tela nova é instalada.

O que foi construído

Um site de página única pensado como vitrine da rede, com um painel por trás para quem opera.

• Mapa de satélite da rede. Cada ponto aparece no lugar exato, com filtro por situação (no ar, instalando ou livre), busca por ponto ou bairro, raio de alcance desenhado e a contagem de telas atualizada sozinha.
• Planos com a conta feita. Três faixas, com alternância entre mensal, semestral e anual, o custo por dia calculado e o tempo de tela por rodada mostrado em barra.
• Pedido de proposta que chega pronto. O visitante escolhe o plano e descreve o que quer divulgar; o formulário mostra ao vivo como a mensagem vai chegar e abre o WhatsApp com tudo escrito.
• Painel administrativo. A SmartScreen cadastra e move pontos no mapa, troca a promoção em destaque e controla os anunciantes com a data de fim de cada contrato.

As decisões técnicas

O site e o painel leem a mesma fonte. Os pontos vêm do banco de dados, então o que o operador salva no painel é o que o visitante vê no mapa na próxima visita. Não existe um arquivo para editar e publicar de novo a cada tela instalada.

O que é público e o que não é, separado no banco. Os pontos da rede são abertos de propósito, porque o mapa é o argumento de venda. Já a lista de anunciantes e seus contratos só é lida por quem está logado no painel: a regra está no próprio banco, não escondida na tela. Conferido de fora, com a chave pública do site, a lista de anunciantes volta vazia. E não é possível criar conta por conta própria.

Continua de pé se o banco falhar. Se a conexão com o banco não responder, o mapa carrega um conjunto de pontos de reserva que já vem junto com o site, em vez de mostrar um mapa vazio.

O resto do cuidado de sempre. Tema claro e escuro, página de privacidade que diz com exatidão o que o formulário coleta (e que ele não guarda nada), página de erro própria, seis blocos de dados estruturados com as dez perguntas frequentes, e nenhum rastreador de terceiros.

Números do projeto

Tecnologias

HTML, CSS e JavaScript no site, Leaflet com imagem de satélite para o mapa, e Supabase (PostgreSQL com regras de acesso por linha e autenticação) por trás do mapa e do painel. Veja como a GMW constrói um sistema sob medida.

Telas do site

Capturas do site público no ar. O painel administrativo fica fora da galeria, porque mostra os anunciantes e os contratos da SmartScreen.