VOREL

Αυτο-ανατεθειμένο concept: ένας ενιαίος, scroll-scrubbed περίπατος μέσα από τρία δωμάτια. Το scroll δεν κουνάει τη σελίδα — γυρίζει καρέ μιας 4K ακολουθίας πάνω σε ένα fixed canvas, με το κείμενο κάθε δωματίου κλειδωμένο να εμφανίζεται μόνο όταν το δωμάτιο έχει σταθεροποιηθεί. Κάνε κλικ σε ένα έργο και το ίδιο canvas ανοίγει σαν πόρτα στη σελίδα του.

Brief

Τα περισσότερα site αρχιτεκτονικής είναι μια galleria από στατικά renders. Ήθελα κάτι πιο κοντά στην εμπειρία του ίδιου του χώρου: να περπατάς, όχι να ξεφυλλίζεις. Ζητούμενο μια κινηματογραφική ροή — μία λήψη χωρίς κοψίματα — που όμως φορτώνει γρήγορα, σέβεται το prefers-reduced-motion και διαβάζεται σε δύο γλώσσες.

Δουλειά

• Canvas μηχανή frame sequence: το scroll progress (0..1) είναι η μοναδική πηγή αλήθειας — οδηγεί το καρέ (lerp-smoothed) και κλειδώνει το κείμενο ώστε τίποτα να μην εμφανίζεται σε μετάβαση
• Δύο σκηνές μετάβασης × 121 καρέ, προ-φορτωμένα πίσω από loader και progress hairline
• Adaptive resolution: true 4K (3856px) σε desktop, ελαφρύτερα tiers (2.2K / 1.5K) σε laptop και mobile — επιλέγεται από viewport × DPR
• Το canvas είναι η πόρτα: κλικ σε έργο κάνει zoom το canvas και ανοίγει project view με location / year / typology, χωρίς αλλαγή σελίδας
• Lenis smooth scroll + GSAP + SplitText για τα reveal· πλήρες prefers-reduced-motion fallback
• Δίγλωσσο EN/EL με data-attributes — εναλλαγή χωρίς reload, από ένα κουμπί
• Hash routing (#work/slug, #studio…) ώστε reload και deep-link να κρατούν σωστά τα asset paths
• Vanilla — μηδέν framework, ~33KB JS· οι εικόνες κουβαλούν το βάρος, όχι ο κώδικας

Highlight

Το δύσκολο ήταν να μη σπάει ποτέ η ψευδαίσθηση. Το κείμενο πρέπει να εμφανίζεται μόνο όταν το δωμάτιο έχει κάτσει — αλλιώς διαβάζεις τίτλο πάνω σε μισή μετάβαση. Λύση: αυστηρά dwell windows στο progress (0..1), lerp στο καρέ για να μην τρέμει στο γρήγορο scroll, και προ-φόρτωση όλων των καρέ πριν ξεκλειδώσει το scroll.