Configurador de janelas — 10 passos, um motor de regras e uma pré-visualização 3D, diretamente no navegador.
Esta demo ao vivo mostra um configurador completo para um produto técnico: material, tipo de janela, medidas, tipo de abertura, perfil, cor e decoração, ferragens, puxadores, vidro e acessórios. Um motor de restrições mantém cada combinação válida, a pré-visualização 3D acompanha cada alteração e o preço atualiza-se ao vivo. É assim que construímos configuradores para fabricantes, distribuidores e profissionais.
Demo ao vivo: configure você mesmo
Escolha um material, defina as medidas, selecione abertura e vidro – anule ou refaça qualquer passo. O widget é carregado a pedido ao clicar em Iniciar.
Nota: Demo com catálogo de exemplo integrado: produtos, opções e preços são ilustrativos e não constituem uma oferta. Em produção, catálogo, regras e preços vêm do backend (API multi-inquilino) e o resultado é entregue à loja, ao CRM ou ao processo de orçamentação. Nesta demo não são recolhidos dados.
O que esta demo mostra tecnicamente
- Assistente de 10 passos com motor de restrições: combinações inválidas são bloqueadas ou corrigidas automaticamente
- Pré-visualização 3D em tempo real da janela (Three.js / React Three Fiber) – caixilho, folhas, profundidade do perfil e vidro acompanham cada alteração
- Preço ao vivo a partir de preço base, medidas, opções e suplementos, recalculado em cada passo
- Anular/refazer em toda a configuração, além de guardar e partilhar uma configuração
- Multi-inquilino: catálogo, regras e preços por cliente a partir de um backend JSON:API
- Entrega à loja: a configuração final vai para o carrinho (Shopware) ou para um pedido de orçamento
- Integrado como widget Shadow DOM isolado – sem conflitos de estilo com a página anfitriã, interface DE/EN
- Desempenho: carregamento ao clique, um único ficheiro autónomo, sem pedidos externos
Do configurador à pipeline quote-to-order
Um configurador como este é o front-end de um processo quote-to-order completo. Traduz as escolhas do cliente numa configuração única e válida, gera preço e lista de materiais e entrega o resultado de forma estruturada à loja, ao ERP ou ao processo de orçamentação – a mesma pipeline que usamos para a automação de orçamentos e CPQ.
Para a versão produtiva ligamos o seu catálogo de produtos e as suas regras de preço, adotamos a sua linguagem visual e configuramos a entrega: carrinho, formulário de pedido, orçamento em PDF ou registo direto no ERP. Regras e preços residem no servidor; o navegador mostra apenas o que a API fornece.
Outros projetos de configuradores
Configurador 3D fotorrealista: metais preciosos, perfis de aro, cravação e brilho do diamante ao vivo no navegador.
Ver o projeto →Planeamento de vedações arrastar e largar com lista de materiais automática, preço ao vivo e passagem direta para o carrinho.
Ver o projeto →Configurador de 5 passos com pré-visualização 3D em tempo real, lista de materiais e saída em PDF.
Ver o projeto →