How zan701/zan-recidences works
Zan Residences is a single-page digital property showroom. Visitors move from the project introduction through unit discovery and selection, explore home and floor-plan details, consider lifestyle and location, compare units, then reach a private-viewing request form. app/page.tsx composes the experience; property data supports the interactive masterplan and available-unit form, while shared scroll-animation behavior supports selected sections. The README is a generic Next.js starter; feature names and the page composition establish the product capabilities. Unsampled section internals are represented by their exact paths without assuming their data wiring.
Main entry points: page.tsx Showroom page · S04_Masterplan.tsx Interactive masterplan · S12_PrivateViewing.tsx Private viewing form · useGsapScrollTrigger.ts Scroll animation hooks
Components 22
Page Shell
- Showroom page
app/page.tsx - Navigation
components/layout/Navbar.tsx - Footer
components/layout/Footer.tsx - Hero
components/sections/S01_Hero.tsx - Project story
components/sections/S02_Story.tsx - Project overview
components/sections/S03_ProjectOverview.tsx - Scroll animation hooks
lib/hooks/useGsapScrollTrigger.ts - Domain types
lib/types/index.ts
Unit Discovery
- Interactive masterplan
components/sections/S04_Masterplan.tsx - Home finder
components/sections/S05_FindYourHome.tsx - Unit details
components/sections/S06_UnitDetail.tsx - Unit comparison
components/sections/S11_CompareUnits.tsx - Property catalog
lib/data/properties.ts
Home Experience
- Explore home
components/sections/S07_ExploreHome.tsx - Floor plans
components/sections/S08_FloorPlan.tsx - Daily-life timeline
components/sections/S09_ImagineYourDay.tsx - Location experience
components/sections/S10_LocationExperience.tsx - Location data
lib/data/locations.ts - Room data
lib/data/rooms.ts - Timeline data
lib/data/timeline.ts
Engagement
- Private viewing form
components/sections/S12_PrivateViewing.tsx
Other components
- Site visitor
Connections 20
- Site visitor → Showroom page: opens
- Showroom page → Navigation: renders
- Showroom page → Hero: renders
- Showroom page → Project story: renders
- Showroom page → Project overview: renders
- Showroom page → Interactive masterplan: renders
- Showroom page → Home finder: renders
- Showroom page → Unit details: renders
- Showroom page → Explore home: renders
- Showroom page → Floor plans: renders
- Showroom page → Daily-life timeline: renders
- Showroom page → Location experience: renders
- Showroom page → Unit comparison: renders
- Showroom page → Private viewing form: renders
- Showroom page → Footer: renders
- Interactive masterplan → Property catalog: reads
- Private viewing form → Property catalog: filters
- Interactive masterplan → Scroll animation hooks: uses
- Private viewing form → Scroll animation hooks: uses
- Footer → Scroll animation hooks: uses