3D website · The closing window
Serramenti Cardine
Scroll and the window closes, keeping noise out and letting light in.
- Year
- 2026
- Status
- Concept
The problem
Anyone who needs to replace their windows nearly always finds catalogues of profile cross-sections, glazing codes and thermal ratings, product shots on white and a generic form.
Nobody explains what actually happens, who comes to measure, whether walls need breaking, how long fitting takes and how the quote arrives. The site talks about the window but never lets you feel the difference that matters, a quieter room full of light.
The solution
Serramenti Cardine is a window company where the same team measures, orders and fits.
At the top, an arched two-sash window, a 3D model built in code piece by piece, floats open in front of a photo of a room overlooking the hills early in the morning. As you scroll the scene holds still, the window settles exactly onto the photo's frame and the sashes close, letting only the light through. The page then lights up the manifesto word by word, stacks the cards of the five services, follows the method from measuring to fitting, answers the most common questions and ends with a golden band and the contacts for booking a survey. I chose anthracite, a warm dawn yellow, brass and a soft serif typeface.
The site in numbers
- Page sections, from the window to the final form
- 9
- Services in stacking cards, from windows to aftercare
- 5
- Parts of the 3D window, across frame, sashes, glass, handle and hinges
- 7
Technologies
- React
- Three.js
- GSAP
- TypeScript
- Tailwind CSS
- Vite
- Lenis
- Motion
- 21st.dev
- ChatGPT
The screens
On mobile
The same site on a phone, designed for thumbs and small screens.
1 of 3
Use the left and right arrow keys to browse the screens.
On desktop
The page scrolls and the scene changes with you. Here are a few moments, from the opening to the contact section.
1 of 5
Use the left and right arrow keys to browse the screens.







