Site de demonstração de uma imobiliária inventada no lago de Como: a página inicial é um filme que desliza do lago até à pesquisa, depois 24 anúncios em 14 zonas com o mapa do lago, páginas com galeria e uma área de crédito à habitação com dados reais do BCE. O painel do proprietário experimenta-se sem conta.
**A Ardesia Immobiliare não existe**: é uma imobiliária inventada no lago de Como, construída como os sites que faço para negócios reais. Os anúncios, as pessoas e as fotos são inventados, e as fotos foram geradas na GPU do meu computador com um modelo aberto; os dados de crédito à habitação são reais, descarregados do BCE e do Eurostat. O site di-lo em todas as páginas.
**O que faz**
- **A página inicial é um filme**: ao deslizar, desce-se sobre o lago, entra-se na sala de uma moradia e chega-se a um terraço ao pôr do sol, onde começa a pesquisa. - **A pesquisa**: 24 anúncios em 14 zonas, com filtros por contrato, tipo, zona, preço, área, divisões e características, e uma vista de mapa do lago que filtra a lista. - **As páginas dos imóveis**: uma galeria em ecrã inteiro, os dados técnicos com a classe energética, a zona e o pedido de uma visita. - **Crédito e parceiros**: as taxas dos novos créditos à habitação em Itália desde 2015, com a Euribor e a taxa do BCE, os preços das casas, um simulador da prestação e os profissionais em quem a agência confia. - **As estatísticas de visitas**, sem cookies e sem guardar o endereço de quem visita.
**O painel, para experimentar sem conta**
O proprietário atualiza tudo num painel pensado para o telemóvel: os anúncios com as fotos, os pedidos recebidos, os parceiros, as pessoas, os textos, a cor e as secções do site, com «Ripristina» (anular) depois de cada gravação e um lixo. No site, «Prova il pannello» (experimentar o painel) abre-o sem conta: as alterações ficam no navegador de quem experimenta, porque a lógica do servidor corre lá, sobre uma cópia dos dados.
**A parte difícil**
Correr a mesma lógica em dois sítios, no servidor com MongoDB e no navegador para a experiência, sem que as duas versões se afastem. Os serviços estão num pacote partilhado, sobre um contrato dos dados, e um teste automático envia os mesmos pedidos ao servidor e à cópia no navegador e exige respostas iguais. E o filme da página inicial pesa 0,90 MB no primeiro carregamento no computador: as cenas seguintes descarregam-se enquanto se desliza.
Vue 3 e TypeScript, Fastify e MongoDB, GSAP para o filme, ECharts para os gráficos; cada alteração passa por 381 testes automáticos, e o site está publicado no meu servidor, com uma cópia noturna da base de dados.
Conceção, desenvolvimento full-stack e publicação · 2026
Vue.js, Fastify, MongoDB, GSAP, Z-Image-Turbo