Project · ynara-web
Ynara Web
- Role
- Immersive landing page · design and development
- Year
- 2026
- Status
- In development
- Technologies
- GSAPMotion. Since 2026. Deterministic timeline orchestration for high-precision interfaces and spatial micro-interactions. Also in La Rúcula Gastrobar and ARG Piscinas.
- LenisMotion. Since 2026. Normalized cross-platform inertial scrolling without breaking the browser's native behavior. Also in La Rúcula Gastrobar.
- Next.jsFrameworks. Since 2026. A full-stack React framework with asset optimization, file-system routing and SSR. Also in Ynara.
- ReactFrameworks. Since 2026. A massive ecosystem, React Server Components and hybrid rendering, adopted in the Ynara thesis. Also in Ynara and Barberpole.
- Tailwind CSSTooling. Since 2026. A composable, utility-first design system with aggressive purging for ultra-light bundles. Also in La Rúcula Gastrobar and ARG Piscinas.
- Three.jsGraphics. Since 2026. WebGL and GLSL shaders for immersive 3D experiences when the DOM isn't enough. Only in this work for now.
- TypeScriptLanguages. Since 2023 · 3 years. A mandatory standard on client and server: if it isn't typed at compile time, it doesn't reach production. Also in Ynara and Eros Career OS.
Immersive WebGL landing page for Ynara: a form of light that mutates and reacts to scroll. The public gateway to the thesis.
Brief
A spatial experience you don't navigate: you travel through it. The visual narrative is drawn first; the shaders come in to serve the atmosphere.
Process
Concept
Translating adaptive artificial intelligence into a three-dimensional entity of light.
Shaders
Custom GLSL vertex and fragment shaders on Three.js, orchestrated with GSAP ScrollTrigger.
Outcome
A procedural shader that reacts to scroll velocity, with a graceful fallback for low-power devices.
Metrics
- 4Draw callsDraw calls. GPU draw calls per frame.
- 60 fpsTarget FPSTarget FPS. Frames per second the animation holds.
- 78 KBBundleBundle. Compressed size of the initial JavaScript the browser downloads.