Bedsgone
Site de recolha de colchões, com cena 3D e reservas com preço em tempo real
Sobre o projeto
Um cliente pediu um site para um serviço de recolha e reciclagem de colchões, e este é o protótipo que construí para lhe mostrar a direção: a marca, o aspeto, o modelo de preços e o fluxo de reserva. A proposta é simples — dois preços fixos, e o tamanho, tipo ou idade do colchão nunca mudam o que se paga. Tem uma landing page com uma cena 3D feita à mão em three.js e um assistente de reserva em cinco passos com o preço a atualizar ao vivo.
O que construí
- 01Cena 3D em three.js construída só com geometria, sem modelos: a carrinha entra, o colchão cai na caixa e o scroll leva-a embora
- 02three.js carregado com import() dinâmico e só depois de confirmar suporte a WebGL
- 03Assistente de reserva em cinco passos com preço ao vivo, rascunho guardado em localStorage e deep links que pré-preenchem o formulário
- 04Preços, taxas, horários e zonas num único ficheiro de configuração, com o cálculo em funções puras prontas para correr num servidor
- 05Sistema de animação com GSAP e Lenis, desligado por completo com prefers-reduced-motion
- 06Marca refeita em SVG, tokens de cor no @theme do Tailwind 4 e output 100% estático
Ficha
- Contexto
- Protótipo feito para um cliente
- Função
- Projeto individual — marca, design e frontend
- Ano
- 2026
Stack
- Astro
- TypeScript
- Tailwind CSS
- three.js
- GSAP
- Lenis
Links
Protótipo para um cliente, não um negócio real. Nenhuma reserva é enviada ou cobrada, e os contactos, testemunhos e zona de serviço são conteúdo de exemplo.